Description
🐛 Bug Report
I'm unable to use the pinch-to-zoom gesture to zoom in or out when a dialog is opened.
🤔 Expected Behavior
The default browser behavior of zooming in and out should work within a dialog as the content might become inaccessible otherwise.
😯 Current Behavior
On the demo page, focussing a field inside the dialog on my iPhone will automatically zoom in (as the input font size is below 16px) but I'm unable to zoom out. When starting the gesture outside of the dialog, it will close, when starting within, nothing happens.
-
Before opening:
-
After opening and focussing a field:
-
After attempting to reduce the zoom level by starting pinch-to-zoom outside of the dialog:
💁 Possible Solution
I would assume that some touch event listeners are interfering with the default behavior.
🔦 Context
The dialog context might become inaccessible either by cutting it off when auto-zooming or by simply being to small to be readable (where default pinch-to-zoom behavior would solve the problem).
💻 Code Sample
https://react-spectrum.adobe.com/react-aria/useDialog.html
🌍 Your Environment
| Software | Version(s) |
|---|---|
| react-spectrum | Current version on the official demo page |
| Browser | Latest Safari on iOS 14.4.2 |
| Operating System | iOS 14.4.2 |