feat: add accessibility smoke checks

docs/accessibility-notes.md

@@ -0,0 +1,44 @@
+# Accessibility Notes
+
+## Purpose
+
+Accessibility checks in DISCOGS-UI are automated smoke-level scans intended to identify obvious accessibility issues on selected public Discogs pages.
+
+## Version 1 Scope
+
+Version 1 includes automated accessibility checks for:
+
+- Homepage
+- Search results page
+- Marketplace browse page
+
+## Tooling
+
+Accessibility checks are implemented with Playwright and `@axe-core/playwright`.
+
+## Assertion Strategy
+
+Version 1 fails tests only when critical accessibility violations are detected.
+
+This is intentional because Discogs is a public third-party website, and the goal is to demonstrate practical accessibility awareness without making the suite overly brittle.
+
+## Limitations
+
+Automated accessibility testing does not replace a full manual accessibility audit.
+
+These tests do not guarantee WCAG compliance. They are designed to catch obvious critical issues and provide scan artifacts for review.
+
+## Manual Review
+
+Accessibility scan results should be manually reviewed before documenting any issue as a bug or finding.
+
+## Known Third-Party Findings
+
+During initial accessibility smoke testing, automated scans found critical violations in shared Discogs page chrome:
+
+- Footer menu ARIA structure issue: `aria-required-children`
+- Header/search clear button accessible name issue: `button-name`
+
+Because DISCOGS-UI is a portfolio project testing a third-party public website, Version 1 accessibility smoke tests exclude known shared header and footer containers from automated pass/fail assertions.
+
+The full scan artifacts are still attached to Playwright test results for manual review. These findings should be treated as observed accessibility findings, not defects that can be fixed within this repository.

package.json

@@ -3,11 +3,14 @@
   "version": "1.0.0",
   "description": "",
   "main": "index.js",
-  "scripts": {},
+  "scripts": {
+    "test:a11y": "playwright test tests/accessibility --project=chromium"
+  },
   "keywords": [],
   "author": "",
   "license": "ISC",
   "devDependencies": {
+    "@axe-core/playwright": "^4.11.2",
     "@playwright/test": "^1.59.1",
     "@types/node": "^25.6.0"
   }

pages/MarketplacePage.ts

@@ -29,8 +29,16 @@ export class MarketplacePage {
   }
 
   async expectNoApplicationError(): Promise<void> {
-    await expect(this.mainContent).not.toContainText(
-      /server error|something went wrong|application error|internal error|404/i
-    );
-  }
+  await expect(this.page).not.toHaveTitle(/error|404|not found/i);
+  await expect(this.page).not.toHaveURL(/404|error|not-found/i);
+
+  const visibleErrorAlerts = this.page
+    .locator('[role="alert"], [aria-live="assertive"], .error, .error-message, [class*="alert"]')
+    .filter({
+      hasText:
+        /server error|something went wrong|application error|internal error|404|not found/i,
+    });
+
+  await expect(visibleErrorAlerts).toHaveCount(0);
+}
 }

tests/accessibility/public-pages-a11y.spec.ts

@@ -0,0 +1,85 @@
+import { expect, test, Page, TestInfo } from '@playwright/test';
+import AxeBuilder from '@axe-core/playwright';
+import { HomePage } from '../../pages/HomePage';
+import { MarketplacePage } from '../../pages/MarketplacePage';
+import { SearchResultsPage } from '../../pages/SearchResultsPage';
+
+async function runCriticalA11yScan(
+  page: Page,
+  testInfo: TestInfo,
+  scanName: string
+): Promise<void> {
+  const accessibilityScanResults = await new AxeBuilder({ page })
+  .include('body')
+  .exclude('#esi-footer-root')
+  .exclude('[id^="__header_root_"]')
+  .withTags(['wcag2a', 'wcag2aa', 'wcag21a', 'wcag21aa'])
+  .analyze();
+
+  await testInfo.attach(`${scanName}-a11y-results`, {
+    body: JSON.stringify(accessibilityScanResults, null, 2),
+    contentType: 'application/json',
+  });
+
+  const criticalViolations = accessibilityScanResults.violations.filter(
+    (violation) => violation.impact === 'critical'
+  );
+
+  expect(
+    criticalViolations,
+    `Critical accessibility violations found on ${scanName}:\n${JSON.stringify(
+      criticalViolations,
+      null,
+      2
+    )}`
+  ).toEqual([]);
+}
+
+test.describe('Discogs public page accessibility smoke checks', () => {
+  test('@a11y homepage has no critical accessibility violations', async ({
+    page,
+  }, testInfo) => {
+    const homePage = new HomePage(page);
+
+    await test.step('Navigate to Discogs homepage', async () => {
+      await homePage.goto();
+      await homePage.expectPageLoaded();
+    });
+
+    await test.step('Run critical accessibility scan', async () => {
+      await runCriticalA11yScan(page, testInfo, 'homepage');
+    });
+  });
+
+  test('@a11y search results page has no critical accessibility violations', async ({
+    page,
+  }, testInfo) => {
+    const homePage = new HomePage(page);
+    const searchResultsPage = new SearchResultsPage(page);
+
+    await test.step('Navigate to search results page', async () => {
+      await homePage.goto();
+      await homePage.searchFor('Miles Davis');
+      await searchResultsPage.expectSearchResultsPageLoaded('Miles Davis');
+    });
+
+    await test.step('Run critical accessibility scan', async () => {
+      await runCriticalA11yScan(page, testInfo, 'search-results');
+    });
+  });
+
+  test('@a11y marketplace page has no critical accessibility violations', async ({
+    page,
+  }, testInfo) => {
+    const marketplacePage = new MarketplacePage(page);
+
+    await test.step('Navigate to marketplace page', async () => {
+      await marketplacePage.goto();
+      await marketplacePage.expectPageLoaded();
+    });
+
+    await test.step('Run critical accessibility scan', async () => {
+      await runCriticalA11yScan(page, testInfo, 'marketplace');
+    });
+  });
+});