@design-edito/tools 0.4.5 → 0.4.11

package/agnostic/html/index.d.ts

@@ -1,8 +1,8 @@
 export * as getNodeAncestors from './get-node-ancestors/index.js'
 export * as getPositionInsideParent from './get-position-inside-parent/index.js'
+export * as hyperJson from './hyper-json/index.js'
 export * as insertNode from './insert-node/index.js'
 export * as placeholders from './placeholders/index.js'
-export * as hyperJson from './hyper-json/index.js'
 export * as replaceInElement from './replace-in-element/index.js'
-export * as selectorToElement from './selector-to-element/index.js'
 export * as stringToNodes from './string-to-nodes/index.js'
+export * as selectorToElement from './selector-to-element/index.js'

package/agnostic/html/index.js

@@ -1,8 +1,8 @@
 export * as getNodeAncestors from './get-node-ancestors/index.js'
 export * as getPositionInsideParent from './get-position-inside-parent/index.js'
+export * as hyperJson from './hyper-json/index.js'
 export * as insertNode from './insert-node/index.js'
 export * as placeholders from './placeholders/index.js'
-export * as hyperJson from './hyper-json/index.js'
 export * as replaceInElement from './replace-in-element/index.js'
-export * as selectorToElement from './selector-to-element/index.js'
 export * as stringToNodes from './string-to-nodes/index.js'
+export * as selectorToElement from './selector-to-element/index.js'

package/agnostic/html/insert-node/index.js

