Skip to content

fix: wcag test runner #618

New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Draft
mkouzel-yext wants to merge 1 commit into
base: main
Choose a base branch
from
Draft

fix: wcag test runner #618

Changes from all commits
Commits
Show all changes
1 commit
Select commit
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
49 changes: 28 additions & 21 deletions .storybook/wcag/test-runner.ts
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -7,33 +7,40 @@ import { TestContext, TestRunnerConfig } from '@storybook/test-runner';
* See https://storybook.js.org/docs/react/writing-tests/test-runner#test-hook-api-experimental
* to learn more about the test-runner hooks API.
*/
// Mutex to serialize axe checks and avoid concurrency issues
let axeLock: Promise<void> = Promise.resolve();

const renderFunctions: TestRunnerConfig = {
async preVisit(page: Page) {
await injectAxe(page);
},
async postVisit(page: Page, context: TestContext) {
await checkA11y(
page,
{
exclude: [
'#root .mapboxgl-canvas-container',
'.mapboxgl-marker',
'.mapboxgl-popup-close-button'
],
},
{
axeOptions: {
runOnly,
rules: {
'color-contrast': { enabled: context.name !== 'Loading' },
},
},
detailedReport: true,
detailedReportOptions: {
html: true,
// Serialize axe checks to avoid "Axe is already running" error
axeLock = axeLock.then(async () => {
await checkA11y(
page,
{
exclude: [
'#root .mapboxgl-canvas-container',
'.mapboxgl-marker',
'.mapboxgl-popup-close-button'
],
},
}
);
{
axeOptions: {
runOnly,
rules: {
'color-contrast': { enabled: context.name !== 'Loading' },
},
},
detailedReport: true,
detailedReportOptions: {
html: true,
},
}
);
});
Comment on lines +19 to +42
Copy link

Copilot AI Jan 23, 2026

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

The lock implementation doesn't properly handle errors. If checkA11y throws an error, it will break the promise chain and cause all subsequent tests to hang indefinitely waiting for a promise that will never resolve. The callback passed to then() should explicitly return the promise, and error handling should be added to prevent the lock from becoming permanently broken. Consider wrapping the checkA11y call in a try-finally block or using catch() to ensure the lock chain continues even when errors occur.

Copilot uses AI. Check for mistakes.
await axeLock;
},
};

Expand Down
Loading