diff --git a/e2e/fixtures.ts b/e2e/fixtures.ts new file mode 100644 index 0000000..07e12e6 --- /dev/null +++ b/e2e/fixtures.ts @@ -0,0 +1,12 @@ +import { test as base, expect } from "@playwright/test"; +import AxeBuilder from "@axe-core/playwright"; + +export const test = base.extend<{ axeCheck: void }>({ + axeCheck: [async ({ page }, use) => { + await use(); + const results = await new AxeBuilder({ page }).analyze(); + expect(results.violations).toEqual([]); + }, { auto: true }], +}); + +export { expect } from "@playwright/test"; diff --git a/e2e/smoke.spec.ts b/e2e/smoke.spec.ts index 28ec3e1..996c72f 100644 --- a/e2e/smoke.spec.ts +++ b/e2e/smoke.spec.ts @@ -1,6 +1,6 @@ -import { test, expect } from '@playwright/test'; +import { test, expect } from "./fixtures"; -test('app loads', async ({ page }) => { - await page.goto('/'); +test("app loads", async ({ page }) => { + await page.goto("/"); await expect(page).toHaveTitle(/CartSnitch/); }); diff --git a/package-lock.json b/package-lock.json index 6921d4b..04163c5 100644 --- a/package-lock.json +++ b/package-lock.json @@ -18,6 +18,7 @@ "zustand": "^5.0.0" }, "devDependencies": { + "@axe-core/playwright": "^4.10.0", "@eslint/js": "^9.39.4", "@playwright/test": "^1.58.2", "@tailwindcss/vite": "^4.0.0", @@ -70,6 +71,19 @@ "devOptional": true, "license": "ISC" }, + "node_modules/@axe-core/playwright": { + "version": "4.11.1", + "resolved": "https://registry.npmjs.org/@axe-core/playwright/-/playwright-4.11.1.tgz", + "integrity": "sha512-mKEfoUIB1MkVTht0BGZFXtSAEKXMJoDkyV5YZ9jbBmZCcWDz71tegNsdTkIN8zc/yMi5Gm2kx7Z5YQ9PfWNAWw==", + "dev": true, + "license": "MPL-2.0", + "dependencies": { + "axe-core": "~4.11.1" + }, + "peerDependencies": { + "playwright-core": ">= 1.0.0" + } + }, "node_modules/@babel/code-frame": { "version": "7.29.0", "resolved": "https://registry.npmjs.org/@babel/code-frame/-/code-frame-7.29.0.tgz", @@ -4494,6 +4508,16 @@ "url": "https://github.com/sponsors/ljharb" } }, + "node_modules/axe-core": { + "version": "4.11.1", + "resolved": "https://registry.npmjs.org/axe-core/-/axe-core-4.11.1.tgz", + "integrity": "sha512-BASOg+YwO2C+346x3LZOeoovTIoTrRqEsqMa6fmfAV0P+U9mFr9NsyOEpiYvFjbc64NMrSswhV50WdXzdb/Z5A==", + "dev": true, + "license": "MPL-2.0", + "engines": { + "node": ">=4" + } + }, "node_modules/babel-plugin-polyfill-corejs2": { "version": "0.4.16", "resolved": "https://registry.npmjs.org/babel-plugin-polyfill-corejs2/-/babel-plugin-polyfill-corejs2-0.4.16.tgz", diff --git a/package.json b/package.json index 3981847..6f11531 100644 --- a/package.json +++ b/package.json @@ -23,6 +23,7 @@ "zustand": "^5.0.0" }, "devDependencies": { + "@axe-core/playwright": "^4.10.0", "@eslint/js": "^9.39.4", "@playwright/test": "^1.58.2", "@tailwindcss/vite": "^4.0.0", diff --git a/src/pages/Dashboard.tsx b/src/pages/Dashboard.tsx index d1e885f..d7c2b9a 100644 --- a/src/pages/Dashboard.tsx +++ b/src/pages/Dashboard.tsx @@ -173,6 +173,7 @@ function AuthenticatedDashboard({ userName }: { userName: string }) { function DashboardSkeleton() { return (