✅ - test: attempt to make Storybook tests less flaky

maykinmedia · Apr 2, 2024 · 27f88af · 27f88af
1 parent 6779387
commit 27f88af
Showing 1 changed file with 15 additions and 4 deletions.
diff --git a/src/components/navbar/navbar.stories.tsx b/src/components/navbar/navbar.stories.tsx
@@ -91,12 +91,23 @@ export const NavbarOnMobile: Story = {
     await expect(canvas.getByRole("dialog")).toBeVisible();
 
     // Tab focuses items.
-    await userEvent.tab({ delay: 10 });
-    await userEvent.tab({ delay: 10 });
-    await userEvent.tab({ delay: 10 });
+    await waitFor(async () => {
+      const toolbar = document.activeElement?.closest(
+        '[role="toolbar"]',
+      ) as HTMLElement;
+      const controls = toolbar.children;
+      const lastControl = controls[controls.length - 1];
+      const isLastControlActive = document.activeElement === lastControl;
 
-    expect(canvas.getByRole("dialog")).toContainElement(
+      if (!isLastControlActive) {
+        await userEvent.tab({ delay: 10 });
+        throw new Error("Last button not selected");
+      }
+    });
+
+    await expect(canvas.getByRole("dialog")).toContainElement(
       document.activeElement as HTMLElement,
     );
+    await expect(document.activeElement.textContent).toBe("Uitloggen");
   },
 };