Extract independent MIT Mortar kit and contribution workflow

tests/browser/components.spec.mjs

@@ -0,0 +1,33 @@
+import { test, expect } from "@playwright/test";
+import AxeBuilder from "@axe-core/playwright";
+import { readFile } from "node:fs/promises";
+const { components } = JSON.parse(
+  await readFile(new URL("../../catalog.json", import.meta.url), "utf8"),
+);
+for (const component of components)
+  for (const theme of ["light", "dark"])
+    test(`${component.export} ${theme}`, async ({ page }) => {
+      const errors = [];
+      page.on("pageerror", (e) => errors.push(e.message));
+      await page.goto(`/?component=${component.export}&theme=${theme}`);
+      await expect(
+        page.getByRole("heading", { name: "Mortar playground" }),
+      ).toBeVisible();
+      await expect(
+        page.getByRole("status", { name: "Loading preview…" }),
+      ).toHaveCount(0);
+      await expect(page.locator("[data-mortar-appearance]")).toHaveAttribute(
+        "data-mortar-appearance",
+        theme,
+      );
+      const results = await new AxeBuilder({ page })
+        .withTags(["wcag2a", "wcag2aa", "wcag21aa"])
+        .analyze();
+      expect(
+        results.violations.map((v) => ({
+          id: v.id,
+          nodes: v.nodes.map((n) => n.target),
+        })),
+      ).toEqual([]);
+      expect(errors).toEqual([]);
+    });