xyflow: Zoom on pinch not working on Windows
Describe the Bug
Zoom on pinch does not appear to work when using Windows and panOnScroll is set to true.
Can be demonstrated in the Reactflow Figma-like example on the doc site.
This works on Mac.
Your Example Website or App
https://codesandbox.io/p/sandbox/thirsty-darkness-qdwrp6
Steps to Reproduce the Bug or Issue
- Use a Windows machine (or Browserstack, or Parallels, etc), I tested on Windows 11
- Load any browser (I tried Chrome & Edge)
- Go to the Reactflow Figma-like example: https://reactflow.dev/learn/concepts/the-viewport#figma-like-viewport-controls
- Try pinch to zoom
Expected behavior
Expected: Viewport zooms in and out Reality: Viewport scrolls
Screenshots or Videos
No response
Platform
- OS: Windows
- Browser: Chrome, Edge
- Version: latest (Chrome: v120)
Additional context
We’ve had multiple support requests for this on our product, and it appears to be the case for all Windows users.
Setting zoomOnPinch={true} does nothing (as it is already the default).
About this issue
- Original URL
- State: closed
- Created 6 months ago
- Reactions: 4
- Comments: 17 (8 by maintainers)
Commits related to this issue
- fix(system): pinch zoom on windows #3759 — committed to xyflow/xyflow by moklick 2 months ago
- fix(core): pinch zoom on windows closes #3759 — committed to xyflow/xyflow by moklick 2 months ago
we will check it!
Do you guys have any leads on this? I’d be happy to help investigate the issue and try to open a PR.
👀
Just checking in on this. We’re getting a lot of bug reports from users and it’s making our product pretty tough to use on Windows 😬
Hey @moklick, I’m using the built in macbook touchpad to pinch zoom (and simulating the issue in Windows through Browserstack & Parallels).
The users that reported the issue are using Windows 11 laptops and their built in touchpads as far as I know.