Have a page with an element that listens for touch events, with event.preventDefault() in place.
Example code: https://gist.github.com/Pomax/50cdb4090be48ca088bb57169f086292
Live example: https://flat-holly-winterberry.glitch.me/
Scroll to the canvas element, and then tap-and-drag a circle in it. This will slide the toolbar in and out and in and out and in and out, which would be fine except it's _also_ moving the page content around, which it should absolutely not be doing.
The toolbar slides in _over_ the page content, and slides out _revealing_ the page content under it, without affecting page content placement.
The toolbar slides in/out as if it's part of the page itself, pushing content up/down on the page itself as the user is interacting with it, making touch coordinates completely unreliable.
This makes it impossible to do even basic things like drawing a circle on an element, let alone have a simple on page canvas/js game with reliable controls.
This is probably the same underlying issue as #11389
This doesn't feel like the same kind of problem: this use-case is for elements that don't have inate scroll, so even if inate scroll gets fixed, we'll still have a situation where the scroll is "supposed" to be not even forwarded due to event.preventDefault(), which you want to honour (elements should be able to prevent default browser behaviour), while still leaving a way for users to get to the interface under all circumstances: the UI sliding in and out of view is going to be a _horrible_ experience for web games, for example, so there's some heavy thinking about how to solve this.
This feels more like a conflict caused by tying "toggling the UI" to both scroll directions. Ideally, Fenix would have a different way to _reveal_ the UI (not tied to scroll events at all), even if it still gets hidden when scrolling down the page. Solving that problem would "automatically" solve this particular symptom, too.
Thanks for the clarification, I'll update the ticket name as well so it's clearer for prioritization.
from "Dragging on a element with preventDefault() for touch events moves the page as it slides the dynamic toolbar in/out"
I think this was resolved by https://bugzilla.mozilla.org/show_bug.cgi?id=1633322
@Pomax can you please confirm if this is still reproducing or not for you?
Is this something I can test by updating nightly, or do I need to compile things myself? (in which case, that is not really an option for me)
Is this something I can test by updating nightly, or do I need to compile things myself? (in which case, that is not really an option for me)
Should be fixed in the latest Nightly from Playstore.
Yeah, that's no longer sliding the UI in and out of view, very nice! Thanks to all involved.
Most helpful comment
Thanks for the clarification, I'll update the ticket name as well so it's clearer for prioritization.
from "Dragging on a element with preventDefault() for touch events moves the page as it slides the dynamic toolbar in/out"