fix: flickering variants while ongoing generation - #2467
Conversation
This comment has been minimized.
This comment has been minimized.
Visual recap — generation failedThe visual recap could not be generated for this pull request. This is informational only and does not block the PR. Diagnostic: No plan URL: Repair changed too much of targeted file plan.mdx; expected a localized parser fix. Agent output: Repaired recap-source.json: restored the diagram’s four escaped Markdown fences, so the CSS is no longer parsed as an MDX expression. JSON and fence structure verified. --- ⠀ 🟢 Recap source repaired and ready for the hosted parser retry stderr: Reading additional input from stdin... 2026-07-28T16:55:09.908596Z ERROR codex_core::tools::router: error=apply_patch verification failed: Failed to find expected lines in /home/runner/work/agent-native/agent-native/recap-source.json: \n\ |
![builder-io-integration[bot]](https://avatars.githubusercontent.com/in/353721?s=60&v=4){kind=small}
There was a problem hiding this comment.
Builder reviewed your changes and found 1 potential issue 🟡
Review Details
Code Review Summary
PR #2467 fixes horizontal overlap between generated design directions and responsive breakpoint previews by centralizing responsive group-width arithmetic, making file ordering deterministic, and changing overview culling to budget whole screens while retaining an iframe ceiling. Computing placement inside the compare-and-set mutation is a sound choice for using the breakpoint set that is current at commit time, and the added tests cover horizontal spacing, deduplication, ordering, and culling behavior well. This is a standard-risk UI/state-management change.
Key Findings
Medium: The placement helper claims to reserve each screen's whole painted footprint, but row advancement still uses only the primary frame height. A taller breakpoint preview can therefore overlap the next generated row.
Browser testing
🧪 Browser testing: Attempted, but visual verification could not run because the browser-test executor had no browser navigation or interaction tools. The dev server was healthy; the planner seeded designs and hand-verified persisted horizontal placement math, but all visual test cases remained unverified due to the environment limitation.
| screen.width, | ||
| ), | ||
| }) + VARIANT_GAP; | ||
| rowHeight = Math.max(rowHeight, screen.height); |
There was a problem hiding this comment.
🟡 Reserve breakpoint preview height when advancing variant rows
x now accounts for every breakpoint preview, but rowHeight is still only screen.height. A generated mobile/tablet screen can have a much taller painted breakpoint preview when the design already has a wider breakpoint, so the next variant row is placed over the previous row's preview. Compute the maximum painted group height for the row using the same responsive sizing rules as the canvas, and add a regression case with a wider existing breakpoint.
Additional Info
Confirmed by code review agent; browser visual verification was unavailable because executor tooling lacked browser controls.
This comment has been minimized.
This comment has been minimized.
This comment has been minimized.
This comment has been minimized.
This comment has been minimized.
This comment has been minimized.
This comment has been minimized.
This comment has been minimized.
This comment has been minimized.
This comment has been minimized.
This comment has been minimized.
This comment has been minimized.
This comment has been minimized.
This comment has been minimized.
This comment has been minimized.
This comment has been minimized.
This comment has been minimized.
This comment has been minimized.
This comment has been minimized.
This comment has been minimized.
This comment has been minimized.
This comment has been minimized.
2 participants
No description provided.