Repository navigation
fix(console): draw resource IDs without ligatures - #3019
Conversation
A monospace font with ligatures (Nimbus Mono PS, the fontconfig default on some Linux hosts) drew "ff" in an ID as one glyph. An Agent ID with two "ff" pairs was then 14.4 px narrower and fit one line in the 360 px stacked Agents list, so the phone-layout test failed about 1 run in 13 on such a host (finding 2114). IDs read character by character, so .resource-id turns ligatures off, and the test checks that an ID with "ff" draws as wide as one without.
|
🦞👀 Pull request received. I will update this pull request when review starts. ClawSweeper review completeClawSweeper finished reviewing this revision. The review result is being finalized. |
|
Codex review: needs maintainer review before merge. What this changesThis PR disables ligatures for console resource IDs and adds browser coverage and a matching Storybook scenario. Example: View agt_ffffffff-ffff-4fff-bfff-ffffffffffff at 360 px using Nimbus Mono PS.
Review scores
ProductKind: Bug fix · Worth it: Yes · Fix scope: Complete Merge readiness✅ Ready for maintainer review This PR remains useful: current main still permits ligatures in resource IDs, and the focused repair introduces no identified code defect; the previous Storybook finding is resolved. Priority: P3 Before mergeNone. FindingsNone. Tests
Agent review detailsHow this fits togetherThe controller serves console modules that render API resource IDs with the shared resource-id CSS class; the browser turns those strings into selectable text. flowchart TB
A[Resource API responses] --> B[Console renderers]
B --> C[Shared resource ID style]
C --> D[Browser font shaping]
D --> E[Readable selectable IDs]
Technical reviewBest possible solution: Keep the rendering fix in the existing shared resource-ID rule and retain the focused browser and Storybook coverage. Do we have a high-confidence way to reproduce the issue? Current main leaves ligatures enabled for monospace resource IDs, and the supplied before screenshots demonstrate merged f glyphs; the author also reports base failure and head success on Nimbus Mono PS, but no target code was run during this review. Is this the best way to solve the issue? Disabling ligatures at the shared ID style fixes the rendering cause across existing consumers without changing identifiers, font selection, or wrapping rules. AGENTS.md: found and applied where relevant. Codex review notes: model internal, reasoning medium; reviewed against 6aedac546aad. Provenance checked
TestingProof path: in-process harness. SecurityNone. EvidenceWhat I checked:
Likely related people:
Review metrics
LabelsLabel changes:
Label justifications:
Rank-up movesOptional improvements that raise the rating; they are not merge blockers.
Rating scale6/6 🦀 challenger crab · 5/6 🦞 diamond lobster · 4/6 🐚 platinum hermit · 3/6 🦐 gold shrimp · 2/6 🦪 silver shellfish · 1/6 🧂 unranked krab. Overall follows the weaker of proof and patch quality; ✨ marks media proof (a screenshot, video, or linked artifact) that directly shows the changed behavior. WorkflowClawSweeper edits this one comment on every review. Comment HistoryReview history (1 earlier review cycle)
Reviewed October 20, 2026, 4:22 AM ET / 08:22 UTC (Revision 2). |
Pages/Agents "Agent ID with ff (phone)" lists an Agent whose ID is agt_ffffffff-ffff-4fff-bfff-ffffffffffff, so the ligature fix can be inspected: where the monospace font has ligatures (Nimbus Mono PS), each "ff" used to draw as one glyph. The fixture Agent takes an optional scenario agentId.
|
@clawsweeper re-review |
|
🦞👀 Re-review progress:
|
Problem
tests/browser/console-agents-list-return.test.mjs"On a phone the Agents list stacks each row..." failed about 1 run in 13 at 2 CPUs on a dev host, always with360: row N ID fits one line(finding 2114).Cause: not timing. The host's fontconfig
monospaceis Nimbus Mono PS, which has ligatures, and Chromium applies them by default, soffin an Agent ID is drawn as one glyph. A 40-character Agent ID is 288 px in the 279 px ID line of a 360 px stacked row, so it wraps after a hyphen. An ID with twoffpairs drew 2 characters narrower (273.6 px), fit one line, and failed the check. Agent IDs are random UUIDs, so whether a run hit this was random. A 4x CPU throttle did not change the rate.It is a product issue as well as a flake: an ID should read character by character, and a ligature merges two characters into one glyph. On this host
agt_ffffffff-ffff-4fff-bfff-ffffffffffffdrew 187 px wide against 288 px for an ID with noff.Change
console.css:.resource-idsetsfont-variant-ligatures: none. This covers every resource ID in the console (Agents list, Agent page, shell, access bindings).ffdraws as wide as one without. It measures a probe span in the row's ID style.agentsIdLigaturesPhone) lists an Agent whose ID isagt_ffffffff-ffff-4fff-bfff-ffffffffffff. The fixture Agent takes an optional scenarioagentId. The story's description says how to see the difference: view it where the monospace font has ligatures.Verification
All runs below use
tasksetto pin each run to 2 CPUs, 4 runs at a time.360: row 1/2/3/4/6/8 ID fits one line)390: an ID with "ff" is 187.203125 px, one without 288.015625 px).font-size: 11px(360: row 0 ID fits one line);white-space: nowrap(fits one line);word-break: break-all(ID breaks inside a segment). So the 360 px wrap check still catches an ID that really fits one line.git merge-treeagainst this head gives the same conflicted files as against main, and no conflict hunk inconsole.cssor the test file.UI media (simulated Storybook fixture, this host's Nimbus Mono PS)
Story Pages/Agents → Agent ID with ff (phone). Before uses main's
console.cssand after uses this head (033fe95); both render the same fixture fromprepare-assets.mjsoutput. Before, the ID is 187.2 px on one line at 360 px. After, it is 288.0 px and wraps after a hyphen. At 390 px it is 288.0 px on one line.Full 360 px page after:
Walkthrough at 360 px: scroll the list, then select the ID (after-360-select.webm).
Not verified: the Storybook manager build itself (CI's Console Storybook workflow builds it), and fonts other than Nimbus Mono PS.
Risks
Low. This is one CSS property on monospace IDs, and it changes rendering only where the monospace font has ligatures. With a font that has no
ffligature, such as the usual CI fonts, the new assertion passes on main too. It guards the regression only on hosts like this one, and the visual change shows only there.