[BUG] iOS: Pinch zoom broken (b)

[joosakle]

What is the bug?

Pinch zoom is currently broken on iOS web when tested using latest master branch and demo application, using Safari and Chrome on iPhone SE2020, 11 and 14. Frequently when you zoom the gesture gets stuck, so that it's as if you constantly have two fingers on the screen, even though you have only one. This prevents further use of the map until reload.

The screen recording illustrates the issue well. When you load the map and calmly move around and then zoom things usually work normally, but when you zoom immediately after map loads, the bug happens frequently. I have this same issue also on my own fork of master (waiting for #1452 ) with map rotation disabled, there the map gets completely stuck on one place with only in/out pinch zoom working. Occasionally the bug also happens later, when the map has had some time to load and you've moved around, but most of the time it only happens the first time you zoom in.

https://github.com/fleaflet/flutter_map/assets/36109831/f161b423-9ac4-4f3c-98d1-6b103322e2c7

How can we reproduce it?

1. Load https://demo.fleaflet.dev/ on latest iOS and Safari or Chrome
2. Immediately after the map loads, do a fast pinch zoom in. Then try move around and see if things work normally.
3. Repeat 1 and 2 if the bug didn't occur. Shouldn't take many tries.

Do you have a potential solution?

Unfortunately not. I suppose this is related to other gesture issues in #1529. Similarly to #1572, I am unable to tap anything after the zoom gets stuck. The issue #1583 is also similar in sense that it's as if two fingers are detected when there's only one.

Platforms

iPhone SE2020, iPhone 11, iPhone 14, iOS

Severity

Obtrusive: Prevents normal functioning but causes no errors in the console

[JaffaKetchup]

Thanks for reporting @joosakle. I'll need to confirm what commit this issue appeared in, I'm assuming it will be one where the gestures file has changed. I have a suspicious commit (of my own) in mind, but I'm not sure if this is the issue.

[JaffaKetchup]

I don't have an iOS to test on, but I quickly borrowed one from someone else. I can reproduce this issue, as shown in your video.

I won't be able to resolve this issue as I can't test this anymore. However, it is of significant concern. If you could do any more digging, that would be hugely appreciated!

[TesteurManiak]

@joosakle have you made any configuration to enforce the usage of the canvaskit renderer for the web build? By default it is dynamic and Safari on iOS will use the html renderer.

[JaffaKetchup]

@TesteurManiak I think I set up the Actions to build with CanvasKit, so the website should be using it.

[joosakle]

@TesteurManiak I now built the demo-page with flutter build web --web-renderer html, when tested with Safari on my SE2020 the issue persists. So render mode seems to have no impact.

I also checked that the issue persists also on demo home page when modified with only flags: InteractiveFlag.pinchZoom | InteractiveFlag.drag present, as is the case with my own fork-based app. With those settings I can only zoom in and out with one finger, no other movement possible.

Thanks for the quick response!

[JaffaKetchup]

I think unfortunately, this will have to be grouped in with all the other gesture issues on Apple platforms, to be fixed in a future version. The entire gesture system needs rewriting completely, it's a spaghetti mess of a single file with over a 1000 lines now.

[kirpit]

Unfortunately, this may not be only iOS related.. I'm seeing the same behaviour on Android with the latest flutter_map version 6. To be honest, I didn't experience this problem with version 5.

Xiaomi Mi 10 - Android API 33 Only these 3 interaction flags enabled: doubleTapZoom, drag, pinchZoom

It's mostly happening after a hot restart but sometimes occurring on a fresh run without even hot restart.

Stuck on single point - exact same behaviour (without hot restart): https://github.com/fleaflet/flutter_map/assets/1009931/72c4468a-e3ae-4083-be2d-4af94bc1b56d

Map is frozen (with hot restart): https://github.com/fleaflet/flutter_map/assets/1009931/bb0c70a1-55a0-4331-bce9-cecc0bd349fd

[JaffaKetchup]

Very similar to #1429. I suspect there is a bug in the gesture handling somewhere.

[JaffaKetchup]

I can't reproduce this issue on my Android device (anymore), on the web demo. Can someone confirm if this still occurs?