diff --git a/src/modes/select/select.mode.spec.ts b/src/modes/select/select.mode.spec.ts index a0f5fb12..d475eb32 100644 --- a/src/modes/select/select.mode.spec.ts +++ b/src/modes/select/select.mode.spec.ts @@ -13,12 +13,12 @@ describe("TerraDrawSelectMode", () => { let unproject: jest.Mock; let onSelect: jest.Mock; let onDeselect: jest.Mock; + let onFinish: jest.Mock; const setSelectMode = ( options?: ConstructorParameters[0] ) => { selectMode = new TerraDrawSelectMode(options); - const mockConfig = getMockModeConfig(selectMode.mode); onChange = mockConfig.onChange; project = mockConfig.project; @@ -26,6 +26,7 @@ describe("TerraDrawSelectMode", () => { onSelect = mockConfig.onSelect; onDeselect = mockConfig.onDeselect; setCursor = mockConfig.setCursor; + onFinish = mockConfig.onFinish; store = mockConfig.store; selectMode.register(mockConfig); @@ -2026,6 +2027,7 @@ describe("TerraDrawSelectMode", () => { ]); expect(onChange).toBeCalledTimes(1); + const idOne = onChange.mock.calls[0][0] as string[]; // mock for both drag coordinate and drag feature mockMouseEventBoundingBox(); @@ -2057,8 +2059,8 @@ describe("TerraDrawSelectMode", () => { }); selectMode.onClick({ - lng: 0, - lat: 0, + lng: 0.5, + lat: 0.5, containerX: 0, containerY: 0, button: "left", @@ -2070,8 +2072,8 @@ describe("TerraDrawSelectMode", () => { selectMode.onDragStart( { - lng: 1, - lat: 1, + lng: 0.5, + lat: 0.5, containerX: 1, containerY: 1, button: "left", @@ -2114,7 +2116,8 @@ describe("TerraDrawSelectMode", () => { setMapDraggability ); - expect(onChange).toBeCalledTimes(2); + expect(onChange).toBeCalledTimes(3); + expect(onChange).toHaveBeenNthCalledWith(3, idOne, "update"); }); }); }); @@ -2334,19 +2337,9 @@ describe("TerraDrawSelectMode", () => { }); describe("onDragEnd", () => { - let selectMode: TerraDrawSelectMode; - let setCursor: jest.Mock; - - beforeEach(() => { - selectMode = new TerraDrawSelectMode(); - - const mockConfig = getMockModeConfig(selectMode.mode); - setCursor = mockConfig.setCursor; - - selectMode.register(mockConfig); - }); - it("sets map draggability back to false, sets cursor to default", () => { + setSelectMode(); + const setMapDraggability = jest.fn(); selectMode.onDragEnd( { @@ -2365,6 +2358,241 @@ describe("TerraDrawSelectMode", () => { expect(setCursor).toBeCalledTimes(1); expect(setCursor).toBeCalledWith("move"); }); + + it("fires onFinish for dragged coordinate if it is currently being dragged", () => { + setSelectMode({ + flags: { polygon: { feature: { coordinates: { draggable: true } } } }, + }); + + // We want to account for ignoring points branch + addPointToStore([100, 89]); + + expect(onChange).toBeCalledTimes(1); + + addPolygonToStore([ + [0, 0], + [0, 1], + [1, 1], + [1, 0], + [0, 0], + ]); + + expect(onChange).toBeCalledTimes(2); + + mockMouseEventBoundingBox(); + + project + .mockReturnValueOnce({ + x: 100, + y: 100, + }) + .mockReturnValue({ + x: 0, + y: 0, + }); + + selectMode.onClick({ + lng: 0, + lat: 0, + containerX: 0, + containerY: 0, + button: "left", + heldKeys: [], + }); + + expect(onSelect).toBeCalledTimes(1); + expect(onChange).toBeCalledTimes(4); + + // Select feature + expect(onChange).toHaveBeenNthCalledWith( + 3, + [expect.any(String)], + "update" + ); + + // Create selection points + expect(onChange).toHaveBeenNthCalledWith( + 4, + [ + expect.any(String), + expect.any(String), + expect.any(String), + expect.any(String), + ], + "create" + ); + + mockMouseEventBoundingBox(); + project + .mockReturnValueOnce({ + x: 100, + y: 100, + }) + .mockReturnValue({ + x: 0, + y: 0, + }); + + selectMode.onDragStart( + { + lng: 1, + lat: 1, + containerX: 1, + containerY: 1, + button: "left", + heldKeys: [], + }, + jest.fn() + ); + + const setMapDraggability = jest.fn(); + selectMode.onDrag( + { + lng: 1, + lat: 1, + containerX: 1, + containerY: 1, + button: "left", + heldKeys: [], + }, + setMapDraggability + ); + + selectMode.onDragEnd( + { + lng: 1, + lat: 1, + containerX: 1, + containerY: 1, + button: "left", + heldKeys: [], + }, + setMapDraggability + ); + + expect(onFinish).toBeCalledTimes(1); + expect(onFinish).toBeCalledWith(expect.any(String)); + }); + + it("fires onFinish for dragged feature if it is currently being dragged", () => { + setSelectMode({ + flags: { polygon: { feature: { draggable: true } } }, + }); + + addPolygonToStore([ + [0, 0], + [0, 1], + [1, 1], + [1, 0], + [0, 0], + ]); + + expect(onChange).toBeCalledTimes(1); + + // mock for both drag coordinate and drag feature + mockMouseEventBoundingBox(); + mockMouseEventBoundingBox(); + project + .mockReturnValueOnce({ + x: 0, + y: 0, + }) + .mockReturnValueOnce({ + x: 1, + y: 1, + }) + .mockReturnValueOnce({ + x: 0, + y: 0, + }) + .mockReturnValueOnce({ + x: 1, + y: 1, + }) + .mockReturnValueOnce({ + x: 0, + y: 0, + }) + .mockReturnValueOnce({ + x: 1, + y: 1, + }); + + selectMode.onClick({ + lng: 0.5, + lat: 0.5, + containerX: 0, + containerY: 0, + button: "left", + heldKeys: [], + }); + + expect(onSelect).toBeCalledTimes(1); + expect(onChange).toBeCalledTimes(2); + + selectMode.onDragStart( + { + lng: 0.5, + lat: 0.5, + containerX: 0.5, + containerY: 0.5, + button: "left", + heldKeys: [], + }, + jest.fn() + ); + + // mock for both drag coordinate and drag feature + mockMouseEventBoundingBox(); + mockMouseEventBoundingBox(); + project + .mockReturnValueOnce({ + x: 0, + y: 0, + }) + .mockReturnValueOnce({ + x: 1, + y: 1, + }) + .mockReturnValueOnce({ + x: 0, + y: 0, + }) + .mockReturnValueOnce({ + x: 1, + y: 1, + }); + + const setMapDraggability = jest.fn(); + selectMode.onDrag( + { + lng: 0.5, + lat: 0.5, + containerX: 0, + containerY: 0, + button: "left", + heldKeys: [], + }, + setMapDraggability + ); + + expect(onChange).toBeCalledTimes(3); + + selectMode.onDragEnd( + { + lng: 1, + lat: 1, + containerX: 1, + containerY: 1, + button: "left", + heldKeys: [], + }, + setMapDraggability + ); + + expect(onFinish).toBeCalledTimes(1); + expect(onFinish).toBeCalledWith(expect.any(String)); + }); }); describe("onMouseMove", () => { diff --git a/src/modes/select/select.mode.ts b/src/modes/select/select.mode.ts index 5212c827..0ef194ad 100644 --- a/src/modes/select/select.mode.ts +++ b/src/modes/select/select.mode.ts @@ -657,6 +657,15 @@ export class TerraDrawSelectMode extends TerraDrawBaseDrawMode setMapDraggability: (enabled: boolean) => void ) { this.setCursor(this.cursors.dragEnd); + + // If we have finished dragging a coordinate or a feature + // lets fire an onFinish event which can be listened to + if (this.dragCoordinate.isDragging()) { + this.onFinish(this.selected[0]); + } else if (this.dragFeature.isDragging()) { + this.onFinish(this.selected[0]); + } + this.dragCoordinate.stopDragging(); this.dragFeature.stopDragging(); this.rotateFeature.reset();