2

In my leaflet map, clicking on a marker opens its popup and immediately closes it.

Logging of map events reveals that instead of firing just a popupopen event, the click on the marker triggers 2 events - popupopen followed by popupclose of the same marker.

This behavior is semi-consistent:

  • Open+close happens when you just click on the marker without dragging the mouse at all. But if you click the marker and move the mouse by just few pixels (< ~30px) while at it, the popup now opens just fine (and only a popupopen event is fired, without popupclose following it).
  • Open+close happens reliably only in Safari on Mac and iPhone. It also happens sometimes in Chrome on Mac, and when it does - it's consistent during the testing session.
  • This only happens in one of my 2 map pages, which use a common map component (one for mobile, one for desktop). Obviously this is a good place to start debugging, but despite many hours of debugging I haven't been able to narrow down the relevant difference between them.

I debugged the source of the popupclose event, and was suprised to discover that the _openPopup function in src/layer/Popup.js:473 is invoked twice. This method ends up calling this.closePopup() on the second invocation.

Note sure it if's related, but looking at click events on the map, I see in Safari two such events per mouse click, both having an original event of type MouseEvent. In Chrome, when things work correctly, there is just a single event with an original event of PointerEvent.

I suspect that this could be related to #7255, however unfortunately the recommended workaround of setting tap to false didn't help.

Any ideas what could be the cause and how to work around it?

Using Leaflet 1.7.1 through react-leaflet 3.2.1.

orange77
  • 933
  • 8
  • 12
  • There is a bug with in Leaflet 1.7.1 with touch interaction https://github.com/Leaflet/Leaflet/issues/7422. You can try using my fork of the library and see if it helps. Put this in your package.json: `"leaflet": "ted-piotrowski/Leaflet#hotfix"` – teddybeard Oct 14 '21 at 19:48
  • Thanks, I just posted an update about how this was resolved, so didn't get to test your suggestion. – orange77 Oct 14 '21 at 20:28
  • Just banged my head against this for a day or two... turns out the bug is reconciled in 1.8.x. Good luck out there fellow coders – dslosky Jun 09 '22 at 18:05

1 Answers1

1

Update:

It turns out that setting tap to false actually did resolve this!

Not sure how I missed this previously. Definitely one of the more frustrating third-party issues I encountered recently!

orange77
  • 933
  • 8
  • 12