Skip to content

fix: Apply reversed axis flip by macOS on Web when scroll with modifier keys - #189506

Merged
auto-submit[bot] merged 18 commits into
flutter:masterfrom
Gustl22:159868-ignore-axis-flip-web
Sep 17, 2026
Merged

auto-submit[bot] merged 18 commits into
flutter:masterfrom
Gustl22:159868-ignore-axis-flip-web

Conversation

@Gustl22

@Gustl22 Gustl22 commented Jul 15, 2026 •

Copy link
Copy Markdown
Contributor

MacOS is flipping the vertical scroll (y) to a horizontal scroll (x), when the "Shift" modifier key is pressed.
To conform with other platforms, a reverse flip was already applied for native macOS, see: be9ae47

The same must be done for web platforms, as the event is received by the browser, but the flipping by OSX happens before.

Fixes #159868
See also #185146

Pre-launch Checklist

If you need help, consider asking for advice on the #hackers-new channel on Discord.

If this change needs to override an active code freeze, provide a comment explaining why. The code freeze workflow can be overridden by code reviewers. See pinned issues for any active code freezes with guidance.

Note: The Flutter team is currently trialing the use of Gemini Code Assist for GitHub. Comments from the gemini-code-assist bot should not be taken as authoritative feedback from the Flutter team. If you find its comments useful you can update your code accordingly, but if you are unsure or disagree with the feedback, please feel free to wait for a Flutter team member's review for guidance on which automated comments should be addressed.

@github-actions github-actions Bot added framework flutter/packages/flutter repository. See also f: labels. f: scrolling Viewports, list views, slivers, etc. labels Jul 15, 2026
@Gustl22
Gustl22 force-pushed the 159868-ignore-axis-flip-web branch from 942c3fb to 3af3a0e Compare August 4, 2026 07:23
@Gustl22 Gustl22 changed the title fix: Respect axis flip by the browser on scroll with modifier keys fix: Apply reversed axis flip by macOS on Web when scroll with modifier keys Aug 4, 2026
@Gustl22
Gustl22 force-pushed the 159868-ignore-axis-flip-web branch from 3af3a0e to 218d9ef Compare August 4, 2026 22:18
@github-actions github-actions Bot added engine flutter/engine related. See also e: labels. platform-macos Building on or for macOS specifically platform-web Web applications specifically a: desktop Running on desktop team-web Owned by Web platform team team-macos Owned by the macOS platform team and removed framework flutter/packages/flutter repository. See also f: labels. f: scrolling Viewports, list views, slivers, etc. labels Aug 4, 2026
@Gustl22
Gustl22 force-pushed the 159868-ignore-axis-flip-web branch from 218d9ef to 8d4dec4 Compare August 7, 2026 12:41
@Gustl22
Gustl22 marked this pull request as ready for review August 7, 2026 12:44
@Gustl22
Gustl22 requested a review from a team as a code owner August 7, 2026 12:44

@gemini-code-assist gemini-code-assist Bot left a comment

Copy link
Copy Markdown
Contributor

Choose a reason for hiding this comment

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

Code Review

This pull request implements a reverse flip of the scroll axis when the Shift key is pressed on macOS with a mouse, normalizing the input received by the framework. It introduces a new isMacOS helper, exposes physical shift key constants, and adds corresponding tests. The review feedback suggests simplifying the implementation by removing the redundant debugEmulateMacOs test flag and avoiding hardcoding the pull request URL in the native macOS code comments.

@jmagman

jmagman commented Aug 25, 2026

Copy link
Copy Markdown
Member

This requires review from the web team.

@Gustl22

Gustl22 commented Sep 1, 2026 •

Copy link
Copy Markdown
Contributor Author

@jmagman I don't see a review team for web:

# These names are just suggestions. It is fine to have your changes

How does the review process work for web? Thank you for helping ;)

@mdebbar mdebbar left a comment

Copy link
Copy Markdown
Contributor

Choose a reason for hiding this comment

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

Thanks @Gustl22 for the fix! Overall the change looks good to me. I just have one minor suggestion.

Comment on lines +759 to +761
final shiftKeyPressed =
(_keyboardConverter?.keyIsPressed(kPhysicalShiftLeft) ?? false) ||
(_keyboardConverter?.keyIsPressed(kPhysicalShiftRight) ?? false);

