dom-predicates

Functions for determining if an object resembles a DOM Node of various types (from any Realm) via duck typing.

Note: jsdom nodes are supported and without having to define globals such as window and document.

Installation

Node.js >= 10 is required. To install, type this at the command line:

npm install dom-predicates

Importing

ES Module:

import {isHTMLElementNode} from 'dom-predicates';

CommonJS Module:

const {isHTMLElementNode} = require('dom-predicates');

Functions

isAttachedNode(node)

Determine if node exists within any DOM tree.

const div = document.createElement('div');
isAttachedNode(div); //-> false

document.body.append(div);
isAttachedNode(div); //-> true

isCustomElementNode(node[, registry])

Determine if node is a custom HTMLElement defined within registry (a CustomElementRegistry). The value of registry will default to window.customElements (for the Realm where this library was imported) within a web browser.

isCustomElementNode(document.createElement('my-component'), customElements); //-> true or false
isCustomElementNode(document.createElement('div'), customElements); //-> false

isCustomElementRegistry(registry)

Determine if registry is a CustomElementRegistry.

isCustomElementRegistry(window.customElements); //-> true

isDocumentFragmentNode(node)

Determine if node is a DocumentFragment.

isDocumentFragmentNode(document.createDocumentFragment()); //-> true
isDocumentFragmentNode(document); //-> false

isDocumentNode(node)

Determine if node is a Document (or subclass).

isDocumentNode(document); //-> true
isDocumentNode(document.implementation.createDocument(null, 'xml')); //-> true
isDocumentNode(document.body); //-> false

isDocumentTypeNode(node)

Determine if node is a DocumentType.

isDocumentTypeNode(document.doctype); //-> true or false
isDocumentTypeNode(document.implementation.createDocumentType('html', '', '')); //-> true
isDocumentTypeNode(document); //-> false

isElementNode(node)

Determine if node is an Element (or subclass).

isElementNode(document.createElement('div')); //-> true
isElementNode(document.createElementNS('http://www.w3.org/2000/svg', 'path')); //-> true
isElementNode(document.createTextNode('content')); //-> false

isHTMLDocumentNode(node)

Determine if node is an HTMLDocument.

isHTMLDocumentNode(document); //-> true or false
isHTMLDocumentNode(document.implementation.createHTMLDocument()); //-> true
isHTMLDocumentNode(document.implementation.createDocument(null, 'xml')); //-> false
isHTMLDocumentNode(document.body); //-> false

isHTMLElementNode(node[, tagName])

Determine if node is an HTMLElement (or subclass).

isHTMLElementNode(document.createElement('div')); //-> true
isHTMLElementNode(document.createElementNS('http://www.w3.org/2000/svg', 'div')); //-> false

With the optional tagName argument:

isHTMLElementNode(document.createElement('div'), 'div'); //-> true
isHTMLElementNode(document.createElement('div'), 'span'); //-> false

isKnownElementNode(node)

Determine if node has a known tag name in relation to its type (HTMLElement or SVGElement). This does not include CustomElementRegistry.

isKnownElementNode(document.createElement('div')); //-> true
isKnownElementNode(document.createElementNS('http://www.w3.org/2000/svg', 'path')); //-> true
isKnownElementNode(document.createElement('non-existent')); //-> false

isNode(node)

Determine if node is a Node (or subclass).

isNode(document.createElement('div')); //-> true
isNode(document.createTextNode('content')); //-> true

isProcessingInstructionNode(node)

Determine if node is a ProcessingInstruction.

isProcessingInstructionNode(document.createProcessingInstruction('xml', '')); //-> true
isProcessingInstructionNode(document); //-> false

isSelfClosingElementNode(node)

Determine if node is a void HTMLElement or a known self-closing SVGElement.

isSelfClosingElementNode(document.createElement('input')); //-> true
isSelfClosingElementNode(document.createElementNS('http://www.w3.org/2000/svg', 'input')); //-> false

isSelfClosingElementNode(document.createElementNS('http://www.w3.org/2000/svg', 'path')); //-> true
isSelfClosingElementNode(document.createElement('path')); //-> false

isSVGDocumentNode(node)

Determine if node is an XMLDocument with an SVG namespace.

isSVGDocumentNode(document); //-> true or false
isSVGDocumentNode(document.implementation.createDocument('http://www.w3.org/2000/svg', 'svg')); //-> true

isSVGDocumentNode(document.implementation.createDocument(null, 'xml')); //-> false
isSVGDocumentNode(document.implementation.createHTMLDocument()); //-> false
isSVGDocumentNode(document.body); //-> false

isSVGElementNode(node[, tagName])

Determine if node is an SVGElement (or subclass).

isSVGElementNode(document.createElementNS('http://www.w3.org/2000/svg', 'path')); //-> true
isSVGElementNode(document.createElement('path')); //-> false

With the optional tagName argument:

isSVGElementNode(document.createElementNS('http://www.w3.org/2000/svg', 'path'), 'path'); //-> true
isSVGElementNode(document.createElementNS('http://www.w3.org/2000/svg', 'path'), 'circle'); //-> false

isTextNode(node)

Determine if node is a Text (or subclass).

isTextNode(document.createTextNode('')); //-> true
isTextNode(document.createCDATASection('')); //-> true
isTextNode(document.createElement('div')); //-> false

isVoidHTMLElementNode(node)

Determine if node is a void HTMLElement.

isVoidHTMLElementNode(document.createElement('input')); //-> true
isVoidHTMLElementNode(document.createElementNS('http://www.w3.org/2000/svg', 'input')); //-> false
isVoidHTMLElementNode(document.createElement('div')); //-> false

isXHTMLDocumentNode(node)

Determine if node is an XMLDocument with an XHTML namespace.

isXHTMLDocumentNode(document); //-> true or false
isXHTMLDocumentNode(document.implementation.createDocument('http://www.w3.org/1999/xhtml', 'html')); //-> true
isXHTMLDocumentNode(document.implementation.createHTMLDocument()); //-> false
isXHTMLDocumentNode(document.body); //-> false

isXMLDocumentNode(node)

Determine if node is an XMLDocument (with any namespace).

isXMLDocumentNode(document); //-> true or false
isXMLDocumentNode(document.implementation.createDocument(null, 'xml')); //-> true
isXMLDocumentNode(document.implementation.createDocument('http://www.w3.org/1999/xhtml', 'html')); //-> true
isXMLDocumentNode(document.implementation.createHTMLDocument()); //-> false
isXMLDocumentNode(document.body); //-> false

Compatibility

Depending on your target browsers, you may need polyfills/shims for the following:

• globalThis
• Set
• String::endsWith

FAQ

1. Why is there no isXHTMLElementNode()?
   Because it's impossible to differentiate. All HTML elements (non-SVG, etc) within an XHTML document are still instances of HTMLElement and all HTML elements within HTML and XHTML documents (excluding HTML4 and below) have an XHTML namespace by default.

2. Why are HTML4 and DOM3 features not supported?
   Because they're deprecated and shouldn't be used.