[Bug] `onMouseMove` ignores `interactiveLayerIds`

[tordans]

Description

The way I read the docs for onMouseMove (https://visgl.github.io/react-map-gl/docs/api-reference/map#onmousemove) when I specify a layer in interactiveLayerIds, the events should only fire while I move the mouse over one of the elements of those specified layers.

That is how it works for onMouseEnter (console log a) and onMouseLeave (console log b) on the blue line.

However, for onMouseMove the events fire all the time.

Expected Behavior

I expected onMouseMove to behave the same way as onMouseEnter/Leave, to only fire when hovering the blue lines (which are the layer I specified with interactiveLayerIds).

Steps to Reproduce

(On request)

Environment

• Framework version: "react-map-gl": "^7.0.17",
• Map library: "maplibre-gl": "^2.1.9",
• Browser: Chrome
• OS: macOS

Logs

No response

[Pessimistress]

Please create a CodeSandbox that reproduces your issue.

[tordans]

Please create a CodeSandbox that reproduces your issue.

I created https://github.com/visgl/react-map-gl/pull/1953 which shows the issue.

The console.error is the onEnter logging, which only fires once when I enter the first state from the bottom of the screen. The 350+ console.log fire for onMouseMove which I take as an indicator that the interactiveLayerIds are not taken into account.

HTH

[Pessimistress]

Ok this was changed because of https://github.com/visgl/react-map-gl/issues/1893. In mapbox-gl you can register multiple callbacks for the same event like

map.on('click', () => {
  // clicked anywhere
});
map.on('click', 'some-layer', () => {
  // clicked on layer
});

Since the React API can only take one callback for each event, it becomes tricky to handle both the layer-specific and "anywhere" situation. While it is relatively easy to check for empty features (this issue), there is no quick workaround if the event is not fired (issue #1893), so I think that the current behavior covers more use cases.

The documentation should be updated to reflect the current behavior.

[tordans]

Thanks for looking into this.

In order to understand the required docs change, I looked into which on* events do / do not respect the interactiveLayerIds prop. As a WIP I commited Debug Example for #1950.

It looks like the interactiveLayerIds are not used a lot anymore … and maybe should be used even less for consistency reasons. Let me know if I should create separate issues for the list at https://github.com/visgl/react-map-gl/commit/eced0e01f2e0e6c9e6209ed95b8d396f021cf162#diff-002d6fffe918690b016321d42041df19bcf3ea7a62d1da35c91e29848fdd2d3eR1-R6.

For the docs update: The recommendation would be to guard with if(!event?.features?.length) return, right?

[Pessimistress]

It looks like the interactiveLayerIds are not used a lot anymore

interactiveLayerIds is used to populate event.features. The only thing at discussion here is if the event should be fired when event.features is [].