Tooltip tap/click stops working after Pinch Zoom on Safari/iPad

[SyedTayyab99]

Expected behaviour

The tooltip should work after pinch zoom just like it's working after zooming with the buttons or in the web browser.

Actual behaviour

On mobile browsers, after the pinch zoom, the click event on the tooltip is not registered. Please run the attached code.

Live demo with steps to reproduce

Attached

Product version

Highcharts JS v10.2.0
Highmaps JS v11.0.1

Affected browser(s)

Safari on IPAD
highmaps issue.zip

[KacperMadej]

Hi @SyedTayyab99

The modules are loaded inconsistently with different versions. All should be the same.

You have customized code that might be unstable. Have you experienced the same problems without that code?

In both index and index_alt the chart.pinchType: 'none' is set so on pinch nothing happens in the chart and in Safari the whole site is zoomed into.

The difference between working (index_alt) and not working (index) is the custom tooltip that prevents touch (tooltip: { style: { pointerEvents: 'auto') on the map and looks like when it is hidden it still stops the touch because I am able to show the tooltip for a different part of the screen.

The pinch action triggers the tooltip refresh for its location but as this is not a proper touch event that should trigger the tooltip it is not shown - just its content and position are updated.

Internal note:
This is not a Maps specific behavior - can be recreated with a column series type.
Minimal code used the same as in this demo: https://jsfiddle.net/BlackLabel/v0jsL7zm/
Steps:

1. touch to show the tooltip
2. pinch to zoom cose to the tooltip but outside of it so it hides while zooming
3. try touching the points that would be under the tooltip if the tooltip were visible
4. to show the tooltip click outside of the area were the tooltip would be is it was visible

Additional note: seems to be affecting only Safari on iPad because Chrome and an Android device work fine.

[mabuhaddah]

@KacperMadej Hi, is there any expected due date to fix the bug?
your prompt reply is highly appreciated

[mabuhaddah]

@KacperMadej awaiting your feedback thankfully !

[oysteinmoseng]

@mabuhaddah Hi, we will prioritize the issue and get back to you shortly

[mabuhaddah]

@jakubSzuminski Hope you are doing great ,, Could you please share the update for this ticket so far? thanks

[jszuminski]

Hi @mabuhaddah, we're currently debugging the issue. I'll keep you posted when we find a solution for you.

[jszuminski]

@mabuhaddah I've prepared a simple demo with a workaround: https://jsfiddle.net/BlackLabel/ceh3o8t2/

Please try this out and let me know if that solved your problem.

[SyedTayyab99]

@jakubSzuminski The workaround worked like a charm. Thank you so much :D