mirror of
https://github.com/webstudio-is/webstudio.git
synced 2026-10-23 03:27:27 +09:00
Oleg Isonen
8439a1a644
A screenshot could return success when a generated page rendered a React error boundary. The HTTP response and Webstudio root marker were valid, so the error was easy to miss. The capture now records browser JavaScript exceptions and error-level console events. MCP path screenshots of generated projects return `SCREENSHOT_JAVASCRIPT_ERROR` instead of success when either is detected. Other URL-based captures keep their existing behavior. Closes #6538 ### Checklist - [x] Capture JavaScript exceptions and error-level console events from the browser. - [x] Reject generated-project screenshots with a structured error code. - [x] Add regression coverage and verify the tests fail before the fix. - [x] Review authoritative documentation; no documentation change is needed for this error-reporting correction. - [x] Run vision and CLI tests, typechecks, lint, and a local Chrome React error-boundary capture. ### Verification - `pnpm --filter @webstudio-is/vision test` — 103 passed. - `pnpm --filter webstudio test` — 1,278 passed. - `pnpm --filter @webstudio-is/vision typecheck` — passed. - `pnpm --filter webstudio typecheck` — passed. - Oxlint and `git diff --check` — passed. - Local Chrome end-to-end: an HTTP 200 page rendered a React error boundary and was identified as a JavaScript error. Local agent evaluations were not run; they require explicit approval.
Vision
@webstudio-is/vision provides source-agnostic browser capture, screenshot
comparison, OCR analysis, caching primitives, and portable visual reports.
Import the smallest relevant entry point:
import { createBrowserScreenshotSession } from "@webstudio-is/vision/browser";
import { captureVisualEntries } from "@webstudio-is/vision/capture";
import { diffPngFiles } from "@webstudio-is/vision/diff";
import {
classifyScreenshotComparisonReport,
writeScreenshotComparisonReport,
} from "@webstudio-is/vision/report";
import { selectRepresentativeViewports } from "@webstudio-is/vision/viewports";
Consumers own their source-specific orchestration. The visual regression runner, for example, handles Git revisions and Storybook CSF rendering while this package handles capture batches, image comparison, and reports.