Playwright + axe-core
import AxeBuilder from '@axe-core/playwright';
// Check for status message accessibility
const results = await new AxeBuilder({ page })
.withRules(['aria-live-region-text'])
.analyze();
// Verify live region exists
const liveRegion = page.locator('[aria-live]');
await expect(liveRegion).toBeAttached();
// Trigger update and verify content changes
await page.click('[data-testid="trigger-notification"]');
await expect(liveRegion).toContainText('saved');Manual Testing
// Find all live regions
const liveRegions = await page.$$('[aria-live], [role="status"], [role="alert"]');
for (const region of liveRegions) {
const live = await region.getAttribute('aria-live');
const role = await region.getAttribute('role');
const atomic = await region.getAttribute('aria-atomic');
console.log({
live,
role,
atomic,
text: await region.textContent()
});
}
// Verify dynamic content is in live region
await page.click('[data-testid="save-button"]');
const status = page.locator('[role="status"]');
await expect(status).toHaveText(/saved|error/i);
