- aggiunge configurazione playwright.config.cjs per compatibilita runtime - aggiorna playwright.config.ts con progetto Mobile Chrome - migra i test E2E da .js a .spec.cjs - rimuove i vecchi file E2E non piu usati - allinea i test visual con snapshot baseline aggiornate
73 lines
2.7 KiB
JavaScript
73 lines
2.7 KiB
JavaScript
const { test, expect } = require('@playwright/test');
|
|
const AxeBuilderImport = require('@axe-core/playwright');
|
|
const AxeBuilder = AxeBuilderImport.default || AxeBuilderImport;
|
|
|
|
test.describe('Accessibility (a11y)', () => {
|
|
|
|
test('Display: non dovrebbe avere violazioni critiche a11y', async ({ page }) => {
|
|
await page.goto('http://localhost:3000');
|
|
await page.waitForTimeout(500);
|
|
|
|
const results = await new AxeBuilder({ page })
|
|
.withTags(['wcag2a', 'wcag2aa'])
|
|
.disableRules(['color-contrast']) // il display ha sfondo nero con testo grande, valutato separatamente
|
|
.analyze();
|
|
|
|
expect(results.violations).toEqual([]);
|
|
});
|
|
|
|
test('Controller: non dovrebbe avere violazioni critiche a11y', async ({ page }) => {
|
|
await page.goto('http://localhost:3001');
|
|
await page.waitForTimeout(500);
|
|
|
|
const results = await new AxeBuilder({ page })
|
|
.withTags(['wcag2a', 'wcag2aa'])
|
|
.analyze();
|
|
|
|
// Mostra i dettagli delle violazioni se ci sono
|
|
if (results.violations.length > 0) {
|
|
console.log('A11y violations:', JSON.stringify(results.violations.map(v => ({
|
|
id: v.id,
|
|
impact: v.impact,
|
|
description: v.description,
|
|
nodes: v.nodes.length
|
|
})), null, 2));
|
|
}
|
|
|
|
// Accettiamo solo violazioni minor (non critiche o serie)
|
|
const serious = results.violations.filter(v =>
|
|
v.impact === 'critical' || v.impact === 'serious'
|
|
);
|
|
expect(serious).toEqual([]);
|
|
});
|
|
|
|
test('Controller: i touch target dovrebbero avere dimensione minima', async ({ page }) => {
|
|
await page.goto('http://localhost:3001');
|
|
await page.waitForSelector('.conn-bar.connected');
|
|
|
|
// Controlla che i bottoni principali abbiano dimensione minima 44x44px
|
|
const buttons = page.locator('.btn-ctrl');
|
|
const count = await buttons.count();
|
|
|
|
for (let i = 0; i < count; i++) {
|
|
const box = await buttons.nth(i).boundingBox();
|
|
expect(box.width).toBeGreaterThanOrEqual(44);
|
|
expect(box.height).toBeGreaterThanOrEqual(44);
|
|
}
|
|
});
|
|
|
|
test('Controller: i bottoni punteggio dovrebbero avere dimensione adeguata', async ({ page }) => {
|
|
await page.goto('http://localhost:3001');
|
|
await page.waitForSelector('.conn-bar.connected');
|
|
|
|
const scoreButtons = page.locator('.team-score');
|
|
const count = await scoreButtons.count();
|
|
|
|
for (let i = 0; i < count; i++) {
|
|
const box = await scoreButtons.nth(i).boundingBox();
|
|
expect(box.width).toBeGreaterThanOrEqual(100);
|
|
expect(box.height).toBeGreaterThanOrEqual(100);
|
|
}
|
|
});
|
|
});
|