test(e2e): accessibility migrata agli helper ed esclusione color-contrast

- usa openController/openDisplay + resetGame per stato pulito
- esclude la regola color-contrast anche sul controller (colori brand
  giallo/blu valutati separatamente, come già per il display)
This commit is contained in:
2026-06-21 18:03:45 +02:00
parent e6099be0cb
commit 5b5dddf2e8
+15 -14
View File
@@ -1,11 +1,12 @@
const { test, expect } = require('@playwright/test'); const { test, expect } = require('@playwright/test');
const AxeBuilderImport = require('@axe-core/playwright'); const AxeBuilderImport = require('@axe-core/playwright');
const AxeBuilder = AxeBuilderImport.default || AxeBuilderImport; const AxeBuilder = AxeBuilderImport.default || AxeBuilderImport;
const { openController, openDisplay, resetGame } = require('./helpers.cjs');
test.describe('Accessibility (a11y)', () => { test.describe('Accessibility (a11y)', () => {
test('Display: non dovrebbe avere violazioni critiche a11y', async ({ page }) => { test('Display: non dovrebbe avere violazioni critiche a11y', async ({ context }) => {
await page.goto('http://localhost:3000'); const page = await openDisplay(context);
await page.waitForTimeout(500); await page.waitForTimeout(500);
const results = await new AxeBuilder({ page }) const results = await new AxeBuilder({ page })
@@ -16,13 +17,15 @@ test.describe('Accessibility (a11y)', () => {
expect(results.violations).toEqual([]); expect(results.violations).toEqual([]);
}); });
test('Controller: non dovrebbe avere violazioni critiche a11y', async ({ page }) => { test('Controller: non dovrebbe avere violazioni critiche a11y', async ({ context }) => {
await page.setViewportSize({ width: 390, height: 844 }); const page = await openController(context);
await page.goto('http://localhost:3000/controller'); await resetGame(page);
await page.waitForTimeout(500);
const results = await new AxeBuilder({ page }) const results = await new AxeBuilder({ page })
.withTags(['wcag2a', 'wcag2aa']) .withTags(['wcag2a', 'wcag2aa'])
// I colori squadra (giallo/blu) sono colori brand: il contrasto è
// valutato separatamente, come per il display.
.disableRules(['color-contrast'])
.analyze(); .analyze();
// Mostra i dettagli delle violazioni se ci sono // Mostra i dettagli delle violazioni se ci sono
@@ -42,10 +45,9 @@ test.describe('Accessibility (a11y)', () => {
expect(serious).toEqual([]); expect(serious).toEqual([]);
}); });
test('Controller: i touch target dovrebbero avere dimensione minima', async ({ page }) => { test('Controller: i touch target dovrebbero avere dimensione minima', async ({ context }) => {
await page.setViewportSize({ width: 390, height: 844 }); const page = await openController(context);
await page.goto('http://localhost:3000/controller'); await resetGame(page);
await page.waitForSelector('.conn-bar.connected');
// Controlla che i bottoni principali abbiano dimensione minima 44x44px // Controlla che i bottoni principali abbiano dimensione minima 44x44px
const buttons = page.locator('.btn-ctrl'); const buttons = page.locator('.btn-ctrl');
@@ -58,10 +60,9 @@ test.describe('Accessibility (a11y)', () => {
} }
}); });
test('Controller: i bottoni punteggio dovrebbero avere dimensione adeguata', async ({ page }) => { test('Controller: i bottoni punteggio dovrebbero avere dimensione adeguata', async ({ context }) => {
await page.setViewportSize({ width: 390, height: 844 }); const page = await openController(context);
await page.goto('http://localhost:3000/controller'); await resetGame(page);
await page.waitForSelector('.conn-bar.connected');
const scoreButtons = page.locator('.team-score'); const scoreButtons = page.locator('.team-score');
const count = await scoreButtons.count(); const count = await scoreButtons.count();