-
Notifications
You must be signed in to change notification settings - Fork 16
Commit
This commit does not belong to any branch on this repository, and may belong to a fork outside of the repository.
* Fix issue #935 * Add test / test data for map-extent issue. Closes #935 * Fix Layer reordering bug. closes #955 Update LayerControl._layers object which was being neglected and not being updated. Added a line to properly sort the layerControl based on the MapML Layer zIndex. * Update call to sortFunction in copied / locally modified LayerControl. _update function to use the options.sortFunction if present. tbd: if this should be offered via PR to upstream project. * Add test for re-order bug #955 --------- Co-authored-by: AliyanH <[email protected]>
- Loading branch information
1 parent
263d14a
commit d2f7bec
Showing
9 changed files
with
341 additions
and
27 deletions.
There are no files selected for viewing
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
92 changes: 92 additions & 0 deletions
92
test/e2e/elements/map-extent/map-extent-checked-ordering.test.js
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -0,0 +1,92 @@ | ||
| import { test, expect, chromium } from '@playwright/test'; | ||
|
|
||
| test.describe('map-extent checked order tests', () => { | ||
| let page; | ||
| let context; | ||
| test.beforeAll(async function () { | ||
| context = await chromium.launchPersistentContext('', { slowMo: 500 }); | ||
| page = | ||
| context.pages().find((page) => page.url() === 'about:blank') || | ||
| (await context.newPage()); | ||
| await page.goto('map-extent-checked.html'); | ||
| }); | ||
| test('map-extent layer control order correct when cycling checked state', async () => { | ||
| // Fixed #935 https://github.com/Maps4HTML/Web-Map-Custom-Element/issues/935 | ||
| /* | ||
| Go to this map map-extent-checked.html | ||
| Open the layer control for the layer settings. | ||
| Un-check the imagery layer <map-extent> | ||
| Check the imagery layer <map-extent> | ||
| What should happen: | ||
| The imagery layer <map-extent> should draw underneath the states layer. | ||
| What actually happens: | ||
| The imagery layer <map-extent> draws on top of the states layer. | ||
| * */ | ||
| const layerControl = page.locator('.leaflet-top.leaflet-right'); | ||
| await layerControl.hover(); | ||
| const layerSettings = layerControl.getByTitle('Layer Settings'); | ||
| await layerSettings.click(); | ||
| const imageryExtentCheckbox = layerControl.getByRole('checkbox', { | ||
| name: 'Extent One' | ||
| }); | ||
| await imageryExtentCheckbox.click(); // turn it off | ||
| await imageryExtentCheckbox.click(); // turn it on | ||
| const ext1 = page.getByTestId('ext1'); | ||
| let imageryZIndex = await ext1.evaluate((e) => { | ||
| return +e._extentLayer._container.style.zIndex; | ||
| }); | ||
| expect(imageryZIndex).toEqual(0); | ||
| const ext2 = page.getByTestId('ext2'); | ||
| let statesZIndex = await ext2.evaluate((e) => { | ||
| return +e._extentLayer._container.style.zIndex; | ||
| }); | ||
| expect(statesZIndex).toEqual(1); | ||
| // re-order them via the layer control | ||
| const imageryFieldset = layerControl.getByRole('group', { | ||
| name: 'Extent One' | ||
| }); | ||
| let controlBBox = await imageryFieldset.boundingBox(); | ||
| let from = { | ||
| x: controlBBox.x + controlBBox.width / 2, | ||
| y: controlBBox.y + controlBBox.height / 2 | ||
| }, | ||
| to = { x: from.x, y: from.y + controlBBox.height * 1.1 }; | ||
|
|
||
| await page.mouse.move(from.x, from.y); | ||
| await page.mouse.down(); | ||
| await page.mouse.move(to.x, to.y); | ||
| await page.mouse.up(); | ||
| imageryZIndex = await ext1.evaluate((e) => { | ||
| return +e._extentLayer._container.style.zIndex; | ||
| }); | ||
| expect(imageryZIndex).toEqual(1); | ||
| statesZIndex = await ext2.evaluate((e) => { | ||
| return +e._extentLayer._container.style.zIndex; | ||
| }); | ||
| expect(statesZIndex).toEqual(0); | ||
|
|
||
| await page.mouse.move(from.x, from.y); | ||
| await page.mouse.down(); | ||
| await page.mouse.move(to.x, to.y); | ||
| await page.mouse.up(); | ||
| await imageryExtentCheckbox.click(); // turn it off | ||
| await imageryExtentCheckbox.click(); // turn it on | ||
| imageryZIndex = await ext1.evaluate((e) => { | ||
| return +e._extentLayer._container.style.zIndex; | ||
| }); | ||
| expect(imageryZIndex).toEqual(0); | ||
| statesZIndex = await ext2.evaluate((e) => { | ||
| return +e._extentLayer._container.style.zIndex; | ||
| }); | ||
| expect(statesZIndex).toEqual(1); | ||
| // TO DO re-order them via the DOM (insertAdjacentHTML), | ||
| // ensure that | ||
| // a) render order/z-index is correct | ||
| // b) render order is reflected in layer control order as well | ||
| // see https://github.com/Maps4HTML/Web-Map-Custom-Element/issues/956 | ||
| }); | ||
| }); |
Oops, something went wrong.