Skip to content

Fix e2e (Playwright) output dir handling#1312

Open
sentience wants to merge 1 commit into
chromaui:mainfrom
sentience:codex/fix-npm-exec-e2e-output-dir
Open

Fix e2e (Playwright) output dir handling#1312
sentience wants to merge 1 commit into
chromaui:mainfrom
sentience:codex/fix-npm-exec-e2e-output-dir

Conversation

@sentience
Copy link
Copy Markdown

@sentience sentience commented May 1, 2026

This fixes two issues in the E2E (Playwright) build path when using npm (e.g. when using chromaui/action@latest in GitHub Actions with playwright: true):

  • forward --output-dir correctly to build-archive-storybook
  • recover correctly when Storybook writes the output directory in the newer (Storybook 10) multiline format

Problem

For E2E (Playwright) builds, Chromatic currently constructs the npm command to build a Storybook archive from Playwright test results like this:

npm exec build-archive-storybook --output-dir=/tmp/chromatic-...

With npm, that does not reliably pass --output-dir to the binary, so the build output ends up in ./storybook-static instead of the expected temp dir.

chromatic-cli already has a fallback for that case, where it detects the correct output directory by finding it in the Storybook CLI build log, but the parser only recognizes an older one-line log format (which seems to have been the format produced by Storybook 8). @chromatic-com/playwright@0.13.* has recently upgraded to Storybook 10, which outputs the build directory in a different, multi-line format, which chromatic-cli's fallback fails to parse. As a result, chromatic-cli cannot find the Storybook build output, and fails to find/validate the built test suite output with a message like this:

Error: Invalid test suite build at /tmp/chromatic--2600-OhzfouEzYsTN (check the build log)

Here's a sample build failure on one of my own projects triggered by the upgrade to @chromatic-com/playwright@0.13.x.

Fix

This PR fixes both issues:

  • change npm E2E command construction to use npm exec -- ...
  • make output directory parsing handle both:
    • Output directory: /path
    • Output directory: followed by the path on the next line

Why

This showed up for me when upgrading @chromatic-com/playwright, which moved the embedded Storybook version forward. The underlying npm forwarding issue was already there, but the newer Storybook log format stopped the existing recovery path from working. I originally reported it as chromaui/chromatic-e2e#312, mistaking it for a @chromatic-com/playwright issue, but on further investigation I traced the root cause to these issues in chromatic-cli – they were only triggered by the Storybook 10 upgrade in @chromatic-com/playwright.

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

None yet

Projects

None yet

Development

Successfully merging this pull request may close these issues.

1 participant