pseudo-dom 0.17.0 → 1.0.0
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/README.md +63 -5869
- package/browser/pseudo-dom.js +14889 -15288
- package/dist/classes/PseudoEventListener.d.ts +11 -37
- package/dist/classes/PseudoEventListener.js +11 -37
- package/dist/classes/PseudoHTMLDocument.d.ts +4 -12
- package/dist/classes/PseudoHTMLDocument.js +1 -11
- package/dist/classes/PseudoNodeList.d.ts +1 -9
- package/dist/classes/PseudoNodeList.js +1 -9
- package/dist/factories/createDataset.d.ts +1 -3
- package/dist/factories/createDataset.js +3 -8
- package/dist/factories/createEvent.d.ts +5 -9
- package/dist/factories/createEvent.js +3 -5
- package/dist/factories/createStyleDeclaration.d.ts +4 -10
- package/dist/factories/createStyleDeclaration.js +4 -10
- package/dist/factories/cssSelectAdapter.d.ts +0 -2
- package/dist/factories/cssSelectAdapter.js +3 -8
- package/dist/factories/eventDefaults.d.ts +5 -9
- package/dist/factories/eventDefaults.js +1 -4
- package/dist/factories/generateDocument.d.ts +2 -4
- package/dist/factories/generateDocument.js +2 -13
- package/dist/factories/generateNodeList.d.ts +1 -2
- package/dist/factories/generateNodeList.js +1 -2
- package/dist/factories/installGlobal.d.ts +2 -3
- package/dist/factories/installGlobal.js +3 -6
- package/dist/factories/logElement.d.ts +2 -4
- package/dist/factories/logElement.js +3 -7
- package/dist/factories/parseHTML.d.ts +3 -5
- package/dist/factories/parseHTML.js +4 -8
- package/dist/factories/query.d.ts +8 -16
- package/dist/factories/query.js +9 -19
- package/dist/factories/serializeHTML.d.ts +4 -10
- package/dist/factories/serializeHTML.js +12 -25
- package/dist/functions/activeElement.d.ts +3 -6
- package/dist/functions/activeElement.js +3 -6
- package/dist/functions/getElementById.d.ts +2 -4
- package/dist/functions/getElementById.js +2 -4
- package/dist/functions/getParentNodes.d.ts +1 -3
- package/dist/functions/getParentNodes.js +1 -3
- package/dist/functions/getParentNodesFromAttribute.d.ts +3 -5
- package/dist/functions/getParentNodesFromAttribute.js +3 -5
- package/dist/functions/modifierState.d.ts +3 -12
- package/dist/functions/modifierState.js +3 -7
- package/dist/interfaces/PseudoCSSStyleDeclaration.d.ts +1 -1
- package/dist/interfaces/PseudoDocument.d.ts +4 -9
- package/dist/interfaces/PseudoDocumentFragment.d.ts +1 -2
- package/dist/interfaces/PseudoElement.d.ts +39 -78
- package/dist/interfaces/PseudoEvent.d.ts +11 -43
- package/dist/interfaces/PseudoEvent.js +1 -3
- package/dist/interfaces/PseudoEventTarget.d.ts +7 -16
- package/dist/interfaces/PseudoHTMLCollection.d.ts +2 -4
- package/dist/interfaces/PseudoHTMLElement.d.ts +8 -13
- package/dist/interfaces/PseudoNode.d.ts +3 -13
- package/dist/main.d.ts +1 -6
- package/dist/main.js +1 -6
- package/dist/services/AttrService.d.ts +5 -9
- package/dist/services/AttrService.js +5 -9
- package/dist/services/CSSStyleDeclarationService.d.ts +10 -23
- package/dist/services/CSSStyleDeclarationService.js +10 -23
- package/dist/services/CustomEventService.d.ts +4 -15
- package/dist/services/CustomEventService.js +3 -10
- package/dist/services/DOMTokenListService.d.ts +2 -5
- package/dist/services/DOMTokenListService.js +2 -5
- package/dist/services/DocumentFragmentService.d.ts +1 -5
- package/dist/services/DocumentFragmentService.js +1 -5
- package/dist/services/DocumentService.d.ts +4 -12
- package/dist/services/DocumentService.js +4 -12
- package/dist/services/ElementService.d.ts +62 -120
- package/dist/services/ElementService.js +61 -117
- package/dist/services/EventService.d.ts +6 -44
- package/dist/services/EventService.js +18 -44
- package/dist/services/EventTargetService.d.ts +16 -28
- package/dist/services/EventTargetService.js +16 -28
- package/dist/services/FocusEventService.d.ts +4 -12
- package/dist/services/FocusEventService.js +3 -10
- package/dist/services/HTMLCollectionService.d.ts +6 -16
- package/dist/services/HTMLCollectionService.js +6 -16
- package/dist/services/HTMLElementService.d.ts +132 -154
- package/dist/services/HTMLElementService.js +333 -353
- package/dist/services/InputEventService.d.ts +5 -16
- package/dist/services/InputEventService.js +3 -12
- package/dist/services/KeyboardEventService.d.ts +8 -26
- package/dist/services/KeyboardEventService.js +4 -16
- package/dist/services/MouseEventService.d.ts +7 -30
- package/dist/services/MouseEventService.js +4 -18
- package/dist/services/NamedNodeMapService.d.ts +1 -4
- package/dist/services/NamedNodeMapService.js +1 -4
- package/dist/services/NodeService.d.ts +38 -69
- package/dist/services/NodeService.js +39 -72
- package/dist/services/PointerEventService.d.ts +4 -22
- package/dist/services/PointerEventService.js +3 -15
- package/dist/services/ShadowRootService.d.ts +0 -3
- package/dist/services/ShadowRootService.js +0 -3
- package/dist/services/UIEventService.d.ts +5 -17
- package/dist/services/UIEventService.js +3 -11
- package/dist/simulate.d.ts +7 -9
- package/dist/simulate.js +9 -15
- package/package.json +8 -7
|
@@ -18,21 +18,14 @@ const PseudoHTMLDocument_1 = __importDefault(require('../classes/PseudoHTMLDocum
|
|
|
18
18
|
/**
|
|
19
19
|
* Construct the Pseudo Dom to provide access to Dom objects which are otherwise not available outside the browser
|
|
20
20
|
* context.
|
|
21
|
-
* @
|
|
22
|
-
* @param
|
|
23
|
-
* @param {Object} context
|
|
24
|
-
* @returns {Window|PseudoEventTarget}
|
|
21
|
+
* @param root
|
|
22
|
+
* @param context
|
|
25
23
|
*/
|
|
26
24
|
const generateDocument = (root, context = {}) => {
|
|
27
|
-
/**
|
|
28
|
-
*
|
|
29
|
-
* @type {Window|PseudoEventTarget}
|
|
30
|
-
*/
|
|
31
25
|
const newWindow = typeof root.document === 'undefined' ? root : new EventTargetService_1.default()
|
|
32
26
|
/**
|
|
33
27
|
* The Node class itself (matching the DOM's window.Node), not an instance - the right-hand side of `instanceof`
|
|
34
28
|
* must be a constructor, so `x instanceof Node` needs this, not `new PseudoNode()`.
|
|
35
|
-
* @type {Function}
|
|
36
29
|
*/
|
|
37
30
|
const Node = root.Node || NodeService_1.NodeService
|
|
38
31
|
if (typeof newWindow.Node === 'undefined') {
|
|
@@ -40,7 +33,6 @@ const generateDocument = (root, context = {}) => {
|
|
|
40
33
|
}
|
|
41
34
|
/**
|
|
42
35
|
* The Element class itself, for the same reason as Node.
|
|
43
|
-
* @type {Function}
|
|
44
36
|
*/
|
|
45
37
|
const Element = root.Element || ElementService_1.ElementService
|
|
46
38
|
if (typeof newWindow.Element === 'undefined') {
|
|
@@ -48,7 +40,6 @@ const generateDocument = (root, context = {}) => {
|
|
|
48
40
|
}
|
|
49
41
|
/**
|
|
50
42
|
* The HTMLElement class itself, for the same reason as Node.
|
|
51
|
-
* @type {Function}
|
|
52
43
|
*/
|
|
53
44
|
const HTMLElement = root.HTMLElement || HTMLElementService_1.HTMLElementService
|
|
54
45
|
if (typeof newWindow.HTMLElement === 'undefined') {
|
|
@@ -57,7 +48,6 @@ const generateDocument = (root, context = {}) => {
|
|
|
57
48
|
/**
|
|
58
49
|
* The HTMLDocument class itself, for the same reason as Node (so `document instanceof HTMLDocument`, a common
|
|
59
50
|
* real-DOM-detection check, works).
|
|
60
|
-
* @type {Function}
|
|
61
51
|
*/
|
|
62
52
|
const HTMLDocument = root.HTMLDocument || PseudoHTMLDocument_1.default
|
|
63
53
|
if (typeof newWindow.HTMLDocument === 'undefined') {
|
|
@@ -66,7 +56,6 @@ const generateDocument = (root, context = {}) => {
|
|
|
66
56
|
/**
|
|
67
57
|
* Define document when not available - a real instance, unlike the classes above (window.document IS an object,
|
|
68
58
|
* not a constructor).
|
|
69
|
-
* @type {Document|PseudoHTMLDocument}
|
|
70
59
|
*/
|
|
71
60
|
const document = root.document || new PseudoHTMLDocument_1.default()
|
|
72
61
|
if (typeof newWindow.document === 'undefined') {
|
|
@@ -2,8 +2,7 @@ import { PseudoNodeList } from '../classes/PseudoNodeList';
|
|
|
2
2
|
import { TreeLinker } from 'collect-your-stuff/dist/collections/linked-tree-list/TreeLinker';
|
|
3
3
|
/**
|
|
4
4
|
* Create a PseudoNodeList, optionally starting from an existing chain of linkers.
|
|
5
|
-
* @param
|
|
6
|
-
* @returns {PseudoNodeList}
|
|
5
|
+
* @param innerList
|
|
7
6
|
*/
|
|
8
7
|
declare const generateNodeList: (innerList?: TreeLinker | null) => PseudoNodeList;
|
|
9
8
|
export default generateNodeList;
|
|
@@ -6,8 +6,7 @@ Object.defineProperty(exports, '__esModule', {
|
|
|
6
6
|
const PseudoNodeList_1 = require('../classes/PseudoNodeList')
|
|
7
7
|
/**
|
|
8
8
|
* Create a PseudoNodeList, optionally starting from an existing chain of linkers.
|
|
9
|
-
* @param
|
|
10
|
-
* @returns {PseudoNodeList}
|
|
9
|
+
* @param innerList
|
|
11
10
|
*/
|
|
12
11
|
const generateNodeList = (innerList = null) => new PseudoNodeList_1.PseudoNodeList().initialize(innerList)
|
|
13
12
|
exports.default = generateNodeList
|
|
@@ -6,10 +6,9 @@
|
|
|
6
6
|
* real browser's global scope - some code checks for a bare `window` before falling back to `global`), so code
|
|
7
7
|
* written against a real DOM's globals works as-is. Does nothing when a real DOM is already there, matching
|
|
8
8
|
* generateDocument's own only-fill-what-is-missing behaviour - calling this is always safe, in any environment.
|
|
9
|
-
* @
|
|
10
|
-
* @param {*} [target] The object to add document / Node / Element / HTMLElement / window onto - defaults to
|
|
9
|
+
* @param target The object to add document / Node / Element / HTMLElement / window onto - defaults to
|
|
11
10
|
* globalThis, so bare `document`, `Node`, `window`, etc. resolve from anywhere once this has run
|
|
12
|
-
* @returns
|
|
11
|
+
* @returns The same target, for convenience
|
|
13
12
|
*/
|
|
14
13
|
declare const installGlobal: (target?: any) => any;
|
|
15
14
|
export default installGlobal;
|
|
@@ -11,11 +11,9 @@ Object.defineProperty(exports, '__esModule', {
|
|
|
11
11
|
value: true
|
|
12
12
|
})
|
|
13
13
|
/**
|
|
14
|
-
*
|
|
14
|
+
* Makes pseudo-dom a drop-in swap for a real DOM: code written against bare globals (document.createElement,
|
|
15
15
|
* new Node(), ...) works unmodified, in the browser or in Node, without an if (typeof document === 'undefined')
|
|
16
16
|
* check at every call site.
|
|
17
|
-
* @author Joshua Heagle <joshuaheagle@gmail.com>
|
|
18
|
-
* @version 1.0.0
|
|
19
17
|
*/
|
|
20
18
|
const browser_or_node_1 = require('browser-or-node')
|
|
21
19
|
const generateDocument_1 = __importDefault(require('./generateDocument'))
|
|
@@ -27,10 +25,9 @@ const generateDocument_1 = __importDefault(require('./generateDocument'))
|
|
|
27
25
|
* real browser's global scope - some code checks for a bare `window` before falling back to `global`), so code
|
|
28
26
|
* written against a real DOM's globals works as-is. Does nothing when a real DOM is already there, matching
|
|
29
27
|
* generateDocument's own only-fill-what-is-missing behaviour - calling this is always safe, in any environment.
|
|
30
|
-
* @
|
|
31
|
-
* @param {*} [target] The object to add document / Node / Element / HTMLElement / window onto - defaults to
|
|
28
|
+
* @param target The object to add document / Node / Element / HTMLElement / window onto - defaults to
|
|
32
29
|
* globalThis, so bare `document`, `Node`, `window`, etc. resolve from anywhere once this has run
|
|
33
|
-
* @returns
|
|
30
|
+
* @returns The same target, for convenience
|
|
34
31
|
*/
|
|
35
32
|
const installGlobal = (target = typeof globalThis !== 'undefined' ? globalThis : {}) => {
|
|
36
33
|
if (!browser_or_node_1.isBrowser) {
|
|
@@ -1,9 +1,7 @@
|
|
|
1
1
|
/**
|
|
2
2
|
* Print a node's markup to the console, indented for readability (see prettyPrint).
|
|
3
|
-
* @
|
|
4
|
-
* @param
|
|
5
|
-
* @param {string} [label=''] A label printed above the markup, to identify this log call
|
|
6
|
-
* @returns {undefined}
|
|
3
|
+
* @param node
|
|
4
|
+
* @param label A label printed above the markup, to identify this log call
|
|
7
5
|
*/
|
|
8
6
|
declare const logElement: (node: any, label?: string) => void;
|
|
9
7
|
export default logElement;
|
|
@@ -4,18 +4,14 @@ Object.defineProperty(exports, '__esModule', {
|
|
|
4
4
|
value: true
|
|
5
5
|
})
|
|
6
6
|
/**
|
|
7
|
-
*
|
|
7
|
+
* Prints an element (or any node) to the console, readably - the point of pseudo-dom running headlessly is
|
|
8
8
|
* usually to watch what code does to a tree without a real browser to look at.
|
|
9
|
-
* @author Joshua Heagle <joshuaheagle@gmail.com>
|
|
10
|
-
* @version 1.0.0
|
|
11
9
|
*/
|
|
12
10
|
const serializeHTML_1 = require('./serializeHTML')
|
|
13
11
|
/**
|
|
14
12
|
* Print a node's markup to the console, indented for readability (see prettyPrint).
|
|
15
|
-
* @
|
|
16
|
-
* @param
|
|
17
|
-
* @param {string} [label=''] A label printed above the markup, to identify this log call
|
|
18
|
-
* @returns {undefined}
|
|
13
|
+
* @param node
|
|
14
|
+
* @param label A label printed above the markup, to identify this log call
|
|
19
15
|
*/
|
|
20
16
|
const logElement = (node, label = '') => {
|
|
21
17
|
console.log(`${label ? `${label}\n` : ''}${(0, serializeHTML_1.prettyPrint)(node)}`)
|
|
@@ -1,11 +1,9 @@
|
|
|
1
1
|
/**
|
|
2
2
|
* Parse an HTML string into the nodes it describes (siblings at the top level, exactly like the DOM's own HTML
|
|
3
3
|
* parsing does for innerHTML / insertAdjacentHTML - there is no single root unless the markup itself has one).
|
|
4
|
-
* @
|
|
5
|
-
* @param
|
|
6
|
-
* @param
|
|
7
|
-
* @param {function(new: *, {tagName: string})} ElementClass The class to build each parsed element with
|
|
8
|
-
* @returns {Array<*>}
|
|
4
|
+
* @param html
|
|
5
|
+
* @param ownerDocument The document the new nodes belong to (matches what innerHTML etc. would set), or null
|
|
6
|
+
* @param ElementClass The class to build each parsed element with
|
|
9
7
|
*/
|
|
10
8
|
declare const parseHTML: (html: string, ownerDocument: any, ElementClass: new (options: {
|
|
11
9
|
tagName: string;
|
|
@@ -4,7 +4,7 @@ Object.defineProperty(exports, '__esModule', {
|
|
|
4
4
|
value: true
|
|
5
5
|
})
|
|
6
6
|
/**
|
|
7
|
-
*
|
|
7
|
+
* Parses an HTML string into pseudo-dom nodes, for innerHTML / outerHTML / insertAdjacentHTML. Built on
|
|
8
8
|
* htmlparser2's Parser (a SAX-style tokenizer) with a custom handler which builds pseudo-dom nodes directly -
|
|
9
9
|
* htmlparser2's own default DomHandler / domutils tree (which this never uses) is stubbed out of the browser bundle
|
|
10
10
|
* by the browser.ignore config, the same way css-select's unused default adapter already is.
|
|
@@ -12,19 +12,15 @@ Object.defineProperty(exports, '__esModule', {
|
|
|
12
12
|
* The class to build parsed elements with is given by the caller (rather than imported here) so this has no
|
|
13
13
|
* dependency on ElementService / HTMLElementService - importing either here, from a factory ElementService itself
|
|
14
14
|
* would need to call, would create an import cycle.
|
|
15
|
-
* @author Joshua Heagle <joshuaheagle@gmail.com>
|
|
16
|
-
* @version 1.0.0
|
|
17
15
|
*/
|
|
18
16
|
const htmlparser2_1 = require('htmlparser2')
|
|
19
17
|
const NodeService_1 = require('../services/NodeService')
|
|
20
18
|
/**
|
|
21
19
|
* Parse an HTML string into the nodes it describes (siblings at the top level, exactly like the DOM's own HTML
|
|
22
20
|
* parsing does for innerHTML / insertAdjacentHTML - there is no single root unless the markup itself has one).
|
|
23
|
-
* @
|
|
24
|
-
* @param
|
|
25
|
-
* @param
|
|
26
|
-
* @param {function(new: *, {tagName: string})} ElementClass The class to build each parsed element with
|
|
27
|
-
* @returns {Array<*>}
|
|
21
|
+
* @param html
|
|
22
|
+
* @param ownerDocument The document the new nodes belong to (matches what innerHTML etc. would set), or null
|
|
23
|
+
* @param ElementClass The class to build each parsed element with
|
|
28
24
|
*/
|
|
29
25
|
const parseHTML = (html, ownerDocument, ElementClass) => {
|
|
30
26
|
const roots = []
|
|
@@ -1,33 +1,25 @@
|
|
|
1
1
|
/**
|
|
2
2
|
* All of the elements below (not including) scope which match the selector, in tree order.
|
|
3
|
-
* @
|
|
4
|
-
* @param
|
|
5
|
-
* @param {*} scope The node to search below
|
|
6
|
-
* @returns {Array<*>}
|
|
3
|
+
* @param selector A CSS selector
|
|
4
|
+
* @param scope The node to search below
|
|
7
5
|
*/
|
|
8
6
|
export declare const querySelectorAll: (selector: string, scope: any) => Array<any>;
|
|
9
7
|
/**
|
|
10
8
|
* The first element below (not including) scope which matches the selector, in tree order, or null when there is none.
|
|
11
|
-
* @
|
|
12
|
-
* @param
|
|
13
|
-
* @param {*} scope The node to search below
|
|
14
|
-
* @returns {*|null}
|
|
9
|
+
* @param selector A CSS selector
|
|
10
|
+
* @param scope The node to search below
|
|
15
11
|
*/
|
|
16
12
|
export declare const querySelector: (selector: string, scope: any) => any | null;
|
|
17
13
|
/**
|
|
18
14
|
* Whether an element itself (not its descendants) matches the selector.
|
|
19
|
-
* @
|
|
20
|
-
* @param
|
|
21
|
-
* @param {string} selector A CSS selector
|
|
22
|
-
* @returns {boolean}
|
|
15
|
+
* @param element The element to test
|
|
16
|
+
* @param selector A CSS selector
|
|
23
17
|
*/
|
|
24
18
|
export declare const matches: (element: any, selector: string) => boolean;
|
|
25
19
|
/**
|
|
26
20
|
* The nearest ancestor of an element (starting with the element itself) which matches the selector, or null when
|
|
27
21
|
* none of them do.
|
|
28
|
-
* @
|
|
29
|
-
* @param
|
|
30
|
-
* @param {string} selector A CSS selector
|
|
31
|
-
* @returns {*|null}
|
|
22
|
+
* @param element The element to start from
|
|
23
|
+
* @param selector A CSS selector
|
|
32
24
|
*/
|
|
33
25
|
export declare const closest: (element: any, selector: string) => any | null;
|
package/dist/factories/query.js
CHANGED
|
@@ -5,19 +5,15 @@ Object.defineProperty(exports, '__esModule', {
|
|
|
5
5
|
})
|
|
6
6
|
exports.closest = exports.matches = exports.querySelector = exports.querySelectorAll = void 0
|
|
7
7
|
/**
|
|
8
|
-
*
|
|
8
|
+
* Selector queries (querySelector, querySelectorAll, matches, closest), built on css-select and the
|
|
9
9
|
* cssSelectAdapter which lets it query pseudo-dom's own tree.
|
|
10
|
-
* @author Joshua Heagle <joshuaheagle@gmail.com>
|
|
11
|
-
* @version 1.0.0
|
|
12
10
|
*/
|
|
13
11
|
const css_select_1 = require('css-select')
|
|
14
12
|
const cssSelectAdapter_1 = require('./cssSelectAdapter')
|
|
15
13
|
/**
|
|
16
14
|
* All of the elements below (not including) scope which match the selector, in tree order.
|
|
17
|
-
* @
|
|
18
|
-
* @param
|
|
19
|
-
* @param {*} scope The node to search below
|
|
20
|
-
* @returns {Array<*>}
|
|
15
|
+
* @param selector A CSS selector
|
|
16
|
+
* @param scope The node to search below
|
|
21
17
|
*/
|
|
22
18
|
const querySelectorAll = (selector, scope) => (0, css_select_1.selectAll)(selector, scope, {
|
|
23
19
|
adapter: cssSelectAdapter_1.cssSelectAdapter
|
|
@@ -25,10 +21,8 @@ const querySelectorAll = (selector, scope) => (0, css_select_1.selectAll)(select
|
|
|
25
21
|
exports.querySelectorAll = querySelectorAll
|
|
26
22
|
/**
|
|
27
23
|
* The first element below (not including) scope which matches the selector, in tree order, or null when there is none.
|
|
28
|
-
* @
|
|
29
|
-
* @param
|
|
30
|
-
* @param {*} scope The node to search below
|
|
31
|
-
* @returns {*|null}
|
|
24
|
+
* @param selector A CSS selector
|
|
25
|
+
* @param scope The node to search below
|
|
32
26
|
*/
|
|
33
27
|
const querySelector = (selector, scope) => (0, css_select_1.selectOne)(selector, scope, {
|
|
34
28
|
adapter: cssSelectAdapter_1.cssSelectAdapter
|
|
@@ -36,10 +30,8 @@ const querySelector = (selector, scope) => (0, css_select_1.selectOne)(selector,
|
|
|
36
30
|
exports.querySelector = querySelector
|
|
37
31
|
/**
|
|
38
32
|
* Whether an element itself (not its descendants) matches the selector.
|
|
39
|
-
* @
|
|
40
|
-
* @param
|
|
41
|
-
* @param {string} selector A CSS selector
|
|
42
|
-
* @returns {boolean}
|
|
33
|
+
* @param element The element to test
|
|
34
|
+
* @param selector A CSS selector
|
|
43
35
|
*/
|
|
44
36
|
const matches = (element, selector) => (0, css_select_1.is)(element, selector, {
|
|
45
37
|
adapter: cssSelectAdapter_1.cssSelectAdapter
|
|
@@ -48,10 +40,8 @@ exports.matches = matches
|
|
|
48
40
|
/**
|
|
49
41
|
* The nearest ancestor of an element (starting with the element itself) which matches the selector, or null when
|
|
50
42
|
* none of them do.
|
|
51
|
-
* @
|
|
52
|
-
* @param
|
|
53
|
-
* @param {string} selector A CSS selector
|
|
54
|
-
* @returns {*|null}
|
|
43
|
+
* @param element The element to start from
|
|
44
|
+
* @param selector A CSS selector
|
|
55
45
|
*/
|
|
56
46
|
const closest = (element, selector) => {
|
|
57
47
|
let current = element
|
|
@@ -1,25 +1,19 @@
|
|
|
1
1
|
/**
|
|
2
2
|
* A node's children, serialized in order (this is what innerHTML returns).
|
|
3
|
-
* @
|
|
4
|
-
* @param {*} node
|
|
5
|
-
* @returns {string}
|
|
3
|
+
* @param node
|
|
6
4
|
*/
|
|
7
5
|
declare const serializeChildren: (node: any) => string;
|
|
8
6
|
/**
|
|
9
7
|
* An element itself, serialized with its children (this is what outerHTML returns).
|
|
10
|
-
* @
|
|
11
|
-
* @param {*} element
|
|
12
|
-
* @returns {string}
|
|
8
|
+
* @param element
|
|
13
9
|
*/
|
|
14
10
|
declare const serializeOuter: (element: any) => string;
|
|
15
11
|
/**
|
|
16
12
|
* A node's markup, indented one level per level of nesting - a real DOM's outerHTML / innerHTML has no line breaks
|
|
17
13
|
* at all, which does not read well for a whole tree (a board full of cells, say). Useful for watching pseudo-dom-
|
|
18
14
|
* driven code run headlessly, printed to a terminal - see also logElement, which does the printing too.
|
|
19
|
-
* @
|
|
20
|
-
* @param
|
|
21
|
-
* @param {string} [indent=' '] The indentation used per level of nesting
|
|
22
|
-
* @returns {string}
|
|
15
|
+
* @param node
|
|
16
|
+
* @param indent The indentation used per level of nesting
|
|
23
17
|
*/
|
|
24
18
|
declare const prettyPrint: (node: any, indent?: string) => string;
|
|
25
19
|
export { serializeChildren, serializeOuter, prettyPrint };
|
|
@@ -24,9 +24,7 @@ Object.defineProperty(exports, '__esModule', {
|
|
|
24
24
|
})
|
|
25
25
|
exports.prettyPrint = exports.serializeOuter = exports.serializeChildren = void 0
|
|
26
26
|
/**
|
|
27
|
-
*
|
|
28
|
-
* @author Joshua Heagle <joshuaheagle@gmail.com>
|
|
29
|
-
* @version 1.0.0
|
|
27
|
+
* Serializes pseudo-dom nodes back into an HTML string, for innerHTML / outerHTML.
|
|
30
28
|
*/
|
|
31
29
|
const NodeService_1 = require('../services/NodeService')
|
|
32
30
|
// Void elements are self-closing and never serialize a closing tag or children (there is no HTML parsing of their
|
|
@@ -46,23 +44,20 @@ const BOOLEAN_ATTRIBUTES = new Set(['hidden'])
|
|
|
46
44
|
* Escape text so it is safe inside HTML text content. Coerces to a string first - unlike a real DOM, pseudo-dom's
|
|
47
45
|
* setAttribute does not itself coerce (see the same note on escapeAttributeValue), and nodeValue is not guaranteed
|
|
48
46
|
* to be a string either.
|
|
49
|
-
* @param
|
|
50
|
-
* @returns {string}
|
|
47
|
+
* @param text
|
|
51
48
|
*/
|
|
52
49
|
const escapeText = text => String(text).replace(/&/g, '&').replace(/</g, '<').replace(/>/g, '>')
|
|
53
50
|
/**
|
|
54
51
|
* Escape a value so it is safe inside a double-quoted HTML attribute. Coerces to a string first: a real DOM's
|
|
55
52
|
* setAttribute always stores a string, however pseudo-dom's does not coerce what it is given, so a value set via
|
|
56
53
|
* setAttribute(name, 5) is stored (and read back by getAttribute) as the number 5, not the string '5'.
|
|
57
|
-
* @param
|
|
58
|
-
* @returns {string}
|
|
54
|
+
* @param value
|
|
59
55
|
*/
|
|
60
56
|
const escapeAttributeValue = value => String(value).replace(/&/g, '&').replace(/"/g, '"')
|
|
61
57
|
/**
|
|
62
58
|
* Every attribute of the element, serialized (class instead of className, boolean attributes bare, the never-real
|
|
63
59
|
* mock properties left out, style added from the live CSSStyleDeclaration when it is not empty).
|
|
64
|
-
* @param
|
|
65
|
-
* @returns {string}
|
|
60
|
+
* @param element
|
|
66
61
|
*/
|
|
67
62
|
const serializeAttributes = element => {
|
|
68
63
|
let result = (element.getAttributeNames ? element.getAttributeNames() : []).filter(name => !NEVER_SERIALIZE.has(name)).map(name => {
|
|
@@ -80,8 +75,7 @@ const serializeAttributes = element => {
|
|
|
80
75
|
}
|
|
81
76
|
/**
|
|
82
77
|
* One node, serialized (its own markup only - see serializeChildren for its descendants too).
|
|
83
|
-
* @param
|
|
84
|
-
* @returns {string}
|
|
78
|
+
* @param node
|
|
85
79
|
*/
|
|
86
80
|
const serializeNode = node => {
|
|
87
81
|
if (node.nodeType === NodeService_1.NodeService.TEXT_NODE) {
|
|
@@ -102,27 +96,22 @@ const serializeNode = node => {
|
|
|
102
96
|
}
|
|
103
97
|
/**
|
|
104
98
|
* A node's children, serialized in order (this is what innerHTML returns).
|
|
105
|
-
* @
|
|
106
|
-
* @param {*} node
|
|
107
|
-
* @returns {string}
|
|
99
|
+
* @param node
|
|
108
100
|
*/
|
|
109
101
|
const serializeChildren = node => Array.from(node.childNodes).map(serializeNode).join('')
|
|
110
102
|
exports.serializeChildren = serializeChildren
|
|
111
103
|
/**
|
|
112
104
|
* An element itself, serialized with its children (this is what outerHTML returns).
|
|
113
|
-
* @
|
|
114
|
-
* @param {*} element
|
|
115
|
-
* @returns {string}
|
|
105
|
+
* @param element
|
|
116
106
|
*/
|
|
117
107
|
const serializeOuter = element => serializeNode(element)
|
|
118
108
|
exports.serializeOuter = serializeOuter
|
|
119
109
|
/**
|
|
120
110
|
* One node, indented for readability (see prettyPrint) - unlike serializeNode, every non-empty node is its own
|
|
121
111
|
* line, so the structure of a whole tree is easy to read at a glance.
|
|
122
|
-
* @param
|
|
123
|
-
* @param
|
|
124
|
-
* @param
|
|
125
|
-
* @returns {string}
|
|
112
|
+
* @param node
|
|
113
|
+
* @param depth
|
|
114
|
+
* @param indent
|
|
126
115
|
*/
|
|
127
116
|
const prettyPrintNode = (node, depth, indent) => {
|
|
128
117
|
const pad = indent.repeat(depth)
|
|
@@ -151,10 +140,8 @@ const prettyPrintNode = (node, depth, indent) => {
|
|
|
151
140
|
* A node's markup, indented one level per level of nesting - a real DOM's outerHTML / innerHTML has no line breaks
|
|
152
141
|
* at all, which does not read well for a whole tree (a board full of cells, say). Useful for watching pseudo-dom-
|
|
153
142
|
* driven code run headlessly, printed to a terminal - see also logElement, which does the printing too.
|
|
154
|
-
* @
|
|
155
|
-
* @param
|
|
156
|
-
* @param {string} [indent=' '] The indentation used per level of nesting
|
|
157
|
-
* @returns {string}
|
|
143
|
+
* @param node
|
|
144
|
+
* @param indent The indentation used per level of nesting
|
|
158
145
|
*/
|
|
159
146
|
const prettyPrint = (node, indent = ' ') => prettyPrintNode(node, 0, indent)
|
|
160
147
|
exports.prettyPrint = prettyPrint
|
|
@@ -1,14 +1,11 @@
|
|
|
1
1
|
/**
|
|
2
2
|
* Find the element which has the focus in a tree.
|
|
3
|
-
* @
|
|
4
|
-
* @param {Object} root The root node of the tree
|
|
5
|
-
* @returns {Object|null}
|
|
3
|
+
* @param root The root node of the tree
|
|
6
4
|
*/
|
|
7
5
|
export declare const getActiveElement: (root: object) => any | null;
|
|
8
6
|
/**
|
|
9
7
|
* Remember the element which has the focus in a tree.
|
|
10
|
-
* @
|
|
11
|
-
* @param
|
|
12
|
-
* @param {Object|null} element The element which now has the focus, or null when nothing has it
|
|
8
|
+
* @param root The root node of the tree
|
|
9
|
+
* @param element The element which now has the focus, or null when nothing has it
|
|
13
10
|
*/
|
|
14
11
|
export declare const setActiveElement: (root: object, element: any | null) => void;
|
|
@@ -11,17 +11,14 @@ exports.setActiveElement = exports.getActiveElement = void 0
|
|
|
11
11
|
const focused = new WeakMap()
|
|
12
12
|
/**
|
|
13
13
|
* Find the element which has the focus in a tree.
|
|
14
|
-
* @
|
|
15
|
-
* @param {Object} root The root node of the tree
|
|
16
|
-
* @returns {Object|null}
|
|
14
|
+
* @param root The root node of the tree
|
|
17
15
|
*/
|
|
18
16
|
const getActiveElement = root => focused.get(root) || null
|
|
19
17
|
exports.getActiveElement = getActiveElement
|
|
20
18
|
/**
|
|
21
19
|
* Remember the element which has the focus in a tree.
|
|
22
|
-
* @
|
|
23
|
-
* @param
|
|
24
|
-
* @param {Object|null} element The element which now has the focus, or null when nothing has it
|
|
20
|
+
* @param root The root node of the tree
|
|
21
|
+
* @param element The element which now has the focus, or null when nothing has it
|
|
25
22
|
*/
|
|
26
23
|
const setActiveElement = (root, element) => {
|
|
27
24
|
if (element === null) {
|
|
@@ -4,10 +4,8 @@ import { PseudoElement } from '../interfaces/PseudoElement';
|
|
|
4
4
|
* The first element, in tree order, below (not including) the given node whose id matches the given value, or null
|
|
5
5
|
* when there is none. Shared by Document and DocumentFragment, which both implement the DOM's NonElementParentNode
|
|
6
6
|
* mixin (so ShadowRoot, a DocumentFragment, gets it too).
|
|
7
|
-
* @
|
|
8
|
-
* @param
|
|
9
|
-
* @param {string} id
|
|
10
|
-
* @returns {PseudoElement|null}
|
|
7
|
+
* @param root The node to search below
|
|
8
|
+
* @param id
|
|
11
9
|
*/
|
|
12
10
|
declare const getElementById: (root: NodeService, id: string) => PseudoElement | null;
|
|
13
11
|
export default getElementById;
|
|
@@ -8,10 +8,8 @@ const NodeService_1 = require('../services/NodeService')
|
|
|
8
8
|
* The first element, in tree order, below (not including) the given node whose id matches the given value, or null
|
|
9
9
|
* when there is none. Shared by Document and DocumentFragment, which both implement the DOM's NonElementParentNode
|
|
10
10
|
* mixin (so ShadowRoot, a DocumentFragment, gets it too).
|
|
11
|
-
* @
|
|
12
|
-
* @param
|
|
13
|
-
* @param {string} id
|
|
14
|
-
* @returns {PseudoElement|null}
|
|
11
|
+
* @param root The node to search below
|
|
12
|
+
* @param id
|
|
15
13
|
*/
|
|
16
14
|
const getElementById = (root, id) => {
|
|
17
15
|
const search = node => {
|
|
@@ -3,9 +3,7 @@ import { PseudoEventTarget } from '../interfaces/PseudoEventTarget';
|
|
|
3
3
|
/**
|
|
4
4
|
* Get all of the ancestors of a node, starting with the root of the tree and ending with the node's own parent (the
|
|
5
5
|
* order in which an event travels down through them). A node which has no parent has no ancestors.
|
|
6
|
-
* @
|
|
7
|
-
* @param {PseudoEventTarget|PseudoNode|*} node The node to find the ancestors of
|
|
8
|
-
* @returns {Array<PseudoNode>}
|
|
6
|
+
* @param node The node to find the ancestors of
|
|
9
7
|
*/
|
|
10
8
|
declare const getParentNodes: (node: PseudoEventTarget | PseudoNode | any) => Array<PseudoNode>;
|
|
11
9
|
export default getParentNodes;
|
|
@@ -6,9 +6,7 @@ Object.defineProperty(exports, '__esModule', {
|
|
|
6
6
|
/**
|
|
7
7
|
* Get all of the ancestors of a node, starting with the root of the tree and ending with the node's own parent (the
|
|
8
8
|
* order in which an event travels down through them). A node which has no parent has no ancestors.
|
|
9
|
-
* @
|
|
10
|
-
* @param {PseudoEventTarget|PseudoNode|*} node The node to find the ancestors of
|
|
11
|
-
* @returns {Array<PseudoNode>}
|
|
9
|
+
* @param node The node to find the ancestors of
|
|
12
10
|
*/
|
|
13
11
|
const getParentNodes = node => {
|
|
14
12
|
const parents = []
|
|
@@ -4,11 +4,9 @@ import { PseudoEventTarget } from '../interfaces/PseudoEventTarget';
|
|
|
4
4
|
* A selector function for retrieving existing parent PseudoNode from the given child item.
|
|
5
5
|
* This function will check all the parents starting from node, and scan the attributes
|
|
6
6
|
* property for matches. The return array contains all matching parent ancestors, starting with the root of the tree.
|
|
7
|
-
* @
|
|
8
|
-
* @param
|
|
9
|
-
* @param
|
|
10
|
-
* @param {PseudoEventTarget|PseudoNode|*} node The node to find the matching ancestors of
|
|
11
|
-
* @returns {Array.<PseudoNode>}
|
|
7
|
+
* @param attr The property to compare on each ancestor (a missing property counts as false)
|
|
8
|
+
* @param value The value the property must have
|
|
9
|
+
* @param node The node to find the matching ancestors of
|
|
12
10
|
*/
|
|
13
11
|
declare const getParentNodesFromAttribute: (attr: string, value: boolean | number | string, node: PseudoEventTarget | PseudoNode | any) => Array<PseudoNode>;
|
|
14
12
|
export default getParentNodesFromAttribute;
|
|
@@ -17,11 +17,9 @@ const getParentNodes_1 = __importDefault(require('./getParentNodes'))
|
|
|
17
17
|
* A selector function for retrieving existing parent PseudoNode from the given child item.
|
|
18
18
|
* This function will check all the parents starting from node, and scan the attributes
|
|
19
19
|
* property for matches. The return array contains all matching parent ancestors, starting with the root of the tree.
|
|
20
|
-
* @
|
|
21
|
-
* @param
|
|
22
|
-
* @param
|
|
23
|
-
* @param {PseudoEventTarget|PseudoNode|*} node The node to find the matching ancestors of
|
|
24
|
-
* @returns {Array.<PseudoNode>}
|
|
20
|
+
* @param attr The property to compare on each ancestor (a missing property counts as false)
|
|
21
|
+
* @param value The value the property must have
|
|
22
|
+
* @param node The node to find the matching ancestors of
|
|
25
23
|
*/
|
|
26
24
|
const getParentNodesFromAttribute = (attr, value, node) => {
|
|
27
25
|
return (0, getParentNodes_1.default)(node).filter(parent => (parent[attr] || false) === value)
|
|
@@ -1,10 +1,5 @@
|
|
|
1
1
|
/**
|
|
2
2
|
* The modifier keys which were held down when a mouse or keyboard event happened.
|
|
3
|
-
* @typedef {Object} ModifierKeys
|
|
4
|
-
* @property {boolean} ctrlKey
|
|
5
|
-
* @property {boolean} shiftKey
|
|
6
|
-
* @property {boolean} altKey
|
|
7
|
-
* @property {boolean} metaKey
|
|
8
3
|
*/
|
|
9
4
|
export type ModifierKeys = {
|
|
10
5
|
ctrlKey: boolean;
|
|
@@ -14,16 +9,12 @@ export type ModifierKeys = {
|
|
|
14
9
|
};
|
|
15
10
|
/**
|
|
16
11
|
* Pick the modifier keys out of the init object of an event.
|
|
17
|
-
* @
|
|
18
|
-
* @param {Object} [init={}] The init of an event
|
|
19
|
-
* @returns {ModifierKeys}
|
|
12
|
+
* @param init The init of an event
|
|
20
13
|
*/
|
|
21
14
|
export declare const modifierKeys: (init?: any) => ModifierKeys;
|
|
22
15
|
/**
|
|
23
16
|
* Answer getModifierState for a set of held modifier keys.
|
|
24
|
-
* @
|
|
25
|
-
* @param
|
|
26
|
-
* @param {string} key The name of the modifier (Control, Shift, Alt or Meta)
|
|
27
|
-
* @returns {boolean}
|
|
17
|
+
* @param keys The modifier keys which were held down
|
|
18
|
+
* @param key The name of the modifier (Control, Shift, Alt or Meta)
|
|
28
19
|
*/
|
|
29
20
|
export declare const modifierState: (keys: ModifierKeys, key: string) => boolean;
|
|
@@ -6,9 +6,7 @@ Object.defineProperty(exports, '__esModule', {
|
|
|
6
6
|
exports.modifierState = exports.modifierKeys = void 0
|
|
7
7
|
/**
|
|
8
8
|
* Pick the modifier keys out of the init object of an event.
|
|
9
|
-
* @
|
|
10
|
-
* @param {Object} [init={}] The init of an event
|
|
11
|
-
* @returns {ModifierKeys}
|
|
9
|
+
* @param init The init of an event
|
|
12
10
|
*/
|
|
13
11
|
const modifierKeys = (init = {}) => ({
|
|
14
12
|
ctrlKey: !!init.ctrlKey,
|
|
@@ -19,10 +17,8 @@ const modifierKeys = (init = {}) => ({
|
|
|
19
17
|
exports.modifierKeys = modifierKeys
|
|
20
18
|
/**
|
|
21
19
|
* Answer getModifierState for a set of held modifier keys.
|
|
22
|
-
* @
|
|
23
|
-
* @param
|
|
24
|
-
* @param {string} key The name of the modifier (Control, Shift, Alt or Meta)
|
|
25
|
-
* @returns {boolean}
|
|
20
|
+
* @param keys The modifier keys which were held down
|
|
21
|
+
* @param key The name of the modifier (Control, Shift, Alt or Meta)
|
|
26
22
|
*/
|
|
27
23
|
const modifierState = (keys, key) => {
|
|
28
24
|
switch (key) {
|
|
@@ -1,5 +1,5 @@
|
|
|
1
1
|
/**
|
|
2
|
-
*
|
|
2
|
+
* Substitute for the DOM CSSStyleDeclaration Class. Real instances (from createStyleDeclaration) also accept
|
|
3
3
|
* arbitrary camelCase CSS property names (declaration.backgroundColor), which cannot be expressed in an interface.
|
|
4
4
|
*/
|
|
5
5
|
export interface PseudoCSSStyleDeclaration {
|