don't fire click event if default is prevented on mousedown for a dra…

…g event (#6697)

src/ui/bind_handlers.js

@@ -25,6 +25,7 @@ export default function bindHandlers(map: Map, options: {interactive: boolean})
     const el = map.getCanvasContainer();
     let contextMenuEvent = null;
     let mouseDown = false;
+    let startPos = null;
 
     for (const name in handlers) {
         (map: any)[name] = new handlers[name](map, options);
@@ -56,6 +57,7 @@ export default function bindHandlers(map: Map, options: {interactive: boolean})
 
     function onMouseDown(e: MouseEvent) {
         mouseDown = true;
+        startPos = DOM.mousePos(el, e);
 
         const mapEvent = new MapMouseEvent('mousedown', map, e);
         map.fire(mapEvent);
@@ -149,7 +151,10 @@ export default function bindHandlers(map: Map, options: {interactive: boolean})
     }
 
     function onClick(e: MouseEvent) {
-        map.fire(new MapMouseEvent('click', map, e));
+        const pos = DOM.mousePos(el, e);
+        if (pos.equals(startPos)) {
+            map.fire(new MapMouseEvent('click', map, e));
+        }
     }
 
     function onDblClick(e: MouseEvent) {

test/unit/ui/map_events.test.js

@@ -544,3 +544,19 @@ test(`Map#on mousedown can have default behavior prevented and still fire subseq
     map.remove();
     t.end();
 });
+
+test(`Map#on mousedown doesn't fire subsequent click event if mousepos changes`, (t) => {
+    const map = createMap();
+
+    map.on('mousedown', e => e.preventDefault());
+
+    const click = t.spy();
+    map.on('click', click);
+    const canvas = map.getCanvas();
+
+    simulate.drag(canvas, {}, {clientX: 100, clientY: 100});
+    t.ok(click.notCalled);
+
+    map.remove();
+    t.end();
+});