Skip to content

Verify generated pages with real Chromium rendering and pixel comparisons - #102

Merged
owjs3901 merged 2 commits into
devfive/3099154426bffbeef8b62999b80bb038/devfive-relay-c70423/devup-mcp-completenessfrom
devfive/3099154426bffbeef8b62999b80bb038/real-render-verification
Oct 19, 2026
Merged

owjs3901 merged 2 commits into
devfive/3099154426bffbeef8b62999b80bb038/devfive-relay-c70423/devup-mcp-completenessfrom
devfive/3099154426bffbeef8b62999b80bb038/real-render-verification

Conversation

@devfive-relay-c70423

Copy link
Copy Markdown
Contributor

Generated TSX can pass static validation and geometry checks while the page paints incorrectly. This adds an executable real-render gate that runs the existing runtime-audit Playwright runner, then compares each page screenshot against a pinned reference with the production Rust pixel comparator. A successful capture or completed execution alone cannot pass it.

The regression generates a page with production Rust codegen, builds it with React and the actual DevupUI Vite plugin/reset, serves it, and visits it in Chromium. Correct output matches exactly. Missing background and unloaded image each change 93.75% of pixels; the wrong card color changes 6.25%. All four cases retain passing geometry. Tests also cover command exit codes and missing, duplicate and modified references. The harness's normal npm test command runs this end-to-end check along with every existing runtime test.

Both devup skills now require browser execution, independently acquired Figma comparisons, report/diff review and retained evidence before claiming completion. Unavailable tooling, missing comparisons and unresolved findings remain incomplete. Updated the embedded skill integrity manifest and generated the patch changepack using the requested bunx command.

Decisions

  • Stack this PR on PR feat: show devup-mcp version in bridge plugin and harden runtime audit #101's actual remote head, devfive/3099154426bffbeef8b62999b80bb038/devfive-relay-c70423/devup-mcp-completeness, matching local integration/devup-mcp-completeness at 0c3386a. This keeps the review limited to real-render verification.
  • Keep existing capture/report ingestion semantics. Add harness/runtime-audit/verify-render.mjs as a separate command-line gate; the documented MCP capture/ingest/visual-compare/status workflow remains supported.
  • Require exactly one hash-pinned original per planned screen/viewport, scale 1, explicit pixel threshold, and page-health/image-loaded checks. The gate rejects missing evidence, runtime/environment errors, comparison failures and invalid dimensions. Use a drawn-width plan for this page gate and the ordinary runtime audit for widths with no Figma original. Section/asset comparisons still run through the existing MCP workflow.
  • Keep regression evidence deterministic and offline. The small independent raster oracle is explicitly synthetic and described pixel-by-pixel in the harness README; it is never generated from Chromium or updated by the test. The Figma connector returned a reauthentication error during this task, so no live Figma acquisition or live-page parity is claimed. For a real Figma page, the gate consumes its independently exported, pinned PNG rather than the synthetic test oracle.
  • Add Vite/React/DevupUI only as harness devDependencies. Browser failures never silently skip. Set DEVUP_KEEP_RENDER_EVIDENCE=1 to retain screenshots, reports and diff PNGs for diagnosis or upload.
  • A push containing the proposed CI workflow addition was rejected by the GitHub proxy with a generic App-permissions/branch-protection error. The same change without the workflow-file modification pushed successfully. Therefore the existing CI workflow is unchanged: the new browser suite runs via the harness's npm test, but is not automatically gated in repository CI yet. The README includes Linux CI commands; the unapplied workflow patch is retained locally in validation-ci.patch.log. This limitation is recorded rather than bypassing the GitHub restriction.
  • Use the required GitHub proxy at 192.168.0.43:8444 for GitHub operations; no edits outside this worktree.

Validation

  • cargo fmt --all --check
  • cargo clippy --workspace --all-targets -- -D warnings
  • cargo test --workspace
  • npm test --prefix harness/runtime-audit (node --test test/*.test.mjs): 40 passed, no skips
  • node --test plugin/tests/*.test.mjs: 8 passed
  • 447 repository Rust files checked: every file at most 1,000 lines
  • bunx @changepacks/cli --yes --update-type patch --message ...
  • Git whitespace check with cr-at-eol for the existing byte-preserved CRLF skill documents

Submitted via Devfive hub. Employee: ; device: 3099154426bffbeef8b62999b80bb038

@owjs3901
owjs3901 marked this pull request as ready for review October 19, 2026 15:32
@owjs3901
owjs3901 merged commit fb0b798 into devfive/3099154426bffbeef8b62999b80bb038/devfive-relay-c70423/devup-mcp-completeness Oct 19, 2026
9 checks passed
@owjs3901
owjs3901 deleted the devfive/3099154426bffbeef8b62999b80bb038/real-render-verification branch October 19, 2026 15:32
owjs3901 pushed a commit that referenced this pull request Oct 19, 2026
#101)

* Require complete runtime evidence and catch responsive reading-order and clipping failures

* Handle unavailable Windows symlink privileges in audit validation

* Guard screen-plan frame inventories and bind navigation labels

* fix: guard Figma section and asset coverage

* Publish generated Figma scripts atomically during concurrent validation

* Block unfinished visual comparisons and complete runtime audit reporting

* Record final generated-script validation evidence

* Record final rendered completeness audit validation

* fix: reset button appearance and preserve hero image sources

* feat: show devup-mcp version in bridge plugin and harden runtime audit

Plugin shows its own version and the connected devup-mcp version (server-info); hello carries pluginVersion, surfaced in status attachedFiles. Runtime audit adds image-loaded, native-appearance and stale-resources checks.

* Verify generated pages with real Chromium rendering and pixel comparisons (#102)

* test: require real-browser render verification for generated pages

* docs: record CI workflow permission limit

---------

Co-authored-by: leader <leader@devfive.invalid>

---------

Co-authored-by: leader <leader@devfive.invalid>
Co-authored-by: devfive-relay-c70423[bot] <328770141+devfive-relay-c70423[bot]@users.noreply.github.com>
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