jodit 4.13.26 → 4.14.0

package/esm/plugins/source/editor/engines/ace.js

@@ -4,6 +4,7 @@
  * Copyright (c) 2013-2026 Valerii Chupurnov. All rights reserved. https://xdsoft.net
  */
 import * as constants from "../../../../core/constants.js";
+import { Dom } from "../../../../core/dom/dom.js";
 import { isString, loadNext } from "../../../../core/helpers/index.js";
 import { SourceEditor } from "../sourceEditor.js";
 export class AceEditor extends SourceEditor {
@@ -74,7 +75,7 @@ export class AceEditor extends SourceEditor {
                 return;
             }
             const fakeMirror = this.j.c.div('jodit-source__mirror-fake');
-            this.container.appendChild(fakeMirror);
+            Dom.append(this.container, fakeMirror);
             const ace = editor.ow.ace;
             this.instance = ace.edit(fakeMirror);
             if (editor.o.direction === 'rtl') {

package/esm/plugins/source/editor/engines/area.js

@@ -11,8 +11,8 @@ export class TextAreaEditor extends SourceEditor {
     constructor() {
         super(...arguments);
         this.autosize = this.j.async.debounce(() => {
-            this.instance.style.height = 'auto';
-            this.instance.style.height = this.instance.scrollHeight + 'px';
+            css(this.instance, 'height', 'auto');
+            css(this.instance, 'height', this.instance.scrollHeight);
         }, this.j.defaultTimeout, true);
     }
     init(editor) {
@@ -20,7 +20,7 @@ export class TextAreaEditor extends SourceEditor {
             class: 'jodit-source__mirror',
             dir: editor.o.direction === 'rtl' ? 'rtl' : undefined
         });
-        this.container.appendChild(this.instance);
+        Dom.append(this.container, this.instance);
         editor.e
             .on(this.instance, 'mousedown keydown touchstart input', editor.async.debounce(this.toWYSIWYG, editor.defaultTimeout))
             .on('setMinHeight.source', (minHeightD) => {

package/esm/plugins/source/source.js

@@ -228,9 +228,9 @@ export class source extends Plugin {
     /** @override */
     afterInit(editor) {
         this.mirrorContainer = editor.c.div('jodit-source');
-        editor.workplace.appendChild(this.mirrorContainer);
+        Dom.append(editor.workplace, this.mirrorContainer);
         editor.e.on('afterAddPlace changePlace afterInit', () => {
-            editor.workplace.appendChild(this.mirrorContainer);
+            Dom.append(editor.workplace, this.mirrorContainer);
         });
         this.sourceEditor = createSourceEditor('area', editor, this.mirrorContainer, this.toWYSIWYG, this.fromWYSIWYG);
         editor.e.on(editor.ow, 'keydown', (e) => {

package/esm/plugins/speech-recognize/speech-recognize.js

@@ -59,7 +59,7 @@ export class SpeechRecognizeNative extends Plugin {
         if (!this.messagePopup) {
             this.messagePopup = this.j.create.div('jodit-speech-recognize__popup');
         }
-        this.j.workplace.appendChild(this.messagePopup);
+        Dom.append(this.j.workplace, this.messagePopup);
         this.j.async.clearTimeout(this.__hidePopupTimeout);
         this.__hidePopupTimeout = this.j.async.setTimeout(() => {
             Dom.safeRemove(this.messagePopup);

package/esm/plugins/sticky/sticky.js

@@ -28,7 +28,7 @@ export class sticky extends Plugin {
         this.__createDummy = (toolbar) => {
             this.__dummyBox = this.j.c.div();
             this.__dummyBox.classList.add('jodit_sticky-dummy_toolbar');
-            this.j.container.insertBefore(this.__dummyBox, toolbar);
+            Dom.before(toolbar, this.__dummyBox);
         };
         /**
          * Add sticky

package/esm/plugins/symbols/config.js

@@ -3,6 +3,7 @@
  * Released under MIT see LICENSE.txt in the project root for license information.
  * Copyright (c) 2013-2026 Valerii Chupurnov. All rights reserved. https://xdsoft.net
  */
+import { Dom } from "../../core/dom/dom.js";
 import { Icon } from "../../core/ui/icon.js";
 import { Config } from "../../config.js";
 import symbolsIcon from "./symbols.svg.js";
@@ -229,14 +230,14 @@ Config.prototype.controls.symbols = {
             if (editor.o.usePopupForSpecialCharacters) {
                 const box = editor.c.div();
                 box.classList.add('jodit-symbols');
-                box.appendChild(container);
+                Dom.append(box, container);
                 editor.e.on(container, 'close_dialog', close);
                 return box;
             }
             editor
                 .alert(container, 'Select Special Character', undefined, 'jodit-symbols')
                 .bindDestruct(editor);
-            const a = container.querySelector('a');
+            const a = Dom.first(container, node => Dom.isTag(node, 'a'));
             a && a.focus();
         }
         return;

package/esm/plugins/symbols/symbols.js

@@ -35,8 +35,9 @@ export class symbols extends Plugin {
 							<div class="jodit-symbols__preview"></div>
 						</div>
 					</div>`);
-            const preview = container.querySelector('.jodit-symbols__preview');
-            const table = container.querySelector('table');
+            const preview = Dom.first(container, node => Dom.isHTMLElement(node) &&
+                node.classList.contains('jodit-symbols__preview'));
+            const table = Dom.first(container, node => Dom.isTag(node, 'table'));
             const body = table.tBodies[0];
             const chars = [];
             for (let i = 0; i < jodit.o.specialCharacters.length;) {
@@ -50,10 +51,10 @@ export class symbols extends Plugin {
 									tabindex="-1"
 							>${jodit.o.specialCharacters[i]}</a>`);
                     chars.push(a);
-                    td.appendChild(a);
-                    tr.appendChild(td);
+                    Dom.append(td, a);
+                    Dom.append(tr, td);
                 }
-                body.appendChild(tr);
+                Dom.append(body, tr);
             }
             const self = this;
             jodit.e

package/esm/plugins/tab/cases/on-tab-inside-li.js

@@ -83,8 +83,8 @@ function appendNestedList(jodit, list, li) {
             acc[attr.name] = attr.value;
             return acc;
         }, {}));
-    newList.appendChild(li);
-    lastElm !== newList && previousLi.appendChild(newList);
+    Dom.append(newList, li);
+    lastElm !== newList && Dom.append(previousLi, newList);
 }
 function removeNestedList(jodit, list, li) {
     const parentLi = Dom.closest(list, 'li', jodit.editor);

package/esm/plugins/table/config.js

@@ -54,7 +54,15 @@ Config.prototype.controls.table = {
             '<label class="jodit-form__center">' +
             '<span>1</span> &times; <span>1</span>' +
             '</label>' +
-            '</form>'), rows = form.querySelectorAll('span')[0], cols = form.querySelectorAll('span')[1], blocksContainer = form.querySelector('.jodit-form__container'), options = form.querySelector('.jodit-form__options'), cells = [];
+            '</form>'), spans = (() => {
+            const list = [];
+            Dom.each(form, node => {
+                Dom.isTag(node, 'span') && list.push(node);
+            });
+            return list;
+        })(), [rows, cols] = spans, blocksContainer = Dom.first(form, node => Dom.isHTMLElement(node) &&
+            node.classList.contains('jodit-form__container')), options = Dom.first(form, node => Dom.isHTMLElement(node) &&
+            node.classList.contains('jodit-form__options')), cells = [];
         const cnt = default_rows_count * default_cols_count;
         attr(blocksContainer, {
             role: 'grid',
@@ -92,7 +100,7 @@ Config.prototype.controls.table = {
             const k = parseInt(attr(cell, '-index') || '0', 10);
             const rows_count = Math.ceil((k + 1) / default_cols_count), cols_count = (k % default_cols_count) + 1;
             const crt = editor.createInside, tbody = crt.element('tbody'), table = crt.element('table');
-            table.appendChild(tbody);
+            Dom.append(table, tbody);
             let first_td = null, tr, td;
             for (let i = 1; i <= rows_count; i += 1) {
                 tr = crt.element('tr');
@@ -102,13 +110,13 @@ Config.prototype.controls.table = {
                         first_td = td;
                     }
                     css(td, 'width', (100 / cols_count).toFixed(4) + '%');
-                    td.appendChild(crt.element('br'));
-                    tr.appendChild(crt.text('\n'));
-                    tr.appendChild(crt.text('\t'));
-                    tr.appendChild(td);
+                    Dom.append(td, crt.element('br'));
+                    Dom.append(tr, crt.text('\n'));
+                    Dom.append(tr, crt.text('\t'));
+                    Dom.append(tr, td);
                 }
-                tbody.appendChild(crt.text('\n'));
-                tbody.appendChild(tr);
+                Dom.append(tbody, crt.text('\n'));
+                Dom.append(tbody, tr);
             }
             $$('input[type=checkbox]:checked', options).forEach((input) => {
                 input.value
@@ -224,9 +232,9 @@ Config.prototype.controls.table = {
                 const row = editor.c.div();
                 attr(row, 'role', 'row');
                 for (let j = 0; j < default_cols_count; j += 1) {
-                    row.appendChild(cells[i * default_cols_count + j]);
+                    Dom.append(row, cells[i * default_cols_count + j]);
                 }
-                blocksContainer.appendChild(row);
+                Dom.append(blocksContainer, row);
             }
             if (cells[0]) {
                 cells[0].className = 'hovered';

package/esm/plugins/table-keyboard-navigation/table-keyboard-navigation.js

@@ -39,7 +39,7 @@ export function tableKeyboardNavigation(editor) {
                 if (!next) {
                     tableModule.appendRow(table, !isPrev
                         ? false
-                        : table.querySelector('tr'), !isPrev);
+                        : Dom.first(table, node => Dom.isTag(node, 'tr')), !isPrev);
                     next = getNextCell();
                 }
                 break;
@@ -68,7 +68,7 @@ export function tableKeyboardNavigation(editor) {
         editor.e.fire('hidePopup hideResizer');
         if (!next.firstChild) {
             const first = editor.createInside.element('br');
-            next.appendChild(first);
+            Dom.append(next, first);
             editor.s.setCursorBefore(first);
         }
         else {

package/esm/plugins/wrap-nodes/wrap-nodes.js

@@ -83,7 +83,7 @@ class wrapNodes extends Plugin {
                 Dom.before(child, box);
                 while (child && this.isSuitable(child)) {
                     const next = child.nextSibling;
-                    box.appendChild(child);
+                    Dom.append(box, child);
                     child = next;
                 }
                 box.normalize();
@@ -133,7 +133,7 @@ function checkAloneListLeaf(child, jodit) {
             !Dom.isList(next.parentElement)) {
             const nextChild = Dom.findNotEmptySibling(next, false);
             if (Dom.isTag(result, 'ul')) {
-                result.appendChild(next);
+                Dom.append(result, next);
             }
             else {
                 result = Dom.wrap(next, 'ul', jodit.createInside);

package/esm/plugins/xpath/xpath.js

@@ -89,7 +89,7 @@ class xpath extends Plugin {
             });
             this.selectAllButton.state.size = 'tiny';
             this.container &&
-                this.container.insertBefore(this.selectAllButton.container, this.container.firstChild);
+                Dom.prepend(this.container, this.selectAllButton.container);
         };
         this.calcPathImd = () => {
             if (this.isDestructed) {
@@ -109,8 +109,7 @@ class xpath extends Plugin {
                         name = elm.nodeName.toLowerCase();
                         xpth = getXPathByElement(elm, this.j.editor).replace(/^\//, '');
                         li = this.tpl(elm, xpth, name, this.j.i18n('Select %s', name));
-                        this.container &&
-                            this.container.insertBefore(li, this.container.firstChild);
+                        this.container && Dom.prepend(this.container, li);
                     }
                 }, this.j.editor);
             }

package/esm/types/index.d.ts

@@ -27,5 +27,6 @@ export * from "./traits";
 export * from "./types";
 export * from "./ui";
 export * from "./uploader";
+export * from "./vdom";
 export * from "./view";
 export * from "./messages";

package/esm/types/vdom.d.ts

@@ -0,0 +1,96 @@
+/*!
+ * Jodit Editor (https://xdsoft.net/jodit/)
+ * Released under MIT see LICENSE.txt in the project root for license information.
+ * Copyright (c) 2013-2026 Valerii Chupurnov. All rights reserved. https://xdsoft.net
+ */
+/**
+ * @module types
+ */
+/**
+ * Virtual DOM interfaces.
+ *
+ * A minimal structural subset of the browser DOM: every browser `Node`,
+ * `Element`, `HTMLElement`, `Text`, `Document` and `DocumentFragment`
+ * satisfies the matching interface below, so they can be passed anywhere
+ * these types are expected. The `Dom` module (and the low-level helpers)
+ * must rely only on this subset — this is the contract that will let the
+ * editor switch to virtual-DOM editing without rewriting the call sites.
+ *
+ * Keep these interfaces as small as possible: add a member only when the
+ * `Dom` module (or `attr`/`css` helpers) really needs it.
+ */
+/**
+ * Minimal subset of the browser `Node`
+ */
+export interface VNode {
+    readonly nodeType: number;
+    readonly nodeName: string;
+    nodeValue: string | null;
+    textContent: string | null;
+    readonly parentNode: VNode | null;
+    readonly parentElement: VHTMLElement | null;
+    readonly firstChild: VNode | null;
+    readonly lastChild: VNode | null;
+    readonly previousSibling: VNode | null;
+    readonly nextSibling: VNode | null;
+    readonly childNodes: ArrayLike<VNode>;
+    readonly ownerDocument: VDocument | null;
+    appendChild(node: VNode): VNode;
+    insertBefore(node: VNode, child: VNode | null): VNode;
+    removeChild(child: VNode): VNode;
+    replaceChild(node: VNode, child: VNode): VNode;
+    contains(other: VNode | null): boolean;
+}
+/**
+ * Minimal subset of the browser `Attr`
+ */
+export interface VAttr {
+    readonly name: string;
+    readonly value: string;
+}
+/**
+ * Minimal subset of the browser `DOMTokenList`
+ */
+export interface VTokenList {
+    readonly length: number;
+    add(...tokens: string[]): void;
+    remove(...tokens: string[]): void;
+    contains(token: string): boolean;
+    toggle(token: string, force?: boolean): boolean;
+}
+/**
+ * Minimal subset of the browser `Element`
+ */
+export interface VElement extends VNode {
+    readonly tagName: string;
+    readonly attributes: ArrayLike<VAttr>;
+    readonly classList: VTokenList;
+    className: string;
+    getAttribute(name: string): string | null;
+    setAttribute(name: string, value: string): void;
+    removeAttribute(name: string): void;
+    hasAttribute(name: string): boolean;
+}
+/**
+ * Minimal subset of the browser `CSSStyleDeclaration`
+ */
+export interface VStyle {
+    getPropertyValue(property: string): string;
+    setProperty(property: string, value: string | null): void;
+    removeProperty(property: string): string;
+}
+/**
+ * Minimal subset of the browser `HTMLElement`
+ */
+export interface VHTMLElement extends VElement {
+    readonly style: VStyle;
+}
+/**
+ * Minimal subset of the browser `Document`. Text nodes and fragments add
+ * nothing to `VNode` structurally, so they are typed as `VNode`.
+ */
+export interface VDocument {
+    createElement(tagName: string): VHTMLElement;
+    createTextNode(data: string): VNode;
+    createDocumentFragment(): VNode;
+}

package/package.json

@@ -1,6 +1,6 @@
 {
 	"name": "jodit",
-	"version": "4.13.26",
+	"version": "4.14.0",
 	"description": "Jodit is an awesome and useful wysiwyg editor with filebrowser",
 	"main": "esm/index.js",
 	"types": "types/index.d.ts",

package/types/core/dom/dom.d.ts

@@ -8,7 +8,7 @@
  * @packageDocumentation
  * @module dom
  */
-import type { HTMLTagNames, ICreate, IDictionary, IJodit, NodeCondition, Nullable } from "../../types/index";
+import type { HTMLTagNames, ICreate, IDictionary, IJodit, NodeCondition, Nullable, VHTMLElement, VNode } from "../../types/index";
 /**
  * Module for working with DOM
  */
@@ -17,7 +17,7 @@ export declare class Dom {
     /**
      * Remove all content from element
      */
-    static detach(node: Nullable<Node>): void;
+    static detach(node: Nullable<VNode>): void;
     /**
      * Wrap all inline next siblings
      */
@@ -32,7 +32,7 @@ export declare class Dom {
     /**
      * Remove parent of node and insert this node instead that parent
      */
-    static unwrap(node: Node): void;
+    static unwrap(node: VNode): void;
     /**
      * Call callback for all nodes between `start` and `end` in document order
      * (`start` and `end` are not included). Iteration stops when the callback returns `true`.
@@ -140,6 +140,11 @@ export declare class Dom {
      * Get last matched node inside root
      */
     static last(root: Nullable<Node>, condition: NodeCondition): Nullable<Node>;
+    /**
+     * Depth-first search for the first matched node inside root:
+     * in document order (`reverse = false`) or in reverse order
+     */
+    private static __deepMost;
     /**
      * Find previous node
      */
@@ -150,6 +155,7 @@ export declare class Dom {
     static next<T extends Node = Node>(node: Node, condition: NodeCondition, root: HTMLElement, withChild?: boolean): Nullable<T>;
     static prevWithClass(node: HTMLElement, className: string): Nullable<HTMLElement>;
     static nextWithClass(node: HTMLElement, className: string): Nullable<HTMLElement>;
+    private static __siblingWithClass;
     /**
      * Find next/prev node what `condition(next) === true`
      */
@@ -197,6 +203,7 @@ export declare class Dom {
      * Returns the previous (`left = true`) or next sibling of the node
      */
     static sibling(node: Node, left?: boolean): Nullable<Node>;
+    static sibling(node: VNode, left?: boolean): Nullable<VNode>;
     /**
      * It goes through all the elements in ascending order, and checks to see if they meet the predetermined condition
      *
@@ -219,28 +226,29 @@ export declare class Dom {
     /**
      * Append new element in the start of root
      */
-    static appendChildFirst(root: HTMLElement, newElement: HTMLElement | DocumentFragment): void;
+    static appendChildFirst(root: VNode, newElement: VNode): void;
     /**
      * Insert newElement after element
      */
-    static after(elm: Node, newElement: Node | DocumentFragment): void;
+    static after(elm: VNode, newElement: VNode): void;
     /**
      * Insert newElement before element
      */
-    static before(elm: Node, newElement: Node | DocumentFragment): void;
+    static before(elm: VNode, newElement: VNode): void;
     /**
      * Insert newElement as first child inside element
      */
-    static prepend(root: Node, newElement: Node | DocumentFragment): void;
+    static prepend(root: VNode, newElement: VNode): void;
     /**
      * Insert newElement as last child inside element
      */
-    static append(root: Node, newElements: Array<Node | DocumentFragment>): void;
-    static append(root: Node, newElement: Node | DocumentFragment): void;
+    static append(root: VNode, newElements: VNode[]): void;
+    static append(root: VNode, newElement: VNode): void;
     /**
      * Move all content to another element
      */
     static moveContent(from: Node, to: Node, inStart?: boolean, filter?: (node: Node) => boolean): void;
+    static moveContent(from: VNode, to: VNode, inStart?: boolean, filter?: (node: VNode) => boolean): void;
     /**
      * Check root contains child or equal child
      */
@@ -259,11 +267,11 @@ export declare class Dom {
     /**
      * Hide element
      */
-    static hide(node: Nullable<HTMLElement>): void;
+    static hide(node: Nullable<VHTMLElement>): void;
     /**
      * Show element
      */
-    static show(node: Nullable<HTMLElement>): void;
+    static show(node: Nullable<VHTMLElement>): void;
     /**
      * Check if element is some tag
      */
@@ -286,8 +294,8 @@ export declare class Dom {
      */
     static replaceTemporaryFromString(value: string): string;
     /**
-     * Get temporary list
-     * @deprecated Just do not use it, it is not needed anymore
+     * Collect the temporary elements (`data-jodit-temp`) inside the root.
+     * A plain tree walk on purpose: no selector engine, works on VNode.
      */
     static temporaryList(root: HTMLElement): HTMLElement[];
 }

package/types/core/helpers/utils/align.d.ts

@@ -15,7 +15,4 @@ export declare function hAlignElement(image: HTMLElement, align: ImageHAlign): v
  * Remove text-align style for all selected children
  */
 export declare function clearAlign(node: Node): void;
-/**
- * Apply align for element
- */
 export declare function alignElement(command: string, box: HTMLElement): void;

package/types/core/helpers/utils/attr.d.ts

@@ -6,7 +6,7 @@
 /**
  * @module helpers/utils
  */
-import type { IDictionary } from "../../../types/index";
+import type { IDictionary, VElement } from "../../../types/index";
 /**
  * Get attribute
  */
@@ -23,3 +23,5 @@ export declare function attr(elm: Element, key: string, value: string | number |
  * Set or remove several attributes
  */
 export declare function attr(elm: Element, attributes: IDictionary<string | number | boolean | null>): null;
+export declare function attrRaw(elm: VElement, name: string): null | string;
+export declare function attrRaw(elm: VElement, name: string, value: string | null): void;

package/types/core/helpers/utils/css.d.ts

@@ -6,13 +6,30 @@
 /**
  * @module helpers/utils
  */
-import type { IStyle, StyleValue } from "../../../types/index";
+import type { IStyle, StyleValue, VHTMLElement } from "../../../types/index";
 export declare function css(element: HTMLElement, key: 'left' | 'top' | 'bottom' | 'right' | 'width' | 'min' | 'max' | 'height' | 'margin' | 'padding' | 'fontsize' | 'font-size'): number;
 export declare function css(element: HTMLElement, key: keyof CSSStyleDeclaration): string | number;
 export declare function css(element: HTMLElement, key: string | IStyle): string | number;
 export declare function css(element: HTMLElement, key: string | IStyle, value: StyleValue): string | number;
+/**
+ * @deprecated Use `cssInline(element, key)` for an exact inline read.
+ * The boolean mode still normalizes the value (`'0px'` → `0`, `bold` → `700`).
+ */
 export declare function css(element: HTMLElement, key: string | IStyle, onlyStyleMode: boolean): string | number;
 /**
  * Clear center align
  */
+/**
+ * Read the exact inline value of a CSS property (the `style` attribute).
+ * Unlike `css()` it never touches computed styles (no layout access) and does
+ * not normalize the result, so it is safe for exact string comparisons and
+ * save/restore. Returns an empty string when the property is not set inline.
+ *
+ * @example
+ * ```js
+ * cssInline(elm, 'zIndex'); // '' or '100'
+ * cssInline(elm, 'width'); // '0px' (css(elm, 'width', true) would return 0)
+ * ```
+ */
+export declare function cssInline(element: VHTMLElement, key: string): string;
 export declare const clearCenterAlign: (image: HTMLElement) => void;

package/types/modules/dialog/dialog.d.ts

@@ -124,6 +124,12 @@ export declare class Dialog extends ViewWithToolbar implements IDialog {
      * ```
      */
     setFooter(content: Content): this;
+    /**
+     * Registry of the currently opened dialogs. Replaces a DOM scan of the
+     * whole `destination` (usually `document.body`) for every z-index update.
+     */
+    private static readonly __opened;
+    private __openedSiblings;
     /**
      * Get zIndex from dialog
      */

package/types/types/index.d.ts

@@ -27,5 +27,6 @@ export * from "./traits";
 export * from "./types";
 export * from "./ui";
 export * from "./uploader";
+export * from "./vdom";
 export * from "./view";
 export * from "./messages";

package/types/types/vdom.d.ts

@@ -0,0 +1,96 @@
+/*!
+ * Jodit Editor (https://xdsoft.net/jodit/)
+ * Released under MIT see LICENSE.txt in the project root for license information.
+ * Copyright (c) 2013-2026 Valerii Chupurnov. All rights reserved. https://xdsoft.net
+ */
+/**
+ * @module types
+ */
+/**
+ * Virtual DOM interfaces.
+ *
+ * A minimal structural subset of the browser DOM: every browser `Node`,
+ * `Element`, `HTMLElement`, `Text`, `Document` and `DocumentFragment`
+ * satisfies the matching interface below, so they can be passed anywhere
+ * these types are expected. The `Dom` module (and the low-level helpers)
+ * must rely only on this subset — this is the contract that will let the
+ * editor switch to virtual-DOM editing without rewriting the call sites.
+ *
+ * Keep these interfaces as small as possible: add a member only when the
+ * `Dom` module (or `attr`/`css` helpers) really needs it.
+ */
+/**
+ * Minimal subset of the browser `Node`
+ */
+export interface VNode {
+    readonly nodeType: number;
+    readonly nodeName: string;
+    nodeValue: string | null;
+    textContent: string | null;
+    readonly parentNode: VNode | null;
+    readonly parentElement: VHTMLElement | null;
+    readonly firstChild: VNode | null;
+    readonly lastChild: VNode | null;
+    readonly previousSibling: VNode | null;
+    readonly nextSibling: VNode | null;
+    readonly childNodes: ArrayLike<VNode>;
+    readonly ownerDocument: VDocument | null;
+    appendChild(node: VNode): VNode;
+    insertBefore(node: VNode, child: VNode | null): VNode;
+    removeChild(child: VNode): VNode;
+    replaceChild(node: VNode, child: VNode): VNode;
+    contains(other: VNode | null): boolean;
+}
+/**
+ * Minimal subset of the browser `Attr`
+ */
+export interface VAttr {
+    readonly name: string;
+    readonly value: string;
+}
+/**
+ * Minimal subset of the browser `DOMTokenList`
+ */
+export interface VTokenList {
+    readonly length: number;
+    add(...tokens: string[]): void;
+    remove(...tokens: string[]): void;
+    contains(token: string): boolean;
+    toggle(token: string, force?: boolean): boolean;
+}
+/**
+ * Minimal subset of the browser `Element`
+ */
+export interface VElement extends VNode {
+    readonly tagName: string;
+    readonly attributes: ArrayLike<VAttr>;
+    readonly classList: VTokenList;
+    className: string;
+    getAttribute(name: string): string | null;
+    setAttribute(name: string, value: string): void;
+    removeAttribute(name: string): void;
+    hasAttribute(name: string): boolean;
+}
+/**
+ * Minimal subset of the browser `CSSStyleDeclaration`
+ */
+export interface VStyle {
+    getPropertyValue(property: string): string;
+    setProperty(property: string, value: string | null): void;
+    removeProperty(property: string): string;
+}
+/**
+ * Minimal subset of the browser `HTMLElement`
+ */
+export interface VHTMLElement extends VElement {
+    readonly style: VStyle;
+}
+/**
+ * Minimal subset of the browser `Document`. Text nodes and fragments add
+ * nothing to `VNode` structurally, so they are typed as `VNode`.
+ */
+export interface VDocument {
+    createElement(tagName: string): VHTMLElement;
+    createTextNode(data: string): VNode;
+    createDocumentFragment(): VNode;
+}