@tkeron/html-parser 1.1.2 → 1.3.0

package/src/dom-simulator/create-document.ts

@@ -0,0 +1,81 @@
+import { NodeType } from "./node-types.js";
+import { createElement } from "./create-element.js";
+import { createTextNode } from "./create-text-node.js";
+import {
+  prepend,
+  append,
+  appendChild,
+  removeChild,
+  insertBefore,
+  insertAfter,
+  replaceChild,
+} from "./index.js";
+import { querySelector, querySelectorAll } from "../selectors/index.js";
+
+export const createDocument = (): any => {
+  const document: any = {
+    nodeType: NodeType.DOCUMENT_NODE,
+    nodeName: "#document",
+    nodeValue: null,
+    textContent: "",
+    childNodes: [],
+    parentNode: null,
+    firstChild: null,
+    lastChild: null,
+    nextSibling: null,
+    previousSibling: null,
+    documentElement: null,
+    body: null,
+    head: null,
+
+    createElement(tagName: string): any {
+      return createElement(tagName, {});
+    },
+
+    createTextNode(data: string): any {
+      return createTextNode(data);
+    },
+
+    appendChild(child: any): any {
+      appendChild(document, child);
+      return child;
+    },
+
+    prepend(...nodes: any[]): void {
+      prepend(document, ...nodes);
+    },
+
+    append(...nodes: any[]): void {
+      append(document, ...nodes);
+    },
+
+    removeChild(child: any): any {
+      return removeChild(document, child);
+    },
+
+    insertBefore(newNode: any, referenceNode: any): any {
+      return insertBefore(document, newNode, referenceNode);
+    },
+
+    replaceChild(newChild: any, oldChild: any): any {
+      return replaceChild(document, newChild, oldChild);
+    },
+
+    insertAfter(newNode: any, referenceNode: any): any {
+      return insertAfter(document, newNode, referenceNode);
+    },
+
+    querySelector(selector: string): any {
+      return querySelector(document, selector);
+    },
+
+    querySelectorAll(selector: string): any[] {
+      return querySelectorAll(document, selector);
+    },
+
+    getElementById(id: string): any {
+      return querySelector(document, `#${id}`);
+    },
+  };
+  return document;
+};

package/src/dom-simulator/create-element.ts

