Skip to content

gpui: Give divs (the option for) a better scrolling experience - #61797

Merged
mikayla-maki merged 11 commits into
zed-industries:mainfrom
feitreim:bugfix-div-scroll
Jul 30, 2026
Merged

mikayla-maki merged 11 commits into
zed-industries:mainfrom
feitreim:bugfix-div-scroll

Conversation

@feitreim

@feitreim feitreim commented Jul 28, 2026

Copy link
Copy Markdown
Collaborator

Objective

Closes #56127

Right now there is an issue where in certain contexts, specifically GPUI div elements, horizontal scrolling w/ a trackpad works very poorly, even when trying to scroll sideways, vertical scrolling will happen.

This happens with both a trackpad and scrollwheel. The showcase video also shows the broken behavior.

Solution

The way that scrolling works in the editor is really nice, scrolls are locked to the axis they started on but with enough force can change axis. so by taking the ongoing scroll handler from the editor and moving it up into GPUI, we can get that same functionality for GPUI.

I somewhat "take over" the functionality of the existing restrict_scroll_to_axis property, because it seems like its purpose was basically trying to fix this problem already, just unsuccessfully. The alternative, and would make things overall nicer to look at, would be to tie this to allow_concurrent_scroll, but the effect radius tied to that option is way bigger, so im holding off on that atleast right now.

Testing

Theres a good number of scroll related tests generally, so I don't think i've perturbed any common existing behaviors. attach the functionality to restrict_scroll_to_axis really limits the surface. There are also some new tests for the ongoing_scroll behaviors.
Tested on my mac w/ both trackpad and mouse.

Self-Review Checklist:

  • I've reviewed my own diff for quality, security, and reliability
  • Unsafe blocks (if any) have justifying comments
  • The content adheres to Zed's UI standards (UX/UI and icon guidelines)
  • Tests cover the new/changed behavior
  • Performance impact has been considered and is acceptable

Showcase

Video show casing all the behaviors:
broken w/ trackpad
working w/ trackpad
broken w/ scroll
working w/ scroll

scroll_video_small.mp4

Release Notes:

  • markdown_preview: Fix horizontal scrolling inside certain elements

@cla-bot cla-bot Bot added the cla-signed The user has signed the Contributor License Agreement label Jul 28, 2026
@zed-community-bot zed-community-bot Bot added the guild Pull requests by someone in Zed Guild. NOTE: the label application is automated via github actions label Jul 28, 2026
@maxdeviant maxdeviant changed the title GPUI: Give divs (the option for) a better scrolling experience gpui: Give divs (the option for) a better scrolling experience Jul 28, 2026
@MrSubidubi MrSubidubi added the area:ui/scrolling Scrollbar and scrolling label Jul 29, 2026
@feitreim
feitreim marked this pull request as ready for review July 30, 2026 15:51
@MrSubidubi MrSubidubi self-assigned this Jul 30, 2026

@mikayla-maki mikayla-maki left a comment

Copy link
Copy Markdown
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Nice tests!

@mikayla-maki
mikayla-maki added this pull request to the merge queue Jul 30, 2026
Merged via the queue into zed-industries:main with commit 79cc17c Jul 30, 2026
43 checks passed
madcodelife added a commit to longbridge/gpui-kit that referenced this pull request Aug 4, 2026
Wireup zed-industries/zed#61797.

- `ScrollableMask` — per-gesture axis lock (follow-up to #2608)
- `Scrollable`, `VirtualList` — no more cross-axis remapping (behavior
change)

Co-authored-by: Claude Opus 5 (1M context) <noreply@anthropic.com>
playdohface pushed a commit to playdohface/zed that referenced this pull request Aug 29, 2026
…ndustries#61797)

# Objective

Closes zed-industries#56127

Right now there is an issue where in certain contexts, specifically GPUI
div elements, horizontal scrolling w/ a trackpad works very poorly, even
when trying to scroll sideways, vertical scrolling will happen.

This happens with both a trackpad and scrollwheel. The showcase video
also shows the broken behavior.

## Solution

The way that scrolling works in the editor is really nice, scrolls are
locked to the axis they started on but with enough force can change
axis. so by taking the ongoing scroll handler from the editor and moving
it up into GPUI, we can get that same functionality for GPUI.

I somewhat "take over" the functionality of the existing
`restrict_scroll_to_axis` property, because it seems like its purpose
was basically trying to fix this problem already, just unsuccessfully.
The alternative, and would make things overall nicer to look at, would
be to tie this to `allow_concurrent_scroll`, but the effect radius tied
to that option is way bigger, so im holding off on that atleast right
now.

## Testing

Theres a good number of scroll related tests generally, so I don't think
i've perturbed any common existing behaviors. attach the functionality
to `restrict_scroll_to_axis` really limits the surface. There are also
some new tests for the ongoing_scroll behaviors.
Tested on my mac w/ both trackpad and mouse. 

## Self-Review Checklist:

- [x] I've reviewed my own diff for quality, security, and reliability
- [x] Unsafe blocks (if any) have justifying comments
- [x] The content adheres to Zed's UI standards
([UX/UI](https://github.com/zed-industries/zed/blob/main/CONTRIBUTING.md#uiux-checklist)
and
[icon](https://github.com/zed-industries/zed/blob/main/crates/icons/README.md)
guidelines)
- [x] Tests cover the new/changed behavior
- [x] Performance impact has been considered and is acceptable

## Showcase

Video show casing all the behaviors:
broken w/ trackpad
working w/ trackpad
broken w/ scroll
working w/ scroll



https://github.com/user-attachments/assets/1935cd2d-a255-4a77-81d5-daa9f72470a6


---

Release Notes:

- markdown_preview: Fix horizontal scrolling inside certain elements
ScottCUSA added a commit to ScottCUSA/gpui-kit that referenced this pull request Sep 10, 2026
GPUI changed restrict_scroll_to_axis in zed-industries/zed#61797 so it now prevents single-axis remapping. Ordinary mouse wheels report vertical delta, so an x-only tab strip with the axis lock ignores wheel input instead of scrolling horizontally.

Zed's workspace tab strip leaves its horizontal tab container unlocked and tracks it with a ScrollHandle. Match that behavior for TabBar so hovering an overflowing tab bar and using the wheel can reveal hidden tabs.

Add a regression test that sends vertical wheel input over an overflowing TabBar and asserts the tab content moves.
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

area:ui/scrolling Scrollbar and scrolling cla-signed The user has signed the Contributor License Agreement guild Pull requests by someone in Zed Guild. NOTE: the label application is automated via github actions

Projects

None yet

Development

Successfully merging this pull request may close these issues.

Markdown preview scrolls on both axes when scrolling horizontally

3 participants