test(ui): mechanics-regression gate — unscrollable sheets + swipe touch-action (#11853 sibling)

[0xSolace]

What

Adds a mechanics-regression gate (packages/ui/src/mechanics-regression-gate.test.ts) — a static, no-browser vitest gate that locks down the two MECHANICS classes of UI bug that slipped past every existing detection layer plus manual QA.

The existing *-gate.test.ts files (no-backdrop-blur, no-focus-ring, no-widget-chrome, will-change) are all STYLE gates. The two bugs that shipped were mechanics bugs — the pixels looked correct, the interaction was dead:

• (a) drawer-not-scrollable — a clamped-height (max-h-[..vh]) + flex-col + overflow-hidden sheet/drawer shell with no inner overflow-y-auto scroll body. Content taller than the clamp is dead-clipped and unreachable.
• (b) broken-swipe — a useHorizontalPager surface with no explicit touch-action. The CSS default (auto) hands horizontal pans to the browser's own scroll/back gesture, which fires pointercancel instead of pointerup, so the flick silently never commits on real touch hardware. (Fixed on develop via touch-action: pan-y / touch-pan-y; this gate locks it so it can't regress.)

The gate

Scoped to the real surfaces (McpDetailDrawer, Launcher, HomeLauncherSurface) rather than a repo-wide regex — a targeted, low-false-positive tripwire beats a noise cannon. Two rules:

• (a) a clamped drawer/sheet consumer must own a genuine scroll body: the flex-1 + min-h-0 + overflow-y-auto triad on the same element.
• (b) any useHorizontalPager consumer must pin an explicit touch-action (pan-y/pan-x/none, class or inline style).

Comments are stripped before scanning, and the drawer triad is checked per-className-element (not per-file), so a comment that merely mentions touch-pan-y or an unrelated decoy scroller (McpDetailDrawer has a max-h-48 overflow-y-auto code block) can't mask a real regression. Four self-tests plant each bug shape — including the two exact false-negatives codex flagged — and assert the detector fires.

Proof

• Green against develop tip (6 tests pass — adds no new red).
• Fails on both planted real-bug shapes, in the HARD form: removing only the real drawer body scroll (leaving the decoy) → rule (a) fires; stripping the pager class leaving only the comment mention → rule (b) fires. Reverted → green.
• Codex-reviewed (gpt-5.5): flagged 2 P2 false-negatives (comment-match + decoy-scroller); both fixed and now covered by dedicated self-tests. Biome clean.

Relationship to the in-flight UI-detection work

This is the MECHANICS gap — covered by none of:

• test(#10722): rendered-geometry 44px tap-target gate + semantic assertions #11868 (rendered 44px tap-target geometry + ARIA semantics) — size/semantics, not scroll/swipe
• test(#10722): add plugin-views keyboard focus-order audit to the WebKit ui-smoke lane #11877 (plugin-views keyboard focus-order on WebKit) — focus order, not mechanics
• fix(ui,app): clear the remaining non-device ui+app test reds — no-blur gate, 5 coverage-ratchet drifts, deterministic #11030 deadlock guard #11898 (clears the existing ui+app test reds) — red-clearing, adds no mechanics gate

Sibling of #11853 (full ui/app suites run in Client Tests but are red/unenforced). This new gate joins that same lane. Enforcement (branch protection on develop) is #11853's job — not duplicated here. The gate is green on develop so it doesn't add a new red; it only arms the tripwire.

Test-only. One new file. No product source touched; did not touch vite.config.*, index.html, client-base.ts, or bun.lock.

Refs #11853.

— [sol-orch]

Co-authored-by: wakesync shadow@shad0w.xyz

[greptile-apps]

Your trial has ended. Reactivate Greptile to resume code reviews.

[coderabbitai]

Important

Review skipped

Auto reviews are disabled on this repository. Please check the settings in the CodeRabbit UI or the .coderabbit.yaml file in this repository. To trigger a single review, invoke the @coderabbitai review command.

⚙️ Run configuration

Configuration used: Organization UI

Review profile: CHILL

Plan: Pro

Run ID: 8f25ba31-51fc-455e-8cc0-b214de01827b

You can disable this status message by setting the reviews.review_status to false in the CodeRabbit configuration file.

Use the checkbox below for a quick retry:

• 🔍 Trigger review

✨ Finishing Touches

🧪 Generate unit tests (beta)

• Create PR with unit tests
• Commit unit tests in branch sol/ui-mechanics-gate

---

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.

❤️ Share

• X
• Mastodon
• Reddit
• LinkedIn

_{Comment @coderabbitai help to get the list of available commands.}

[claude]

Claude encountered an error —— View job

---

I'll analyze this and get back to you.