Web-Map-Custom-Element
Web-Map-Custom-Element copied to clipboard
Console error messages in the case of ill-formed text/mapml content
A text/mapml document like this:
<mapml- xmlns="http://www.w3.org/1999/xhtml">
<map-head>
<map-title>Prevalence rates of mental health issues in London</map-title>
<map-meta http-equiv="Content-Type" content="text/mapml;projection=OSMTILE"></map-meta>
<map-meta charset="utf-8"></map-meta>
<map-link rel="license" href="" title=""></map-link>
</map-head>
<map-body>
<map-extent units="OSMTILE" checked="checked"></map-extent>
<map-input name="tileMatrix" type="zoom" value="0" min="0" max="18"></map-input>
<map-input name="tileColumn" type="location" units="tilematrix" axis="column"></map-input>
<map-input name="tileRow" type="location" units="tilematrix" axis="row"></map-input>
<map-link rel="tile" tref="http://localhost:5000/collections/grid_mental/tiles/WebMercatorQuad/{tileMatrix}/{tileRow}/{tileCol}?f=png"></map-link>
</map-body>
</mapml->
gives rise to the following error messages:
Uncaught TypeError: this.parentElement is null
connectedCallback map-input.js:262
copyRemoteContentToShadowRoot layer.js:390
_onAdd layer.js:229
promise callback*_onAdd/< layer.js:228
_onAdd layer.js:183
connectedCallback layer.js:175
promise callback*connectedCallback layer.js:173
<anonymous> mapml-viewer.js:1430
3 map-input.js:262:4
connectedCallback map-input.js:262
copyRemoteContentToShadowRoot layer.js:390
_onAdd layer.js:229
(Async: promise callback)
_onAdd layer.js:228
_onAdd layer.js:183
connectedCallback layer.js:175
(Async: promise callback)
connectedCallback layer.js:173
<anonymous> mapml-viewer.js:1430
Maybe it would be possible to give a guess/ clue about what's going on here. The this.parentElement is null line suggests that it might be possible when processing the connectedCallback for an element, that it checks to see that its expected parentage is found and if not it could console log a hint to that effect.