Don't stop camera on mousedown/touchstart when non-interactive

src/ui/bind_handlers.js

@@ -1,11 +1,8 @@
 // @flow
 
 import { MapMouseEvent, MapTouchEvent, MapWheelEvent } from '../ui/events';
-
 import DOM from '../util/dom';
-
 import type Map from './map';
-
 import scrollZoom from './handler/scroll_zoom';
 import boxZoom from './handler/box_zoom';
 import dragRotate from './handler/drag_rotate';
@@ -60,7 +57,7 @@ export default function bindHandlers(map: Map, options: {}) {
             return;
         }
 
-        if (!map.doubleClickZoom.isActive()) {
+        if (options.interactive && !map.doubleClickZoom.isActive()) {
             map.stop();
         }
 
@@ -120,7 +117,9 @@ export default function bindHandlers(map: Map, options: {}) {
             return;
         }
 
-        map.stop();
+        if (options.interactive) {
+            map.stop();
+        }
 
         if (!map.boxZoom.isActive() && !map.dragRotate.isActive()) {
             map.dragPan.onTouchStart(e);

test/unit/ui/map.test.js

@@ -6,6 +6,8 @@ import LngLat from '../../../src/geo/lng_lat';
 import Tile from '../../../src/source/tile';
 import { OverscaledTileID } from '../../../src/source/tile_id';
 import { Event, ErrorEvent } from '../../../src/util/evented';
+import simulate from 'mapbox-gl-js-test/simulate_interaction';
+
 import fixed from 'mapbox-gl-js-test/fixed';
 const fixedNum = fixed.Num;
 const fixedLngLat = fixed.LngLat;
@@ -1296,6 +1298,50 @@ test('Map', (t) => {
         });
     });
 
+    t.test('stops camera animation on mousedown when interactive', (t) => {
+        const map = createMap({interactive: true});
+        map.flyTo({ center: [200, 0], duration: 100 });
+
+        simulate.mousedown(map.getCanvasContainer());
+        t.equal(map.isEasing(), false);
+
+        map.remove();
+        t.end();
+    });
+
+    t.test('continues camera animation on mousedown when non-interactive', (t) => {
+        const map = createMap({interactive: false});
+        map.flyTo({ center: [200, 0], duration: 100 });
+
+        simulate.mousedown(map.getCanvasContainer());
+        t.equal(map.isEasing(), true);
+
+        map.remove();
+        t.end();
+    });
+
+    t.test('stops camera animation on touchstart when interactive', (t) => {
+        const map = createMap({interactive: true});
+        map.flyTo({ center: [200, 0], duration: 100 });
+
+        simulate.touchstart(map.getCanvasContainer());
+        t.equal(map.isEasing(), false);
+
+        map.remove();
+        t.end();
+    });
+
+    t.test('continues camera animation on touchstart when non-interactive', (t) => {
+        const map = createMap({interactive: false});
+        map.flyTo({ center: [200, 0], duration: 100 });
+
+        simulate.touchstart(map.getCanvasContainer());
+        t.equal(map.isEasing(), true);
+
+        map.remove();
+        t.end();
+    });
+
     t.end();
 });