[#5] Correct application names for non-webkit browsers (#6)

* feat: fill out remaining browser mappings

Author: cmorten

example/playwright.config.ts

@@ -12,6 +12,10 @@ const config: PlaywrightTestConfig = {
       name: "webkit",
       use: { ...devices["Desktop Safari"], headless: false, video: "on" },
     },
+    {
+      name: "chromium",
+      use: { ...devices["Desktop Chrome"], headless: false, video: "on" },
+    },
   ],
 };
 

example/tests/chromium.snapshot.json

@@ -0,0 +1,8 @@
+[
+  "heading level 1 guidepup/guidepup",
+  "heading level 2 Latest commit",
+  "heading level 2 Git stats",
+  "heading level 2 Files",
+  "heading level 2 link README.md",
+  "heading level 1 Guidepup"
+]

example/tests/chromium.spec.ts

@@ -0,0 +1,38 @@
+import { expect } from "@playwright/test";
+import snapshot from "./chromium.snapshot.json";
+import { voTest as test } from "../../src";
+
+test.describe("Chromium VoiceOver", () => {
+  test("I can navigate the Guidepup Github page", async ({
+    browserName,
+    page,
+    voiceOver,
+  }) => {
+    test.skip(browserName !== "chromium", "Chromium only test");
+
+    // Navigate to Guidepup GitHub page 🎉
+    await page.goto("https://github.com/guidepup/guidepup", {
+      waitUntil: "domcontentloaded",
+    });
+
+    // Wait for page to be ready and interact 🙌
+    await expect(page.locator('header[role="banner"]')).toBeVisible();
+    await voiceOver.stopInteracting();
+    await voiceOver.interact();
+
+    // Move across the page menu to the Guidepup heading using VoiceOver 🔎
+    while ((await voiceOver.itemText()) !== "Guidepup heading level 1") {
+      await voiceOver.perform(voiceOver.keyboard.commands.findNextHeading);
+    }
+
+    // Assert that we've ended up where we expected and what we were told on
+    // the way there is as expected.
+    const spokenPhraseLog = await voiceOver.spokenPhraseLog();
+
+    for (const expectedPhrase of snapshot) {
+      expect(
+        !!spokenPhraseLog.find((log) => log.includes(expectedPhrase))
+      ).toBe(true);
+    }
+  });
+});

example/tests/itemTextSnapshot.json

@@ -0,0 +1,8 @@
+[
+  "heading level 1 guidepup/guidepup",
+  "heading level 2 Latest commit",
+  "heading level 2 Git stats",
+  "heading level 2 Files",
+  "heading level 2 link README.md",
+  "heading level 1 Guidepup"
+]

example/tests/webkit.snapshot.json

@@ -1,38 +1,22 @@
 import { expect } from "@playwright/test";
-import itemTextSnapshot from "./itemTextSnapshot.json";
+import snapshot from "./webkit.snapshot.json";
 import { voTest as test } from "../../src";
 
