Update Notification to expose define helper

vaadin · Jan 17, 2024 · edfca5b · edfca5b
1 parent 5089f60
commit edfca5b
Show file tree

Hide file tree

Showing 2 changed files with 15 additions and 20 deletions.
diff --git a/src/Notification.tsx b/src/Notification.tsx
@@ -47,18 +47,18 @@ function Notification(
   );
 }
 
-type NotificationShow = {
+export type NotificationFunction = ForwardRefExoticComponent<NotificationProps & RefAttributes<NotificationElement>> & {
   show(contents: string, options?: ShowOptions): Promise<NotificationElement>;
+  define(): Promise<void>;
 };
 
-export type NotificationFunction = ForwardRefExoticComponent<NotificationProps & RefAttributes<NotificationElement>> &
-  NotificationShow;
-
 const ForwardedNotification = forwardRef(Notification) as NotificationFunction;
 
+Object.assign(ForwardedNotification, { define: _Notification.define });
+
 ForwardedNotification.show = async function (contents: string, options?: ShowOptions) {
-  await _Notification.define();
-  const Notification = customElements.get('vaadin-notification') as unknown as NotificationShow;
+  await ForwardedNotification.define();
+  const Notification = customElements.get('vaadin-notification') as typeof NotificationElement;
   return Notification.show(contents, options);
 };
 

diff --git a/test/Notification.spec.tsx b/test/Notification.spec.tsx
@@ -15,43 +15,38 @@ describe('Notification', () => {
     return <>FooBar</>;
   }
 
-  async function until(predicate: () => boolean) {
-    while (!predicate()) {
-      await new Promise((r) => setTimeout(r, 10));
-    }
-  }
-
-  async function assert() {
-    await until(() => !!document.querySelector('vaadin-notification-card'));
+  function assert() {
     const card = document.querySelector('vaadin-notification-card');
     expect(card).to.exist;
     expect(card).to.have.text('FooBar');
   }
 
+  before(Notification.define);
+
   afterEach(cleanup);
   afterEach(catcher);
 
-  it('should use children if no renderer property set', async () => {
+  it('should use children if no renderer property set', () => {
     render(
       <Notification ref={ref} opened>
         FooBar
       </Notification>,
     );
-    await assert();
+    assert();
   });
 
-  it('should use renderer prop if it is set', async () => {
+  it('should use renderer prop if it is set', () => {
     render(<Notification ref={ref} opened renderer={Renderer} />);
-    await assert();
+    assert();
   });
 
-  it('should use children render function as a renderer prop', async () => {
+  it('should use children render function as a renderer prop', () => {
     render(
       <Notification ref={ref} opened>
         {Renderer}
       </Notification>,
     );
-    await assert();
+    assert();
   });
 
   describe('show()', () => {