Repository navigation
#232 — pass-2 conformance: tooltip edge-flip, expected badges left, tooltip text size - #234
Conversation
…ted badges left, 13.44px tip text (#232) Executes the three fix recipes from the 2026-06-11 design-conformance audit (epic #197 pass-2 spec): - R2 (audit D2): renderExpectedPanel always emits the .fixture-view-bar meta row for table renders — [model pill][mode badge][N rows] reading left under the Expected title, mirroring Given; the right-aligned, order-reversed .panel-header fallback is retired (sql-format / external-fixture early-return paths keep the header placement, spec-consistent). The #178 persistent-rowcount rescue is untouched. - R1 (audit D1): edge-aware CSS bubbles — belt-and-braces right-anchor for header-placed badges (the spec's base.css precedent), a geometry- only data-tip-edge tagger on the delegated mouseenter/focusin path (visibility stays pure CSS — the #146/#161 contract intact), and the shared bubble max-width capped at min(70vw, calc(100vw - 16px)). Opportunistic D18: positionTipNear resets left before measuring offsetWidth (stale-width clamp overshoot). - R3 (audit D3): bubble text 0.78rem (7.8px at Sakura's 62.5% root) → 13.44px, matching the column-tooltip description (12px shell base × 1.12em). Headless: three new RED-first pins (375px-class viewport containment, computed-size equality vs #col-tooltip .ct-desc, no-diff meta-row structure) + existing placement pins updated to the spec-true bar location; the #146 focus-reveals-bubble guard stays green. Goldens regenerated with the CI commands; every byte delta traces to the R1/R2/R3/D18 blocks. Closes #232 Co-Authored-By: Claude Fable 5 <noreply@anthropic.com>
|
Warning Review limit reached
More reviews will be available in 13 minutes and 11 seconds. Learn how PR review limits work. Your organization has run out of usage credits. Purchase more credits in the billing tab to continue. ⌛ How to resolve this issue?After more reviews become available, a review can be triggered using the We recommend that you space out your commits to avoid hitting the rate limit. 🚦 How do rate limits work?CodeRabbit enforces hourly rate limits for each developer per organization. Our paid plans include higher PR review limits than trial, open-source, and free plans. In all cases, reviews become available again over time. During sustained high-volume PR review activity, CodeRabbit may temporarily slow when the next review becomes available. Please see our Fair Usage Limits Policy for further information. ℹ️ Review info⚙️ Run configurationConfiguration used: defaults Review profile: CHILL Plan: Pro Run ID: ⛔ Files ignored due to path filters (1)
📒 Files selected for processing (5)
📝 WalkthroughWalkthroughTooltip bubbles now support viewport-edge-aware CSS positioning via a JS geometry tagger that measures triggers and bubbles, then annotates them with ChangesTooltip viewport edge-awareness and expected-panel meta relocation
Estimated code review effort🎯 3 (Moderate) | ⏱️ ~20 minutes Possibly related issues
Possibly related PRs
Poem
🚥 Pre-merge checks | ✅ 5✅ Passed checks (5 passed)
✏️ Tip: You can configure your own custom pre-merge checks in the settings. ✨ Finishing Touches🧪 Generate unit tests (beta)
Thanks for using CodeRabbit! It's free for OSS, and your support helps us grow. If you like it, consider giving us a shout-out. Comment |
|
Ready to review this PR? Stage has broken it down into 4 individual chapters for you:
Chapters generated by Stage for commit 679e82c on Jun 11, 2026 4:48pm UTC. |
📄 Rendered report previewAll golden examples regenerated cleanly. 🟡 Golden examplesCommitted to
🐶 Live dogfood previewThis PR doesn't touch ▶ Open ↗ opens the report in your browser in one click — The Pages preview may take ~1 min to update after this comment Alternative: GitHub CLI# gh CLI >= 2.63 extracts into ./report-preview-playground/.
gh run download 27362957024 -R breezy-bays-labs/cute-dbt -n report-preview-playground
open report-preview-playground/playground-report.htmlPosted by |
![gemini-code-assist[bot]](https://avatars.githubusercontent.com/in/956858?s=60&v=4){kind=small}
There was a problem hiding this comment.
Code Review
This pull request addresses design-conformance issues (cute-dbt#232) by implementing edge-aware tooltip bubble anchoring, ensuring the Expected panel's metadata row is consistently positioned below the title, and adjusting the tooltip bubble text size to match column descriptions. Additionally, headless integration tests have been added to verify these layout and sizing fixes. I have no feedback to provide as there are no review comments to evaluate.
Important
The consumer version of Gemini Code Assist on GitHub is being sunset. Starting June 18, 2026, new organization installations will be blocked, and all code review activity will officially cease on July 17, 2026.
For more details on the timeline and next steps, please review the Help Documentation.
![coderabbitai[bot]](https://avatars.githubusercontent.com/in/347564?s=60&v=4){kind=small}
There was a problem hiding this comment.
Actionable comments posted: 1
🤖 Prompt for all review comments with AI agents
Verify each finding against current code. Fix only still-valid issues, skip the
rest with a brief reason, keep changes minimal, and validate.
Inline comments:
In `@tests/headless_toggle.rs`:
- Around line 7561-7569: The viewport-edge assertions are too strict for
fractional-pixel rounding; update the assertions around variables right, left
and vw in tests/headless_toggle.rs to allow a 1.0px tolerance (e.g.
assert!(right <= vw + 1.0, ...) and assert!(left >= -1.0, ...)) or introduce a
small_tolerance = 1.0 and use right <= vw + small_tolerance and left >=
-small_tolerance so the test remains deterministic while preserving intent.
🪄 Autofix (Beta)
Fix all unresolved CodeRabbit comments on this PR:
- Push a commit to this branch (recommended)
- Create a new PR with the fixes
ℹ️ Review info
⚙️ Run configuration
Configuration used: defaults
Review profile: CHILL
Plan: Pro
Run ID: 6c2bf09f-f3e7-4822-a5c2-e79b3091656c
⛔ Files ignored due to path filters (1)
tests/snapshots/render_integration__rendered_chrome_jaffle_shop.snapis excluded by!**/*.snap
📒 Files selected for processing (7)
examples/diff-showcase-report.htmlexamples/jaffle-shop-report.htmlexamples/playground-report.htmltemplates/interaction.jstemplates/partials/test-card.htmltemplates/report.csstests/headless_toggle.rs
getBoundingClientRect returns fractional px in headless Chrome; the exact bounds (right <= vw, left >= 0.0) were a flake vector. 1px tolerance mirrors the #157 sub-pixel precedent — the guarded regression is 23-47px of clipping, so the teeth are intact. Co-Authored-By: Claude Fable 5 <noreply@anthropic.com>
…ormance # Conflicts: # tests/headless_toggle.rs
1 participant
Summary
Executes the three fix recipes from the 2026-06-11 design-conformance audit (pass-2 spec, epic #197) — the audit's three confirmed deviations, with before/after measurements.
D2 — Expected badges right-aligned + order-reversed (MED) → R2
.panel-headerpushed right in reversed order[rows][branch][model].renderExpectedPanelalways emits the.fixture-view-barmeta row for table renders — reading order[model pill][mode badge][N rows]left under the title, mirroring Given; the header fallback is deleted. The sql-format / external-fixture early-return paths keep the header placement (spec-consistent; themargin-left:autoheader rule now carries a comment scoping it to exactly those paths). The feature: design integration PR-2 — engine merge (settings panel, unified/split diffs) + port-forward of post-fork behaviors #178 persistent-rowcount rescue and the #159 — strategy-correct incremental expect-semantics tooltip #161 idempotent clear-list are untouched.D1 — CSS-bubble tips clip at the viewport edge (HIGH) → R1
bubble.right = 523.0vsinnerWidth = 500— 23.0px clipped (the audit's real-375px measurement was 422.7 vs 375 = 47.7px clipped).bubble left=59.2 right=272.2at the same width — fully contained.base.cssprecedent); (b) a geometry-onlydata-tip-edge="right"|"left"tagger on the delegatedmouseenter/focusinpath measuring the trigger againstdocument.documentElement.clientWidth+ two CSS anchor rules; (c) shared bubblemax-width: min(70vw, calc(100vw - 16px)); (d) opportunistic D18:positionTipNearresetsel.style.left = "0px"before measuringoffsetWidth(stale-width clamp overshoot, the spec-shared quirk). Covers all three CSS-bubble consumers: incremental mode-badge tip, prior-model-state this-badge tip, DAG-hint ⓘ.D3 — Bubble text 7.8px vs spec 13.44px (HIGH) → R3
font-size7.8px (0.78remat Sakura'shtml{font-size:62.5%}root) vs#col-tooltip .ct-desc13.44px.font-size: 13.44px(the spec's 12px shell base × 1.12em description size, absolute px deliberately because of the Sakura root) — computed-equality pin green. The shared rule covers all three bubble consumers;line-height: 1.45already in place; the 375px stacked view stays contained (the R1 cap/anchors handle the taller bubble).#146/#161 contract preserved
The tooltip mechanism is unchanged: focusable trigger (
tabindex),aria-labelon the trigger, bubblearia-hidden, reveal via pure CSS:hoverAND:focus/:focus-visible. No JS-controlled visibility — the new tagger annotates geometry only (data-tip-edge), no nativetitle, no new dependencies, zero-egress untouched (zero-egress gate re-run green). The existing #146 focus-reveals-bubble guard stays green.Tests (RED-first)
Three new pins appended to
tests/headless_toggle.rs(sibling PR #230 also appends there — the #232 block sits at the end; a textual conflict resolves by keeping both blocks):badge_tip_bubble_stays_inside_a_narrow_viewport— phone-class stacked layout, badge tip focused, assertsbubble.right <= innerWidth && left >= 0. Failed on unmodified main (523.0 > 500).badge_tip_text_matches_column_tooltip_description_size— computedfont-sizeequality vs a real#col-tooltip .ct-desc(plus the absolute 13.44px sanity pin). Failed on unmodified main (7.8px vs 13.44px).expected_meta_row_reads_left_without_an_expect_diff— no-diff test: meta row exists, ordermodel|mode|rows, pill paints left of the rowcount, header carries only the<h2>. Failed on unmodified main (no bar without a diff).Existing placement pins (
MODE_BADGE/MODE_TIP_TRIGGER, the rich-test expected pill, the leak-clear pill check) updated truthfully to the spec-true bar location — none weakened. Note: the new pins use the file's synthetic-manifest harness builders (an incremental model +is_incremental_modetest — the identical code path the audit measured on the playground fixture) rather than loading the playground JSON, matching the suite's idiom.Goldens
examples/{jaffle-shop,playground,diff-showcase}-report.htmlregenerated with the exactexample-report-checkCI commands; explore pages unchanged (they don't inline the report engine).git diff --text -U0 -- examples/audited: every delta is the R1/R2/R3/D18 CSS/JS blocks, identical ×3 — no fixture/data/root_path deltas. Therender_integration__rendered_chrome_jaffle_shopinsta snapshot rebaselined for the same blocks. Thetest-card.htmldoc comment uses{#- -#}trimming so the template stays byte-neutral.Gates (run directly — lefthook skips in fresh worktrees)
cargo fmt --check✅cargo clippy --all-targets --locked -- -D warnings✅ (by exit code)cargo nextest run✅ 1193 passedcargo test --test bdd✅ 157 scenarios / 1016 steps (no feature-count change)cargo test --test headless_zero_egress -- --ignored✅ 10 passedcargo test --test headless_toggle -- --ignored✅ 49 passedRUSTDOCFLAGS="-D warnings" cargo doc --no-deps --locked✅cargo deny check✅Closes #232
🤖 Generated with Claude Code
Summary by CodeRabbit
Bug Fixes
UI Improvements