test: fix failing tests after web components changes (#244)

vaadin · May 2, 2024 · 5dec24b · 5dec24b
1 parent 14924f9
commit 5dec24b
Show file tree

Hide file tree

Showing 2 changed files with 12 additions and 3 deletions.
diff --git a/test/Dialog.spec.tsx b/test/Dialog.spec.tsx
@@ -19,15 +19,20 @@ describe('Dialog', () => {
     const dialog = document.querySelector(overlayTag);
     expect(dialog).to.exist;
 
-    const [header, footer, body] = Array.from(dialog!.childNodes);
+    const childNodes = Array.from(dialog!.childNodes);
 
+    const header = childNodes.find(
+      (node) => node.nodeType === Node.ELEMENT_NODE && (node as Element).getAttribute('slot') === 'header-content',
+    );
     expect(header).to.exist;
     expect(header).to.have.text('Title');
 
-    expect(footer).to.exist;
+    const footer = childNodes.find(
+      (node) => node.nodeType === Node.ELEMENT_NODE && (node as Element).getAttribute('slot') === 'footer',
+    );
     expect(footer).to.have.text('Footer');
 
-    expect(body).to.exist;
+    const body = childNodes.find((node) => node.nodeType === Node.TEXT_NODE);
     expect(body).to.have.text('FooBar');
   }
 

diff --git a/test/MenuBar.spec.tsx b/test/MenuBar.spec.tsx
@@ -33,6 +33,7 @@ describe('MenuBar', () => {
     const { container } = render(<MenuBar items={[{ text: 'foo' }]} />);
 
     const menuBar = container.querySelector<HTMLDivElement>('vaadin-menu-bar')!;
+    await until(() => !!menuBar.querySelector(`${menuButtonTag}:not([slot])`));
 
     const item = menuBar.querySelector(menuButtonTag);
     expect(item?.firstElementChild).not.to.exist;
@@ -43,6 +44,7 @@ describe('MenuBar', () => {
     const { container } = render(<MenuBar items={[{ component: <span>foo</span> }]} />);
 
     const menuBar = container.querySelector<HTMLDivElement>('vaadin-menu-bar')!;
+    await until(() => !!menuBar.querySelector(`${menuButtonTag}:not([slot])`));
 
     const item = menuBar.querySelector(`${menuItemTag} > span`);
     expect(item).to.have.text('foo');
@@ -54,6 +56,7 @@ describe('MenuBar', () => {
     );
 
     const menuBar = container.querySelector<HTMLDivElement>('vaadin-menu-bar')!;
+    await until(() => !!menuBar.querySelector(`${menuButtonTag}:not([slot])`));
 
     const rootItem = menuBar.querySelector(menuButtonTag)!;
     await openRootItemSubMenu(rootItem);
@@ -69,6 +72,7 @@ describe('MenuBar', () => {
     const { container } = render(<MenuBar items={items} onItemSelected={spy}></MenuBar>);
 
     const menuBar = container.querySelector<MenuBarElement>('vaadin-menu-bar')!;
+    await until(() => !!menuBar.querySelector(`${menuButtonTag}:not([slot])`));
 
     const rootItems = Array.from(menuBar.querySelectorAll<HTMLElement>(menuButtonTag));
     rootItems[0].click();