@dooboostore/dom-parser 1.0.2 → 1.0.4

package/src/node/elements/HTMLVideoElement.ts

@@ -0,0 +1,11 @@
+import { HTMLElementBase } from './HTMLElementBase';
+import {HTMLElement} from "./HTMLElement";
+
+/**
+ * The **`HTMLVideoElement`** interface provides special properties and methods for manipulating video objects.
+ */
+export class HTMLVideoElement extends HTMLElement {
+  constructor(tagName: string = 'VIDEO', ownerDocument?: any) {
+    super(tagName, ownerDocument);
+  }
+}

package/src/node/elements/MathMLElement.ts

@@ -1,11 +1,12 @@
 import { ElementBase } from './ElementBase';
+import {HTMLElement} from "./HTMLElement";
 
 /**
  * The **`MathMLElement`** class represents the base class for all MathML elements.
  * 
  * [MDN Reference](https://developer.mozilla.org/docs/Web/API/MathMLElement)
  */
-export class MathMLElement extends ElementBase {
+export class MathMLElement extends HTMLElement {
     constructor(tagName: string, ownerDocument?: any) {
         super(tagName.toUpperCase(), ownerDocument);
     }

package/src/node/elements/SVGElement.ts

@@ -1,11 +1,12 @@
 import { ElementBase } from './ElementBase';
+import {HTMLElement} from "./HTMLElement";
 
 /**
  * The **`SVGElement`** class represents the base class for all SVG elements.
  * 
  * [MDN Reference](https://developer.mozilla.org/docs/Web/API/SVGElement)
  */
-export class SVGElement extends ElementBase {
+export class SVGElement extends HTMLElement {
     constructor(tagName: string, ownerDocument?: any) {
         super(tagName, ownerDocument);
     }

package/src/node/elements/index.ts

@@ -1,186 +1,264 @@
 // Base Element interfaces and types
-export { Element, DOMTokenList } from './Element';
-export { HTMLCollection, HTMLCollectionOf } from '../collection';
+// export type { Element, DOMTokenList } from './Element';
+export { HTMLCollectionImp, HTMLCollectionOfImp } from '../collection';
+
 
-// Base Element implementations
-export { ElementBase } from './ElementBase';
-export { HTMLElementBase } from './HTMLElementBase';
-export { HTMLGenericElement } from './HTMLGenericElement';
 
 // Import all element classes
+import { HTMLElement } from './HTMLElement';
+import { ElementBase } from './ElementBase';
+import { HTMLElementBase } from './HTMLElementBase';
 import { HTMLAnchorElement } from './HTMLAnchorElement';
+import { HTMLAreaElement } from './HTMLAreaElement';
+import { HTMLAudioElement } from './HTMLAudioElement';
+import { HTMLBaseElement } from './HTMLBaseElement';
 import { HTMLBodyElement } from './HTMLBodyElement';
-import { HTMLDivElement } from './HTMLDivElement';
-import { HTMLSpanElement } from './HTMLSpanElement';
-import { HTMLPElement } from './HTMLPElement';
-import { HTMLImgElement } from './HTMLImgElement';
 import { HTMLButtonElement } from './HTMLButtonElement';
 import { HTMLCanvasElement } from './HTMLCanvasElement';
-import { HTMLInputElement } from './HTMLInputElement';
+import { HTMLCaptionElement } from './HTMLCaptionElement';
+import { HTMLDataElement } from './HTMLDataElement';
+import { HTMLDataListElement } from './HTMLDataListElement';
+import { HTMLDetailsElement } from './HTMLDetailsElement';
+import { HTMLDialogElement } from './HTMLDialogElement';
+import { HTMLDivElement } from './HTMLDivElement';
+import { HTMLDListElement } from './HTMLDListElement';
+import { HTMLEmbedElement } from './HTMLEmbedElement';
+import { HTMLFieldSetElement } from './HTMLFieldSetElement';
+import { HTMLFormElement } from './HTMLFormElement';
 import { HTMLH1Element } from './HTMLH1Element';
 import { HTMLHeadElement } from './HTMLHeadElement';
+import { HTMLHRElement } from './HTMLHRElement';
 import { HTMLHtmlElement } from './HTMLHtmlElement';
-import { HTMLTitleElement } from './HTMLTitleElement';
+import { HTMLIFrameElement } from './HTMLIFrameElement';
+import { HTMLImgElement } from './HTMLImgElement';
+import { HTMLInputElement } from './HTMLInputElement';
+import { HTMLLabelElement } from './HTMLLabelElement';
+import { HTMLLegendElement } from './HTMLLegendElement';
+import { HTMLLIElement } from './HTMLLIElement';
 import { HTMLLinkElement } from './HTMLLinkElement';
+import { HTMLMapElement } from './HTMLMapElement';
+import { HTMLMetaElement } from './HTMLMetaElement';
+import { HTMLMeterElement } from './HTMLMeterElement';
+import { HTMLModElement } from './HTMLModElement';
+import { HTMLObjectElement } from './HTMLObjectElement';
+import { HTMLOListElement } from './HTMLOListElement';
+import { HTMLOptGroupElement } from './HTMLOptGroupElement';
+import { HTMLOptionElement } from './HTMLOptionElement';
+import { HTMLOutputElement } from './HTMLOutputElement';
+import { HTMLPElement } from './HTMLPElement';
+import { HTMLParamElement } from './HTMLParamElement';
+import { HTMLPictureElement } from './HTMLPictureElement';
+import { HTMLPreElement } from './HTMLPreElement';
+import { HTMLProgressElement } from './HTMLProgressElement';
+import { HTMLQuoteElement } from './HTMLQuoteElement';
 import { HTMLScriptElement } from './HTMLScriptElement';
+import { HTMLSelectElement } from './HTMLSelectElement';
+import { HTMLSlotElement } from './HTMLSlotElement';
+import { HTMLSourceElement } from './HTMLSourceElement';
+import { HTMLSpanElement } from './HTMLSpanElement';
 import { HTMLStyleElement } from './HTMLStyleElement';
-import { HTMLFormElement } from './HTMLFormElement';
 import { HTMLTableElement } from './HTMLTableElement';
-import { HTMLUListElement } from './HTMLUListElement';
-import { HTMLOListElement } from './HTMLOListElement';
-import { HTMLLIElement } from './HTMLLIElement';
-import { SVGElement } from './SVGElement';
-import { SVGCircleElement } from './SVGCircleElement';
-import { SVGRectElement } from './SVGRectElement';
-import { HTMLMetaElement } from './HTMLMetaElement';
+import { HTMLTbodyElement } from './HTMLTbodyElement';
+import { HTMLTdElement } from './HTMLTdElement';
 import { HTMLTemplateElement } from './HTMLTemplateElement';
-import { HTMLTheadElement } from './HTMLTheadElement';
+import { HTMLTextAreaElement } from './HTMLTextAreaElement';
 import { HTMLTfootElement } from './HTMLTfootElement';
-import { HTMLTrElement } from './HTMLTrElement';
-import { HTMLTdElement } from './HTMLTdElement';
+import { HTMLTheadElement } from './HTMLTheadElement';
 import { HTMLThElement } from './HTMLThElement';
-import { HTMLCaptionElement } from './HTMLCaptionElement';
-import { HTMLTbodyElement } from './HTMLTbodyElement';
-import { HTMLEmbedElement } from './HTMLEmbedElement';
-import { HTMLAreaElement } from './HTMLAreaElement';
-import { HTMLBaseElement } from './HTMLBaseElement';
+import { HTMLTimeElement } from './HTMLTimeElement';
+import { HTMLTitleElement } from './HTMLTitleElement';
+import { HTMLTrackElement } from './HTMLTrackElement';
+import { HTMLTrElement } from './HTMLTrElement';
+import { HTMLUListElement } from './HTMLUListElement';
+import { HTMLVideoElement } from './HTMLVideoElement';
 import { MathMLElement } from './MathMLElement';
+import { SVGElement } from './SVGElement';
+import { SVGCircleElement } from './SVGCircleElement';
+import { SVGRectElement } from './SVGRectElement';
 
 // Export all element classes
 export {
-    HTMLAnchorElement,
-    HTMLBodyElement,
-    HTMLDivElement,
-    HTMLHeadElement,
-    HTMLHtmlElement,
-    HTMLSpanElement,
-    HTMLPElement,
-    HTMLImgElement,
-    HTMLButtonElement,
-    HTMLCanvasElement,
-    HTMLInputElement,
-    HTMLH1Element,
-    HTMLTitleElement,
-    HTMLLinkElement,
-    HTMLScriptElement,
-    HTMLStyleElement,
-    HTMLFormElement,
-    HTMLTableElement,
-    HTMLUListElement,
-    HTMLOListElement,
-    HTMLLIElement,
-    SVGElement,
-    SVGCircleElement,
-    SVGRectElement,
-    HTMLMetaElement,
-    HTMLTemplateElement,
-    HTMLTheadElement,
-    HTMLTfootElement,
-    HTMLTrElement,
-    HTMLTdElement,
-    HTMLThElement,
-    HTMLCaptionElement,
-    HTMLTbodyElement,
-    HTMLEmbedElement,
-    HTMLAreaElement,
-    HTMLBaseElement,
-    MathMLElement,
+  ElementBase,
+  HTMLElementBase,
+  HTMLElement,
+  HTMLAnchorElement,
+  HTMLAreaElement,
+  HTMLAudioElement,
+  HTMLBaseElement,
+  HTMLBodyElement,
+  HTMLButtonElement,
+  HTMLCanvasElement,
+  HTMLCaptionElement,
+  HTMLDataElement,
+  HTMLDataListElement,
+  HTMLDetailsElement,
+  HTMLDialogElement,
+  HTMLDivElement,
+  HTMLDListElement,
+  HTMLEmbedElement,
+  HTMLFieldSetElement,
+  HTMLFormElement,
+  HTMLH1Element,
+  HTMLHeadElement,
+  HTMLHRElement,
+  HTMLHtmlElement,
+  HTMLIFrameElement,
+  HTMLImgElement,
+  HTMLInputElement,
+  HTMLLabelElement,
+  HTMLLegendElement,
+  HTMLLIElement,
+  HTMLLinkElement,
+  HTMLMapElement,
+  HTMLMetaElement,
+  HTMLMeterElement,
+  HTMLModElement,
+  HTMLObjectElement,
+  HTMLOListElement,
+  HTMLOptGroupElement,
+  HTMLOptionElement,
+  HTMLOutputElement,
+  HTMLPElement,
+  HTMLParamElement,
+  HTMLPictureElement,
+  HTMLPreElement,
+  HTMLProgressElement,
+  HTMLQuoteElement,
+  HTMLScriptElement,
+  HTMLSelectElement,
+  HTMLSlotElement,
+  HTMLSourceElement,
+  HTMLSpanElement,
+  HTMLStyleElement,
+  HTMLTableElement,
+  HTMLTbodyElement,
+  HTMLTdElement,
+  HTMLTemplateElement,
+  HTMLTextAreaElement,
+  HTMLTfootElement,
+  HTMLTheadElement,
+  HTMLThElement,
+  HTMLTimeElement,
+  HTMLTitleElement,
+  HTMLTrackElement,
+  HTMLTrElement,
+  HTMLUListElement,
+  HTMLVideoElement,
+  MathMLElement,
+  SVGElement,
+  SVGCircleElement,
+  SVGRectElement
 };
 
-// HTML Elements mapping with explicit string keys for proper type inference
+// HTML Elements mapping
 export const htmlElements = {
-    'a': HTMLAnchorElement,
-    'body': HTMLBodyElement,
-    'button': HTMLButtonElement,
-    'canvas': HTMLCanvasElement,
-    'div': HTMLDivElement,
-    'h1': HTMLH1Element,
-    'head': HTMLHeadElement,
-    'html': HTMLHtmlElement,
-    'img': HTMLImgElement,
-    'input': HTMLInputElement,
-    'p': HTMLPElement,
-    'meta': HTMLMetaElement,
-    'span': HTMLSpanElement,
-    'title': HTMLTitleElement,
-    'link': HTMLLinkElement,
-    'script': HTMLScriptElement,
-    'style': HTMLStyleElement,
-    'form': HTMLFormElement,
-    'table': HTMLTableElement,
-    'ul': HTMLUListElement,
-    'ol': HTMLOListElement,
-    'li': HTMLLIElement,
-    'template': HTMLTemplateElement,
-    'thead': HTMLTheadElement,
-    'tfoot': HTMLTfootElement,
-    'tr': HTMLTrElement,
-    'td': HTMLTdElement,
-    'th': HTMLThElement,
-    'caption': HTMLCaptionElement,
-    'tbody': HTMLTbodyElement,
-    'embed': HTMLEmbedElement,
-    'area': HTMLAreaElement,
-    'base': HTMLBaseElement,
+  a: HTMLAnchorElement,
+  area: HTMLAreaElement,
+  audio: HTMLAudioElement,
+  base: HTMLBaseElement,
+  body: HTMLBodyElement,
+  button: HTMLButtonElement,
+  canvas: HTMLCanvasElement,
+  caption: HTMLCaptionElement,
+  data: HTMLDataElement,
+  datalist: HTMLDataListElement,
+  details: HTMLDetailsElement,
+  dialog: HTMLDialogElement,
+  div: HTMLDivElement,
+  dl: HTMLDListElement,
+  embed: HTMLEmbedElement,
+  fieldset: HTMLFieldSetElement,
+  form: HTMLFormElement,
+  h1: HTMLH1Element,
+  head: HTMLHeadElement,
+  hr: HTMLHRElement,
+  html: HTMLHtmlElement,
+  iframe: HTMLIFrameElement,
+  img: HTMLImgElement,
+  input: HTMLInputElement,
+  label: HTMLLabelElement,
+  legend: HTMLLegendElement,
+  li: HTMLLIElement,
+  link: HTMLLinkElement,
+  map: HTMLMapElement,
+  meta: HTMLMetaElement,
+  meter: HTMLMeterElement,
+  del: HTMLModElement,
+  object: HTMLObjectElement,
+  ol: HTMLOListElement,
+  optgroup: HTMLOptGroupElement,
+  option: HTMLOptionElement,
+  output: HTMLOutputElement,
+  p: HTMLPElement,
+  param: HTMLParamElement,
+  picture: HTMLPictureElement,
+  pre: HTMLPreElement,
+  progress: HTMLProgressElement,
+  blockquote: HTMLQuoteElement,
+  script: HTMLScriptElement,
+  select: HTMLSelectElement,
+  slot: HTMLSlotElement,
+  source: HTMLSourceElement,
+  span: HTMLSpanElement,
+  style: HTMLStyleElement,
+  table: HTMLTableElement,
+  tbody: HTMLTbodyElement,
+  td: HTMLTdElement,
+  template: HTMLTemplateElement,
+  textarea: HTMLTextAreaElement,
+  tfoot: HTMLTfootElement,
+  thead: HTMLTheadElement,
+  th: HTMLThElement,
+  time: HTMLTimeElement,
+  title: HTMLTitleElement,
+  track: HTMLTrackElement,
+  tr: HTMLTrElement,
+  ul: HTMLUListElement,
+  video: HTMLVideoElement
 } as const;
 
-// SVG Elements mapping with explicit string keys
 export const svgElements = {
-    'svg': SVGElement,
-    'circle': SVGCircleElement,
-    'rect': SVGRectElement,
+  svg: SVGElement,
+  circle: SVGCircleElement,
+  rect: SVGRectElement
 } as const;
 
-// MathML Elements mapping - all use MathMLElement
 export const mathmlElements = {
-    'annotation': MathMLElement,
-    'annotation-xml': MathMLElement,
-    'maction': MathMLElement,
-    'math': MathMLElement,
-    'merror': MathMLElement,
-    'mfrac': MathMLElement,
-    'mi': MathMLElement,
-    'mmultiscripts': MathMLElement,
-    'mn': MathMLElement,
-    'mo': MathMLElement,
-    'mover': MathMLElement,
-    'mpadded': MathMLElement,
-    'mphantom': MathMLElement,
-    'mprescripts': MathMLElement,
-    'mroot': MathMLElement,
-    'mrow': MathMLElement,
-    'ms': MathMLElement,
-    'mspace': MathMLElement,
-    'msqrt': MathMLElement,
-    'mstyle': MathMLElement,
-    'msub': MathMLElement,
-    'msubsup': MathMLElement,
-    'msup': MathMLElement,
-    'mtable': MathMLElement,
-    'mtd': MathMLElement,
-    'mtext': MathMLElement,
-    'mtr': MathMLElement,
-    'munder': MathMLElement,
-    'munderover': MathMLElement,
-    'semantics': MathMLElement,
+  annotation: MathMLElement,
+  'annotation-xml': MathMLElement,
+  maction: MathMLElement,
+  math: MathMLElement,
+  merror: MathMLElement,
+  mfrac: MathMLElement,
+  mi: MathMLElement,
+  mmultiscripts: MathMLElement,
+  mn: MathMLElement,
+  mo: MathMLElement,
+  mover: MathMLElement,
+  mpadded: MathMLElement,
+  mphantom: MathMLElement,
+  mprescripts: MathMLElement,
+  mroot: MathMLElement,
+  mrow: MathMLElement,
+  ms: MathMLElement,
+  mspace: MathMLElement,
+  msqrt: MathMLElement,
+  mstyle: MathMLElement,
+  msub: MathMLElement,
+  msubsup: MathMLElement,
+  msup: MathMLElement,
+  mtable: MathMLElement,
+  mtd: MathMLElement,
+  mtext: MathMLElement,
+  mtr: MathMLElement,
+  munder: MathMLElement,
+  munderover: MathMLElement,
+  semantics: MathMLElement
 } as const;
 
-// Type-safe tag name mappings - back to the working approach
-export type HTMLElementTagNameMap = {
-    [K in keyof typeof htmlElements]: InstanceType<typeof htmlElements[K]>;
-};
-
-export type SVGElementTagNameMap = {
-    [K in keyof typeof svgElements]: InstanceType<typeof svgElements[K]>;
-};
-
-export type MathMLElementTagNameMap = {
-    [K in keyof typeof mathmlElements]: InstanceType<typeof mathmlElements[K]>;
-};
-
-export interface HTMLElementDeprecatedTagNameMap {
-    // deprecated 태그들
-}
-
-// Type aliases for Document interface compatibility
-export type HTMLImageElement = HTMLImgElement;
+export type HTMLImageElement = HTMLImgElement;
+export type HTMLParagraphElement = HTMLPElement;
+export type HTMLHeadingElement = HTMLH1Element;
+export type HTMLTableSectionElement = HTMLTbodyElement;
+export type HTMLTableCellElement = HTMLTdElement;
+export type HTMLTableRowElement = HTMLTrElement;

package/src/node/index.ts

@@ -1,28 +1,28 @@
 // Core Node interfaces
-export { Node, ELEMENT_NODE, ATTRIBUTE_NODE, TEXT_NODE, CDATA_SECTION_NODE, ENTITY_REFERENCE_NODE, ENTITY_NODE, PROCESSING_INSTRUCTION_NODE, COMMENT_NODE, DOCUMENT_NODE, DOCUMENT_TYPE_NODE, DOCUMENT_FRAGMENT_NODE, NOTATION_NODE, DOCUMENT_POSITION_DISCONNECTED, DOCUMENT_POSITION_PRECEDING, DOCUMENT_POSITION_FOLLOWING, DOCUMENT_POSITION_CONTAINS, DOCUMENT_POSITION_CONTAINED_BY, DOCUMENT_POSITION_IMPLEMENTATION_SPECIFIC } from './Node';
-export { ChildNode } from './ChildNode';
-export { ParentNode } from './ParentNode';
+export { ELEMENT_NODE, ATTRIBUTE_NODE, TEXT_NODE, CDATA_SECTION_NODE, ENTITY_REFERENCE_NODE, ENTITY_NODE, PROCESSING_INSTRUCTION_NODE, COMMENT_NODE, DOCUMENT_NODE, DOCUMENT_TYPE_NODE, DOCUMENT_FRAGMENT_NODE, NOTATION_NODE, DOCUMENT_POSITION_DISCONNECTED, DOCUMENT_POSITION_PRECEDING, DOCUMENT_POSITION_FOLLOWING, DOCUMENT_POSITION_CONTAINS, DOCUMENT_POSITION_CONTAINED_BY, DOCUMENT_POSITION_IMPLEMENTATION_SPECIFIC } from './Node';
 
 // Base implementations
 export { NodeBase } from './NodeBase';
 export { ChildNodeBase } from './ChildNodeBase';
 export { ParentNodeBase } from './ParentNodeBase';
 export { ElementBase } from './elements/ElementBase';
-export { Text } from './Text';
 
 // Document class (concrete implementation)
-export { Document, ElementCreationOptions, DocumentReadyState, DocumentFragment } from './Document';
 
 // Character data interfaces
-export { CharacterData } from './CharacterData';
+// export { CharacterData } from './CharacterData';
 export { Comment } from './Comment';
 
 // Collections
 export { NodeList } from './collection/NodeList';
-export { NodeListOf } from './collection/NodeListOf';
+export { NodeListOfImp } from './collection/NodeListOfImp';
+
+// Traversal
+export { NodeIterator } from './NodeIterator';
+export { TreeWalker } from './TreeWalker';
 
 // Element interfaces (from element directory)
 export * from './elements';
 
 // Options and interfaces
-export { GetRootNodeOptions } from './GetRootNodeOptions';
+export { GetRootNodeOptions } from './GetRootNodeOptions';

package/src/utils/CSSSelector.ts

@@ -1,4 +1,3 @@
-import { Element } from '../node/elements/Element';
 
 /**
  * CSS Selector Parser and Matcher

package/src/window/CustomElementRegistryImp.ts

@@ -0,0 +1,138 @@
+export interface CustomElementRegistration {
+  constructor: any;
+  options?: ElementDefinitionOptions;
+}
+
+export class CustomElementRegistryImp implements CustomElementRegistration {
+  private _definitions = new Map<string, CustomElementRegistration>();
+  private _whenDefinedPromises = new Map<string, { promise: Promise<void>; resolve: () => void }>();
+  private _window: any;
+
+  setWindow(window: any): void {
+    this._window = window;
+  }
+
+  define(name: string, constructor: any, options?: ElementDefinitionOptions): void {
+    if (this._definitions.has(name)) {
+      throw new Error(`Registration failed for '${name}': a device with this name has already been registered.`);
+    }
+
+    // Basic validation of custom element name (must contain a hyphen)
+    if (!name.includes('-')) {
+      throw new Error(`Registration failed for '${name}': the name is not a valid custom element name.`);
+    }
+
+    // Keep registration metadata on constructor so direct `new` calls can infer the proper tag name.
+    // const ctor = constructor as any;
+    // ctor.__domParserTagName = name;
+    // if (options?.extends) {
+    //   ctor.__domParserExtendsTagName = options.extends;
+    // }
+
+    this._definitions.set(name, { constructor, options });
+
+    // Resolve any pending whenDefined promises
+    if (this._whenDefinedPromises.has(name)) {
+      this._whenDefinedPromises.get(name)!.resolve();
+    }
+
+    // Automatically upgrade existing elements in the document
+    if (this._window && this._window.document) {
+      // console.log(`   [CustomElementRegistry] Upgrading document for: ${name}`);
+      this.upgrade(this._window.document);
+    }
+  }
+
+
+  getName(constructor: any): string | undefined {
+    for (const [name, registration] of this._definitions) {
+      if (registration.constructor === constructor) {
+        return name;
+      }
+    }
+    return undefined;
+  }
+
+
+  get(name: string): any | undefined {
+    return this._definitions.get(name)?.constructor;
+  }
+
+  upgrade(root: any): void {
+    if (!root) return;
+
+    const nodesToUpgrade: any[] = [];
+    const walk = (node: any) => {
+      if (node.nodeType === 1) {
+        const tagName = node.tagName.toLowerCase();
+        const isAttr = node.getAttribute('is');
+        const registration = isAttr ? this._definitions.get(isAttr) : this._definitions.get(tagName);
+
+        if (registration) {
+          const isInstance = node instanceof registration.constructor;
+          if (!isInstance) {
+            // console.log(`   [CustomElementRegistry] Found node to upgrade: <${tagName}${isAttr ? ' is="' + isAttr + '"' : ''}>`);
+            nodesToUpgrade.push({ node, registration });
+          }
+        }
+      }
+
+      let child = node.firstChild;
+      while (child) {
+        walk(child);
+        child = child.nextSibling;
+      }
+    };
+
+    walk(root);
+
+    // Perform upgrades after walking to avoid traversal issues
+    for (const { node, registration } of nodesToUpgrade) {
+      const newInstance = new registration.constructor();
+      // Ensure the tag name is preserved if it's an autonomous custom element
+      // or set correctly if it's a customized built-in
+      newInstance._tagName = node.tagName;
+      newInstance.nodeName = node.tagName;
+
+      // Copy attributes
+      if (node.attributes) {
+        for (let i = 0; i < node.attributes.length; i++) {
+          const attr = node.attributes.item(i);
+          if (attr) {
+            newInstance.setAttribute(attr.name, attr.value);
+          }
+        }
+      }
+
+      // Move children
+      while (node.firstChild) {
+        newInstance.appendChild(node.firstChild);
+      }
+
+      // Replace in parent
+      if (node.parentNode) {
+        node.parentNode.replaceChild(newInstance, node);
+      }
+    }
+  }
+
+  whenDefined(name: string): Promise<void> {
+    if (this._definitions.has(name)) {
+      return Promise.resolve();
+    }
+
+    if (!this._whenDefinedPromises.has(name)) {
+      let resolve!: () => void;
+      const promise = new Promise<void>(r => {
+        resolve = r;
+      });
+      this._whenDefinedPromises.set(name, { promise, resolve });
+    }
+
+    return this._whenDefinedPromises.get(name)!.promise;
+  }
+}
+
+export interface ElementDefinitionOptions {
+  extends?: string;
+}