From 5e8f04e0e2998ca5357f0ca1fdba6b525b19c8a6 Mon Sep 17 00:00:00 2001
From: WickyNilliams <WickyNilliams@users.noreply.github.com>
Date: Mon, 25 Mar 2024 15:09:33 +0000
Subject: [PATCH] fix tests

---
 .github/workflows/test.yml               |  2 +-
 src/calendar-date/calendar-date.test.tsx |  5 +++--
 src/utils/test.ts                        | 12 ++++++++++++
 3 files changed, 16 insertions(+), 3 deletions(-)

diff --git a/.github/workflows/test.yml b/.github/workflows/test.yml
index cb77546..9407fa3 100644
--- a/.github/workflows/test.yml
+++ b/.github/workflows/test.yml
@@ -18,5 +18,5 @@ jobs:
           node-version: "20.x"
       - run: npm ci
       - run: npm run build
-      - run: npx playwright install chrome webkit --with-deps
+      - run: npx playwright install --with-deps
       - run: npm test
diff --git a/src/calendar-date/calendar-date.test.tsx b/src/calendar-date/calendar-date.test.tsx
index 0183bf5..ae2556b 100644
--- a/src/calendar-date/calendar-date.test.tsx
+++ b/src/calendar-date/calendar-date.test.tsx
@@ -5,6 +5,7 @@ import {
   click,
   clickDay,
   createSpy,
+  getActiveElement,
   getDayButton,
   getMonth,
   getNextPageButton,
@@ -236,7 +237,7 @@ describe("CalendarDate", () => {
       await sendKeys({ press: "Tab" });
       await sendKeys({ press: "Enter" });
 
-      expect(getNextPageButton(calendar)).to.match(":focus-within");
+      expect(getActiveElement()).to.eq(getNextPageButton(calendar));
     });
 
     it("moves focus to the selected date when clicking outside of the month", async () => {
@@ -257,7 +258,7 @@ describe("CalendarDate", () => {
 
       // get the clicked day
       const button = getDayButton(month, "1 February");
-      expect(button).to.match(":focus-within");
+      expect(getActiveElement()).to.eq(button);
       expect(button.tabIndex).to.eq(0);
     });
   });
diff --git a/src/utils/test.ts b/src/utils/test.ts
index 1ff1d28..364459f 100644
--- a/src/utils/test.ts
+++ b/src/utils/test.ts
@@ -112,3 +112,15 @@ export async function clickDay(month: MonthInstance, dateLabel: string) {
 
   await click(button);
 }
+
+export function getActiveElement(root: Document | ShadowRoot = document) {
+  if (
+    root.activeElement &&
+    "shadowRoot" in root.activeElement &&
+    root.activeElement.shadowRoot
+  ) {
+    return getActiveElement(root.activeElement.shadowRoot);
+  }
+
+  return root.activeElement;
+}