Child Workflow Timeline stuttering with scrollbars on#3329
Draft
rossnelson wants to merge 1 commit intomainfrom
Draft
Child Workflow Timeline stuttering with scrollbars on#3329rossnelson wants to merge 1 commit intomainfrom
rossnelson wants to merge 1 commit intomainfrom
Conversation
…-gutter DT-3695: On OSes that always show scrollbars, the embedded child workflow timeline stuttered when expanding a group with a pending activity. The inner TimelineGraph div (max-height 320px via viewportHeight) toggled a vertical scrollbar, changing its clientWidth (bound to canvasWidth, which drives the SVG width). The re-render could re-toggle the scrollbar, producing a visible width oscillation. Reserving a stable scrollbar gutter on that container keeps clientWidth constant regardless of scrollbar visibility, breaking the loop. No-op visually on OSes with overlay scrollbars (the 48px SVG gutter already provides right-edge padding). Requires Chrome 94+, Firefox 97+, or Safari 18.2+; older browsers fall back to current behavior.
|
The latest updates on your projects. Learn more about Vercel for GitHub.
|
Contributor
|
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.
Summary
Implements DT-3695: Child Workflow Timeline stuttering with scrollbars on
Adds
[scrollbar-gutter:stable]to the outer<div>intimeline-graph.svelte— the element withbind:clientWidth={canvasWidth}that drives SVG sizing. On OSes that always show scrollbars (Windows, macOS "Always"), the vertical scrollbar was toggling on/off due to height interaction with the 320pxmax-height, changingclientWidtheach toggle and re-triggering SVG re-renders in a feedback loop. Reserving a stable gutter keepsclientWidthconstant regardless of scrollbar state, breaking the loop.No visible change on overlay-scrollbar OSes (default macOS/Linux); the existing 48px SVG gutter absorbs the reserved space.
Test plan
#event-history-timeline-graphin devtools —scrollbar-gutter: stableshould be computed on itpnpm checkandpnpm lintpass with no new errors