Repository navigation
fix(web): track line through finished stages; WebKit scroll jump - #11
Merged
Merged
Conversation
CI runs alongside review and validate, so a running CI turned the Validate->CI connector green while Validate had not started, and the track read as two stages reached at once. The connector now greens only through an unbroken run of done or skipped stages; a stage finished out of order keeps its dot but gets no line. The skipped dot's dashed border uses --ink-3 so it shows in dark themes. Co-Authored-By: Claude Opus 5.5 <noreply@anthropic.com> Claude-Session: https://claude.ai/code/session_01JrFSqr3eJsNihHcgYph1hB
The pipeline list was its own inline-size container. Each 3s poll rewrites its cards, and WebKit (Safari, Dock web apps) lays the page out short while it re-resolves that container, so a reader scrolled to the feed at the bottom is clamped back up. Chrome does not do this. The narrow-card query now sits on the shell container at 1044px, the shell width at which the pipeline is 760px wide (232px sidebar, 52px main padding). Card layout is identical in Chrome and WebKit at every width checked, including 1044/1045. Co-Authored-By: Claude Opus 5.5 <noreply@anthropic.com> Claude-Session: https://claude.ai/code/session_01JrFSqr3eJsNihHcgYph1hB
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
Add this suggestion to a batch that can be applied as a single commit.This suggestion is invalid because no changes were made to the code.Suggestions cannot be applied while the pull request is closed.Suggestions cannot be applied while viewing a subset of changes.Only one suggestion per line can be applied in a batch.Add this suggestion to a batch that can be applied as a single commit.Applying suggestions on deleted lines is not supported.You must change the existing code in this line in order to create a valid suggestion.Outdated suggestions cannot be applied.This suggestion has been applied or marked resolved.Suggestions cannot be applied from pending reviews.Suggestions cannot be applied on multi-line comments.Suggestions cannot be applied while the pull request is queued to merge.Suggestion cannot be applied right now. Please check back later.
1. Track line
The pipeline track coloured each connector by the state of the stage it led into. CI runs alongside review and validate, so with review running and CI pending the track showed a green Validate→CI line while Validate had not started, reading as two stages reached at once.
done/skippedstages (pure CSS::is(.done, .skipped) + .k::beforegreen,:not(.done, .skipped) ~ .k::beforegrey).--ink-3; it was nearly invisible in dark themes.Checked against a 9-state mockup in light and dark.
2. Dashboard scrolls back up in Safari
In Safari (and a Safari Dock web app), scrolling to the feed at the bottom of the dashboard jumped back up within a few seconds; Chrome did not.
Cause:
.pl(the pipeline list) was aninline-sizecontainer. Each 3s poll rewrites its cards, and WebKit lays the page out short while re-resolving the container, soscrollYis clamped (321 → 77 in the repro) and stays there. Reproduced in Playwright WebKit 26.0; removing that container stopped it,overflow-anchor: nonedid not.Fix: the narrow-card query moves to the existing
shellcontainer at 1044px (pipeline 760px = shell − 232px sidebar − 52px main padding). Card grid columns match the old CSS exactly in Chrome and WebKit at 600–1400px, including 1044/1045. WebKit now holds scroll for 20s+ of polling.Tests
pnpm lint && pnpm typecheck && pnpm testgreen (709). Tests insrc/web.test.tspin the track rules and keep size containers off.pl.🤖 Generated with Claude Code
https://claude.ai/code/session_01JrFSqr3eJsNihHcgYph1hB