@stencil/mock-doc 5.0.0-alpha.2 → 5.0.0-alpha.21

package/README.md

@@ -0,0 +1,133 @@
+# @stencil/mock-doc
+
+A minimal mock DOM implementation for server-side rendering and unit testing of Stencil components.
+
+## Install
+
+```bash
+npm install --save-dev @stencil/mock-doc
+```
+
+## Usage
+
+### `createDocument(html?)` — lightweight document only
+
+Use this when you only need a `Document` with no surrounding `window` object:
+
+```ts
+import { createDocument, serializeNodeToHtml } from '@stencil/mock-doc';
+
+const doc = createDocument('<div class="greeting">Hello</div>');
+const el = doc.querySelector('.greeting');
+el.textContent = 'Hello, world!';
+
+console.log(serializeNodeToHtml(el, { outerHtml: true }));
+// <div class="greeting">Hello, world!</div>
+```
+
+### `MockWindow(html?)` — full window environment
+
+Use this when your code accesses `window`, `location`, `navigator`, `localStorage`, etc.:
+
+```ts
+import { MockWindow, serializeNodeToHtml } from '@stencil/mock-doc';
+
+const win = new MockWindow('<html><body><my-comp></my-comp></body></html>');
+const doc = win.document;
+
+const el = doc.querySelector('my-comp');
+el.setAttribute('label', 'Hello');
+
+const html = serializeNodeToHtml(doc);
+```
+
+### `parseHtmlToDocument` / `parseHtmlToFragment`
+
+Parse an HTML string into a `Document` or a `DocumentFragment`:
+
+```ts
+import { parseHtmlToDocument, parseHtmlToFragment } from '@stencil/mock-doc';
+
+const doc = parseHtmlToDocument('<p>Hello</p>');
+const frag = parseHtmlToFragment('<li>one</li><li>two</li>');
+```
+
+### `serializeNodeToHtml(node, options?)`
+
+Serialize any node back to an HTML string. Useful for snapshot tests and SSR output.
+
+```ts
+import { serializeNodeToHtml } from '@stencil/mock-doc';
+
+// Pretty-printed output
+const pretty = serializeNodeToHtml(doc, { prettyHtml: true });
+
+// Outer HTML of a single element (includes the element's own tag)
+const outer = serializeNodeToHtml(el, { outerHtml: true });
+
+// Serialize shadow roots as Declarative Shadow DOM
+const dsd = serializeNodeToHtml(doc, {
+  serializeShadowRoot: 'declarative-shadow-dom',
+});
+```
+
+Key options:
+
+| Option | Default | Description |
+|---|---|---|
+| `prettyHtml` | `false` | Indent and add newlines |
+| `indentSpaces` | `2` (when pretty) | Spaces per indent level |
+| `outerHtml` | `false` | Include the root element's own tag |
+| `removeEmptyAttributes` | `true` | Strip attributes with empty string values |
+| `removeHtmlComments` | `false` | Strip HTML comments |
+| `serializeShadowRoot` | — | `'declarative-shadow-dom'` or `'scoped'` |
+| `fullDocument` | `false` | Always emit a full `<!DOCTYPE html>` document |
+
+### `setupGlobal` / `teardownGlobal` — test framework integration
+
+Installs a `MockWindow` onto `global` so that `window`, `document`, `customElements`, etc. are available without a browser. Call in `beforeEach`/`afterEach` to get a fresh environment per test:
+
+```ts
+import { setupGlobal, teardownGlobal } from '@stencil/mock-doc';
+
+beforeEach(() => setupGlobal(global));
+afterEach(() => teardownGlobal(global));
+
+it('reads document.title', () => {
+  document.title = 'My Page';
+  expect(document.title).toBe('My Page');
+});
+```
+
+`setupGlobal` returns the `MockWindow` it created, which you can use to reach `window`-level APIs directly if needed.
+
+### `patchWindow(win)` — fill gaps in a partial window
+
+Useful when running in an environment that has _some_ browser globals but is missing others (e.g. a custom SSR runtime):
+
+```ts
+import { patchWindow } from '@stencil/mock-doc';
+
+patchWindow(globalThis); // fills in any missing window APIs with mock implementations
+```
+
+### Fetch mocks
+
+Use `MockRequest`, `MockResponse`, and `MockHeaders` to test code that calls `fetch` without hitting the network:
+
+```ts
+import { MockRequest, MockResponse, MockHeaders } from '@stencil/mock-doc';
+
+// Simulate an incoming request
+const req = new MockRequest('/api/data', { method: 'POST' });
+console.log(req.method); // 'POST'
+console.log(req.url);    // 'http://localhost/api/data'
+
+// Build a response your handler returns
+const res = new MockResponse(JSON.stringify({ ok: true }), {
+  status: 200,
+  headers: new MockHeaders({ 'content-type': 'application/json' }),
+});
+
+const body = await res.json(); // { ok: true }
+```

package/dist/index.d.mts

