Browser normalization for scroll zoom

[tonybob-tl]

Your plugin works great. However, the step property does not normalize to the variances between browsers. Chrome and Firefox step large while others step small. See stackoverflow issue and github issue

[timmywil]

Thanks for opening an issue. But those issues are pretty old and a lot has change since then. For instance, Opera and Edge are now Blink browsers and work the same as Chrome. This makes me wonder if any of those solutions still work. I also wonder if this is really an issue anymore. For instance, I don't really see a difference between Firefox, Safari, and Chrome in the mousewheel example on the demo page.

That said, it would be very helpful if you could provide a small test showing different deltas across browsers on the wheel event. I could then use that in Panzoom tests and work off of the old facebook solution to normalize deltas, but this issue needs a test case to go further. Thanks.

[tonybob-tl]

Hi Timmy, Thanks for responding so quickly. I just got a chance to test the functionality on all my environments. It looks like the problem is with windows versions of Chrome and Firefox. Otherwise, everything else seems fine with your plugin. Here are the results of the tests. I’m using fairly large SVG maps inline. The zoom in the Chrome and Firefox windows versions seems to step closer to that 120 value instead of the 3 value for all the other browser versions. I program in WSL, but my browsers are all in windows so I didn’t test linux browsers. Windows OS (20H2 build 19042.928): Closer to a step of 120 with my scroll wheel: Chrome: Version 90.0.4430.85 (64-bit) Firefox: Version 88.0 (64-bit) Closer to a step of 3 with my scroll wheel: Edge: Version 90.0.818.42 (64-bit) Opera: Version:75.0.3969.218 Dissenter: Version: 1.5.114 macOS Catalina (Version 10.15.7): Closer to a step of 3 with my scroll wheel: Safari: Version 13.1.3 (15609.4.1) Chrome: Version 90.0.4430.85 (x86_64) Firefox: Version 88.0 (64-bit) Opera: Version 75.0.3969.218 (x86_64) Dissenter: Version: 0.70.122 Chromium 78.0.3904.87 (64 bit) Android (Version 11 build RQ2A.210405.005): Pinch zoom works fine: Chrome: Version 90.0.4430.66 Opera Touch: Version 2.9.5 Firefox: Version 88.1.1 (build #2015804891) – slower probably due to file size not your plugin DuckDuckGo mobile browser: Version 5.80.0 IPhone 8 Version 14.1: Pinch zoom works fine: Safari version that goes with this phone Firefox Daylight 31.0 (3537) – slower and crashy probably due to svg file size not your plugin Chrome version 87.0.4280.77 – slower and crashy probably due to svg file size not your plugin Thanks for the work and the use of your plugin. Trent From: Timmy Willison ***@***.***> Sent: Wednesday, April 21, 2021 3:27 PM To: timmywil/panzoom ***@***.***> Cc: tlarsonlgdor ***@***.***>; Author ***@***.***> Subject: Re: [timmywil/panzoom] Browser normalization for scroll zoom (#560) Thanks for opening an issue. But those issues are pretty old and a lot has change since then. For instance, Opera and Edge are now Blink browsers and work the same as Chrome. This makes me wonder if any of those solutions still work. I also wonder if this is really an issue anymore. For instance, I don't really see a difference between Firefox, Safari, and Chrome in the mousewheel example on the demo page <https://timmywil.com/panzoom/demo/> . That said, it would be very helpful if you could provide a small test showing different deltas across browsers on the wheel event. I could then use that in Panzoom tests and work off of the old facebook solution to normalize deltas, but this issue needs a test case to go further. Thanks. — You are receiving this because you authored the thread. Reply to this email directly, view it on GitHub <#560 (comment)> , or unsubscribe <https://github.com/notifications/unsubscribe-auth/AJAGZAG2CHPVICPDTQYH67TTJ4RJBANCNFSM43K2VK3Q> . <https://github.com/notifications/beacon/AJAGZADC4SIEBY4XSFRVHFDTJ4RJBA5CNFSM43K2VK32YY3PNVWWK3TUL52HS4DFVREXG43VMVBW63LNMVXHJKTDN5WW2ZLOORPWSZGOGEQ5RTA.gif>

[timmywil]

Okay thanks. That should be enough to go on. I'll have a look at the deltas on Windows when I get a chance.

[tonybob-tl]

I’m trying to work around using react-device-detect, but the only way to distinguish the difference between Chrome and opera, brave, and dissenter is their engine version. All of them use Blink like you said, but for some reason Chrome is a larger step while the others are smaller steps even though they are earlier Blink versions. I just installed Brave on windows and it is almost the same Blink version as Chrome, but it steps great with your default setting of 0.3 (same for opera and dissenter). While I have to use 0.01 for Chrome or lower to prevent stepping too far with a scroll wheel tick. I’m using logi roller ball. This work around is fine for me right now. For Firefox, I’m using a step of 0.01, but there seems to be some centering issues or random jumps when I scroll. Only other option I set was animate and it is false. From: Timmy Willison ***@***.***> Sent: Wednesday, April 21, 2021 5:20 PM To: timmywil/panzoom ***@***.***> Cc: tlarsonlgdor ***@***.***>; Author ***@***.***> Subject: Re: [timmywil/panzoom] Browser normalization for scroll zoom (#560) Okay thanks. That should be enough to go on. I'll have a look at the deltas on Windows when I get a chance. — You are receiving this because you authored the thread. Reply to this email directly, view it on GitHub <#560 (comment)> , or unsubscribe <https://github.com/notifications/unsubscribe-auth/AJAGZADRWHCG2YN7XZZ32BDTJ46QLANCNFSM43K2VK3Q> . <https://github.com/notifications/beacon/AJAGZAHTL7ZPL3AAPHDXNHTTJ46QLA5CNFSM43K2VK32YY3PNVWWK3TUL52HS4DFVREXG43VMVBW63LNMVXHJKTDN5WW2ZLOORPWSZGOGERM6AI.gif>

[timmywil]

Interesting. I suppose it could have something to do with the underlying Blink version. Hopefully the browsers will align as time goes on.

[trusktr]

There are too many inconsistencies with delta values across browsers, even today. Related web spec issue:

• Needs alternative WheelEvent.deltaMode, WheelEvent.delta(X|Y|Z) w3c/uievents#181