trash correct vertices by changing sort to be numeric-aware

src/modes/direct_select.js

@@ -165,7 +165,11 @@ DirectSelect.toDisplayFeatures = function(state, geojson, push) {
 };
 
 DirectSelect.onTrash = function(state) {
-  state.selectedCoordPaths.sort().reverse().forEach(id => state.feature.removeCoordinate(id));
+  // Uses number-aware sorting to make sure '9' < '10'. Comparison is reversed because we want them
+  // in reverse order so that we can remove by index safely.
+  state.selectedCoordPaths
+    .sort((a, b) => b.localeCompare(a, 'en', { numeric: true }))
+    .forEach(id => state.feature.removeCoordinate(id));
   this.fireUpdate();
   state.selectedCoordPaths = [];
   this.clearSelectedCoordinates();

test/direct_select.test.js

@@ -121,6 +121,33 @@ test('direct_select', (t) => {
     });
   });
 
+  t.test('direct_select - trashing vertices should delete the correct ones', (st) => {
+    const longLine = {
+      type: 'Feature',
+      properties: {},
+      geometry: {
+        type: 'LineString',
+        coordinates: [[0, 0], [10, 0], [20, 0], [30, 0], [40, 0], [50, 0], [60, 0], [70, 0], [80, 0], [80, 10], [70, 10], [60, 10], [50, 10]]
+      }
+    };
+    const ids = Draw.add(longLine);
+    Draw.changeMode(Constants.modes.DIRECT_SELECT, {
+      featureId: ids[0]
+    });
+    afterNextRender(() => {
+      // select multiple nodes at indices 9, 10, 11
+      click(map, makeMouseEvent(70, 10, { shiftKey: true }));
+      click(map, makeMouseEvent(80, 10, { shiftKey: true }));
+      click(map, makeMouseEvent(60, 10, { shiftKey: true }));
+      afterNextRender(() => {
+        Draw.trash();
+        const afterTrash = Draw.get(ids[0]);
+        st.deepEqual(afterTrash.geometry.coordinates, [[0, 0], [10, 0], [20, 0], [30, 0], [40, 0], [50, 0], [60, 0], [70, 0], [80, 0], [50, 10]]);
+        cleanUp(() => st.end());
+      });
+    });
+  });
+
   t.test('direct_select - a click on a vertex and than dragging the map shouldn\'t drag the vertex', (st) => {
     const ids = Draw.add(getGeoJSON('polygon'));
     Draw.changeMode(Constants.modes.DIRECT_SELECT, {