@@ -1,17 +1,28 @@
-// src/agnostic/html/insert-node/index.ts
-function insertNode(node, position, reference) {
-  if (position === "after") {
-    if (reference.nextSibling !== null) reference.parentNode?.insertBefore(node, reference.nextSibling);
-    else reference.parentNode?.appendChild(node);
-  } else if (position === "before") {
-    reference.parentNode?.insertBefore(node, reference);
-  } else if (position === "startof") {
-    if (reference.firstChild !== null) reference.insertBefore(node, reference.firstChild);
-    else reference.appendChild(node);
-  } else {
-    reference.appendChild(node);
-  }
+/**
+ * Inserts a DOM node at a specific position relative to a reference node.
+ *
+ * @param {Node} node - The node to insert.
+ * @param {InsertNodePosition} position - The insertion position relative to the reference node.
+ * @param {Node} reference - The reference node used to determine the insertion point.
+ * @returns {void}
+ */
+export function insertNode(node, position, reference) {
+    if (position === 'after') {
+        if (reference.nextSibling !== null)
+            reference.parentNode?.insertBefore(node, reference.nextSibling);
+        else
+            reference.parentNode?.appendChild(node);
+    }
+    else if (position === 'before') {
+        reference.parentNode?.insertBefore(node, reference);
+    }
+    else if (position === 'startof') {
+        if (reference.firstChild !== null)
+            reference.insertBefore(node, reference.firstChild);
+        else
+            reference.appendChild(node);
+    }
+    else {
+        reference.appendChild(node);
+    }
 }
-export {
-  insertNode
-};

package/agnostic/html/insert-node/index.test.js

@@ -0,0 +1,73 @@
+import { describe, it, expect, beforeEach, afterEach } from 'vitest';
+import { insertNode } from './index.js';
+import { JSDOM } from 'jsdom';
+import * as Window from '../../misc/crossenv/window/index.js';
+describe('insertNode', () => {
+    beforeEach(() => Window.set(new JSDOM().window));
+    afterEach(() => Window.unset());
+    it('inserts node before reference node', () => {
+        const { document } = Window.get();
+        const parent = document.createElement('div');
+        const reference = document.createElement('span');
+        const node = document.createElement('p');
+        parent.appendChild(reference);
+        insertNode(node, 'before', reference);
+        expect(parent.childNodes[0]).toBe(node);
+        expect(parent.childNodes[1]).toBe(reference);
+    });
+    it('inserts node after reference node', () => {
+        const { document } = Window.get();
+        const parent = document.createElement('div');
+        const reference = document.createElement('span');
+        const node = document.createElement('p');
+        parent.appendChild(reference);
+        insertNode(node, 'after', reference);
+        expect(parent.childNodes[0]).toBe(reference);
+        expect(parent.childNodes[1]).toBe(node);
+    });
+    it('inserts node at end when inserting after last child', () => {
+        const { document } = Window.get();
+        const parent = document.createElement('div');
+        const reference = document.createElement('span');
+        const node = document.createElement('p');
+        parent.appendChild(reference);
+        insertNode(node, 'after', reference);
+        expect(parent.lastChild).toBe(node);
+    });
+    it('inserts node as first child with startof', () => {
+        const { document } = Window.get();
+        const parent = document.createElement('div');
+        const existing = document.createElement('span');
+        const node = document.createElement('p');
+        parent.appendChild(existing);
+        insertNode(node, 'startof', parent);
+        expect(parent.firstChild).toBe(node);
+        expect(parent.childNodes[1]).toBe(existing);
+    });
+    it('inserts node as last child with endof', () => {
+        const { document } = Window.get();
+        const parent = document.createElement('div');
+        const existing = document.createElement('span');
+        const node = document.createElement('p');
+        parent.appendChild(existing);
+        insertNode(node, 'endof', parent);
+        expect(parent.lastChild).toBe(node);
+        expect(parent.firstChild).toBe(existing);
+    });
+    it('inserts node in empty parent with startof', () => {
+        const { document } = Window.get();
+        const parent = document.createElement('div');
+        const node = document.createElement('p');
+        insertNode(node, 'startof', parent);
+        expect(parent.firstChild).toBe(node);
+        expect(parent.lastChild).toBe(node);
+    });
+    it('inserts node in empty parent with endof', () => {
+        const { document } = Window.get();
+        const parent = document.createElement('div');
+        const node = document.createElement('p');
+        insertNode(node, 'endof', parent);
+        expect(parent.firstChild).toBe(node);
+        expect(parent.lastChild).toBe(node);
+    });
+});

package/agnostic/html/placeholders/index.js

@@ -1,37 +1,34 @@
-// src/agnostic/html/placeholders/index.ts
-var EightKiloByteOfLoremIpsumSentences = "Etiam consequat interdum elit eu interdum. Nunc eu nulla vel arcu mattis venenatis sit amet gravida sem. Mauris pretium aliquam augue vitae tempor. Interdum et malesuada fames ac ante ipsum primis in faucibus. Nam mollis in ipsum nec efficitur. Nullam imperdiet et urna vitae suscipit. In hac habitasse platea dictumst. Nullam lacinia commodo enim non iaculis. Nam elementum tellus ac lectus aliquam porta. Mauris ut lorem nec magna porttitor efficitur sed sed odio. Ut in dapibus nulla, non eleifend elit. Pellentesque habitant morbi tristique senectus et netus et malesuada fames ac turpis egestas. Maecenas posuere leo neque, a luctus quam feugiat in. Phasellus lobortis egestas cursus. In sit amet massa et sem scelerisque facilisis quis fringilla felis. Praesent purus velit, vehicula id orci ac, placerat congue quam. Cras vulputate nisi eu justo accumsan malesuada. Vestibulum ex urna, volutpat non quam in, vulputate pellentesque est. Pellentesque interdum orci in quam finibus faucibus. In eget lectus augue. Vestibulum lobortis vulputate odio. Nam vitae felis in lorem dignissim venenatis. Curabitur bibendum, est quis tempor efficitur, magna orci facilisis erat, id rhoncus massa ante non tellus. Etiam id gravida elit. Mauris ut semper risus. Nulla sed interdum lorem. Nullam eu consectetur purus. Praesent ut enim diam. Nulla hendrerit dapibus eros, sit amet rhoncus eros consequat aliquam. Duis viverra erat vel commodo facilisis. Quisque hendrerit posuere sapien, id cursus ligula rhoncus vitae. Ut et turpis augue. Aliquam augue lorem, fringilla at magna eu, egestas sagittis ex. Vestibulum elementum diam facilisis elit ultrices, eget viverra massa venenatis. Nullam finibus ligula est. Interdum et malesuada fames ac ante ipsum primis in faucibus. Nam condimentum, justo pulvinar posuere tincidunt, mi libero convallis sapien, id consectetur nunc tellus eget nisi. Fusce tincidunt sit amet enim vitae feugiat. Etiam in nulla vitae orci consequat vulputate. Vestibulum sodales urna sit amet velit elementum, vel fringilla eros iaculis. Vestibulum gravida tempus nulla, at vulputate nunc aliquam vitae. Phasellus ac augue et augue finibus congue ut nec nunc. Ut in dictum lectus, eget efficitur dui. Suspendisse bibendum congue arcu, sit amet maximus felis dictum sit amet. Morbi scelerisque feugiat risus, id pellentesque elit cursus nec. Vivamus at erat id magna sagittis cursus vitae eu magna. Integer pretium nec lorem at consectetur. Integer id justo vitae nunc gravida posuere eu vel magna. Donec ex nunc, condimentum id laoreet et, scelerisque nec enim. Sed venenatis, augue vel posuere ullamcorper, lorem velit auctor erat, a auctor mi odio id velit. Donec justo erat, tempor ut diam sed, scelerisque aliquam dolor. Donec erat dui, dictum a tortor sit amet, pellentesque blandit risus. Donec tincidunt ligula ex, vel tincidunt leo posuere sit amet. Curabitur lacinia blandit pellentesque. Donec fringilla aliquam purus ac porta. Fusce faucibus convallis leo, ut aliquet libero maximus nec. Morbi ac magna lorem. Quisque suscipit quis nisi interdum condimentum. Pellentesque imperdiet lorem diam, eu molestie ipsum scelerisque vel. Vivamus hendrerit, ipsum id sollicitudin pharetra, justo justo laoreet lorem, ac scelerisque turpis justo vitae augue. Nullam lacinia magna nec neque auctor scelerisque. Nunc sit amet lacus condimentum, interdum nisl eu, pharetra lorem. Morbi consectetur eros ac nisi facilisis, facilisis placerat magna aliquet. Donec bibendum leo ac est aliquam dictum. Quisque commodo magna risus, ut rhoncus ex feugiat nec. Sed vel tellus porta, feugiat sem quis, facilisis enim. Quisque accumsan imperdiet felis id laoreet. Etiam condimentum at ligula nec vehicula. Phasellus eget placerat quam. Cras efficitur mauris id ex tempus porttitor. Quisque pulvinar tellus id tempus ultricies. Lorem ipsum dolor sit amet, consectetur adipiscing elit. In non erat justo. Nulla blandit placerat hendrerit. Sed blandit mattis magna eget sodales. Morbi eget accumsan sapien. Sed ornare interdum tortor iaculis volutpat. Maecenas vel tortor quis urna placerat mollis. Mauris ultrices, magna sit amet molestie sagittis, libero mi tincidunt diam, eu scelerisque nulla est vel dolor. Aenean congue congue eros bibendum elementum. Phasellus lobortis faucibus eros, et cursus lectus ultricies et. Vivamus augue metus, iaculis eget egestas in, tincidunt et lectus. Mauris varius arcu at cursus auctor. Curabitur eget nunc tellus. In eget tempor odio, vitae dictum massa. Proin in cursus est. Curabitur lobortis, velit eu accumsan sollicitudin, orci orci aliquam velit, ac iaculis massa justo sit amet massa. Duis a mauris iaculis, aliquam ipsum vel, vulputate mauris. Sed ex augue, cursus a dapibus sed, iaculis lacinia quam. Vivamus sit amet justo tellus. Nunc ac neque mattis, euismod velit id, feugiat massa. Etiam vitae auctor orci. Pellentesque sollicitudin est nibh, vitae scelerisque lacus sagittis eu. Morbi convallis metus eu enim gravida, non finibus enim accumsan. In quis pharetra justo, et tempor nibh. Duis non interdum diam. Vestibulum nec felis rhoncus, pharetra ipsum eu, rutrum magna. Integer dignissim odio eu mi finibus sollicitudin. Sed ut magna a nulla porttitor lobortis in id nibh. Pellentesque in lobortis ligula, vel malesuada neque. Aenean commodo arcu nunc, et posuere eros vulputate et. Mauris vestibulum euismod molestie. Vestibulum luctus sapien sollicitudin, cursus ante vel, varius massa. Mauris non magna pharetra, luctus felis sed, dapibus massa. Pellentesque habitant morbi tristique senectus et netus et malesuada fames ac turpis egestas. Donec posuere sapien diam, vitae porttitor nisi dictum sed. Maecenas sit amet eleifend odio. In luctus, neque eget eleifend ultricies, neque ante vestibulum leo, non ullamcorper enim orci vestibulum erat. Phasellus bibendum urna at aliquet elementum. Nulla facilisi. Sed porttitor lacus id hendrerit iaculis. Vivamus facilisis ex eget odio malesuada bibendum. Vestibulum fermentum at sem nec dignissim. Class aptent taciti sociosqu ad litora torquent per conubia nostra, per inceptos himenaeos. Nunc faucibus augue id odio ornare, et maximus quam placerat. Nullam rutrum enim justo, id hendrerit felis faucibus sed. Aenean id nulla arcu. Nulla vitae eleifend ante. Class aptent taciti sociosqu ad litora torquent per conubia nostra, per inceptos himenaeos. Quisque ipsum risus, cursus at ligula convallis, interdum fringilla quam. Curabitur libero sapien, mollis in consectetur sit amet, accumsan vel justo. Nulla a eros sit amet nibh pharetra ultricies. Proin et dapibus mauris. Maecenas at lacinia felis. Vestibulum consectetur vestibulum ante. Interdum et malesuada fames ac ante ipsum primis in faucibus. In imperdiet ipsum ac facilisis interdum. Nullam vestibulum dictum vestibulum. Cras pharetra vehicula neque.".split(".").map((e) => e.trim());
-var generateSentence = () => {
-  const pos = Math.floor(Math.random() * EightKiloByteOfLoremIpsumSentences.length);
-  return EightKiloByteOfLoremIpsumSentences[pos];
+// [WIP] maybe this util is not that useful
+// [WIP] should return Nodes, not strings
+export const EightKiloByteOfLoremIpsumSentences = 'Etiam consequat interdum elit eu interdum. Nunc eu nulla vel arcu mattis venenatis sit amet gravida sem. Mauris pretium aliquam augue vitae tempor. Interdum et malesuada fames ac ante ipsum primis in faucibus. Nam mollis in ipsum nec efficitur. Nullam imperdiet et urna vitae suscipit. In hac habitasse platea dictumst. Nullam lacinia commodo enim non iaculis. Nam elementum tellus ac lectus aliquam porta. Mauris ut lorem nec magna porttitor efficitur sed sed odio. Ut in dapibus nulla, non eleifend elit. Pellentesque habitant morbi tristique senectus et netus et malesuada fames ac turpis egestas. Maecenas posuere leo neque, a luctus quam feugiat in. Phasellus lobortis egestas cursus. In sit amet massa et sem scelerisque facilisis quis fringilla felis. Praesent purus velit, vehicula id orci ac, placerat congue quam. Cras vulputate nisi eu justo accumsan malesuada. Vestibulum ex urna, volutpat non quam in, vulputate pellentesque est. Pellentesque interdum orci in quam finibus faucibus. In eget lectus augue. Vestibulum lobortis vulputate odio. Nam vitae felis in lorem dignissim venenatis. Curabitur bibendum, est quis tempor efficitur, magna orci facilisis erat, id rhoncus massa ante non tellus. Etiam id gravida elit. Mauris ut semper risus. Nulla sed interdum lorem. Nullam eu consectetur purus. Praesent ut enim diam. Nulla hendrerit dapibus eros, sit amet rhoncus eros consequat aliquam. Duis viverra erat vel commodo facilisis. Quisque hendrerit posuere sapien, id cursus ligula rhoncus vitae. Ut et turpis augue. Aliquam augue lorem, fringilla at magna eu, egestas sagittis ex. Vestibulum elementum diam facilisis elit ultrices, eget viverra massa venenatis. Nullam finibus ligula est. Interdum et malesuada fames ac ante ipsum primis in faucibus. Nam condimentum, justo pulvinar posuere tincidunt, mi libero convallis sapien, id consectetur nunc tellus eget nisi. Fusce tincidunt sit amet enim vitae feugiat. Etiam in nulla vitae orci consequat vulputate. Vestibulum sodales urna sit amet velit elementum, vel fringilla eros iaculis. Vestibulum gravida tempus nulla, at vulputate nunc aliquam vitae. Phasellus ac augue et augue finibus congue ut nec nunc. Ut in dictum lectus, eget efficitur dui. Suspendisse bibendum congue arcu, sit amet maximus felis dictum sit amet. Morbi scelerisque feugiat risus, id pellentesque elit cursus nec. Vivamus at erat id magna sagittis cursus vitae eu magna. Integer pretium nec lorem at consectetur. Integer id justo vitae nunc gravida posuere eu vel magna. Donec ex nunc, condimentum id laoreet et, scelerisque nec enim. Sed venenatis, augue vel posuere ullamcorper, lorem velit auctor erat, a auctor mi odio id velit. Donec justo erat, tempor ut diam sed, scelerisque aliquam dolor. Donec erat dui, dictum a tortor sit amet, pellentesque blandit risus. Donec tincidunt ligula ex, vel tincidunt leo posuere sit amet. Curabitur lacinia blandit pellentesque. Donec fringilla aliquam purus ac porta. Fusce faucibus convallis leo, ut aliquet libero maximus nec. Morbi ac magna lorem. Quisque suscipit quis nisi interdum condimentum. Pellentesque imperdiet lorem diam, eu molestie ipsum scelerisque vel. Vivamus hendrerit, ipsum id sollicitudin pharetra, justo justo laoreet lorem, ac scelerisque turpis justo vitae augue. Nullam lacinia magna nec neque auctor scelerisque. Nunc sit amet lacus condimentum, interdum nisl eu, pharetra lorem. Morbi consectetur eros ac nisi facilisis, facilisis placerat magna aliquet. Donec bibendum leo ac est aliquam dictum. Quisque commodo magna risus, ut rhoncus ex feugiat nec. Sed vel tellus porta, feugiat sem quis, facilisis enim. Quisque accumsan imperdiet felis id laoreet. Etiam condimentum at ligula nec vehicula. Phasellus eget placerat quam. Cras efficitur mauris id ex tempus porttitor. Quisque pulvinar tellus id tempus ultricies. Lorem ipsum dolor sit amet, consectetur adipiscing elit. In non erat justo. Nulla blandit placerat hendrerit. Sed blandit mattis magna eget sodales. Morbi eget accumsan sapien. Sed ornare interdum tortor iaculis volutpat. Maecenas vel tortor quis urna placerat mollis. Mauris ultrices, magna sit amet molestie sagittis, libero mi tincidunt diam, eu scelerisque nulla est vel dolor. Aenean congue congue eros bibendum elementum. Phasellus lobortis faucibus eros, et cursus lectus ultricies et. Vivamus augue metus, iaculis eget egestas in, tincidunt et lectus. Mauris varius arcu at cursus auctor. Curabitur eget nunc tellus. In eget tempor odio, vitae dictum massa. Proin in cursus est. Curabitur lobortis, velit eu accumsan sollicitudin, orci orci aliquam velit, ac iaculis massa justo sit amet massa. Duis a mauris iaculis, aliquam ipsum vel, vulputate mauris. Sed ex augue, cursus a dapibus sed, iaculis lacinia quam. Vivamus sit amet justo tellus. Nunc ac neque mattis, euismod velit id, feugiat massa. Etiam vitae auctor orci. Pellentesque sollicitudin est nibh, vitae scelerisque lacus sagittis eu. Morbi convallis metus eu enim gravida, non finibus enim accumsan. In quis pharetra justo, et tempor nibh. Duis non interdum diam. Vestibulum nec felis rhoncus, pharetra ipsum eu, rutrum magna. Integer dignissim odio eu mi finibus sollicitudin. Sed ut magna a nulla porttitor lobortis in id nibh. Pellentesque in lobortis ligula, vel malesuada neque. Aenean commodo arcu nunc, et posuere eros vulputate et. Mauris vestibulum euismod molestie. Vestibulum luctus sapien sollicitudin, cursus ante vel, varius massa. Mauris non magna pharetra, luctus felis sed, dapibus massa. Pellentesque habitant morbi tristique senectus et netus et malesuada fames ac turpis egestas. Donec posuere sapien diam, vitae porttitor nisi dictum sed. Maecenas sit amet eleifend odio. In luctus, neque eget eleifend ultricies, neque ante vestibulum leo, non ullamcorper enim orci vestibulum erat. Phasellus bibendum urna at aliquet elementum. Nulla facilisi. Sed porttitor lacus id hendrerit iaculis. Vivamus facilisis ex eget odio malesuada bibendum. Vestibulum fermentum at sem nec dignissim. Class aptent taciti sociosqu ad litora torquent per conubia nostra, per inceptos himenaeos. Nunc faucibus augue id odio ornare, et maximus quam placerat. Nullam rutrum enim justo, id hendrerit felis faucibus sed. Aenean id nulla arcu. Nulla vitae eleifend ante. Class aptent taciti sociosqu ad litora torquent per conubia nostra, per inceptos himenaeos. Quisque ipsum risus, cursus at ligula convallis, interdum fringilla quam. Curabitur libero sapien, mollis in consectetur sit amet, accumsan vel justo. Nulla a eros sit amet nibh pharetra ultricies. Proin et dapibus mauris. Maecenas at lacinia felis. Vestibulum consectetur vestibulum ante. Interdum et malesuada fames ac ante ipsum primis in faucibus. In imperdiet ipsum ac facilisis interdum. Nullam vestibulum dictum vestibulum. Cras pharetra vehicula neque.'.split('.').map(e => e.trim());
+export const generateSentence = () => {
+    const pos = Math.floor(Math.random() * EightKiloByteOfLoremIpsumSentences.length);
+    return EightKiloByteOfLoremIpsumSentences[pos];
 };
-var generateSentences = (amount = 1) => {
-  return new Array(amount).fill(null).map(generateSentence);
+export const generateSentences = (amount = 1) => {
+    return new Array(amount)
+        .fill(null)
+        .map(generateSentence);
 };
-var generateTitle = () => `<h1 class="title">${generateSentence()}</h1>`;
-var generateIntertitle = () => `<h2 class="intertitle">${generateSentence()}</h2>`;
-var generateParagraph = () => {
-  const length = Math.floor(Math.random() * 5) + 3;
-  const sentencesArr = new Array(length).fill(null).map(generateSentence);
-  return `<p class="paragraph">${sentencesArr.join(". ")}</p>`;
+export const generateTitle = () => `<h1 class="title">${generateSentence()}</h1>`;
+export const generateIntertitle = () => `<h2 class="intertitle">${generateSentence()}</h2>`;
+export const generateParagraph = () => {
+    const length = Math.floor(Math.random() * 5) + 3;
+    const sentencesArr = new Array(length)
+        .fill(null)
+        .map(generateSentence);
+    return `<p class="paragraph">${sentencesArr.join('. ')}</p>`;
 };
-var generateContentPage = (len = 1) => {
-  const length = (Math.floor(Math.random() * 3) + 3) * Math.round(len);
-  const pageBody = new Array(length).fill(null).map(() => {
-    if (Math.random() < 0.2) return generateIntertitle();
-    return generateParagraph();
-  }).join("");
-  return `<div class="content-page">
+export const generateContentPage = (len = 1) => {
+    const length = (Math.floor(Math.random() * 3) + 3) * Math.round(len);
+    const pageBody = new Array(length).fill(null).map(() => {
+        if (Math.random() < 0.2)
+            return generateIntertitle();
+        return generateParagraph();
+    }).join('');
+    return `<div class="content-page">
     ${generateTitle()}
     ${pageBody}
     ${generateParagraph()}
   </div>`;
 };
-export {
-  EightKiloByteOfLoremIpsumSentences,
-  generateContentPage,
-  generateIntertitle,
-  generateParagraph,
-  generateSentence,
-  generateSentences,
-  generateTitle
-};

package/agnostic/html/replace-in-element/index.js

@@ -1,49 +1,32 @@
-// src/agnostic/misc/crossenv/window/index.ts
-function exists() {
-  return typeof globalThis !== "undefined" && "window" in globalThis;
+import { getNodeAncestors } from '../get-node-ancestors/index.js';
+/**
+ * Replaces specific descendant nodes of a given element according to a
+ * replacement map.
+ *
+ * Only entries whose target nodes are descendants of `inputElement`
+ * are applied. Each target node is removed after its replacement node(s)
+ * are inserted in its place.
+ *
+ * @param {Element} inputElement - The root element within which replacements are applied.
+ * @param {Map<Node, Node | NodeListOf<Node>>} replaceMap
+ * - A map associating nodes to be replaced with either a single replacement
+ *   node or a list of replacement nodes.
+ * @returns {Element} The original `inputElement`, after replacements have been applied.
+ */
+export function replaceInElement(inputElement, replaceMap) {
+    const actualReplaceMap = new Map(Array.from(replaceMap).filter(([toReplace]) => {
+        const toReplaceAncestors = getNodeAncestors(toReplace);
+        return toReplaceAncestors.includes(inputElement);
+    }));
+    actualReplaceMap.forEach((replacer, toReplace) => {
+        if ('nodeType' in replacer) {
+            toReplace.parentNode?.insertBefore(replacer, toReplace);
+        }
+        else {
+            const replacerNodes = Array.from(replacer);
+            replacerNodes.forEach(rpl => toReplace.parentNode?.insertBefore(rpl, toReplace));
+        }
+        toReplace.parentNode?.removeChild(toReplace);
+    });
+    return inputElement;
 }
-var _window = exists() ? globalThis.window ?? null : null;
-function get() {
-  if (_window !== null) return _window;
-  const message = "window is undefined. Please call Window.setWindow(windowObj) before using Window.get.";
-  throw new Error(message);
-}
-
-// src/agnostic/html/get-node-ancestors/index.ts
-function getNodeAncestors(node, traverseShadowRoots) {
-  const returned = [];
-  let currentNode = node;
-  const { ShadowRoot } = get();
-  while (currentNode !== null) {
-    returned.push(currentNode);
-    const parentNode = currentNode.parentNode;
-    if (parentNode instanceof ShadowRoot) {
-      returned.push(parentNode);
-      currentNode = traverseShadowRoots === true ? parentNode.host : null;
-      continue;
-    }
-    currentNode = currentNode.parentElement;
-  }
-  return returned;
-}
-
-// src/agnostic/html/replace-in-element/index.ts
-function replaceInElement(inputElement, replaceMap) {
-  const actualReplaceMap = new Map(Array.from(replaceMap).filter(([toReplace]) => {
-    const toReplaceAncestors = getNodeAncestors(toReplace);
-    return toReplaceAncestors.includes(inputElement);
-  }));
-  actualReplaceMap.forEach((replacer, toReplace) => {
-    if ("nodeType" in replacer) {
-      toReplace.parentNode?.insertBefore(replacer, toReplace);
-    } else {
-      const replacerNodes = Array.from(replacer);
-      replacerNodes.forEach((rpl) => toReplace.parentNode?.insertBefore(rpl, toReplace));
-    }
-    toReplace.parentNode?.removeChild(toReplace);
-  });
-  return inputElement;
-}
-export {
-  replaceInElement
-};

package/agnostic/html/replace-in-element/index.test.js

@@ -0,0 +1,80 @@
+import { describe, it, expect, beforeEach, afterEach } from 'vitest';
+import { JSDOM } from 'jsdom';
+import { replaceInElement } from './index.js';
+import * as Window from '../../misc/crossenv/window/index.js';
+describe('replaceInElement', () => {
+    beforeEach(() => Window.set(new JSDOM().window));
+    afterEach(() => Window.unset());
+    it('replaces a single node with another node', () => {
+        const { document } = Window.get();
+        const parent = document.createElement('div');
+        const toReplace = document.createElement('span');
+        const replacement = document.createElement('p');
+        parent.appendChild(toReplace);
+        const replaceMap = new Map([[toReplace, replacement]]);
+        replaceInElement(parent, replaceMap);
+        expect(parent.childNodes.length).toBe(1);
+        expect(parent.firstChild).toBe(replacement);
+        expect(parent.contains(toReplace)).toBe(false);
+    });
+    it('replaces multiple nodes', () => {
+        const { document } = Window.get();
+        const parent = document.createElement('div');
+        const node1 = document.createElement('span');
+        const node2 = document.createElement('span');
+        const replacement1 = document.createElement('p');
+        const replacement2 = document.createElement('div');
+        parent.appendChild(node1);
+        parent.appendChild(node2);
+        const replaceMap = new Map([
+            [node1, replacement1],
+            [node2, replacement2]
+        ]);
+        replaceInElement(parent, replaceMap);
+        expect(parent.childNodes.length).toBe(2);
+        expect(parent.childNodes[0]).toBe(replacement1);
+        expect(parent.childNodes[1]).toBe(replacement2);
+    });
+    it('replaces node with multiple nodes', () => {
+        const { document } = Window.get();
+        const parent = document.createElement('div');
+        const toReplace = document.createElement('span');
+        const replacement1 = document.createElement('p');
+        const replacement2 = document.createElement('div');
+        parent.appendChild(toReplace);
+        const fragment = document.createDocumentFragment();
+        fragment.appendChild(replacement1);
+        fragment.appendChild(replacement2);
+        const nodeList = fragment.childNodes;
+        const replaceMap = new Map([[toReplace, nodeList]]);
+        replaceInElement(parent, replaceMap);
+        expect(parent.childNodes.length).toBe(2);
+        expect(parent.childNodes[0]).toBe(replacement1);
+        expect(parent.childNodes[1]).toBe(replacement2);
+    });
+    it('only replaces nodes that are descendants', () => {
+        const { document } = Window.get();
+        const parent = document.createElement('div');
+        const child = document.createElement('span');
+        const orphan = document.createElement('span');
+        const replacement = document.createElement('p');
+        parent.appendChild(child);
+        const replaceMap = new Map([
+            [child, replacement],
+            [orphan, document.createElement('div')]
+        ]);
+        replaceInElement(parent, replaceMap);
+        expect(parent.contains(replacement)).toBe(true);
+        expect(parent.contains(orphan)).toBe(false);
+    });
+    it('returns the input element', () => {
+        const { document } = Window.get();
+        const parent = document.createElement('div');
+        const child = document.createElement('span');
+        const replacement = document.createElement('p');
+        parent.appendChild(child);
+        const replaceMap = new Map([[child, replacement]]);
+        const result = replaceInElement(parent, replaceMap);
+        expect(result).toBe(parent);
+    });
+});

package/agnostic/html/selector-to-element/index.js

@@ -1,40 +1,54 @@
-// src/agnostic/misc/crossenv/window/index.ts
-function exists() {
-  return typeof globalThis !== "undefined" && "window" in globalThis;
+/* eslint-disable no-useless-escape */
+import * as Window from '../../misc/crossenv/window/index.js';
+/**
+ * Creates a DOM element from a CSS-like selector string.
+ * Tag name defaults to div.
+ *
+ * Supports simple tag, ID, class, and attribute syntax:
+ * - Tag name (e.g., `"div"`)
+ * - ID (e.g., `"#myId"`)
+ * - Classes (e.g., `".class1.class2"`)
+ * - Attributes (e.g., `"[attr=value]"`)
+ *
+ * @param {string} selector - The selector string used to construct the element.
+ * @returns {Element} A newly created DOM element corresponding to the selector.
+ *
+ * @throws Will throw an error if no document object is available for element creation.
+ */
+export function selectorToElement(selector) {
+    // RegExps
+    const tagRegexp = /^[A-Za-z]+/;
+    // The dot is apparently a valid character but is prevented here
+    // in order to be able to match class elements
+    const idRegexp = /#[A-Za-z]+[\w\-\:]*/;
+    const classRegexp = /\.[A-Za-z]+[\w\-]*/g;
+    const attributeRegexp = /\[[A-Za-z]+[\w\-]*(="[\w\-]+")?\]/g;
+    // Matched
+    const matchedTags = selector.match(tagRegexp) ?? [];
+    const matchedIds = selector.match(idRegexp) ?? [];
+    const matchedClasses = selector.match(classRegexp) ?? [];
+    const matchedAttrs = selector.match(attributeRegexp) ?? [];
+    // Extracted
+    const tag = matchedTags[matchedTags.length - 1] ?? 'div';
+    const id = matchedIds.length > 0
+        ? matchedIds[matchedIds.length - 1]?.replace(/^#/, '') ?? null
+        : null;
+    const classes = matchedClasses.map(matchedClass => matchedClass.replace(/^\./, ''));
+    const attributes = matchedAttrs.map(matchedAttr => matchedAttr
+        .replace(/^\[/, '')
+        .replace(/\]$/, '')
+        .split('='));
+    // Returning
+    const element = Window.get().document.createElement(tag);
+    if (id !== null) {
+        element.id = id;
+    }
+    element.classList.add(...classes);
+    attributes.forEach(([name, value = '']) => {
+        if (name === undefined)
+            return;
+        const cleanValue = value.replace(/^"(.*)"$/, '$1');
+        element.setAttribute(name, cleanValue);
+    });
+    return element;
 }
-var _window = exists() ? globalThis.window ?? null : null;
-function get() {
-  if (_window !== null) return _window;
-  const message = "window is undefined. Please call Window.setWindow(windowObj) before using Window.get.";
-  throw new Error(message);
-}
-
-// src/agnostic/html/selector-to-element/index.ts
-function selectorToElement(selector) {
-  const tagRegexp = /^[A-Za-z]+/;
-  const idRegexp = /#[A-Za-z]+[\w\-\:]*/;
-  const classRegexp = /\.[A-Za-z]+[\w\-]*/g;
-  const attributeRegexp = /\[[A-Za-z]+[\w\-]*(="[\w\-]+")?\]/g;
-  const matchedTags = selector.match(tagRegexp) ?? [];
-  const matchedIds = selector.match(idRegexp) ?? [];
-  const matchedClasses = selector.match(classRegexp) ?? [];
-  const matchedAttrs = selector.match(attributeRegexp) ?? [];
-  const tag = matchedTags[matchedTags.length - 1] ?? "div";
-  const id = matchedIds.length > 0 ? matchedIds[matchedIds.length - 1]?.replace(/^#/, "") ?? null : null;
-  const classes = matchedClasses.map((matchedClass) => matchedClass.replace(/^\./, ""));
-  const attributes = matchedAttrs.map((matchedAttr) => matchedAttr.replace(/^\[/, "").replace(/\]$/, "").split("="));
-  const element = get().document.createElement(tag);
-  if (id !== null) {
-    element.id = id;
-  }
-  element.classList.add(...classes);
-  attributes.forEach(([name, value = ""]) => {
-    if (name === void 0) return;
-    const cleanValue = value.replace(/^"(.*)"$/, "$1");
-    element.setAttribute(name, cleanValue);
-  });
-  return element;
-}
-export {
-  selectorToElement
-};

package/agnostic/html/selector-to-element/index.test.js

@@ -0,0 +1,69 @@
+import { describe, it, expect, beforeEach, afterEach } from 'vitest';
+import { JSDOM } from 'jsdom';
+import { selectorToElement } from './index.js';
+import * as Window from '../../misc/crossenv/window/index.js';
+describe('selectorToElement', () => {
+    beforeEach(() => Window.set(new JSDOM().window));
+    afterEach(() => Window.unset());
+    it('creates element with tag name', () => {
+        const element = selectorToElement('div');
+        expect(element.tagName).toBe('DIV');
+    });
+    it('defaults to div when no tag specified', () => {
+        const element = selectorToElement('#myId');
+        expect(element.tagName).toBe('DIV');
+    });
+    it('creates element with ID', () => {
+        const element = selectorToElement('#myId');
+        expect(element.id).toBe('myId');
+    });
+    it('creates element with single class', () => {
+        const element = selectorToElement('.myClass');
+        expect(element.classList.contains('myClass')).toBe(true);
+    });
+    it('creates element with multiple classes', () => {
+        const element = selectorToElement('.class1.class2.class3');
+        expect(element.classList.contains('class1')).toBe(true);
+        expect(element.classList.contains('class2')).toBe(true);
+        expect(element.classList.contains('class3')).toBe(true);
+    });
+    it('creates element with attribute', () => {
+        const element = selectorToElement('[data-test]');
+        expect(element.hasAttribute('data-test')).toBe(true);
+    });
+    it('creates element with attribute and value', () => {
+        const element = selectorToElement('[data-test="value"]');
+        expect(element.getAttribute('data-test')).toBe('value');
+    });
+    it('combines tag, ID, classes, and attributes', () => {
+        const element = selectorToElement('span#myId.class1.class2[data-test="value"]');
+        expect(element.tagName).toBe('SPAN');
+        expect(element.id).toBe('myId');
+        expect(element.classList.contains('class1')).toBe(true);
+        expect(element.classList.contains('class2')).toBe(true);
+        expect(element.getAttribute('data-test')).toBe('value');
+    });
+    it('handles different tag names', () => {
+        expect(selectorToElement('span').tagName).toBe('SPAN');
+        expect(selectorToElement('p').tagName).toBe('P');
+        expect(selectorToElement('button').tagName).toBe('BUTTON');
+    });
+    it('handles ID with hyphens', () => {
+        const element = selectorToElement('#my-id');
+        expect(element.id).toBe('my-id');
+    });
+    it('handles classes with hyphens', () => {
+        const element = selectorToElement('.my-class');
+        expect(element.classList.contains('my-class')).toBe(true);
+    });
+    it('handles multiple attributes', () => {
+        const element = selectorToElement('[attr1="value1"][attr2="value2"]');
+        expect(element.getAttribute('attr1')).toBe('value1');
+        expect(element.getAttribute('attr2')).toBe('value2');
+    });
+    it('handles attribute without value', () => {
+        const element = selectorToElement('[disabled]');
+        expect(element.hasAttribute('disabled')).toBe(true);
+        expect(element.getAttribute('disabled')).toBe('');
+    });
+});

package/agnostic/html/string-to-nodes/index.js

@@ -1,26 +1,25 @@
-// src/agnostic/misc/crossenv/window/index.ts
-function exists() {
-  return typeof globalThis !== "undefined" && "window" in globalThis;
+import * as Window from '../../misc/crossenv/window/index.js';
+/**
+ * Converts a string into an array of DOM nodes.
+ *
+ * If sanitization options are provided, the string is first sanitized
+ * using `Sanitize.sanitize`.
+ *
+ * Only element and text nodes are included in the returned array; comment
+ * and other node types are ignored.
+ *
+ * @param {string} inputStr - The input string to convert into nodes.
+ * @param {SanitizeHtmlOptions} [options.sanitize] - Sanitization options for the input string.
+ * @returns {Node[]} An array of DOM nodes created from the string.
+ */
+export function stringToNodes(inputStr) {
+    const window = Window.get();
+    const { document, Node } = window;
+    const wrapperDiv = document.createElement('div');
+    wrapperDiv.innerHTML = inputStr;
+    const nodes = Array.from(wrapperDiv.childNodes).filter(node => {
+        const allowedNodeTypes = [Node.ELEMENT_NODE, Node.TEXT_NODE];
+        return allowedNodeTypes.includes(node.nodeType);
+    });
+    return nodes;
 }
-var _window = exists() ? globalThis.window ?? null : null;
-function get() {
-  if (_window !== null) return _window;
-  const message = "window is undefined. Please call Window.setWindow(windowObj) before using Window.get.";
-  throw new Error(message);
-}
-
-// src/agnostic/html/string-to-nodes/index.ts
-function stringToNodes(inputStr) {
-  const window = get();
-  const { document, Node } = window;
-  const wrapperDiv = document.createElement("div");
-  wrapperDiv.innerHTML = inputStr;
-  const nodes = Array.from(wrapperDiv.childNodes).filter((node) => {
-    const allowedNodeTypes = [Node.ELEMENT_NODE, Node.TEXT_NODE];
-    return allowedNodeTypes.includes(node.nodeType);
-  });
-  return nodes;
-}
-export {
-  stringToNodes
-};