@remote-dom/polyfill 1.3.1 → 1.4.1

package/source/Node.ts

@@ -8,6 +8,7 @@ import {
   NamespaceURI,
   NodeType,
   HOOKS,
+  IS_CONNECTED,
 } from './constants.ts';
 import type {Document} from './Document.ts';
 import type {ParentNode} from './ParentNode.ts';
@@ -17,6 +18,7 @@ import {
   isParentNode,
   isTextNode,
   cloneNode,
+  descendants,
 } from './shared.ts';
 
 export class Node extends EventTarget {
@@ -28,6 +30,7 @@ export class Node extends EventTarget {
   [CHILD]: Node | null = null;
   [PREV]: Node | null = null;
   [NEXT]: Node | null = null;
+  [IS_CONNECTED] = false;
 
   protected get [HOOKS]() {
     return this[OWNER_DOCUMENT].defaultView[HOOKS];
@@ -45,6 +48,10 @@ export class Node extends EventTarget {
     return this[OWNER_DOCUMENT];
   }
 
+  get isConnected() {
+    return this[IS_CONNECTED];
+  }
+
   isDefaultNamespace(namespace: string) {
     return namespace === NamespaceURI.XHTML;
   }
@@ -55,6 +62,14 @@ export class Node extends EventTarget {
 
   set parentNode(_readonly) {}
 
+  get parentElement(): ParentNode | null {
+    const parent = this[PARENT];
+    if (!parent || parent.nodeType !== 1) return null;
+    return parent;
+  }
+
+  set parentElement(_readonly) {}
+
   get previousSibling() {
     return this[PREV];
   }
@@ -113,17 +128,13 @@ export class Node extends EventTarget {
   get textContent(): string | null {
     if (isCharacterData(this)) return this.data;
     let text = '';
-    function walk(node: Node) {
+
+    for (const node of descendants(this)) {
       if (isTextNode(node)) {
         text += node.data;
       }
-      const child = node[CHILD];
-      if (child) walk(child);
-      const sibling = node[NEXT];
-      if (sibling) walk(sibling);
     }
-    const child = this[CHILD];
-    if (child) walk(child);
+
     return text;
   }
 

package/source/ParentNode.ts

@@ -6,11 +6,13 @@ import {
   OWNER_DOCUMENT,
   NodeType,
   HOOKS,
+  IS_CONNECTED,
 } from './constants.ts';
 import type {Node} from './Node.ts';
 import {ChildNode, toNode} from './ChildNode.ts';
 import {NodeList} from './NodeList.ts';
 import {querySelectorAll, querySelector} from './selectors.ts';
+import {selfAndDescendants} from './shared.ts';
 
 export class ParentNode extends ChildNode {
   readonly childNodes = new NodeList();
@@ -66,8 +68,20 @@ export class ParentNode extends ChildNode {
       children.splice(children.indexOf(child), 1);
     }
 
-    (child as any).disconnectedCallback?.();
-    this[HOOKS].removeChild?.(this as any, child as any, childNodesIndex);
+    child[PARENT] = null;
+    child[NEXT] = null;
+    child[PREV] = null;
+
+    if (this[IS_CONNECTED]) {
+      for (const node of selfAndDescendants(child)) {
+        node[IS_CONNECTED] = false;
+        (node as any).disconnectedCallback?.();
+      }
+    }
+
+    if (this.nodeType === NodeType.ELEMENT_NODE) {
+      this[HOOKS].removeChild?.(this as any, child as any, childNodesIndex);
+    }
   }
 
   replaceChild(newChild: Node, oldChild: Node) {
@@ -154,7 +168,15 @@ export class ParentNode extends ChildNode {
       if (isElement) this.children.push(child);
     }
 
-    (child as any).connectedCallback?.();
-    this[HOOKS].insertChild?.(this as any, child as any, insertIndex);
+    if (this[IS_CONNECTED]) {
+      for (const node of selfAndDescendants(child)) {
+        node[IS_CONNECTED] = true;
+        (node as any).connectedCallback?.();
+      }
+    }
+
+    if (this.nodeType === NodeType.ELEMENT_NODE) {
+      this[HOOKS].insertChild?.(this as any, child as any, insertIndex);
+    }
   }
 }

package/source/Window.ts

@@ -21,6 +21,7 @@ import type {Hooks} from './hooks.ts';
 export class Window extends EventTarget {
   [HOOKS]: Partial<Hooks> = {};
   name = '';
+  window = this;
   parent = this;
   self = this;
   top = this;
@@ -46,32 +47,18 @@ export class Window extends EventTarget {
   MutationObserver = MutationObserver;
 
   static setGlobal(window: Window) {
-    const properties = Object.getOwnPropertyDescriptors(window);
-
-    delete (properties as any).self;
+    for (const property in window) {
+      if ((window as any)[property] === window) {
+        (window as any)[property] = globalThis;
+      }
+    }
 
-    Object.defineProperties(globalThis, {
-      ...properties,
-      window: {
-        value: window,
-        configurable: true,
-        writable: true,
-        enumerable: true,
-      },
-    });
+    const eventTargetPrototypeProperties = Object.getOwnPropertyDescriptors(
+      EventTarget.prototype,
+    );
+    const properties = Object.getOwnPropertyDescriptors(window);
 
-    if (typeof self === 'undefined') {
-      Object.defineProperty(globalThis, 'self', {
-        value: window,
-        configurable: true,
-        writable: true,
-        enumerable: true,
-      });
-    } else {
-      // There can already be a `self`, like when polyfilling the DOM
-      // in a Web Worker. In those cases, just mirror all the `Window`
-      // properties onto `self`, rather than wholly redefining it.
-      Object.defineProperties(self, properties);
-    }
+    Object.defineProperties(globalThis, eventTargetPrototypeProperties);
+    Object.defineProperties(globalThis, properties);
   }
 }

package/source/constants.ts

@@ -16,6 +16,7 @@ export const PATH = Symbol('path');
 export const STOP_IMMEDIATE_PROPAGATION = Symbol('stop_immediate_propagation');
 export const CONTENT = Symbol('content');
 export const HOOKS = Symbol('hooks');
+export const IS_CONNECTED = Symbol('is_connected');
 
 // @TODO remove explicit values
 export const enum NodeType {

package/source/shared.ts

@@ -1,4 +1,11 @@
-import {DATA, OWNER_DOCUMENT, ATTRIBUTES, NodeType} from './constants.ts';
+import {
+  DATA,
+  OWNER_DOCUMENT,
+  ATTRIBUTES,
+  NodeType,
+  CHILD,
+  NEXT,
+} from './constants.ts';
 import type {Document} from './Document.ts';
 import type {DocumentFragment} from './DocumentFragment.ts';
 import type {Node} from './Node.ts';
@@ -78,3 +85,23 @@ export function cloneNode(
     return cloned;
   }
 }
+
+export function descendants(node: Node) {
+  const nodes: Node[] = [];
+  const walk = (node: Node) => {
+    nodes.push(node);
+    const child = node[CHILD];
+    if (child) walk(child);
+    const sibling = node[NEXT];
+    if (sibling) walk(sibling);
+  };
+  const child = node[CHILD];
+  if (child) walk(child);
+  return nodes;
+}
+
+export function selfAndDescendants(node: Node) {
+  const nodes = descendants(node);
+  nodes.unshift(node);
+  return nodes;
+}