Copy link
Copy Markdown
Contributor

Choose a reason for hiding this comment

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

Instead of relying on keyIsPressed, let's use the browser-provided event.shiftKey or event.getModifierState('Shift'). Obviously, tests will need to be changed accordingly.

Copy link
Copy Markdown
Contributor Author

Choose a reason for hiding this comment

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

I replaced with your proposal.

As additional info: I am not 100% sure, whether the shift flip is applied on logical or physical keys. I tried to switch with Karabiner elements, but as they switch the physical key mapping, i cannot differentiate between logical and hard key in any use case. And OSX built-in Settings do not allow to remap the shift key. In the end a user barely is able to remap the Shift key in any case. But as the legacy pinch zoom modifier ctrl key also is applied logically (as far as I understood), I assume its the same for the shift key.

I also tested with varius input devices and wheels:

  • Touch pad, scroll horizontally
  • Touch pad, scroll vertically
  • Mouse with vertical scroll wheel
  • Mouse with horizontal scroll wheel

As one expects, both Physical Shift (Left or/and Right) and DOM event Shift state always are in sync and both are applied independently of the input source event. What I wanted to clarify with this, that the OS does not magically add a "Shift" state, when scrolling horizontally (either with the touch pad or the horizontal scroll mouse wheel) without actually pressing shift.

Copy link
Copy Markdown
Contributor

Choose a reason for hiding this comment

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

Thanks for the extensive testing!!

@Gustl22
Gustl22 force-pushed the 159868-ignore-axis-flip-web branch from 105bca7 to ca3cf2b Compare September 3, 2026 18:49
@Gustl22
Gustl22 force-pushed the 159868-ignore-axis-flip-web branch from ca3cf2b to 625e0df Compare September 3, 2026 18:51
@okorohelijah okorohelijah added the CICD Run CI/CD label Sep 10, 2026
@auto-submit auto-submit Bot removed the autosubmit Merge PR when tree becomes green via auto submit App label Sep 10, 2026
@auto-submit

auto-submit Bot commented Sep 10, 2026

Copy link
Copy Markdown
Contributor

autosubmit label was removed for flutter/flutter/189506, because - The status or check suite Dashboard Checks has failed. Please fix the issues identified (or deflake) before re-applying this label.

@flutter-dashboard flutter-dashboard Bot removed the CICD Run CI/CD label Sep 11, 2026
@flutter-zl flutter-zl added CICD Run CI/CD autosubmit Merge PR when tree becomes green via auto submit App labels Sep 11, 2026
@auto-submit auto-submit Bot removed the autosubmit Merge PR when tree becomes green via auto submit App label Sep 11, 2026
@auto-submit

auto-submit Bot commented Sep 11, 2026

Copy link
Copy Markdown
Contributor

autosubmit label was removed for flutter/flutter/189506, because - The status or check suite Google testing has failed. Please fix the issues identified (or deflake) before re-applying this label.

@Gustl22

Gustl22 commented Sep 16, 2026 •

Copy link
Copy Markdown
Contributor Author

@flutter-zl not sure, how this can be progressed, it just states:

Internal smoke tests failed. Please contact a Google developer to help investigate the failure.

Thanks for your help

@flutter-dashboard flutter-dashboard Bot removed the CICD Run CI/CD label Sep 16, 2026
@flutter-zl flutter-zl added CICD Run CI/CD autosubmit Merge PR when tree becomes green via auto submit App labels Sep 16, 2026
@auto-submit
auto-submit Bot added this pull request to the merge queue Sep 17, 2026
Merged via the queue into flutter:master with commit b62b39f Sep 17, 2026
29 of 30 checks passed
@flutter-dashboard flutter-dashboard Bot removed the autosubmit Merge PR when tree becomes green via auto submit App label Sep 17, 2026
@Gustl22
Gustl22 deleted the 159868-ignore-axis-flip-web branch September 19, 2026 17:25
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

a: desktop Running on desktop CICD Run CI/CD engine flutter/engine related. See also e: labels. platform-macos Building on or for macOS specifically platform-web Web applications specifically team-macos Owned by the macOS platform team team-web Owned by Web platform team

Projects

None yet

Development

Successfully merging this pull request may close these issues.

[Web] Shift + scroll wheel not working when run on mac .

5 participants