@@ -0,0 +1,195 @@
+import { NodeType, VOID_ELEMENTS } from "./node-types.js";
+import { appendChild } from "./append-child.js";
+import { prepend } from "./index.js";
+import { querySelector, querySelectorAll } from "../selectors/index.js";
+import {
+  getTextContent,
+  setInnerHTML,
+  cloneNode,
+  getInnerHTML,
+  setTextContent,
+  setOuterHTML,
+} from "./index.js";
+import {
+  append,
+  remove,
+  insertAfter,
+  replaceChild,
+  insertBefore,
+  removeChild,
+  matches,
+} from "./index.js";
+import { updateElementContent } from "./update-element-content.js";
+
+export const createElement = (
+  tagName: string,
+  attributes: Record<string, string> = {},
+  namespaceURI?: string,
+  isSelfClosing?: boolean,
+): any => {
+  const innerHTML = "";
+  const tagNameLower = tagName.toLowerCase();
+  const isVoid = VOID_ELEMENTS.has(tagNameLower);
+  const attrsStr = Object.entries(attributes)
+    .map(([k, v]) => ` ${k}="${v}"`)
+    .join("");
+  const initialOuterHTML = isVoid
+    ? `<${tagNameLower}${attrsStr}>`
+    : `<${tagNameLower}${attrsStr}></${tagNameLower}>`;
+  const textContent = "";
+
+  const element: any = {
+    nodeType: NodeType.ELEMENT_NODE,
+    nodeName: tagName.toUpperCase(),
+    nodeValue: null,
+    tagName: tagName.toUpperCase(),
+    namespaceURI: namespaceURI || null,
+    isSelfClosing: isSelfClosing || isVoid,
+    attributes: { ...attributes },
+    childNodes: [],
+    children: [],
+    textContent,
+    innerHTML,
+    _internalOuterHTML: initialOuterHTML,
+    parentNode: null,
+    parentElement: null,
+    firstChild: null,
+    lastChild: null,
+    nextSibling: null,
+    previousSibling: null,
+    firstElementChild: null,
+    lastElementChild: null,
+    nextElementSibling: null,
+    previousElementSibling: null,
+
+    appendChild(child: any): any {
+      appendChild(element, child);
+      return child;
+    },
+
+    prepend(...nodes: any[]): void {
+      prepend(element, ...nodes);
+    },
+
+    append(...nodes: any[]): void {
+      append(element, ...nodes);
+    },
+
+    remove(): void {
+      remove(element);
+    },
+
+    removeChild(child: any): any {
+      return removeChild(element, child);
+    },
+
+    insertBefore(newNode: any, referenceNode: any): any {
+      return insertBefore(element, newNode, referenceNode);
+    },
+
+    replaceChild(newChild: any, oldChild: any): any {
+      return replaceChild(element, newChild, oldChild);
+    },
+
+    insertAfter(newNode: any, referenceNode: any): any {
+      return insertAfter(element, newNode, referenceNode);
+    },
+
+    setAttribute(name: string, value: string): void {
+      element.attributes[name] = value;
+      updateElementContent(element);
+    },
+
+    getAttribute(name: string): string | null {
+      return element.attributes[name] || null;
+    },
+
+    hasAttribute(name: string): boolean {
+      return name in element.attributes;
+    },
+
+    removeAttribute(name: string): void {
+      delete element.attributes[name];
+      updateElementContent(element);
+    },
+
+    querySelector(selector: string): any {
+      return querySelector(element, selector);
+    },
+
+    querySelectorAll(selector: string): any[] {
+      return querySelectorAll(element, selector);
+    },
+
+    matches(selector: string): boolean {
+      return matches(element, selector);
+    },
+
+    cloneNode(deep: boolean = false): any {
+      return cloneNode(element, deep);
+    },
+  };
+
+  Object.defineProperty(element, "textContent", {
+    get() {
+      return (element as any)._internalTextContent || getTextContent(element);
+    },
+    set(value: string) {
+      setTextContent(element, value);
+    },
+    enumerable: true,
+    configurable: true,
+  });
+
+  Object.defineProperty(element, "innerHTML", {
+    get() {
+      if (!element._internalInnerHTML) {
+        updateElementContent(element);
+      }
+      return element._internalInnerHTML || getInnerHTML(element);
+    },
+    set(value: string) {
+      setInnerHTML(element, value);
+    },
+    enumerable: true,
+    configurable: true,
+  });
+
+  Object.defineProperty(element, "className", {
+    get() {
+      return element.attributes.class || "";
+    },
+    set(value: string) {
+      element.attributes.class = value;
+    },
+    enumerable: true,
+    configurable: true,
+  });
+
+  Object.defineProperty(element, "id", {
+    get() {
+      return element.attributes.id || "";
+    },
+    set(value: string) {
+      element.attributes.id = value;
+    },
+    enumerable: true,
+    configurable: true,
+  });
+
+  Object.defineProperty(element, "outerHTML", {
+    get() {
+      if (!element._internalOuterHTML) {
+        updateElementContent(element);
+      }
+      return element._internalOuterHTML || "";
+    },
+    set(value: string) {
+      setOuterHTML(element, value);
+    },
+    enumerable: true,
+    configurable: true,
+  });
+
+  return element;
+};

package/src/dom-simulator/create-processing-instruction.ts

@@ -0,0 +1,19 @@
+import { NodeType } from "./node-types.js";
+
+export const createProcessingInstruction = (content: string): any => {
+  const piNode: any = {
+    nodeType: NodeType.PROCESSING_INSTRUCTION_NODE,
+    nodeName: "#processing-instruction",
+    nodeValue: content,
+    textContent: content,
+    data: content,
+    target: content.split(" ")[0] || "",
+    childNodes: [],
+    parentNode: null,
+    firstChild: null,
+    lastChild: null,
+    nextSibling: null,
+    previousSibling: null,
+  };
+  return piNode;
+};

package/src/dom-simulator/create-temp-parent.ts

@@ -0,0 +1,9 @@
+import { createElement } from "./create-element.js";
+
+export const createTempParent = (element: any): any => {
+  const temp = createElement("div");
+  temp.childNodes.push(element);
+  temp.children.push(element);
+  element._tempParent = temp;
+  return temp;
+};

package/src/dom-simulator/create-text-node.ts

@@ -0,0 +1,23 @@
+import { NodeType } from "./node-types.js";
+import { remove } from "./index.js";
+
+export const createTextNode = (content: string): any => {
+  const textNode: any = {
+    nodeType: NodeType.TEXT_NODE,
+    nodeName: "#text",
+    nodeValue: content,
+    textContent: content,
+    data: content,
+    childNodes: [],
+    parentNode: null,
+    firstChild: null,
+    lastChild: null,
+    nextSibling: null,
+    previousSibling: null,
+
+    remove(): void {
+      remove(textNode);
+    },
+  };
+  return textNode;
+};

package/src/dom-simulator/escape-text-content.ts

@@ -0,0 +1,6 @@
+export const escapeTextContent = (text: string): string => {
+  return text
+    .replace(/&/g, "&")
+    .replace(/</g, "&lt;")
+    .replace(/>/g, "&gt;");
+};

package/src/dom-simulator/find-special-elements.ts

