diff --git a/.changeset/visual-reporter-react-router.md b/.changeset/visual-reporter-react-router.md index 78000f6e..01f8a0a2 100644 --- a/.changeset/visual-reporter-react-router.md +++ b/.changeset/visual-reporter-react-router.md @@ -1,9 +1,9 @@ --- -"@wdio/visual-reporter": minor +"@wdio/visual-reporter": patch --- chore: rebuild the report UI with React Router 8, React 19 and Vite 8 The report UI moves from Remix 2 (end of life) to React Router 8 in framework mode, as a static single-page app, with React 19 and Vite 8. The report looks and works the same, and the CLI did not change. -Vite 8 builds for its default target "baseline widely available": the report now needs Chrome or Edge 111+, Firefox 114+ or Safari 16.4+ (before, with Vite 5: Chrome 87+, Edge 88+, Firefox 78+, Safari 14+). +The report still opens in the same browsers as before: Chrome 87+, Edge 88+, Firefox 78+ and Safari 14+. Vite 8 builds for newer browsers by default, so the reporter sets this list itself. diff --git a/docs/v11-migration.md b/docs/v11-migration.md index 37d100bb..a837c9e0 100644 --- a/docs/v11-migration.md +++ b/docs/v11-migration.md @@ -20,7 +20,7 @@ v11 is in prerelease on `main` (npm tag `next`). This guide lists what changes w | [New color difference metric (pixelmatch 8)](#new-color-difference-metric-pixelmatch-8) | Check tight tolerances; maybe re-accept some baselines | | [Ignored regions](#ignored-regions) | Only if a check fails after the upgrade | | [OCR: tesseract.js 7](#ocr-tesseractjs-7) | No | -| [Visual reporter](#visual-reporter) | Only if you open reports in an old browser | +| [Visual reporter](#visual-reporter) | No | | [Smaller fixes](#smaller-fixes) | No | ## WebdriverIO v10 only @@ -97,9 +97,8 @@ No change is needed. - Needs Node.js 22.19 or later (before: 20). - The report UI is rebuilt with React Router (before: Remix 2), React 19 and Vite 8. It looks and works the same. -- **Browser support of the report:** Vite 8 builds for its default target "baseline widely available": - Chrome and Edge 111+, Firefox 114+, Safari 16.4+ (before, with Vite 5: Chrome 87+, Edge 88+, Firefox 78+, - Safari 14+). Open the report in a recent browser. +- **Browser support of the report did not change:** Chrome 87+, Edge 88+, Firefox 78+, Safari 14+, the same + browsers as Vite 5 built for. Vite 8 has a newer default target, so the reporter sets this list itself. - The CLI wizards use `@inquirer/prompts` 8 and `ora` 9; they work the same. ## Smaller fixes diff --git a/packages/visual-reporter/vite.config.ts b/packages/visual-reporter/vite.config.ts index f8dce9e2..69843b8a 100644 --- a/packages/visual-reporter/vite.config.ts +++ b/packages/visual-reporter/vite.config.ts @@ -12,6 +12,12 @@ export default defineConfig({ tsconfigPaths: true, }, ...(baseName && { base: baseName }), + build: { + // The browsers of Vite 5's 'modules' target, which Vite 7 removed: the report is often opened in another + // browser than the one under test. The Vite 8 default ('baseline-widely-available') needs Chrome/Edge 111+, + // Firefox 114+ and Safari 16.4+ + target: ['es2020', 'edge88', 'firefox78', 'chrome87', 'safari14'], + }, css: { modules: { localsConvention: 'camelCaseOnly',