From ace460b5001e3efc9d1523fc1cdfb5a054df0b63 Mon Sep 17 00:00:00 2001 From: Anshpreet Date: Thu, 25 Nov 2021 19:27:47 -0500 Subject: [PATCH 1/5] focus on layer menu item/link if remove button clicked --- src/mapml/layers/MapLayer.js | 15 +++++++++++++++ 1 file changed, 15 insertions(+) diff --git a/src/mapml/layers/MapLayer.js b/src/mapml/layers/MapLayer.js index 11777521e..5c442b085 100644 --- a/src/mapml/layers/MapLayer.js +++ b/src/mapml/layers/MapLayer.js @@ -425,7 +425,22 @@ export var MapMLLayer = L.Layer.extend({ //L.DomEvent.disableClickPropagation(removeControlButton); L.DomEvent.on(removeControlButton, 'click', L.DomEvent.stop); L.DomEvent.on(removeControlButton, 'click', (e)=>{ + let fieldset = 0, elem; + if(e.target.closest("fieldset").nextElementSibling){ + elem = e.target.closest("fieldset").previousElementSibling; + while(elem){ + fieldset += 2; // find the next layer menu item + elem = elem.previousElementSibling; + } + } else { + // focus on the link + elem = document.getElementsByTagName('mapml-viewer')[0].shadowRoot.querySelector(".leaflet-control-attribution").firstElementChild; + } mapEl.removeChild(e.target.closest("fieldset").querySelector("span").layer._layerEl); + if(elem === null){ + elem = document.body.getElementsByTagName('mapml-viewer')[0].shadowRoot.querySelectorAll('input')[fieldset]; + } + if(elem) setTimeout(() => elem.focus(), 800); // a timeout is set so "pressed remove layer" is announced first }, this); let itemSettingControlButton = L.DomUtil.create('button', 'mapml-layer-item-settings-control', layerItemControls); From 1ad4106f9281285937fba9cf53a7aa7a3a14349a Mon Sep 17 00:00:00 2001 From: Anshpreet Date: Fri, 26 Nov 2021 10:27:28 -0500 Subject: [PATCH 2/5] fixed getting the shadow root --- src/mapml/layers/MapLayer.js | 10 +++++++--- 1 file changed, 7 insertions(+), 3 deletions(-) diff --git a/src/mapml/layers/MapLayer.js b/src/mapml/layers/MapLayer.js index 5c442b085..8dfacab7a 100644 --- a/src/mapml/layers/MapLayer.js +++ b/src/mapml/layers/MapLayer.js @@ -385,6 +385,9 @@ export var MapMLLayer = L.Layer.extend({ }, getAttribution: function () { return this.options.attribution; + }, + getShadowRoot: function(root){ + }, getLayerUserControlsHTML: function () { var fieldset = L.DomUtil.create('fieldset', 'mapml-layer-item'), @@ -425,7 +428,8 @@ export var MapMLLayer = L.Layer.extend({ //L.DomEvent.disableClickPropagation(removeControlButton); L.DomEvent.on(removeControlButton, 'click', L.DomEvent.stop); L.DomEvent.on(removeControlButton, 'click', (e)=>{ - let fieldset = 0, elem; + let fieldset = 0, elem, root; + root = mapEl.tagName === "MAPML-VIEWER" ? mapEl.shadowRoot : mapEl.querySelector(".mapml-web-map").shadowRoot; if(e.target.closest("fieldset").nextElementSibling){ elem = e.target.closest("fieldset").previousElementSibling; while(elem){ @@ -434,11 +438,11 @@ export var MapMLLayer = L.Layer.extend({ } } else { // focus on the link - elem = document.getElementsByTagName('mapml-viewer')[0].shadowRoot.querySelector(".leaflet-control-attribution").firstElementChild; + elem = root.querySelector(".leaflet-control-attribution").firstElementChild; } mapEl.removeChild(e.target.closest("fieldset").querySelector("span").layer._layerEl); if(elem === null){ - elem = document.body.getElementsByTagName('mapml-viewer')[0].shadowRoot.querySelectorAll('input')[fieldset]; + elem = root.querySelectorAll('input')[fieldset]; } if(elem) setTimeout(() => elem.focus(), 800); // a timeout is set so "pressed remove layer" is announced first }, this); From 9054f7ce1686e6f71072db9e4a684a2a942b911d Mon Sep 17 00:00:00 2001 From: Anshpreet Date: Fri, 26 Nov 2021 10:33:21 -0500 Subject: [PATCH 3/5] removed unused function --- src/mapml/layers/MapLayer.js | 3 --- 1 file changed, 3 deletions(-) diff --git a/src/mapml/layers/MapLayer.js b/src/mapml/layers/MapLayer.js index 8dfacab7a..c2d1784d2 100644 --- a/src/mapml/layers/MapLayer.js +++ b/src/mapml/layers/MapLayer.js @@ -385,9 +385,6 @@ export var MapMLLayer = L.Layer.extend({ }, getAttribution: function () { return this.options.attribution; - }, - getShadowRoot: function(root){ - }, getLayerUserControlsHTML: function () { var fieldset = L.DomUtil.create('fieldset', 'mapml-layer-item'), From ba78c6c9899e36dfea4587532444d3f9c172811e Mon Sep 17 00:00:00 2001 From: Anshpreet Date: Fri, 26 Nov 2021 11:05:33 -0500 Subject: [PATCH 4/5] made some fixes --- src/mapml/layers/MapLayer.js | 10 ++++------ 1 file changed, 4 insertions(+), 6 deletions(-) diff --git a/src/mapml/layers/MapLayer.js b/src/mapml/layers/MapLayer.js index c2d1784d2..10cdf5268 100644 --- a/src/mapml/layers/MapLayer.js +++ b/src/mapml/layers/MapLayer.js @@ -427,7 +427,7 @@ export var MapMLLayer = L.Layer.extend({ L.DomEvent.on(removeControlButton, 'click', (e)=>{ let fieldset = 0, elem, root; root = mapEl.tagName === "MAPML-VIEWER" ? mapEl.shadowRoot : mapEl.querySelector(".mapml-web-map").shadowRoot; - if(e.target.closest("fieldset").nextElementSibling){ + if(e.target.closest("fieldset").nextElementSibling && !e.target.closest("fieldset").nextElementSibling.disbaled){ elem = e.target.closest("fieldset").previousElementSibling; while(elem){ fieldset += 2; // find the next layer menu item @@ -435,13 +435,11 @@ export var MapMLLayer = L.Layer.extend({ } } else { // focus on the link - elem = root.querySelector(".leaflet-control-attribution").firstElementChild; + elem = "link"; } mapEl.removeChild(e.target.closest("fieldset").querySelector("span").layer._layerEl); - if(elem === null){ - elem = root.querySelectorAll('input')[fieldset]; - } - if(elem) setTimeout(() => elem.focus(), 800); // a timeout is set so "pressed remove layer" is announced first + elem = elem ? root.querySelector(".leaflet-control-attribution").firstElementChild: elem = root.querySelectorAll('input')[fieldset]; + setTimeout(() => elem.focus(), 800); // a timeout is set so "pressed remove layer" is announced first }, this); let itemSettingControlButton = L.DomUtil.create('button', 'mapml-layer-item-settings-control', layerItemControls); From 80bc73bbcfff831aa8cc5f7a6839e253885deb90 Mon Sep 17 00:00:00 2001 From: Anshpreet Date: Fri, 26 Nov 2021 12:33:26 -0500 Subject: [PATCH 5/5] added timeouts to featureLinks test --- test/e2e/core/featureLinks.test.js | 2 ++ 1 file changed, 2 insertions(+) diff --git a/test/e2e/core/featureLinks.test.js b/test/e2e/core/featureLinks.test.js index c881fae28..684509388 100644 --- a/test/e2e/core/featureLinks.test.js +++ b/test/e2e/core/featureLinks.test.js @@ -25,6 +25,7 @@ describe("Playwright Feature Links Tests", () => { test("Sub-point inplace link adds new layer, parent feature has separate link", async () => { await page.hover(".leaflet-top.leaflet-right"); await page.click("div > div.leaflet-control-container > div.leaflet-top.leaflet-right > div > section > div.leaflet-control-layers-overlays > fieldset:nth-child(2) > div:nth-child(1) > div > button:nth-child(1)"); + await page.waitForTimeout(850); await page.click("body > map"); for(let i = 0; i < 6; i++) { await page.keyboard.press("Tab"); @@ -59,6 +60,7 @@ describe("Playwright Feature Links Tests", () => { test("Main part adds new layer", async () => { await page.hover(".leaflet-top.leaflet-right"); await page.click("div > div.leaflet-control-container > div.leaflet-top.leaflet-right > div > section > div.leaflet-control-layers-overlays > fieldset:nth-child(2) > div:nth-child(1) > div > button:nth-child(1)"); + await page.waitForTimeout(850); await page.click("body > map"); for(let i = 0; i < 5; i++) { await page.keyboard.press("Tab");