Thanks to visit codestin.com
Credit goes to github.com

Skip to content

React 19.1 breaks axe-storybook command #107

@surgeboris

Description

@surgeboris

React 19.1 release includes some changes to scheduling (here and here), which breaks the E2E setup of axe-storybook: only the first test gets "passed", but all of the subsequent tests fail.

The minimal reproduction of the problem is in the react-19.1-issue branch of this repo. Just clone it and run npm ci && npm run build-storybook && npx axe-storybook.

If you downgrade react to 19.0.0 (by npm i [email protected] [email protected]) and run npm ci && npm run build-storybook && npx axe-storybook again the problem isn't there anymore.

From digging in the code, it looks like the scheduling changes in React affect the work of Storybook's internal APIs. The emitSetCurrentStory function works fine the first time, but on the second execution it causes a duplicate navigation, which causes page.evaluate to fail. I wasn't able to pinpoint the exact reason for a duplicate navigation (probably has something to do with the React effect execution, but I wasn't able to find the relevant part in the Storybook source code), however if I delete (or restrict to running only once) the updateGlobals block - the axe-storybook starts to work as expected.

Metadata

Metadata

Assignees

No one assigned

    Labels

    No labels
    No labels

    Type

    No type

    Projects

    No projects

    Milestone

    No milestone

    Relationships

    None yet

    Development

    No branches or pull requests

    Issue actions