mapbox / mapbox/mapbox-gl-js

Hover events should react to map movement

Open
#6,830 1 comment 1 reaction 0 assignees View on GitHub

Nobody has claimed this yet.

bug :lady_beetle:
Dominant language
TypeScript
Stars
12.4k
Forks
2.4k
PR merge metrics
No merged PRs in 30d

Description

mapbox-gl-js version: v0.46.0-beta.1

Steps to Trigger Behavior
  1. Set up a mouseenter/mouseleave listener on a layer.
  2. Move the map by any means other than dragging (e.g. pan using keyboard, or programmatically zoom in on click).
Link to Demonstration

https://www.mapbox.com/mapbox-gl-js/example/hover-styles/
Click on the map to focus on it, then hover on a state and press a keyboard arrow to pan away. The hovered status doesn't change.

Expected Behavior

The mouse events should trigger when the map moves under the cursor just like they do when the cursor moves over the map.

Actual Behavior

The mouse events don't trigger on map movement.

Discovered this while setting up a "Click on cluster to zoom in and expand it" demo. It's pretty common to have "click on a feature to zoom in / center on it" interaction, but if you have hover states at the same time, they become glitchy.

hover-bug

cc @jfirebaugh

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 layer mouseenter/mouseleave listeners and the map movement behavior described in the reproduction steps. Reproduce the hover-styles example, then compare cursor movement with keyboard or programmatic map movement; done means hover events update when features move under the cursor.

Written by the indexing model from the issue text.

Assessment

Tech stack
typescript
Domain
frontend, web-dev
Issue type
Bug
Difficulty
3/5
Estimated time
1-2 days
Activity status
Stale
Clarity
Mostly clear
Newbie friendliness
35/100

Get new issues in your inbox

A short digest of beginner-friendly GitHub issues.