From 27f88afc148df2ac1f8361f79be8841ad01f44ad Mon Sep 17 00:00:00 2001
From: Sven van de Scheur <svenvandescheur@gmail.com>
Date: Tue, 2 Apr 2024 10:49:09 +0200
Subject: [PATCH] :white_check_mark: - test: attempt to make Storybook tests
 less flaky

---
 src/components/navbar/navbar.stories.tsx | 19 +++++++++++++++----
 1 file changed, 15 insertions(+), 4 deletions(-)

diff --git a/src/components/navbar/navbar.stories.tsx b/src/components/navbar/navbar.stories.tsx
index 724b214f..5088a620 100644
--- 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");
   },
 };