Skip to content

Commit 9a5a03c

Browse files
yushan-muprushforthMu
authored
Closes #319
Ensure layer name is not undefined for pasted content --------- Co-authored-by: Peter Rushforth <[email protected]> Co-authored-by: Mu <[email protected]>
1 parent cc01561 commit 9a5a03c

File tree

3 files changed

+113
-0
lines changed

3 files changed

+113
-0
lines changed

src/mapml/layers/MapMLLayer.js

Lines changed: 2 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -345,6 +345,8 @@ export var MapMLLayer = L.LayerGroup.extend({
345345
layer._titleIsReadOnly = true;
346346
} else if (layer._layerEl && layer._layerEl.hasAttribute('label')) {
347347
layer._title = layer._layerEl.getAttribute('label').trim();
348+
} else {
349+
layer._title = M.options.locale.dfLayer;
348350
}
349351
}
350352
function parseLicenseAndLegend() {

test/e2e/layers/layerLabel.html

Lines changed: 79 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,79 @@
1+
<!doctype html>
2+
<html lang="en">
3+
4+
<head>
5+
<meta charset="utf-8">
6+
<meta name="viewport" content="width=device-width,initial-scale=1">
7+
<title>Layer Control Tests</title>
8+
<script type="module" src="mapml.js"></script>
9+
<style>
10+
html,
11+
body {
12+
height: 100%;
13+
}
14+
15+
* {
16+
margin: 0;
17+
padding: 0;
18+
}
19+
20+
/* Specifying the `:defined` selector is recommended to style the map
21+
element, such that styles don't apply when fallback content is in use
22+
(e.g. when scripting is disabled or when custom/built-in elements isn't
23+
supported in the browser). */
24+
mapml-viewer:defined {
25+
/* Responsive map. */
26+
max-width: 100%;
27+
28+
/* Full viewport. */
29+
width: 100%;
30+
height: 100%;
31+
32+
/* Remove default (native-like) border. */
33+
/* border: none; */
34+
}
35+
36+
/* Pre-style to avoid FOUC of inline layer- and fallback content. */
37+
mapml-viewer:not(:defined)>* {
38+
display: none;
39+
}
40+
41+
/* Ensure inline layer content is hidden if custom/built-in elements isn't
42+
supported, or if javascript is disabled. This needs to be defined separately
43+
from the above, because the `:not(:defined)` selector invalidates the entire
44+
declaration in browsers that do not support it. */
45+
layer- {
46+
display: none;
47+
}
48+
</style>
49+
<noscript>
50+
<style>
51+
/* Ensure fallback content (children of the map element) is displayed if
52+
custom/built-in elements is supported but javascript is disabled. */
53+
mapml-viewer:not(:defined)> :not(layer-) {
54+
display: initial;
55+
}
56+
</style>
57+
</noscript>
58+
</head>
59+
60+
<body>
61+
<mapml-viewer projection="CBMTILE" zoom="3" lat="37.176710163979834" lon="-62.070013924549045" controls>
62+
63+
<!-- Layer without a label -->
64+
<layer- checked>
65+
<map-meta name="projection" content="CBMTILE"></map-meta>
66+
<map-feature zoom="10">
67+
<map-properties>Layer with no label</map-properties>
68+
<map-geometry cs="gcrs">
69+
<map-point>
70+
<map-coordinates>-75.866089 45.463020</map-coordinates>
71+
</map-point>
72+
</map-geometry>
73+
</map-feature>
74+
</layer->
75+
76+
</mapml-viewer>
77+
</body>
78+
79+
</html>

test/e2e/layers/layerLabel.test.js

Lines changed: 32 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,32 @@
1+
import { test, expect, chromium } from '@playwright/test';
2+
3+
test.describe('Layer Label Tests', () => {
4+
let page;
5+
let context;
6+
test.beforeAll(async function () {
7+
context = await chromium.launchPersistentContext('');
8+
page =
9+
context.pages().find((page) => page.url() === 'about:blank') ||
10+
(await context.newPage());
11+
await page.goto('layerLabel.html');
12+
});
13+
14+
test.afterAll(async function () {
15+
await context.close();
16+
});
17+
18+
test('Name of unnamed layer is Layer', async () => {
19+
await page.waitForTimeout(500);
20+
const label = await page
21+
.locator('body > mapml-viewer > layer-')
22+
.evaluate((elem) => elem.label);
23+
expect(label).toEqual('Layer');
24+
});
25+
26+
test('Unnamed layer shows up as Layer in layer control', async () => {
27+
const text = await page
28+
.locator('body > mapml-viewer >> css=div > label.mapml-layer-item-toggle')
29+
.evaluate((text) => text.textContent);
30+
expect(text).toEqual('Layer');
31+
});
32+
});

0 commit comments

Comments
 (0)