From 60c002f94a80ef03a91edcd5c8d6019a59a07cd0 Mon Sep 17 00:00:00 2001 From: Yohan Boniface Date: Wed, 29 Nov 2023 16:32:22 +0100 Subject: [PATCH 1/3] Call commitDrawing instead of stopDrawing on ESC fix #1428 --- umap/static/umap/js/umap.js | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/umap/static/umap/js/umap.js b/umap/static/umap/js/umap.js index 48944b51..2bf4737a 100644 --- a/umap/static/umap/js/umap.js +++ b/umap/static/umap/js/umap.js @@ -559,7 +559,7 @@ L.U.Map.include({ this.help.show('edit') } if (e.keyCode === L.U.Keys.ESC) { - if (this.editEnabled) this.editTools.stopDrawing() + if (this.editEnabled) this.editTools.commitDrawing() if (this.measureTools.enabled()) this.measureTools.stopDrawing() } } From 64e90bb4c143302c85973d5030c04da93992666e Mon Sep 17 00:00:00 2001 From: Yohan Boniface Date: Wed, 29 Nov 2023 17:26:01 +0100 Subject: [PATCH 2/3] Add integrations tests covering basic line creation --- umap/tests/integration/test_drawing.py | 69 ++++++++++++++++++++++++++ 1 file changed, 69 insertions(+) create mode 100644 umap/tests/integration/test_drawing.py diff --git a/umap/tests/integration/test_drawing.py b/umap/tests/integration/test_drawing.py new file mode 100644 index 00000000..65f6f6cd --- /dev/null +++ b/umap/tests/integration/test_drawing.py @@ -0,0 +1,69 @@ +from playwright.sync_api import expect + + +def test_draw_polyline(page, live_server, tilelayer): + page.goto(f"{live_server.url}/en/map/new/") + + # Click on the Draw a line button on a new map. + create_line = page.locator(".leaflet-control-toolbar ").get_by_title( + "Draw a polyline (Ctrl+L)" + ) + create_line.click() + + # Check no line is present by default. + # We target with the color, because there is also the drawing line guide (dash-array) + # around + lines = page.locator(".leaflet-overlay-pane path[stroke='DarkBlue']") + guide = page.locator(".leaflet-overlay-pane > svg > g > path") + expect(lines).to_have_count(0) + expect(guide).to_have_count(0) + + # Click on the map, it will create a line. + map = page.locator("#map") + map.click(position={"x": 200, "y": 200}) + expect(lines).to_have_count(1) + expect(guide).to_have_count(1) + map.click(position={"x": 100, "y": 200}) + expect(lines).to_have_count(1) + expect(guide).to_have_count(1) + map.click(position={"x": 100, "y": 100}) + expect(lines).to_have_count(1) + expect(guide).to_have_count(1) + # Click again to finish + map.click(position={"x": 100, "y": 100}) + expect(lines).to_have_count(1) + expect(guide).to_have_count(0) + + +def test_clicking_esc_should_finish_line(page, live_server, tilelayer): + page.goto(f"{live_server.url}/en/map/new/") + + # Click on the Draw a line button on a new map. + create_line = page.locator(".leaflet-control-toolbar ").get_by_title( + "Draw a polyline (Ctrl+L)" + ) + create_line.click() + + # Check no line is present by default. + # We target with the color, because there is also the drawing line guide (dash-array) + # around + lines = page.locator(".leaflet-overlay-pane path[stroke='DarkBlue']") + guide = page.locator(".leaflet-overlay-pane > svg > g > path") + expect(lines).to_have_count(0) + expect(guide).to_have_count(0) + + # Click on the map, it will create a line. + map = page.locator("#map") + map.click(position={"x": 200, "y": 200}) + expect(lines).to_have_count(1) + expect(guide).to_have_count(1) + map.click(position={"x": 100, "y": 200}) + expect(lines).to_have_count(1) + expect(guide).to_have_count(1) + map.click(position={"x": 100, "y": 100}) + expect(lines).to_have_count(1) + expect(guide).to_have_count(1) + # Click ESC to finish + page.keyboard.press("Escape") + expect(lines).to_have_count(1) + expect(guide).to_have_count(0) From 7591031e638ab033f67c00b9da6901c5ebc0e0e1 Mon Sep 17 00:00:00 2001 From: Yohan Boniface Date: Wed, 29 Nov 2023 17:34:12 +0100 Subject: [PATCH 3/3] Add integration tests covering basic polygon drawing --- umap/static/umap/js/umap.controls.js | 2 +- umap/tests/integration/test_drawing.py | 68 ++++++++++++++++++++++++++ 2 files changed, 69 insertions(+), 1 deletion(-) diff --git a/umap/static/umap/js/umap.controls.js b/umap/static/umap/js/umap.controls.js index da5da285..b905e13f 100644 --- a/umap/static/umap/js/umap.controls.js +++ b/umap/static/umap/js/umap.controls.js @@ -108,7 +108,7 @@ L.U.DrawPolygonAction = L.U.BaseAction.extend({ options: { helpMenu: true, className: 'umap-draw-polygon dark', - tooltip: `${L._('Draw a polygone')} (Ctrl+P)`, + tooltip: `${L._('Draw a polygon')} (Ctrl+P)`, }, addHooks: function () { diff --git a/umap/tests/integration/test_drawing.py b/umap/tests/integration/test_drawing.py index 65f6f6cd..67c6618a 100644 --- a/umap/tests/integration/test_drawing.py +++ b/umap/tests/integration/test_drawing.py @@ -67,3 +67,71 @@ def test_clicking_esc_should_finish_line(page, live_server, tilelayer): page.keyboard.press("Escape") expect(lines).to_have_count(1) expect(guide).to_have_count(0) + + +def test_draw_polygon(page, live_server, tilelayer): + page.goto(f"{live_server.url}/en/map/new/") + + # Click on the Draw a polygon button on a new map. + create_line = page.locator(".leaflet-control-toolbar ").get_by_title( + "Draw a polygon (Ctrl+P)" + ) + create_line.click() + + # Check no polygon is present by default. + # We target with the color, because there is also the drawing line guide (dash-array) + # around + lines = page.locator(".leaflet-overlay-pane path[stroke='DarkBlue']") + guide = page.locator(".leaflet-overlay-pane > svg > g > path") + expect(lines).to_have_count(0) + expect(guide).to_have_count(0) + + # Click on the map, it will create a polygon. + map = page.locator("#map") + map.click(position={"x": 200, "y": 200}) + expect(lines).to_have_count(1) + expect(guide).to_have_count(1) + map.click(position={"x": 100, "y": 200}) + expect(lines).to_have_count(1) + expect(guide).to_have_count(2) + map.click(position={"x": 100, "y": 100}) + expect(lines).to_have_count(1) + expect(guide).to_have_count(2) + # Click again to finish + map.click(position={"x": 100, "y": 100}) + expect(lines).to_have_count(1) + expect(guide).to_have_count(0) + + +def test_clicking_esc_should_finish_polygon(page, live_server, tilelayer): + page.goto(f"{live_server.url}/en/map/new/") + + # Click on the Draw a polygon button on a new map. + create_line = page.locator(".leaflet-control-toolbar ").get_by_title( + "Draw a polygon (Ctrl+P)" + ) + create_line.click() + + # Check no polygon is present by default. + # We target with the color, because there is also the drawing line guide (dash-array) + # around + lines = page.locator(".leaflet-overlay-pane path[stroke='DarkBlue']") + guide = page.locator(".leaflet-overlay-pane > svg > g > path") + expect(lines).to_have_count(0) + expect(guide).to_have_count(0) + + # Click on the map, it will create a polygon. + map = page.locator("#map") + map.click(position={"x": 200, "y": 200}) + expect(lines).to_have_count(1) + expect(guide).to_have_count(1) + map.click(position={"x": 100, "y": 200}) + expect(lines).to_have_count(1) + expect(guide).to_have_count(2) + map.click(position={"x": 100, "y": 100}) + expect(lines).to_have_count(1) + expect(guide).to_have_count(2) + # Click ESC to finish + page.keyboard.press("Escape") + expect(lines).to_have_count(1) + expect(guide).to_have_count(0)