@@ -164,12 +164,16 @@ declare class MockResizeObserver {
 //#endregion
 //#region src/shadow-root.d.ts
 declare class MockShadowRoot extends MockDocumentFragment {
+  private _mode;
+  private _delegatesFocus;
   get activeElement(): HTMLElement | null;
   get cloneable(): boolean;
   get delegatesFocus(): boolean;
+  set delegatesFocus(value: boolean);
   get fullscreenElement(): HTMLElement | null;
   get host(): HTMLElement | null;
   get mode(): 'open' | 'closed';
+  set mode(value: 'open' | 'closed');
   get pictureInPictureElement(): HTMLElement | null;
   get pointerLockElement(): HTMLElement | null;
   get serializable(): boolean;
@@ -215,7 +219,7 @@ declare class MockWindow {
   __allowInterval: boolean;
   URL: typeof URL;
   console: Console;
-  customElements: CustomElementRegistry;
+  customElements: CustomElementRegistry | null;
   document: Document;
   performance: Performance;
   devicePixelRatio: number;
@@ -429,7 +433,7 @@ declare class MockWindow {
   onwebkitfullscreenerror(): void;
   onwheel(): void;
 }
-declare function cloneWindow(srcWin: Window, opts?: {
+declare function cloneWindow(srcWin: Window | MockWindow, opts?: {
   customElementProxy?: boolean;
 }): MockWindow | null;
 declare function cloneDocument(srcDoc: Document): Document;
@@ -438,7 +442,7 @@ declare function cloneDocument(srcDoc: Document): Document;
  * only allow setInterval() to fire once, also constrained to 1ms.
  * @param win the mock window instance to update
  */
-declare function constrainTimeouts(win: any): void;
+declare function constrainTimeouts(win: MockWindow): void;
 //#endregion
 //#region src/event.d.ts
 declare class MockEvent {

package/dist/index.mjs

@@ -6,7 +6,7 @@ var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
 var __getOwnPropNames = Object.getOwnPropertyNames;
 var __getProtoOf = Object.getPrototypeOf;
 var __hasOwnProp = Object.prototype.hasOwnProperty;
-var __commonJSMin = (cb, mod) => () => (mod || cb((mod = { exports: {} }).exports, mod), mod.exports);
+var __commonJSMin = (cb, mod) => () => (mod || (cb((mod = { exports: {} }).exports, mod), cb = null), mod.exports);
 var __copyProps = (to, from, except, desc) => {
 	if (from && typeof from === "object" || typeof from === "function") for (var keys = __getOwnPropNames(from), i = 0, n = keys.length, key; i < n; i++) {
 		key = keys[i];
@@ -48,13 +48,6 @@ let NODE_TYPES = /* @__PURE__ */ function(NODE_TYPES) {
 	NODE_TYPES[NODE_TYPES["DOCUMENT_FRAGMENT_NODE"] = 11] = "DOCUMENT_FRAGMENT_NODE";
 	return NODE_TYPES;
 }({});
-let NODE_NAMES = /* @__PURE__ */ function(NODE_NAMES) {
-	NODE_NAMES["COMMENT_NODE"] = "#comment";
-	NODE_NAMES["DOCUMENT_NODE"] = "#document";
-	NODE_NAMES["DOCUMENT_FRAGMENT_NODE"] = "#document-fragment";
-	NODE_NAMES["TEXT_NODE"] = "#text";
-	return NODE_NAMES;
-}({});
 //#endregion
 //#region src/attribute.ts
 const attrHandler = { get(obj, prop) {
@@ -63,6 +56,7 @@ const attrHandler = { get(obj, prop) {
 } };
 const createAttributeProxy = (caseInsensitive) => new Proxy(new MockAttributeMap(caseInsensitive), attrHandler);
 var MockAttributeMap = class {
+	caseInsensitive;
 	__items = [];
 	constructor(caseInsensitive = false) {
 		this.caseInsensitive = caseInsensitive;
@@ -285,6 +279,7 @@ function jsCaseToCssCase(str) {
 //#endregion
 //#region src/custom-element-registry.ts
 var MockCustomElementRegistry = class {
+	win;
 	__registry;
 	__whenDefined;
 	constructor(win) {
@@ -389,7 +384,7 @@ const proxyElements = /* @__PURE__ */ new WeakMap();
 const upgradedElements = /* @__PURE__ */ new WeakSet();
 function connectNode(ownerDocument, node) {
 	node.ownerDocument = ownerDocument;
-	if (node.nodeType === NODE_TYPES.ELEMENT_NODE) {
+	if (node.nodeType === 1) {
 		if (ownerDocument != null && node.nodeName.includes("-")) {
 			if (ownerDocument.defaultView != null && typeof node.connectedCallback === "function" && node.isConnected) fireConnectedCallback(node);
 			const shadowRoot = node.shadowRoot;
@@ -414,7 +409,7 @@ function fireConnectedCallback(node) {
 	}
 }
 function disconnectNode(node) {
-	if (node.nodeType === NODE_TYPES.ELEMENT_NODE) {
+	if (node.nodeType === 1) {
 		if (node.nodeName.includes("-") === true && typeof node.disconnectedCallback === "function") {
 			if (tempDisableCallbacks.has(node.ownerDocument) === false) try {
 				node.disconnectedCallback();
@@ -508,7 +503,7 @@ var MockEvent = class {
 		let currentElement = this.target;
 		while (currentElement) {
 			composedPath.push(currentElement);
-			if (!currentElement.parentElement && currentElement.nodeName === NODE_NAMES.DOCUMENT_NODE) {
+			if (!currentElement.parentElement && currentElement.nodeName === "#document") {
 				composedPath.push(currentElement.defaultView);
 				break;
 			}
@@ -639,7 +634,7 @@ function triggerEventListener(elm, ev) {
 		}
 	});
 	if (ev.bubbles === false) return;
-	if (elm.nodeName === NODE_NAMES.DOCUMENT_NODE) triggerEventListener(elm.defaultView, ev);
+	if (elm.nodeName === "#document") triggerEventListener(elm.defaultView, ev);
 	else if (elm.parentElement == null && elm.tagName === "HTML") triggerEventListener(elm.ownerDocument, ev);
 	else triggerEventListener(getNextEventTarget(elm, ev), ev);
 }
@@ -688,7 +683,7 @@ function getParser(ownerDocument) {
 	if (parseOptions != null) return parseOptions;
 	parseOptions = { treeAdapter: {
 		createDocument() {
-			const doc = ownerDocument.createElement(NODE_NAMES.DOCUMENT_NODE);
+			const doc = ownerDocument.createElement("#document");
 			doc["x-mode"] = "no-quirks";
 			return doc;
 		},
@@ -727,7 +722,7 @@ function getParser(ownerDocument) {
 			return templateElement.content;
 		},
 		setDocumentType(doc, name, publicId, systemId) {
-			let doctypeNode = doc.childNodes.find((n) => n.nodeType === NODE_TYPES.DOCUMENT_TYPE_NODE);
+			let doctypeNode = doc.childNodes.find((n) => n.nodeType === 10);
 			if (doctypeNode == null) {
 				doctypeNode = ownerDocument.createDocumentTypeNode();
 				doc.insertBefore(doctypeNode, doc.firstChild);
@@ -748,12 +743,12 @@ function getParser(ownerDocument) {
 		},
 		insertText(parentNode, text) {
 			const lastChild = parentNode.lastChild;
-			if (lastChild != null && lastChild.nodeType === NODE_TYPES.TEXT_NODE) lastChild.nodeValue += text;
+			if (lastChild != null && lastChild.nodeType === 3) lastChild.nodeValue += text;
 			else parentNode.appendChild(ownerDocument.createTextNode(text));
 		},
 		insertTextBefore(parentNode, text, referenceNode) {
 			const prevNode = parentNode.childNodes[parentNode.childNodes.indexOf(referenceNode) - 1];
-			if (prevNode != null && prevNode.nodeType === NODE_TYPES.TEXT_NODE) prevNode.nodeValue += text;
+			if (prevNode != null && prevNode.nodeType === 3) prevNode.nodeValue += text;
 			else parentNode.insertBefore(ownerDocument.createTextNode(text), referenceNode);
 		},
 		adoptAttributes(recipient, attrs) {
@@ -805,16 +800,16 @@ function getParser(ownerDocument) {
 			return doctypeNode["x-systemId"];
 		},
 		isTextNode(node) {
-			return node.nodeType === NODE_TYPES.TEXT_NODE;
+			return node.nodeType === 3;
 		},
 		isCommentNode(node) {
-			return node.nodeType === NODE_TYPES.COMMENT_NODE;
+			return node.nodeType === 8;
 		},
 		isDocumentTypeNode(node) {
-			return node.nodeType === NODE_TYPES.DOCUMENT_TYPE_NODE;
+			return node.nodeType === 10;
 		},
 		isElementNode(node) {
-			return node.nodeType === NODE_TYPES.ELEMENT_NODE;
+			return node.nodeType === 1;
 		}
 	} };
 	docParser.set(ownerDocument, parseOptions);
@@ -888,8 +883,8 @@ const shadowRootTag = "mock:shadow-root";
 * @yields the serialized HTML in chunks
 */
 function* streamToHtml(node, opts, output) {
-	const isShadowRoot = node.nodeType === NODE_TYPES.DOCUMENT_FRAGMENT_NODE;
-	if (node.nodeType === NODE_TYPES.ELEMENT_NODE || isShadowRoot) {
+	const isShadowRoot = node.nodeType === 11;
+	if (node.nodeType === 1 || isShadowRoot) {
 		const tagName = isShadowRoot ? shadowRootTag : getTagName(node);
 		if (tagName === "body") output.isWithinBody = true;
 		const ignoreTag = opts.excludeTags != null && opts.excludeTags.includes(tagName);
@@ -925,7 +920,7 @@ function* streamToHtml(node, opts, output) {
 				const attr = attributes.item(i);
 				const attrName = attr.name;
 				if (attrName === "style") continue;
-				if (tag === "template" && isShadowRoot && (attrName === "shadowrootmode" || attrName === "shadowrootdelegatesfocus")) continue;
+				if (tag === "template" && isShadowRoot && (attrName === "shadowrootmode" || attrName === "shadowrootdelegatesfocus" || attrName === "shadowrootcustomelementregistry")) continue;
 				let attrValue = attr.value;
 				if (opts.removeEmptyAttributes && attrValue === "" && REMOVE_EMPTY_ATTR.has(attrName)) continue;
 				const attrNamespaceURI = attr.namespaceURI;
@@ -988,7 +983,7 @@ function* streamToHtml(node, opts, output) {
 				yield* streamToHtml(shadowRoot, opts, output);
 				output.indent = output.indent - (opts.indentSpaces ?? 0);
 				const childNodes = getChildNodes(node);
-				if (opts.newLines && (childNodes.length === 0 || childNodes.length === 1 && childNodes[0].nodeType === NODE_TYPES.TEXT_NODE && childNodes[0].nodeValue?.trim() === "")) {
+				if (opts.newLines && (childNodes.length === 0 || childNodes.length === 1 && childNodes[0].nodeType === 3 && childNodes[0].nodeValue?.trim() === "")) {
 					yield "\n";
 					output.currentLineWidth = 0;
 					for (let i = 0; i < output.indent; i++) yield " ";
@@ -999,7 +994,7 @@ function* streamToHtml(node, opts, output) {
 				const tag = tagName === shadowRootTag ? "template" : tagName;
 				const childNodes = tagName === "template" ? node.content.childNodes : getChildNodes(node);
 				const childNodeLength = childNodes.length;
-				if (childNodeLength > 0) if (childNodeLength === 1 && childNodes[0].nodeType === NODE_TYPES.TEXT_NODE && (typeof childNodes[0].nodeValue !== "string" || childNodes[0].nodeValue.trim() === "")) {} else {
+				if (childNodeLength > 0) if (childNodeLength === 1 && childNodes[0].nodeType === 3 && (typeof childNodes[0].nodeValue !== "string" || childNodes[0].nodeValue.trim() === "")) {} else {
 					const isWithinWhitespaceSensitiveNode = opts.newLines || (opts.indentSpaces ?? 0) > 0 ? isWithinWhitespaceSensitive(node) : false;
 					if (!isWithinWhitespaceSensitiveNode && (opts.indentSpaces ?? 0) > 0 && ignoreTag === false) output.indent = output.indent + (opts.indentSpaces ?? 0);
 					for (let i = 0; i < childNodeLength; i++) {
@@ -1041,7 +1036,7 @@ function* streamToHtml(node, opts, output) {
 			output.currentLineWidth = 0;
 		}
 		if (tagName === "body") output.isWithinBody = false;
-	} else if (node.nodeType === NODE_TYPES.TEXT_NODE) {
+	} else if (node.nodeType === 3) {
 		let textContent = node.nodeValue;
 		if (typeof textContent === "string") {
 			const trimmedTextContent = textContent.trim();
@@ -1068,7 +1063,7 @@ function* streamToHtml(node, opts, output) {
 				}
 				let textContentLength = textContent.length;
 				if (textContentLength > 0) {
-					const parentTagName = node.parentNode != null && node.parentNode.nodeType === NODE_TYPES.ELEMENT_NODE ? node.parentNode.nodeName : null;
+					const parentTagName = node.parentNode != null && node.parentNode.nodeType === 1 ? node.parentNode.nodeName : null;
 					if (typeof parentTagName === "string" && NON_ESCAPABLE_CONTENT.has(parentTagName)) {
 						if (isWithinWhitespaceSensitive(node)) yield textContent;
 						else {
@@ -1082,13 +1077,13 @@ function* streamToHtml(node, opts, output) {
 					} else {
 						if (isWithinWhitespaceSensitive(node)) output.currentLineWidth += textContentLength;
 						else {
-							if (/\s/.test(textContent.charAt(0))) textContent = " " + textContent.trimLeft();
+							if (/\s/.test(textContent.charAt(0))) textContent = " " + textContent.trimStart();
 							textContentLength = textContent.length;
 							if (textContentLength > 1) {
 								if (/\s/.test(textContent.charAt(textContentLength - 1))) if (opts.approximateLineWidth && opts.approximateLineWidth > 0 && output.currentLineWidth + textContentLength > opts.approximateLineWidth) {
-									textContent = textContent.trimRight() + "\n";
+									textContent = textContent.trimEnd() + "\n";
 									output.currentLineWidth = 0;
-								} else textContent = textContent.trimRight() + " ";
+								} else textContent = textContent.trimEnd() + " ";
 							}
 							output.currentLineWidth += textContentLength;
 						}
@@ -1097,7 +1092,7 @@ function* streamToHtml(node, opts, output) {
 				}
 			}
 		}
-	} else if (node.nodeType === NODE_TYPES.COMMENT_NODE) {
+	} else if (node.nodeType === 8) {
 		const nodeValue = node.nodeValue;
 		const isHydrateAnnotation = nodeValue?.startsWith("r.") || nodeValue?.startsWith("o.") || nodeValue?.startsWith("s.") || nodeValue?.startsWith("t.");
 		/**
@@ -1116,7 +1111,7 @@ function* streamToHtml(node, opts, output) {
 		}
 		yield "<!--" + nodeValue + "-->";
 		if (nodeValue) output.currentLineWidth += nodeValue.length + 7;
-	} else if (node.nodeType === NODE_TYPES.DOCUMENT_TYPE_NODE) yield "<!doctype html>";
+	} else if (node.nodeType === 10) yield "<!doctype html>";
 }
 const AMP_REGEX = /&/g;
 const NBSP_REGEX = /\u00a0/g;
@@ -1163,11 +1158,7 @@ const NON_ESCAPABLE_CONTENT = new Set([
 	"STYLE",
 	"SCRIPT",
 	"IFRAME",
-	"NOSCRIPT",
-	"XMP",
-	"NOEMBED",
-	"NOFRAMES",
-	"PLAINTEXT"
+	"NOSCRIPT"
 ]);
 /**
 * A list of whitespace sensitive tag names, such as `code`, `pre`, etc.
@@ -1175,7 +1166,6 @@ const NON_ESCAPABLE_CONTENT = new Set([
 const WHITESPACE_SENSITIVE = new Set([
 	"CODE",
 	"OUTPUT",
-	"PLAINTEXT",
 	"PRE",
 	"SCRIPT",
 	"TEMPLATE",
@@ -1184,21 +1174,16 @@ const WHITESPACE_SENSITIVE = new Set([
 const EMPTY_ELEMENTS = new Set([
 	"area",
 	"base",
-	"basefont",
-	"bgsound",
 	"br",
 	"col",
 	"embed",
-	"frame",
 	"hr",
 	"img",
 	"input",
-	"keygen",
 	"link",
 	"meta",
 	"param",
 	"source",
-	"trace",
 	"track",
 	"wbr"
 ]);
@@ -1216,44 +1201,29 @@ const BOOLEAN_ATTR = new Set([
 	"autofocus",
 	"autoplay",
 	"checked",
-	"compact",
 	"controls",
-	"declare",
 	"default",
-	"defaultchecked",
-	"defaultmuted",
-	"defaultselected",
 	"defer",
 	"disabled",
-	"enabled",
 	"formnovalidate",
 	"hidden",
-	"indeterminate",
 	"inert",
 	"ismap",
 	"itemscope",
 	"loop",
 	"multiple",
 	"muted",
-	"nohref",
 	"nomodule",
-	"noresize",
-	"noshade",
 	"novalidate",
-	"nowrap",
 	"open",
-	"pauseonexit",
 	"readonly",
 	"required",
 	"reversed",
-	"scoped",
-	"seamless",
 	"selected",
+	"shadowrootclonable",
+	"shadowrootcustomelementregistry",
 	"shadowrootdelegatesfocus",
-	"sortable",
-	"truespeed",
-	"typemustmatch",
-	"visible"
+	"shadowrootserializable"
 ]);
 const STRUCTURE_ELEMENTS = new Set([
 	"html",
@@ -1270,6 +1240,8 @@ const STRUCTURE_ELEMENTS = new Set([
 //#endregion
 //#region src/token-list.ts
 var MockTokenList = class {
+	elm;
+	attr;
 	constructor(elm, attr) {
 		this.elm = elm;
 		this.attr = attr;
@@ -1352,7 +1324,7 @@ var MockNode = class {
 		this._childNodes = value;
 	}
 	appendChild(newNode) {
-		if (newNode.nodeType === NODE_TYPES.DOCUMENT_FRAGMENT_NODE) {
+		if (newNode.nodeType === 11) {
 			const nodes = newNode.childNodes.slice();
 			for (const child of nodes) this.appendChild(child);
 		} else {
@@ -1383,22 +1355,20 @@ var MockNode = class {
 		const DOCUMENT_POSITION_DISCONNECTED = 1;
 		const DOCUMENT_POSITION_PRECEDING = 2;
 		const DOCUMENT_POSITION_FOLLOWING = 4;
-		const DOCUMENT_POSITION_CONTAINS = 8;
-		const DOCUMENT_POSITION_CONTAINED_BY = 16;
 		if (this === other) return 0;
 		let thisRoot = this;
 		while (thisRoot.parentNode) thisRoot = thisRoot.parentNode;
 		let otherRoot = other;
 		while (otherRoot.parentNode) otherRoot = otherRoot.parentNode;
-		if (thisRoot !== otherRoot) return DOCUMENT_POSITION_DISCONNECTED | DOCUMENT_POSITION_PRECEDING;
+		if (thisRoot !== otherRoot) return 3;
 		let node = other;
 		while (node) {
-			if (node === this) return DOCUMENT_POSITION_CONTAINS | DOCUMENT_POSITION_PRECEDING;
+			if (node === this) return 10;
 			node = node.parentNode;
 		}
 		node = this;
 		while (node) {
-			if (node === other) return DOCUMENT_POSITION_CONTAINED_BY | DOCUMENT_POSITION_FOLLOWING;
+			if (node === other) return 20;
 			node = node.parentNode;
 		}
 		const getAncestors = (n) => {
@@ -1426,16 +1396,16 @@ var MockNode = class {
 		return this.childNodes[0] || null;
 	}
 	insertBefore(newNode, referenceNode) {
-		if (newNode.nodeType === NODE_TYPES.DOCUMENT_FRAGMENT_NODE) for (let i = 0, ii = newNode.childNodes.length; i < ii; i++) insertBefore(this, newNode.childNodes[i], referenceNode);
+		if (newNode.nodeType === 11) for (let i = 0, ii = newNode.childNodes.length; i < ii; i++) insertBefore(this, newNode.childNodes[i], referenceNode);
 		else insertBefore(this, newNode, referenceNode);
 		return newNode;
 	}
 	get isConnected() {
 		let node = this;
 		while (node != null) {
-			if (node.nodeType === NODE_TYPES.DOCUMENT_NODE) return true;
+			if (node.nodeType === 9) return true;
 			node = node.parentNode;
-			if (node != null && node.nodeType === NODE_TYPES.DOCUMENT_FRAGMENT_NODE) node = node.host;
+			if (node != null && node.nodeType === 11) node = node.host;
 		}
 		return false;
 	}
@@ -1481,7 +1451,7 @@ var MockNode = class {
 		const index = this.childNodes.indexOf(childNode);
 		if (index > -1) {
 			this.childNodes.splice(index, 1);
-			if (this.nodeType === NODE_TYPES.ELEMENT_NODE) {
+			if (this.nodeType === 1) {
 				const wasConnected = this.isConnected;
 				childNode.parentNode = null;
 				if (wasConnected === true) disconnectNode(childNode);
@@ -1550,7 +1520,7 @@ var MockElement = class extends MockNode {
 		} });
 	}
 	constructor(ownerDocument, nodeName, namespaceURI = null) {
-		super(ownerDocument, NODE_TYPES.ELEMENT_NODE, typeof nodeName === "string" ? nodeName : null, null);
+		super(ownerDocument, 1, typeof nodeName === "string" ? nodeName : null, null);
 		this.__namespaceURI = namespaceURI;
 		this.__localName = typeof nodeName === "string" ? nodeName : null;
 		this.__shadowRoot = null;
@@ -1561,6 +1531,7 @@ var MockElement = class extends MockNode {
 	}
 	attachShadow(_opts) {
 		const shadowRoot = this.ownerDocument.createDocumentFragment();
+		shadowRoot.mode = _opts.mode ?? "open";
 		shadowRoot.delegatesFocus = _opts.delegatesFocus ?? false;
 		this.shadowRoot = shadowRoot;
 		return shadowRoot;
@@ -1624,10 +1595,10 @@ var MockElement = class extends MockNode {
 		this.__attributeMap = attrs;
 	}
 	get children() {
-		return this.childNodes.filter((n) => n.nodeType === NODE_TYPES.ELEMENT_NODE);
+		return this.childNodes.filter((n) => n.nodeType === 1);
 	}
 	get childElementCount() {
-		return this.childNodes.filter((n) => n.nodeType === NODE_TYPES.ELEMENT_NODE).length;
+		return this.childNodes.filter((n) => n.nodeType === 1).length;
 	}
 	get className() {
 		return this.getAttributeNS(null, "class") || "";
@@ -1820,7 +1791,7 @@ var MockElement = class extends MockNode {
 	}
 	get nextElementSibling() {
 		const parentElement = this.parentElement;
-		if (parentElement != null && (parentElement.nodeType === NODE_TYPES.ELEMENT_NODE || parentElement.nodeType === NODE_TYPES.DOCUMENT_FRAGMENT_NODE || parentElement.nodeType === NODE_TYPES.DOCUMENT_NODE)) {
+		if (parentElement != null && (parentElement.nodeType === 1 || parentElement.nodeType === 11 || parentElement.nodeType === 9)) {
 			const index = parentElement.children.indexOf(this) + 1;
 			return parentElement.children[index] || null;
 		}
@@ -1835,7 +1806,7 @@ var MockElement = class extends MockNode {
 	}
 	get previousElementSibling() {
 		const parentElement = this.parentElement;
-		if (parentElement != null && (parentElement.nodeType === NODE_TYPES.ELEMENT_NODE || parentElement.nodeType === NODE_TYPES.DOCUMENT_FRAGMENT_NODE || parentElement.nodeType === NODE_TYPES.DOCUMENT_NODE)) {
+		if (parentElement != null && (parentElement.nodeType === 1 || parentElement.nodeType === 11 || parentElement.nodeType === 9)) {
 			const index = parentElement.children.indexOf(this) - 1;
 			return parentElement.children[index] || null;
 		}
@@ -2094,7 +2065,7 @@ function insertBefore(parentNode, newNode, referenceNode) {
 var MockHTMLElement = class extends MockElement {
 	__namespaceURI = "http://www.w3.org/1999/xhtml";
 	constructor(ownerDocument, nodeName) {
-		super(ownerDocument, typeof nodeName === "string" ? nodeName.toUpperCase() : null);
+		super(ownerDocument, nodeName ? nodeName.toUpperCase() : null);
 	}
 	get tagName() {
 		return this.nodeName ?? "";
@@ -2126,7 +2097,7 @@ var MockHTMLElement = class extends MockElement {
 };
 var MockTextNode = class MockTextNode extends MockNode {
 	constructor(ownerDocument, text) {
-		super(ownerDocument, NODE_TYPES.TEXT_NODE, NODE_NAMES.TEXT_NODE, text);
+		super(ownerDocument, 3, "#text", text);
 	}
 	cloneNode(_deep) {
 		return new MockTextNode(null, this.nodeValue);
@@ -2148,7 +2119,7 @@ var MockTextNode = class MockTextNode extends MockNode {
 			const text = [];
 			for (let i = 0, ii = this.parentNode.childNodes.length; i < ii; i++) {
 				const childNode = this.parentNode.childNodes[i];
-				if (childNode.nodeType === NODE_TYPES.TEXT_NODE) text.push(childNode.nodeValue);
+				if (childNode.nodeType === 3) text.push(childNode.nodeValue);
 			}
 			return text.join("");
 		}
@@ -2158,8 +2129,8 @@ var MockTextNode = class MockTextNode extends MockNode {
 function getTextContent(childNodes, text) {
 	for (let i = 0, ii = childNodes.length; i < ii; i++) {
 		const childNode = childNodes[i];
-		if (childNode.nodeType === NODE_TYPES.TEXT_NODE) text.push(childNode.nodeValue);
-		else if (childNode.nodeType === NODE_TYPES.ELEMENT_NODE) getTextContent(childNode.childNodes, text);
+		if (childNode.nodeType === 3) text.push(childNode.nodeValue);
+		else if (childNode.nodeType === 1) getTextContent(childNode.childNodes, text);
 	}
 }
 function setTextContent(elm, text) {
@@ -2204,7 +2175,7 @@ function unmarkAsDispatching(target, eventType) {
 //#region src/comment-node.ts
 var MockComment = class MockComment extends MockNode {
 	constructor(ownerDocument, data) {
-		super(ownerDocument, NODE_TYPES.COMMENT_NODE, NODE_NAMES.COMMENT_NODE, data);
+		super(ownerDocument, 8, "#comment", data);
 	}
 	cloneNode(_deep) {
 		return new MockComment(null, this.nodeValue);
@@ -3359,8 +3330,8 @@ var import_nwsapi = /* @__PURE__ */ __toESM((/* @__PURE__ */ __commonJSMin(((exp
 var MockDocumentFragment = class MockDocumentFragment extends MockHTMLElement {
 	constructor(ownerDocument) {
 		super(ownerDocument, null);
-		this.nodeName = NODE_NAMES.DOCUMENT_FRAGMENT_NODE;
-		this.nodeType = NODE_TYPES.DOCUMENT_FRAGMENT_NODE;
+		this.nodeName = "#document-fragment";
+		this.nodeType = 11;
 	}
 	getElementById(id) {
 		return getElementById(this, id);
@@ -3375,7 +3346,7 @@ var MockDocumentFragment = class MockDocumentFragment extends MockHTMLElement {
 		const cloned = new MockDocumentFragment(null);
 		if (deep) for (let i = 0, ii = this.childNodes.length; i < ii; i++) {
 			const childNode = this.childNodes[i];
-			if (childNode.nodeType === NODE_TYPES.ELEMENT_NODE || childNode.nodeType === NODE_TYPES.TEXT_NODE || childNode.nodeType === NODE_TYPES.COMMENT_NODE) {
+			if (childNode.nodeType === 1 || childNode.nodeType === 3 || childNode.nodeType === 8) {
 				const clonedChildNode = this.childNodes[i].cloneNode(true);
 				cloned.appendChild(clonedChildNode);
 			}
@@ -3388,13 +3359,14 @@ var MockDocumentFragment = class MockDocumentFragment extends MockHTMLElement {
 var MockDocumentTypeNode = class extends MockHTMLElement {
 	constructor(ownerDocument) {
 		super(ownerDocument, "!DOCTYPE");
-		this.nodeType = NODE_TYPES.DOCUMENT_TYPE_NODE;
+		this.nodeType = 10;
 		this.setAttribute("html", "");
 	}
 };
 //#endregion
 //#region src/css-style-sheet.ts
 var MockCSSRule = class {
+	parentStyleSheet;
 	cssText = "";
 	type = 0;
 	constructor(parentStyleSheet) {
@@ -3882,8 +3854,8 @@ var MockSlotElement = class MockSlotElement extends MockHTMLElement {
 		const ownerHost = this.getRootNode().host;
 		if (!ownerHost) return nodesToReturn;
 		if (ownerHost.childNodes.length) {
-			if (this.name) nodesToReturn = ownerHost.childNodes.filter((n) => n.nodeType === NODE_TYPES.ELEMENT_NODE && n.getAttribute("slot") === this.name);
-			else nodesToReturn = ownerHost.childNodes.filter((n) => n.nodeType === NODE_TYPES.ELEMENT_NODE && !n.getAttribute("slot") || n.nodeType !== NODE_TYPES.ELEMENT_NODE);
+			if (this.name) nodesToReturn = ownerHost.childNodes.filter((n) => n.nodeType === 1 && n.getAttribute("slot") === this.name);
+			else nodesToReturn = ownerHost.childNodes.filter((n) => n.nodeType === 1 && !n.getAttribute("slot") || n.nodeType !== 1);
 			if (nodesToReturn.length) return nodesToReturn;
 		}
 		if (!opts?.flatten) return this.childNodes.filter((n) => !(n instanceof MockSlotElement));
@@ -4687,6 +4659,8 @@ var MockResizeObserver = class {
 //#endregion
 //#region src/shadow-root.ts
 var MockShadowRoot = class extends MockDocumentFragment {
+	_mode = "open";
+	_delegatesFocus = false;
 	get activeElement() {
 		return null;
 	}
@@ -4694,7 +4668,10 @@ var MockShadowRoot = class extends MockDocumentFragment {
 		return false;
 	}
 	get delegatesFocus() {
-		return false;
+		return this._delegatesFocus;
+	}
+	set delegatesFocus(value) {
+		this._delegatesFocus = value;
 	}
 	get fullscreenElement() {
 		return null;
@@ -4708,7 +4685,10 @@ var MockShadowRoot = class extends MockDocumentFragment {
 		return null;
 	}
 	get mode() {
-		return "open";
+		return this._mode;
+	}
+	set mode(value) {
+		this._mode = value;
 	}
 	get pictureInPictureElement() {
 		return null;
@@ -5308,8 +5288,8 @@ var MockDocument = class MockDocument extends MockHTMLElement {
 	#nwsapi = null;
 	constructor(html = null, win = null) {
 		super(null, null);
-		this.nodeName = NODE_NAMES.DOCUMENT_NODE;
-		this.nodeType = NODE_TYPES.DOCUMENT_NODE;
+		this.nodeName = "#document";
+		this.nodeType = 9;
 		this.defaultView = win;
 		this.cookie = "";
 		this.referrer = "";
@@ -5400,7 +5380,7 @@ var MockDocument = class MockDocument extends MockHTMLElement {
 		return documentElement;
 	}
 	set documentElement(documentElement) {
-		for (let i = this.childNodes.length - 1; i >= 0; i--) if (this.childNodes[i].nodeType !== NODE_TYPES.DOCUMENT_TYPE_NODE) this.childNodes[i].remove();
+		for (let i = this.childNodes.length - 1; i >= 0; i--) if (this.childNodes[i].nodeType !== 10) this.childNodes[i].remove();
 		if (documentElement != null) {
 			this.appendChild(documentElement);
 			setOwnerDocument(documentElement, this);
@@ -5452,7 +5432,7 @@ var MockDocument = class MockDocument extends MockHTMLElement {
 		return new MockAttr(attrName, "", namespaceURI);
 	}
 	createElement(tagName) {
-		if (tagName === NODE_NAMES.DOCUMENT_NODE) {
+		if (tagName === "#document") {
 			const doc = new MockDocument(false);
 			doc.nodeName = tagName;
 			doc.parentNode = null;
@@ -5524,10 +5504,10 @@ function resetDocument(doc) {
 		}
 		for (const key in doc) if (doc.hasOwnProperty(key) && !DOC_KEY_KEEPERS.has(key)) delete doc[key];
 		try {
-			doc.nodeName = NODE_NAMES.DOCUMENT_NODE;
+			doc.nodeName = "#document";
 		} catch {}
 		try {
-			doc.nodeType = NODE_TYPES.DOCUMENT_NODE;
+			doc.nodeType = 9;
 		} catch {}
 		try {
 			doc.cookie = "";
@@ -5571,7 +5551,7 @@ function getElementsByName(elm, elmName, foundElms = []) {
 function setOwnerDocument(elm, ownerDocument) {
 	for (let i = 0, ii = elm.childNodes.length; i < ii; i++) {
 		elm.childNodes[i].ownerDocument = ownerDocument;
-		if (elm.childNodes[i].nodeType === NODE_TYPES.ELEMENT_NODE) setOwnerDocument(elm.childNodes[i], ownerDocument);
+		if (elm.childNodes[i].nodeType === 1) setOwnerDocument(elm.childNodes[i], ownerDocument);
 	}
 }
 //#endregion

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@stencil/mock-doc",
-  "version": "5.0.0-alpha.2",
+  "version": "5.0.0-alpha.21",
   "description": "A minimal mock DOM implementation for SSR and testing",
   "keywords": [
     "dom",
@@ -32,14 +32,14 @@
     }
   },
   "dependencies": {
-    "nwsapi": "^2.2.23",
-    "parse5": "7.2.1"
+    "nwsapi": "^2.0.0",
+    "parse5": "^8.0.0"
   },
   "devDependencies": {
-    "@stencil/vitest": "^1.9.3",
-    "tsdown": "^0.21.6",
-    "typescript": "~6.0.2",
-    "vitest": "^4.1.1"
+    "@stencil/vitest": "^1.12.1",
+    "tsdown": ">=0.21.0 <1.0.0",
+    "typescript": ">4.0.0 <7.0.0",
+    "vitest": "^4.1.7"
   },
   "volta": {
     "extends": "../../package.json"