@@ -0,0 +1,14 @@
+import { NodeType } from "./node-types.js";
+
+export const findSpecialElements = (document: any, htmlElement: any): void => {
+  for (const child of htmlElement.childNodes) {
+    if (child.nodeType === NodeType.ELEMENT_NODE) {
+      const element = child;
+      if (element.tagName === "BODY") {
+        document.body = element;
+      } else if (element.tagName === "HEAD") {
+        document.head = element;
+      }
+    }
+  }
+};

package/src/dom-simulator/get-text-content.ts

@@ -0,0 +1,18 @@
+import { NodeType } from "./node-types.js";
+
+export const getTextContent = (node: any): string => {
+  if (node.nodeType === NodeType.TEXT_NODE) {
+    return node.textContent || "";
+  }
+  if (
+    node.nodeType !== NodeType.ELEMENT_NODE &&
+    node.nodeType !== NodeType.DOCUMENT_NODE
+  ) {
+    return "";
+  }
+  let textContent = "";
+  for (const child of node.childNodes) {
+    textContent += getTextContent(child);
+  }
+  return textContent;
+};

package/src/dom-simulator/index.ts

@@ -0,0 +1,36 @@
+export { NodeType, VOID_ELEMENTS } from "./node-types.js";
+export { createElement } from "./create-element.js";
+export { createTextNode } from "./create-text-node.js";
+export { createComment } from "./create-comment.js";
+export { createCDATA } from "./create-cdata.js";
+export { createProcessingInstruction } from "./create-processing-instruction.js";
+export { createDoctype } from "./create-doctype.js";
+export { createDocument } from "./create-document.js";
+export { appendChild } from "./append-child.js";
+export { getTextContent } from "./get-text-content.js";
+export { setTextContent } from "./set-text-content.js";
+export {
+  getAttribute,
+  hasAttribute,
+  setAttribute,
+  removeAttribute,
+} from "./attributes.js";
+export {
+  setInnerHTML,
+  setOuterHTML,
+  getInnerHTML,
+} from "./inner-outer-html.js";
+export { cloneNode } from "./clone-node.js";
+export { updateElementContent } from "./update-element-content.js";
+export { prepend } from "./prepend.js";
+export { append } from "./append.js";
+export { remove } from "./remove.js";
+export { insertBefore } from "./insert-before.js";
+export { insertAfter } from "./insert-after.js";
+export { replaceChild } from "./replace-child.js";
+export { removeChild } from "./remove-child.js";
+export { createTempParent } from "./create-temp-parent.js";
+export { escapeTextContent } from "./escape-text-content.js";
+export { findSpecialElements } from "./find-special-elements.js";
+export { convertASTNodeToDOM } from "./convert-ast-node-to-dom.js";
+export { matches } from "./matches.js";

package/src/dom-simulator/inner-outer-html.ts

