@reltio/components 1.4.2257 → 1.4.2259

package/cjs/ReltioMap/ReltioMap.spec.js

@@ -88,6 +88,7 @@ var user_event_1 = __importDefault(require("@testing-library/user-event"));
 var ramda_1 = require("ramda");
 var jest_mocks_1 = require("@googlemaps/jest-mocks");
 var constants_1 = require("../constants");
+var usePolygonDrawing_1 = require("./components/PolygonDrawing/usePolygonDrawing");
 var helpers = __importStar(require("./helpers"));
 var ReltioMap_1 = require("./ReltioMap");
 jest.mock('@vis.gl/react-google-maps', function () { return (__assign(__assign({}, jest.requireActual('@vis.gl/react-google-maps')), { MapControl: function (_a) {
@@ -109,8 +110,24 @@ describe('ReltioMap tests', function () {
         var user = user_event_1.default.setup();
         return __assign(__assign({}, (0, react_2.render)(react_1.default.createElement(ReltioMap_1.ReltioMap, __assign({}, props)))), { user: user });
     };
-    var drawingManagerInstance;
-    var drawingManagerConstructorSpy = jest.fn();
+    /**
+     * Map click payload: must expose lat()/lng() for serialization and equals() for polygonRingHelpers
+     */
+    var mapMouseEventWith = function (lat, lng) { return ({
+        latLng: {
+            lat: function () { return lat; },
+            lng: function () { return lng; },
+            equals: function (other) {
+                var oLat = typeof other.lat === 'function'
+                    ? other.lat()
+                    : other.lat;
+                var oLng = typeof other.lng === 'function'
+                    ? other.lng()
+                    : other.lng;
+                return oLat === lat && oLng === lng;
+            }
+        }
+    }); };
     beforeAll(function () {
         (0, jest_mocks_1.initialize)();
         var OriginalMap = google.maps.Map;
@@ -119,32 +136,11 @@ describe('ReltioMap tests', function () {
             for (var _i = 0; _i < arguments.length; _i++) {
                 args[_i] = arguments[_i];
             }
-            return new (OriginalMap.bind.apply(OriginalMap, __spreadArray([void 0], args, false)))();
+            var mapInstance = new (OriginalMap.bind.apply(OriginalMap, __spreadArray([void 0], args, false)))();
+            mapInstance.setOptions = jest.fn();
+            mapInstance.get = jest.fn(function () { return undefined; });
+            return mapInstance;
         });
-        global.google.maps.drawing.DrawingManager = /** @class */ (function () {
-            function DrawingManager() {
-                var args = [];
-                for (var _i = 0; _i < arguments.length; _i++) {
-                    args[_i] = arguments[_i];
-                }
-                this.addListener = jest.fn();
-                this.getDrawingMode = jest.fn();
-                this.getMap = jest.fn();
-                this.setDrawingMode = jest.fn();
-                this.setMap = jest.fn();
-                this.setOptions = jest.fn();
-                drawingManagerConstructorSpy.apply(void 0, args);
-                drawingManagerInstance = this;
-            }
-            return DrawingManager;
-        }());
-        global.google.maps.drawing.OverlayType = {
-            CIRCLE: 'circle',
-            MARKER: 'marker',
-            POLYGON: 'polygon',
-            POLYLINE: 'polyline',
-            RECTANGLE: 'rectangle'
-        };
         var overlayView = new jest_mocks_1.OverlayView();
         for (var property in overlayView) {
             if (!global.google.maps.OverlayView.prototype.hasOwnProperty(property)) {
@@ -152,9 +148,6 @@ describe('ReltioMap tests', function () {
             }
         }
     });
-    beforeEach(function () {
-        drawingManagerInstance = null;
-    });
     afterEach(function () {
         jest.clearAllMocks();
         jest_mocks_1.mockInstances.clearAll();
@@ -170,13 +163,14 @@ describe('ReltioMap tests', function () {
         }, target.addListener.mock.calls)) === null || _b === void 0 ? void 0 : _b[1]);
     };
     var getLastInstance = function (instance) { return (0, ramda_1.last)(jest_mocks_1.mockInstances.get(instance)); };
+    var getFirstInstance = function (instance) { var _a; return (_a = jest_mocks_1.mockInstances.get(instance)) === null || _a === void 0 ? void 0 : _a[0]; };
     describe('general behaviour', function () {
         it('should render map controls', function () { return __awaiter(void 0, void 0, void 0, function () {
             var _a;
             return __generator(this, function (_b) {
                 switch (_b.label) {
                     case 0:
-                        setUp(__assign(__assign({}, defaultProps), { drawingModes: [constants_1.MAP_DRAWING_MODES.POLYGON] }));
+                        setUp(__assign(__assign({}, defaultProps), { enablePolygonDrawing: true }));
                         _a = expect;
                         return [4 /*yield*/, react_2.screen.findByLabelText('Draw area')];
                     case 1:
@@ -192,7 +186,7 @@ describe('ReltioMap tests', function () {
                 switch (_a.label) {
                     case 0:
                         mapOptions = { mapTypeControl: true };
-                        setUp(__assign(__assign({}, defaultProps), { drawingModes: [constants_1.MAP_DRAWING_MODES.POLYGON], mapOptions: mapOptions }));
+                        setUp(__assign(__assign({}, defaultProps), { enablePolygonDrawing: true, mapOptions: mapOptions }));
                         return [4 /*yield*/, (0, react_2.waitFor)(function () {
                                 expect(google.maps.Map).toHaveBeenCalledWith(expect.any(HTMLElement), expect.objectContaining({
                                     fullscreenControl: false,
@@ -210,7 +204,7 @@ describe('ReltioMap tests', function () {
             return __generator(this, function (_a) {
                 switch (_a.label) {
                     case 0:
-                        setUp(__assign(__assign({}, defaultProps), { drawingModes: [constants_1.MAP_DRAWING_MODES.POLYGON], isSearchEnabled: false }));
+                        setUp(__assign(__assign({}, defaultProps), { enablePolygonDrawing: true, isSearchEnabled: false }));
                         return [4 /*yield*/, (0, react_2.waitFor)(function () {
                                 expect(react_2.screen.queryByLabelText('Draw area')).not.toBeInTheDocument();
                             })];
@@ -236,7 +230,7 @@ describe('ReltioMap tests', function () {
                             }
                         ];
                         onMarkerClick = jest.fn();
-                        setUp(__assign(__assign({}, defaultProps), { drawingModes: [constants_1.MAP_DRAWING_MODES.POLYGON], onMarkerClicked: onMarkerClick, markers: markers }));
+                        setUp(__assign(__assign({}, defaultProps), { enablePolygonDrawing: true, onMarkerClicked: onMarkerClick, markers: markers }));
                         return [4 /*yield*/, (0, react_2.waitFor)(function () {
                                 markerMock = getLastInstance(jest_mocks_1.AdvancedMarkerElement);
                                 expect(markerMock).toBeDefined();
@@ -280,7 +274,7 @@ describe('ReltioMap tests', function () {
         });
         it('should fit map bounds correctly if markers loaded later than map and activeOverlay is not null', function () {
             var activeOverlay = {
-                type: constants_1.MAP_DRAWING_MODES.POLYGON,
+                type: constants_1.POLYGON_DRAWING_MODE,
                 path: [
                     { lat: 1, lng: 1 },
                     { lat: 2, lng: 2 }
@@ -341,7 +335,7 @@ describe('ReltioMap tests', function () {
             var fitMapBoundsForOverlay = jest.spyOn(helpers, 'fitMapBoundsForOverlay');
             var rerender = setUp(__assign(__assign({}, defaultProps), { activeOverlay: null })).rerender;
             var newProps = __assign(__assign({}, defaultProps), { activeOverlay: {
-                    type: constants_1.MAP_DRAWING_MODES.POLYGON,
+                    type: constants_1.POLYGON_DRAWING_MODE,
                     path: [
                         { lat: 1, lng: 1 },
                         { lat: 2, lng: 2 }
@@ -358,7 +352,7 @@ describe('ReltioMap tests', function () {
             var fitMapBoundsForOverlay = jest.spyOn(helpers, 'fitMapBoundsForOverlay');
             var rerender = setUp(__assign(__assign({}, defaultProps), { activeOverlay: null })).rerender;
             var newProps = __assign(__assign({}, defaultProps), { activeOverlay: {
-                    type: constants_1.MAP_DRAWING_MODES.POLYGON,
+                    type: constants_1.POLYGON_DRAWING_MODE,
                     path: [
                         { lat: 1, lng: 1 },
                         { lat: 2, lng: 2 }
@@ -409,16 +403,16 @@ describe('ReltioMap tests', function () {
                 switch (_b.label) {
                     case 0:
                         activeOverlay = {
-                            type: constants_1.MAP_DRAWING_MODES.POLYGON,
+                            type: constants_1.POLYGON_DRAWING_MODE,
                             path: [
                                 { lat: 1, lng: 1 },
                                 { lat: 2, lng: 2 }
                             ]
                         };
-                        _a = setUp(__assign(__assign({}, defaultProps), { drawingModes: [constants_1.MAP_DRAWING_MODES.POLYGON], activeOverlay: activeOverlay })), user = _a.user, rerender = _a.rerender;
+                        _a = setUp(__assign(__assign({}, defaultProps), { enablePolygonDrawing: true, activeOverlay: activeOverlay })), user = _a.user, rerender = _a.rerender;
                         polygon = getLastInstance(jest_mocks_1.Polygon);
                         expect(polygon.setOptions).toHaveBeenCalledWith(expect.objectContaining({ paths: activeOverlay.path }));
-                        newProps = __assign(__assign({}, defaultProps), { drawingModes: [constants_1.MAP_DRAWING_MODES.POLYGON], activeOverlay: null });
+                        newProps = __assign(__assign({}, defaultProps), { enablePolygonDrawing: true, activeOverlay: null });
                         rerender(react_1.default.createElement(ReltioMap_1.ReltioMap, __assign({}, newProps)));
                         return [4 /*yield*/, user.click(react_2.screen.getByLabelText('Draw area'))];
                     case 1:
@@ -428,16 +422,16 @@ describe('ReltioMap tests', function () {
                 }
             });
         }); });
-        it('should not render Polygon if "activeOverlay" prop is circle', function () { return __awaiter(void 0, void 0, void 0, function () {
+        it('should not render Polygon if "activeOverlay" is not a polygon', function () { return __awaiter(void 0, void 0, void 0, function () {
             var activeOverlay;
             return __generator(this, function (_a) {
                 switch (_a.label) {
                     case 0:
                         activeOverlay = {
-                            type: constants_1.MAP_DRAWING_MODES.CIRCLE,
+                            type: 'bounds-rectangle',
                             path: [{ lat: 1, lng: 1 }]
                         };
-                        setUp(__assign(__assign({}, defaultProps), { drawingModes: [constants_1.MAP_DRAWING_MODES.POLYGON], activeOverlay: activeOverlay }));
+                        setUp(__assign(__assign({}, defaultProps), { enablePolygonDrawing: true, activeOverlay: activeOverlay }));
                         return [4 /*yield*/, (0, react_2.waitFor)(function () {
                                 expect(jest_mocks_1.mockInstances.get(jest_mocks_1.Polygon)).toHaveLength(0);
                             })];
@@ -453,19 +447,19 @@ describe('ReltioMap tests', function () {
                 switch (_a.label) {
                     case 0:
                         activeOverlay = {
-                            type: constants_1.MAP_DRAWING_MODES.POLYGON,
+                            type: constants_1.POLYGON_DRAWING_MODE,
                             path: [
                                 { lat: 1, lng: 1 },
                                 { lat: 2, lng: 2 }
                             ]
                         };
                         onOverlayUpdated = jest.fn();
-                        setUp(__assign(__assign({}, defaultProps), { drawingModes: [constants_1.MAP_DRAWING_MODES.POLYGON], activeOverlay: activeOverlay, onOverlayUpdated: onOverlayUpdated }));
+                        setUp(__assign(__assign({}, defaultProps), { enablePolygonDrawing: true, activeOverlay: activeOverlay, onOverlayUpdated: onOverlayUpdated }));
                         polygon = getLastInstance(jest_mocks_1.Polygon);
                         getEventHandler(polygon, 'mouseup')();
                         return [4 /*yield*/, (0, react_2.waitFor)(function () {
                                 expect(onOverlayUpdated).toHaveBeenCalledWith({
-                                    type: constants_1.MAP_DRAWING_MODES.POLYGON,
+                                    type: constants_1.POLYGON_DRAWING_MODE,
                                     data: []
                                 });
                             })];
@@ -482,19 +476,19 @@ describe('ReltioMap tests', function () {
                 switch (_a.label) {
                     case 0:
                         activeOverlay = {
-                            type: constants_1.MAP_DRAWING_MODES.POLYGON,
+                            type: constants_1.POLYGON_DRAWING_MODE,
                             path: [
                                 { lat: 1, lng: 1 },
                                 { lat: 2, lng: 2 }
                             ]
                         };
                         onOverlayUpdated = jest.fn();
-                        setUp(__assign(__assign({}, defaultProps), { drawingModes: [constants_1.MAP_DRAWING_MODES.POLYGON], activeOverlay: activeOverlay, onOverlayUpdated: onOverlayUpdated }));
+                        setUp(__assign(__assign({}, defaultProps), { enablePolygonDrawing: true, activeOverlay: activeOverlay, onOverlayUpdated: onOverlayUpdated }));
                         polygon = getLastInstance(jest_mocks_1.Polygon);
                         getEventHandler(polygon, 'dragend')();
                         return [4 /*yield*/, (0, react_2.waitFor)(function () {
                                 expect(onOverlayUpdated).toHaveBeenCalledWith({
-                                    type: constants_1.MAP_DRAWING_MODES.POLYGON,
+                                    type: constants_1.POLYGON_DRAWING_MODE,
                                     data: []
                                 });
                             })];
@@ -507,46 +501,54 @@ describe('ReltioMap tests', function () {
         }); });
     });
     describe('drawing behavior', function () {
-        it("shouldn't be in drawing mode by default", function () { return __awaiter(void 0, void 0, void 0, function () {
+        it("shouldn't enable double-click zoom suppression before entering draw mode", function () { return __awaiter(void 0, void 0, void 0, function () {
+            var mapMock;
             return __generator(this, function (_a) {
                 switch (_a.label) {
                     case 0:
-                        setUp(__assign(__assign({}, defaultProps), { drawingModes: [constants_1.MAP_DRAWING_MODES.CIRCLE] }));
-                        return [4 /*yield*/, (0, react_2.waitFor)(function () {
-                                expect(drawingManagerInstance).not.toBe(null);
-                            })];
+                        setUp(__assign(__assign({}, defaultProps), { enablePolygonDrawing: true }));
+                        return [4 /*yield*/, (0, react_2.waitFor)(function () { return getLastInstance(jest_mocks_1.Map); })];
                     case 1:
-                        _a.sent();
-                        expect(drawingManagerInstance.setDrawingMode).not.toHaveBeenCalledWith(constants_1.MAP_DRAWING_MODES.CIRCLE);
+                        mapMock = _a.sent();
+                        expect(mapMock.setOptions).not.toHaveBeenCalledWith({ disableDoubleClickZoom: true });
                         return [2 /*return*/];
                 }
             });
         }); });
-        it('should change drawing mode on map control action', function () { return __awaiter(void 0, void 0, void 0, function () {
-            var user;
+        it('should toggle double-click zoom suppression when entering and leaving polygon drawing mode', function () { return __awaiter(void 0, void 0, void 0, function () {
+            var user, mapMock;
             return __generator(this, function (_a) {
                 switch (_a.label) {
                     case 0:
-                        user = setUp(__assign(__assign({}, defaultProps), { drawingModes: [constants_1.MAP_DRAWING_MODES.CIRCLE] })).user;
-                        return [4 /*yield*/, user.click(react_2.screen.getByLabelText('Draw area'))];
+                        user = setUp(__assign(__assign({}, defaultProps), { enablePolygonDrawing: true })).user;
+                        return [4 /*yield*/, (0, react_2.waitFor)(function () { return getLastInstance(jest_mocks_1.Map); })];
                     case 1:
+                        mapMock = _a.sent();
+                        return [4 /*yield*/, user.click(react_2.screen.getByLabelText('Draw area'))];
+                    case 2:
                         _a.sent();
-                        expect(drawingManagerConstructorSpy).toHaveBeenCalledWith(expect.objectContaining({ drawingMode: constants_1.MAP_DRAWING_MODES.CIRCLE }));
+                        expect(mapMock.setOptions).toHaveBeenCalledWith(expect.objectContaining({
+                            draggableCursor: usePolygonDrawing_1.MAP_DRAWING_CROSSHAIR_CURSOR
+                        }));
+                        expect(mapMock.setOptions).toHaveBeenCalledWith(expect.objectContaining({
+                            disableDoubleClickZoom: true,
+                            clickableIcons: false
+                        }));
                         return [4 /*yield*/, user.click(react_2.screen.getByLabelText('Clear area'))];
-                    case 2:
+                    case 3:
                         _a.sent();
-                        expect(drawingManagerConstructorSpy).toHaveBeenCalledWith(expect.objectContaining({ drawingMode: null }));
+                        expect(mapMock.setOptions).toHaveBeenCalledWith(expect.objectContaining({ disableDoubleClickZoom: false }));
                         return [2 /*return*/];
                 }
             });
         }); });
-        it("shouldn't render DrawingManager without drawingModes prop", function () { return __awaiter(void 0, void 0, void 0, function () {
+        it("shouldn't attach polygon drawing listeners when polygon drawing is disabled", function () { return __awaiter(void 0, void 0, void 0, function () {
             return __generator(this, function (_a) {
                 switch (_a.label) {
                     case 0:
                         setUp(__assign({}, defaultProps));
                         return [4 /*yield*/, (0, react_2.waitFor)(function () {
-                                expect(drawingManagerInstance).toBe(null);
+                                expect(react_2.screen.queryByLabelText('Draw area')).not.toBeInTheDocument();
                             })];
                     case 1:
                         _a.sent();
@@ -554,7 +556,7 @@ describe('ReltioMap tests', function () {
                 }
             });
         }); });
-        it("shouldn't render TopRightMapControls without drawingModes prop", function () { return __awaiter(void 0, void 0, void 0, function () {
+        it("shouldn't render TopRightMapControls when polygon drawing is disabled", function () { return __awaiter(void 0, void 0, void 0, function () {
             return __generator(this, function (_a) {
                 switch (_a.label) {
                     case 0:
@@ -569,38 +571,213 @@ describe('ReltioMap tests', function () {
                 }
             });
         }); });
-        it('should call props.onOverlayUpdated after polygon completing', function () { return __awaiter(void 0, void 0, void 0, function () {
-            var onOverlayUpdated, user, overlay;
+        it('should call props.onOverlayUpdated after polygon completing with correct vertex coordinates', function () { return __awaiter(void 0, void 0, void 0, function () {
+            var onOverlayUpdated, OriginalPolygon, polygonPathSpy, user, mapMock, mapDiv, clickHandler;
             return __generator(this, function (_a) {
                 switch (_a.label) {
                     case 0:
                         onOverlayUpdated = jest.fn();
-                        user = setUp(__assign(__assign({}, defaultProps), { onOverlayUpdated: onOverlayUpdated, drawingModes: [constants_1.MAP_DRAWING_MODES.POLYGON] })).user;
+                        OriginalPolygon = google.maps.Polygon;
+                        polygonPathSpy = jest.spyOn(google.maps, 'Polygon').mockImplementation(function (opts) {
+                            var instance = new OriginalPolygon(opts);
+                            var raw = opts === null || opts === void 0 ? void 0 : opts.paths;
+                            var ring = !raw
+                                ? []
+                                : 'getArray' in raw
+                                    ? raw.getArray()
+                                    : raw;
+                            var mvc = new google.maps.MVCArray();
+                            mvc.getArray = jest.fn(function () { return ring; });
+                            instance.getPath = jest.fn(function () { return mvc; });
+                            return instance;
+                        });
+                        user = setUp(__assign(__assign({}, defaultProps), { onOverlayUpdated: onOverlayUpdated, enablePolygonDrawing: true })).user;
+                        return [4 /*yield*/, (0, react_2.waitFor)(function () {
+                                var m = getLastInstance(jest_mocks_1.Map);
+                                if (!m) {
+                                    throw new Error('Map not ready');
+                                }
+                                return m;
+                            })];
+                    case 1:
+                        mapMock = _a.sent();
+                        mapDiv = document.createElement('div');
+                        mapMock.getDiv = jest.fn(function () { return mapDiv; });
                         return [4 /*yield*/, user.click(react_2.screen.getByLabelText('Draw area'))];
+                    case 2:
+                        _a.sent();
+                        clickHandler = getEventHandler(mapMock, 'click');
+                        (0, react_2.act)(function () {
+                            clickHandler(mapMouseEventWith(1, 2));
+                            clickHandler(mapMouseEventWith(3, 4));
+                            clickHandler(mapMouseEventWith(5, 6));
+                        });
+                        (0, react_2.act)(function () {
+                            mapDiv.dispatchEvent(new MouseEvent('dblclick', { bubbles: true, cancelable: true, composed: true }));
+                        });
+                        return [4 /*yield*/, (0, react_2.waitFor)(function () {
+                                expect(onOverlayUpdated).toHaveBeenCalled();
+                            })];
+                    case 3:
+                        _a.sent();
+                        expect(onOverlayUpdated.mock.calls[0][0]).toEqual(expect.objectContaining({
+                            type: constants_1.POLYGON_DRAWING_MODE,
+                            data: [
+                                [1, 2],
+                                [3, 4],
+                                [5, 6]
+                            ]
+                        }));
+                        polygonPathSpy.mockRestore();
+                        return [2 /*return*/];
+                }
+            });
+        }); });
+        it('completes the ring when the first vertex marker is clicked after three map clicks', function () { return __awaiter(void 0, void 0, void 0, function () {
+            var onOverlayUpdated, OriginalPolygon, polygonPathSpy, user, mapMock, mapDiv, clickHandler, firstVertexMarker;
+            return __generator(this, function (_a) {
+                switch (_a.label) {
+                    case 0:
+                        onOverlayUpdated = jest.fn();
+                        OriginalPolygon = google.maps.Polygon;
+                        polygonPathSpy = jest.spyOn(google.maps, 'Polygon').mockImplementation(function (opts) {
+                            var instance = new OriginalPolygon(opts);
+                            var raw = opts === null || opts === void 0 ? void 0 : opts.paths;
+                            var ring = !raw
+                                ? []
+                                : 'getArray' in raw
+                                    ? raw.getArray()
+                                    : raw;
+                            var mvc = new google.maps.MVCArray();
+                            mvc.getArray = jest.fn(function () { return ring; });
+                            instance.getPath = jest.fn(function () { return mvc; });
+                            return instance;
+                        });
+                        user = setUp(__assign(__assign({}, defaultProps), { onOverlayUpdated: onOverlayUpdated, enablePolygonDrawing: true })).user;
+                        return [4 /*yield*/, (0, react_2.waitFor)(function () {
+                                var m = getLastInstance(jest_mocks_1.Map);
+                                if (!m) {
+                                    throw new Error('Map not ready');
+                                }
+                                return m;
+                            })];
                     case 1:
+                        mapMock = _a.sent();
+                        mapDiv = document.createElement('div');
+                        mapMock.getDiv = jest.fn(function () { return mapDiv; });
+                        return [4 /*yield*/, user.click(react_2.screen.getByLabelText('Draw area'))];
+                    case 2:
                         _a.sent();
-                        expect(drawingManagerConstructorSpy).toHaveBeenCalledWith(expect.objectContaining({ drawingMode: constants_1.MAP_DRAWING_MODES.POLYGON }));
-                        overlay = {
-                            setMap: jest.fn(),
-                            getPath: function () { return ({
-                                getArray: function () { return [
-                                    { lat: function () { return 1; }, lng: function () { return 2; } },
-                                    { lat: function () { return 3; }, lng: function () { return 4; } }
-                                ]; }
-                            }); }
-                        };
+                        clickHandler = getEventHandler(mapMock, 'click');
                         (0, react_2.act)(function () {
-                            getEventHandler(drawingManagerInstance, 'polygoncomplete')(overlay);
+                            clickHandler(mapMouseEventWith(1, 2));
+                            clickHandler(mapMouseEventWith(3, 4));
+                            clickHandler(mapMouseEventWith(5, 6));
                         });
-                        expect(onOverlayUpdated).toHaveBeenCalledWith({
-                            type: constants_1.MAP_DRAWING_MODES.POLYGON,
+                        firstVertexMarker = getFirstInstance(jest_mocks_1.AdvancedMarkerElement);
+                        expect(firstVertexMarker).toBeDefined();
+                        (0, react_2.act)(function () {
+                            getEventHandler(firstVertexMarker, 'click')(__assign(__assign({}, mapMouseEventWith(0, 0)), { stop: jest.fn() }));
+                        });
+                        return [4 /*yield*/, (0, react_2.waitFor)(function () {
+                                expect(onOverlayUpdated).toHaveBeenCalled();
+                            })];
+                    case 3:
+                        _a.sent();
+                        expect(onOverlayUpdated.mock.calls[0][0]).toEqual(expect.objectContaining({
+                            type: constants_1.POLYGON_DRAWING_MODE,
                             data: [
                                 [1, 2],
-                                [3, 4]
+                                [3, 4],
+                                [5, 6]
                             ]
+                        }));
+                        polygonPathSpy.mockRestore();
+                        return [2 /*return*/];
+                }
+            });
+        }); });
+        it('clears the in-progress draw on map mouseleave so double-click does not complete a polygon', function () { return __awaiter(void 0, void 0, void 0, function () {
+            var onOverlayUpdated, user, mapMock, mapDiv, clickHandler;
+            return __generator(this, function (_a) {
+                switch (_a.label) {
+                    case 0:
+                        onOverlayUpdated = jest.fn();
+                        user = setUp(__assign(__assign({}, defaultProps), { onOverlayUpdated: onOverlayUpdated, enablePolygonDrawing: true })).user;
+                        return [4 /*yield*/, (0, react_2.waitFor)(function () { return getLastInstance(jest_mocks_1.Map); })];
+                    case 1:
+                        mapMock = _a.sent();
+                        mapDiv = document.createElement('div');
+                        mapMock.getDiv = jest.fn(function () { return mapDiv; });
+                        return [4 /*yield*/, user.click(react_2.screen.getByLabelText('Draw area'))];
+                    case 2:
+                        _a.sent();
+                        clickHandler = getEventHandler(mapMock, 'click');
+                        (0, react_2.act)(function () {
+                            clickHandler(mapMouseEventWith(1, 2));
+                            clickHandler(mapMouseEventWith(3, 4));
+                            clickHandler(mapMouseEventWith(5, 6));
                         });
-                        expect(overlay.setMap).toHaveBeenCalledWith(null);
-                        expect(drawingManagerConstructorSpy).toHaveBeenCalledWith(expect.objectContaining({ drawingMode: null }));
+                        (0, react_2.act)(function () {
+                            mapDiv.dispatchEvent(new MouseEvent('mouseleave', { bubbles: true }));
+                        });
+                        (0, react_2.act)(function () {
+                            mapDiv.dispatchEvent(new MouseEvent('dblclick', { bubbles: true, cancelable: true, composed: true }));
+                        });
+                        expect(onOverlayUpdated).not.toHaveBeenCalled();
+                        return [2 /*return*/];
+                }
+            });
+        }); });
+        it('ignores a second double-click after completion until draw mode is toggled', function () { return __awaiter(void 0, void 0, void 0, function () {
+            var onOverlayUpdated, OriginalPolygon, polygonPathSpy, user, mapMock, mapDiv, clickHandler;
+            return __generator(this, function (_a) {
+                switch (_a.label) {
+                    case 0:
+                        onOverlayUpdated = jest.fn();
+                        OriginalPolygon = google.maps.Polygon;
+                        polygonPathSpy = jest.spyOn(google.maps, 'Polygon').mockImplementation(function (opts) {
+                            var instance = new OriginalPolygon(opts);
+                            var raw = opts === null || opts === void 0 ? void 0 : opts.paths;
+                            var ring = !raw
+                                ? []
+                                : 'getArray' in raw
+                                    ? raw.getArray()
+                                    : raw;
+                            var mvc = new google.maps.MVCArray();
+                            mvc.getArray = jest.fn(function () { return ring; });
+                            instance.getPath = jest.fn(function () { return mvc; });
+                            return instance;
+                        });
+                        user = setUp(__assign(__assign({}, defaultProps), { onOverlayUpdated: onOverlayUpdated, enablePolygonDrawing: true })).user;
+                        return [4 /*yield*/, (0, react_2.waitFor)(function () { return getLastInstance(jest_mocks_1.Map); })];
+                    case 1:
+                        mapMock = _a.sent();
+                        mapDiv = document.createElement('div');
+                        mapMock.getDiv = jest.fn(function () { return mapDiv; });
+                        return [4 /*yield*/, user.click(react_2.screen.getByLabelText('Draw area'))];
+                    case 2:
+                        _a.sent();
+                        clickHandler = getEventHandler(mapMock, 'click');
+                        (0, react_2.act)(function () {
+                            clickHandler(mapMouseEventWith(1, 2));
+                            clickHandler(mapMouseEventWith(3, 4));
+                            clickHandler(mapMouseEventWith(5, 6));
+                        });
+                        (0, react_2.act)(function () {
+                            mapDiv.dispatchEvent(new MouseEvent('dblclick', { bubbles: true, cancelable: true, composed: true }));
+                        });
+                        return [4 /*yield*/, (0, react_2.waitFor)(function () {
+                                expect(onOverlayUpdated).toHaveBeenCalledTimes(1);
+                            })];
+                    case 3:
+                        _a.sent();
+                        onOverlayUpdated.mockClear();
+                        (0, react_2.act)(function () {
+                            mapDiv.dispatchEvent(new MouseEvent('dblclick', { bubbles: true, cancelable: true, composed: true }));
+                        });
+                        expect(onOverlayUpdated).not.toHaveBeenCalled();
+                        polygonPathSpy.mockRestore();
                         return [2 /*return*/];
                 }
             });
@@ -612,13 +789,13 @@ describe('ReltioMap tests', function () {
                     case 0:
                         onOverlayUpdated = jest.fn();
                         activeOverlay = {
-                            type: constants_1.MAP_DRAWING_MODES.POLYGON,
+                            type: constants_1.POLYGON_DRAWING_MODE,
                             path: [
                                 { lat: 1, lng: 1 },
                                 { lat: 2, lng: 2 }
                             ]
                         };
-                        user = setUp(__assign(__assign({}, defaultProps), { drawingModes: [constants_1.MAP_DRAWING_MODES.CIRCLE], activeOverlay: activeOverlay, onOverlayUpdated: onOverlayUpdated })).user;
+                        user = setUp(__assign(__assign({}, defaultProps), { enablePolygonDrawing: true, activeOverlay: activeOverlay, onOverlayUpdated: onOverlayUpdated })).user;
                         return [4 /*yield*/, user.click(react_2.screen.getByLabelText('Clear area'))];
                     case 1:
                         _a.sent();
@@ -630,7 +807,7 @@ describe('ReltioMap tests', function () {
     });
     describe('"Search when I move the map" behavior', function () {
         it('should call props.onMapBoundsChanged with current map bounds and reset drawingMode on change isSearchOnMapMove(true)', function () { return __awaiter(void 0, void 0, void 0, function () {
-            var onMapBoundsChanged, mapBoundsPolygon, user;
+            var onMapBoundsChanged, mapBoundsPolygon, user, mapMock;
             return __generator(this, function (_a) {
                 switch (_a.label) {
                     case 0:
@@ -639,39 +816,57 @@ describe('ReltioMap tests', function () {
                             [1, 2],
                             [3, 4]
                         ];
-                        user = setUp(__assign(__assign({}, defaultProps), { onMapBoundsChanged: onMapBoundsChanged, drawingModes: [constants_1.MAP_DRAWING_MODES.POLYGON] })).user;
+                        user = setUp(__assign(__assign({}, defaultProps), { onMapBoundsChanged: onMapBoundsChanged, enablePolygonDrawing: true })).user;
                         jest.spyOn(helpers, 'getMapBoundsPolygon').mockImplementation(function () { return mapBoundsPolygon; });
-                        return [4 /*yield*/, user.click(react_2.screen.getByLabelText('Draw area'))];
+                        return [4 /*yield*/, (0, react_2.waitFor)(function () { return getLastInstance(jest_mocks_1.Map); })];
                     case 1:
+                        mapMock = _a.sent();
+                        return [4 /*yield*/, user.click(react_2.screen.getByLabelText('Draw area'))];
+                    case 2:
                         _a.sent();
-                        expect(drawingManagerConstructorSpy).toHaveBeenCalledWith(expect.objectContaining({ drawingMode: constants_1.MAP_DRAWING_MODES.POLYGON }));
+                        expect(mapMock.setOptions).toHaveBeenCalledWith(expect.objectContaining({
+                            draggableCursor: usePolygonDrawing_1.MAP_DRAWING_CROSSHAIR_CURSOR
+                        }));
+                        expect(mapMock.setOptions).toHaveBeenCalledWith(expect.objectContaining({
+                            disableDoubleClickZoom: true,
+                            clickableIcons: false
+                        }));
                         return [4 /*yield*/, user.click(react_2.screen.getByText('Search as I move the map'))];
-                    case 2:
+                    case 3:
                         _a.sent();
-                        expect(drawingManagerConstructorSpy).toHaveBeenCalledWith(expect.objectContaining({ drawingMode: null }));
+                        expect(mapMock.setOptions).toHaveBeenCalledWith(expect.objectContaining({ disableDoubleClickZoom: false }));
                         expect(onMapBoundsChanged).toHaveBeenCalledWith(mapBoundsPolygon);
                         return [2 /*return*/];
                 }
             });
         }); });
         it('should call props.onMapBoundsChanged with null on change isSearchOnMapMove(false)', function () { return __awaiter(void 0, void 0, void 0, function () {
-            var onMapBoundsChanged, user;
+            var onMapBoundsChanged, user, mapMock;
             return __generator(this, function (_a) {
                 switch (_a.label) {
                     case 0:
                         onMapBoundsChanged = jest.fn();
-                        user = setUp(__assign(__assign({}, defaultProps), { onMapBoundsChanged: onMapBoundsChanged, drawingModes: [constants_1.MAP_DRAWING_MODES.POLYGON] })).user;
-                        return [4 /*yield*/, user.click(react_2.screen.getByLabelText('Draw area'))];
+                        user = setUp(__assign(__assign({}, defaultProps), { onMapBoundsChanged: onMapBoundsChanged, enablePolygonDrawing: true })).user;
+                        return [4 /*yield*/, (0, react_2.waitFor)(function () { return getLastInstance(jest_mocks_1.Map); })];
                     case 1:
-                        _a.sent();
-                        expect(drawingManagerConstructorSpy).toHaveBeenCalledWith(expect.objectContaining({ drawingMode: constants_1.MAP_DRAWING_MODES.POLYGON }));
-                        return [4 /*yield*/, user.click(react_2.screen.getByText('Search as I move the map'))];
+                        mapMock = _a.sent();
+                        return [4 /*yield*/, user.click(react_2.screen.getByLabelText('Draw area'))];
                     case 2:
                         _a.sent();
+                        expect(mapMock.setOptions).toHaveBeenCalledWith(expect.objectContaining({
+                            draggableCursor: usePolygonDrawing_1.MAP_DRAWING_CROSSHAIR_CURSOR
+                        }));
+                        expect(mapMock.setOptions).toHaveBeenCalledWith(expect.objectContaining({
+                            disableDoubleClickZoom: true,
+                            clickableIcons: false
+                        }));
                         return [4 /*yield*/, user.click(react_2.screen.getByText('Search as I move the map'))];
                     case 3:
                         _a.sent();
-                        expect(drawingManagerConstructorSpy).toHaveBeenCalledWith(expect.objectContaining({ drawingMode: null }));
+                        return [4 /*yield*/, user.click(react_2.screen.getByText('Search as I move the map'))];
+                    case 4:
+                        _a.sent();
+                        expect(mapMock.setOptions).toHaveBeenCalledWith(expect.objectContaining({ disableDoubleClickZoom: false }));
                         expect(onMapBoundsChanged).toHaveBeenCalledWith(null);
                         return [2 /*return*/];
                 }
@@ -684,7 +879,7 @@ describe('ReltioMap tests', function () {
                 [1, 2],
                 [3, 4]
             ];
-            setUp(__assign(__assign({}, defaultProps), { onMapBoundsChanged: onMapBoundsChanged, drawingModes: [constants_1.MAP_DRAWING_MODES.POLYGON], isSearchOnMapMove: true }));
+            setUp(__assign(__assign({}, defaultProps), { onMapBoundsChanged: onMapBoundsChanged, enablePolygonDrawing: true, isSearchOnMapMove: true }));
             jest.spyOn(helpers, 'getMapBoundsPolygon').mockImplementation(function () { return mapBoundsPolygon; });
             expect(react_2.screen.getByLabelText('Search as I move the map').checked).toBe(true);
             expect(onMapBoundsChanged).not.toHaveBeenCalled();
@@ -701,7 +896,7 @@ describe('ReltioMap tests', function () {
                 [1, 2],
                 [3, 4]
             ];
-            setUp(__assign(__assign({}, defaultProps), { onMapBoundsChanged: onMapBoundsChanged, drawingModes: [constants_1.MAP_DRAWING_MODES.POLYGON], isSearchOnMapMove: true }));
+            setUp(__assign(__assign({}, defaultProps), { onMapBoundsChanged: onMapBoundsChanged, enablePolygonDrawing: true, isSearchOnMapMove: true }));
             jest.spyOn(helpers, 'getMapBoundsPolygon').mockImplementation(function () { return mapBoundsPolygon; });
             expect(react_2.screen.getByLabelText('Search as I move the map').checked).toBe(true);
             var mapMock = getLastInstance(jest_mocks_1.Map);
@@ -719,7 +914,7 @@ describe('ReltioMap tests', function () {
         it('should not call props.onMapBoundsChanged on google map idle if "Search when I move the map" mode is off', function () {
             jest.useFakeTimers();
             var onMapBoundsChanged = jest.fn();
-            setUp(__assign(__assign({}, defaultProps), { onMapBoundsChanged: onMapBoundsChanged, drawingModes: [constants_1.MAP_DRAWING_MODES.POLYGON], isSearchOnMapMove: false }));
+            setUp(__assign(__assign({}, defaultProps), { onMapBoundsChanged: onMapBoundsChanged, enablePolygonDrawing: true, isSearchOnMapMove: false }));
             expect(react_2.screen.getByLabelText('Search as I move the map').checked).toBe(false);
             getEventHandler(getLastInstance(jest_mocks_1.Map), 'idle')();
             jest.runOnlyPendingTimers();