The WebMap class is an ES 6 class that implements the customized built-in #lt;map#gt; element. The WebMap implementation is similar to the implementation of MapViewer class, with differences arising for a couple of reasons.<br/><br/>First, the class implements a customized built-in element (#lt;map#gt;), which does not permit the creation of a shadow root in which to store DOM content. Consequently, the class creates a child #lt;div#gt; element in the #lt;map#gt;, to which it attaches a shadow root. The map content is added as descendants of the shadow root.<br/>
The WebMap module defines the WebMap symbol as an ES 6 class, and imports the MapLayer and MapArea symbols. It then registers the WebMap and MapArea as custom built-in elements, and the MapLayer as an autonomous custom element, using the browser customElements.define interface method:
I believe that as a result of the registration of the <layer-> element by this module AND by the MapViewer module, it is not possible to use both the <map is="web-map"> and <mapml-viewer> elements on a single page.
It MIGHT be possible to de-duplicate, but it might not be worth the effort to do so. It also might not be possible to de-duplicate, due to some reason I can't think of right here without trying it. The different locations of the shadow root in <map> and <mapml-viewer> comes to mind as the central concern.