visgl / visgl/deck.gl

[Bug] In Firefox, onHover stops being called after click

Open
#7,869 2 comments 0 reactions 0 assignees View on GitHub

Nobody has claimed this yet.

bug
Dominant language
TypeScript
Stars
14.6k
Forks
2.3k
Avg merge
2d 9h
Merged PRs (30d)
42

Description

Description

Hi 👋🏼 , using Firefox with DeckGL & Arcgis:

When an onHover handler is registered for the DeckLayer (layer.deck.onHover) it is no longer called after a mouse click.

So far, this only manifests in Firefox (Chrome and Edge are working correctly).

I tried to keep the code as minimal as possible to showcase the issue:

const layer = new DeckLayer();

layer.deck.onHover = function (info) { // <-- works until a click on the map
  console.log("[hover]", info); 
};

new MapView({
  container: "viewDiv",
  map: new ArcGISMap({
    basemap: "dark-gray-vector",
    layers: [layer],
  }),
  center: NYC_COORDINATE,
  zoom: 5,
});

You can see a working example in CodeSandbox here:

https://codesandbox.io/p/sandbox/bug-onhover-bug-in-deck-gl-arcgis-with-firefox-54cdg2?file=%2FREADME.md

Video of the bug is here:

https://user-images.githubusercontent.com/489428/236014621-7bcd382f-53c6-4b9c-98ed-e8517e9ba613.mp4

Please let me know if I can help in any other way.

Thank you!

Flavors
  • Script tag
  • React
  • Python/Jupyter notebook
  • MapboxOverlay
  • GoogleMapsOverlay
  • CartoLayer
  • ArcGIS
Expected Behavior

The onHover callback should be called after click events as well. The bug seems isolated to Firefox.

Steps to Reproduce

To reproduce:

  1. Using Firefox browse to this CodeSandbox link.
  2. Open the devTools console.
  3. Hover over the map, expect to see console messages prefixed with [hover].
  4. Click anywhere on the map.
  5. Hover over the map, expect to no longer see the console messages.

Live version here:
https://codesandbox.io/p/sandbox/bug-onhover-bug-in-deck-gl-arcgis-with-firefox-54cdg2?file=%2FREADME.md

Environment
  • Framework version: 8.9.12
  • Browser: Firefox 112
  • OS: MacOS/Windows
Logs

No console logs errors/warnings reported.

Contributor guide

Open the contributing guide

First steps

  1. Read the whole issue, then the project's contributing guide.
  2. Comment on the issue to say you are picking it up — it saves two people doing the same work.
  3. Fork the repository and make your change on a branch.
  4. Open a pull request that references the issue number.

Research direction

Start with the linked CodeSandbox and reproduce the hover regression in Firefox 112, then trace the DeckLayer event handling used by the ArcGIS integration in the deck.gl repository. Compare the event behavior before and after a map click, and verify that hovering again invokes onHover after the fix.

Written by the indexing model from the issue text.

Assessment

Tech stack
javascript, typescript
Domain
data-visualization, frontend
Issue type
Bug
Difficulty
4/5
Estimated time
3-5 days
Activity status
Stale
Clarity
Mostly clear
Newbie friendliness
42/100

Get new issues in your inbox

A short digest of beginner-friendly GitHub issues.