Errors when marker is removed while being dragged

[livthomas]

In our application, we send a request to the server to save a new position when a user moves a marker. When a response is received, the application re-renders the whole map with the latest data so all markers are removed and added again. However, if the user starts dragging the marker again before the response is received, Mapbox throws an error and it is not possible to move any marker even after the map gets re-rendered.

mapbox-gl-js version: 1.1.0

browser: Chrome 75 on Linux

Steps to Trigger Behavior

1. Add a draggable marker to a map.
2. Start dragging the marker.
3. Remove the marker from the map while being dragged.
4. Add a new draggable marker to the map.
5. Try to move the new marker.

Link to Demonstration

https://jsbin.com/pozanuzolu/edit?html,console,output

Try to drag a marker for at least a second and then try to drag a new marker.

Expected Behavior

It should be possible to drag a new marker and there should be no errors in the console.

Actual Behavior

It is not possible to drag a new marker and there are some errors in the console.

The errors in the JS Bin console output will not tell you much. But I am getting the following error in my Angular application:

Uncaught TypeError: Cannot read property 'unproject' of undefined
    at o._onMove (mapbox-gl.js:33)
    at r.Ft.fire (mapbox-gl.js:29)
    at HTMLDivElement.<anonymous> (mapbox-gl.js:33)
    at ZoneDelegate.invokeTask (zone-evergreen.js:391)
    at Zone.runTask (zone-evergreen.js:168)
    at ZoneTask.invokeTask [as invoke] (zone-evergreen.js:465)
    at invokeTask (zone-evergreen.js:1603)
    at HTMLDivElement.globalZoneAwareCallback (zone-evergreen.js:1629)

[ryanhamley]

Thanks for reporting this! The demo helped a lot. I've submitted a PR #8465 that's waiting on review