@@ -0,0 +1,182 @@
+import { NodeType, VOID_ELEMENTS } from "./node-types.js";
+import { tokenize } from "../tokenizer/index.js";
+import { parse } from "../parser/index.js";
+import { appendChild } from "./append-child.js";
+import { getTextContent } from "./get-text-content.js";
+import { escapeTextContent } from "./escape-text-content.js";
+import { updateElementContent } from "./update-element-content.js";
+
+export const setInnerHTML = (element: any, html: string): void => {
+  element.childNodes = [];
+  element.children = [];
+  element.firstChild = null;
+  element.lastChild = null;
+  element.firstElementChild = null;
+  element.lastElementChild = null;
+
+  if (html.trim()) {
+    const wrappedHtml = "<div>" + html + "</div>";
+    const tokens = tokenize(wrappedHtml);
+    const doc = parse(tokens);
+    const div = doc.querySelector("div");
+    if (div && div.childNodes) {
+      const nodesToMove = [...div.childNodes];
+      for (const child of nodesToMove) {
+        child.parentNode = null;
+        appendChild(element, child);
+      }
+    }
+  }
+
+  const actualInnerHTML = getInnerHTML(element);
+  Object.defineProperty(element, "_internalInnerHTML", {
+    value: actualInnerHTML,
+    writable: true,
+    enumerable: false,
+    configurable: true,
+  });
+
+  const textContent = getTextContent(element);
+  Object.defineProperty(element, "_internalTextContent", {
+    value: textContent,
+    writable: true,
+    enumerable: false,
+    configurable: true,
+  });
+
+  const attrs = Object.entries(element.attributes)
+    .map(([k, v]) => ` ${k}="${v}"`)
+    .join("");
+  const tagNameLower = element.tagName.toLowerCase();
+  const isVoid = VOID_ELEMENTS.has(tagNameLower);
+
+  Object.defineProperty(element, "_internalOuterHTML", {
+    value: isVoid
+      ? `<${tagNameLower}${attrs}>`
+      : `<${tagNameLower}${attrs}>${actualInnerHTML}</${tagNameLower}>`,
+    writable: true,
+    enumerable: false,
+    configurable: true,
+  });
+};
+
+export const setOuterHTML = (element: any, html: string): void => {
+  if (!element.parentNode) {
+    throw new Error("Cannot set outerHTML on element without a parent");
+  }
+
+  const parent = element.parentNode;
+  const indexInParent = parent.childNodes.indexOf(element);
+
+  if (indexInParent === -1) {
+    throw new Error("Element not found in parent's childNodes");
+  }
+
+  let newNodes: any[] = [];
+
+  if (html.trim()) {
+    const tokens = tokenize(html);
+    const doc = parse(tokens);
+    const body = doc.body;
+    if (body && body.childNodes) {
+      for (const child of body.childNodes) {
+        child.parentNode = null;
+        newNodes.push(child);
+      }
+    }
+  }
+
+  const previousSibling = element.previousSibling;
+  const nextSibling = element.nextSibling;
+
+  parent.childNodes.splice(indexInParent, 1);
+
+  if (newNodes.length > 0) {
+    parent.childNodes.splice(indexInParent, 0, ...newNodes);
+
+    for (const newNode of newNodes) {
+      newNode.parentNode = parent;
+      newNode.parentElement =
+        parent.nodeType === NodeType.ELEMENT_NODE ? parent : null;
+    }
+
+    for (let i = 0; i < newNodes.length; i++) {
+      const currentNode = newNodes[i];
+
+      if (i === 0) {
+        currentNode.previousSibling = previousSibling;
+        if (previousSibling) {
+          previousSibling.nextSibling = currentNode;
+        }
+      } else {
+        currentNode.previousSibling = newNodes[i - 1];
+      }
+
+      if (i === newNodes.length - 1) {
+        currentNode.nextSibling = nextSibling;
+        if (nextSibling) {
+          nextSibling.previousSibling = currentNode;
+        }
+      } else {
+        currentNode.nextSibling = newNodes[i + 1];
+      }
+    }
+  } else {
+    if (previousSibling) {
+      previousSibling.nextSibling = nextSibling;
+    }
+    if (nextSibling) {
+      nextSibling.previousSibling = previousSibling;
+    }
+  }
+
+  element.parentNode = null;
+  element.parentElement = null;
+  element.previousSibling = null;
+  element.nextSibling = null;
+
+  parent.children = parent.childNodes.filter(
+    (child: any) => child.nodeType === NodeType.ELEMENT_NODE,
+  );
+
+  parent.firstChild =
+    parent.childNodes.length > 0 ? parent.childNodes[0] : null;
+  parent.lastChild =
+    parent.childNodes.length > 0
+      ? parent.childNodes[parent.childNodes.length - 1]
+      : null;
+
+  parent.firstElementChild =
+    parent.children.length > 0 ? parent.children[0] : null;
+  parent.lastElementChild =
+    parent.children.length > 0
+      ? parent.children[parent.children.length - 1]
+      : null;
+
+  for (let i = 0; i < parent.children.length; i++) {
+    const child = parent.children[i];
+    child.previousElementSibling = i > 0 ? parent.children[i - 1] : null;
+    child.nextElementSibling =
+      i < parent.children.length - 1 ? parent.children[i + 1] : null;
+  }
+
+  updateElementContent(parent);
+};
+
+export const getInnerHTML = (element: any): string => {
+  if (element.nodeType !== NodeType.ELEMENT_NODE) {
+    return "";
+  }
+
+  let innerHTML = "";
+  for (const child of element.childNodes) {
+    if (child.nodeType === NodeType.ELEMENT_NODE) {
+      innerHTML += child.outerHTML;
+    } else if (child.nodeType === NodeType.TEXT_NODE) {
+      innerHTML += escapeTextContent(child.textContent || "");
+    } else if (child.nodeType === NodeType.COMMENT_NODE) {
+      innerHTML += `<!--${child.data || ""}-->`;
+    }
+  }
+  return innerHTML;
+};

package/src/dom-simulator/insert-after.ts

@@ -0,0 +1,20 @@
+import { insertBefore } from "./insert-before.js";
+
+export const insertAfter = (
+  parent: any,
+  newNode: any,
+  referenceNode: any,
+): any => {
+  if (referenceNode === null) {
+    insertBefore(parent, newNode, parent.firstChild);
+    return newNode;
+  }
+
+  const refIndex = parent.childNodes.indexOf(referenceNode);
+  if (refIndex === -1) {
+    throw new Error("Reference node is not a child of this node");
+  }
+
+  const nextSibling = referenceNode.nextSibling;
+  return insertBefore(parent, newNode, nextSibling);
+};