-function delay(ms: number) {
-  return new Promise((resolve) => setTimeout(resolve, ms));
-}
-
-async function waitForWebContentAnnouncement(voiceOver) {
-  for (let i = 0; i < 10; i++) {
-    const itemText = await voiceOver.itemText();
-
-    if (itemText?.includes("web content")) {
-      return;
-    }
-
-    await delay(50);
-  }
-
-  throw new Error("web content could not be found");
-}
-
 test.describe("Playwright VoiceOver", () => {
   test("I can navigate the Guidepup Github page", async ({
+    browserName,
     page,
     voiceOver,
   }) => {
+    test.skip(browserName !== "webkit", "Webkit only test");
+
     // Navigate to Guidepup GitHub page 🎉
     await page.goto("https://github.com/guidepup/guidepup", {
       waitUntil: "domcontentloaded",
     });
 
     // Wait for page to be ready and interact 🙌
     await expect(page.locator('header[role="banner"]')).toBeVisible();
-    await waitForWebContentAnnouncement(voiceOver);
     await voiceOver.interact();
 
     // Move across the page menu to the Guidepup heading using VoiceOver 🔎
@@ -42,10 +26,10 @@ test.describe("Playwright VoiceOver", () => {
 
     // Assert that we've ended up where we expected and what we were told on
     // the way there is as expected.
-    const itemTextLog = await voiceOver.itemTextLog();
+    const spokenPhraseLog = await voiceOver.spokenPhraseLog();
 
-    for (const expectedItem of itemTextSnapshot) {
-      expect(itemTextLog).toContain(expectedItem);
+    for (const expectedPhrase of snapshot) {
+      expect(!!spokenPhraseLog.find(log => log.includes(expectedPhrase))).toBe(true);
     }
   });
 });

example/tests/playwright.spec.ts example/tests/webkit.spec.tsexample/tests/playwright.spec.ts renamed to example/tests/webkit.spec.ts

@@ -1,7 +1,7 @@
 {
   "name": "@guidepup/playwright",
-  "version": "0.7.5",
-  "description": "Screen-reader driver for Playwright.",
+  "version": "0.8.0",
+  "description": "Screen reader driver for Playwright tests.",
   "main": "lib/index.js",
   "typings": "lib/index.d.ts",
   "author": "Craig Morten <[email protected]>",
@@ -29,11 +29,11 @@
     "lint": "eslint . --ext .ts",
     "lint:fix": "yarn lint --fix",
     "prepublish": "yarn build",
-    "pretest": "npx playwright install webkit",
-    "test": "playwright test -c ./example/playwright.config.ts ./example/tests/playwright.spec.ts"
+    "pretest": "npx playwright install webkit chromium",
+    "test": "playwright test -c ./example/playwright.config.ts ./example/tests/"
   },
   "dependencies": {
-    "@guidepup/guidepup": "^0.14.7"
+    "@guidepup/guidepup": "^0.15.0"
   },
   "devDependencies": {
     "@playwright/test": "^1.28.1",

package.json

@@ -1,20 +1,28 @@
-/* eslint-disable no-empty-pattern */
 import { test } from "@playwright/test";
 import { voiceOver, macOSActivate } from "@guidepup/guidepup";
 
-const PLAYWRIGHT_APPLICATION = "Playwright";
+const applicationNameMap = {
+  chromium: "Chromium",
+  chrome: "Google Chrome",
+  "chrome-beta": "Google Chrome Beta",
+  msedge: "Microsoft Edge",
+  "msedge-beta": "Microsoft Edge Beta",
+  "msedge-dev": "Microsoft Edge Dev",
+  firefox: "Nightly",
+  webkit: "Playwright",
+};
 
 /**
  * These tests extend the default Playwright environment that launches the
- * browser with a running instance of the VoiceOver screen-reader for MacOS.
+ * browser with a running instance of the VoiceOver screen reader for MacOS.
  *
  * A fresh started VoiceOver instance `vo` is provided to each test.
  */
 const voTest = test.extend<{ voiceOver: typeof voiceOver }>({
-  voiceOver: async ({}, use) => {
+  voiceOver: async ({ browserName }, use) => {
     try {
       await voiceOver.start();
-      await macOSActivate(PLAYWRIGHT_APPLICATION);
+      await macOSActivate(applicationNameMap[browserName]);
       await use(voiceOver);
     } finally {
       await voiceOver.stop();

src/voTest.ts

@@ -29,10 +29,10 @@
     minimatch "^3.0.4"
     strip-json-comments "^3.1.1"
 
-"@guidepup/guidepup@^0.14.7":
-  version "0.14.7"
-  resolved "https://registry.yarnpkg.com/@guidepup/guidepup/-/guidepup-0.14.7.tgz#d83ba5295126b2f391de7c10d0554d5d09b82614"
-  integrity sha512-q/uSktR+eumcgqTmo7ZqW2EMhw3o/ki1btxHWqGxBWJgoQHPz6+zWqzv15VgcmSipG8EOCpcfbWOnEOE00o53A==
+"@guidepup/guidepup@^0.15.0":
+  version "0.15.0"
+  resolved "https://registry.yarnpkg.com/@guidepup/guidepup/-/guidepup-0.15.0.tgz#d9cd40f933f31c03d65f6bef9a31fee953654cc0"
+  integrity sha512-MUPtcp57e6Ehtgtn29nb1spObIz4dUA3aTj+FL4RGBGmv2q+YPXJ0zEKP2MP04QsTAJ5fL8vN2nddmnGGxSS+w==
 
 "@humanwhocodes/config-array@^0.9.2":
   version "0.9.2"