site/node_modules/@asamuzakjp/dom-selector/README.md
2024-10-14 08:09:33 +02:00

6 KiB
Raw Permalink Blame History

DOM Selector

build CodeQL npm (scoped)

A CSS selector engine. Used in jsdom since jsdom v23.2.0.

Install

npm i @asamuzakjp/dom-selector

Usage

import {
  matches, closest, querySelector, querySelectorAll
} from '@asamuzakjp/dom-selector';

matches(selector, node, opt)

matches - same functionality as Element.matches()

Parameters

  • selector string CSS selector
  • node object Element node
  • opt object? options
    • opt.warn boolean? console warn e.g. unsupported pseudo-class

Returns boolean true if matched, false otherwise

closest(selector, node, opt)

closest - same functionality as Element.closest()

Parameters

  • selector string CSS selector
  • node object Element node
  • opt object? options
    • opt.warn boolean? console warn e.g. unsupported pseudo-class

Returns object? matched node

querySelector(selector, node, opt)

querySelector - same functionality as Document.querySelector(), DocumentFragment.querySelector(), Element.querySelector()

Parameters

  • selector string CSS selector
  • node object Document, DocumentFragment or Element node
  • opt object? options
    • opt.warn boolean? console warn e.g. unsupported pseudo-class

Returns object? matched node

querySelectorAll(selector, node, opt)

querySelectorAll - same functionality as Document.querySelectorAll(), DocumentFragment.querySelectorAll(), Element.querySelectorAll()
NOTE: returns Array, not NodeList

Parameters

  • selector string CSS selector
  • node object Document, DocumentFragment or Element node
  • opt object? options
    • opt.warn boolean? console warn e.g. unsupported pseudo-class

Returns Array<(object | undefined)> array of matched nodes

Supported CSS selectors

Pattern Supported Note
*
ns|E
*|E
|E
E
E:not(s1, s2, …)
E:is(s1, s2, …)
E:where(s1, s2, …)
E:has(rs1, rs2, …)
E.warning
E#myid
E[foo]
E[foo="bar"]
E[foo="bar" i]
E[foo="bar" s]
E[foo~="bar"]
E[foo^="bar"]
E[foo$="bar"]
E[foo*="bar"]
E[foo|="en"]
E:defined Unsupported
E:dir(ltr)
E:lang(en) Partially supported Comma-separated list of language codes, e.g. :lang(en, fr), is not yet supported.
E:anylink
E:link
E:visited Returns false or null to prevent fingerprinting.
E:locallink
E:target
E:targetwithin
E:scope
E:current Unsupported
E:current(s) Unsupported
E:past Unsupported
E:future Unsupported
E:active Unsupported
E:hover Unsupported
E:focus
E:focuswithin
E:focusvisible Unsupported
E:enabled
E:disabled
E:readwrite
E:readonly
E:placeholdershown
E:default
E:checked
E:indeterminate
E:valid
E:invalid
E:required
E:optional
E:blank Unsupported
E:userinvalid Unsupported
E:root
E:empty
E:nthchild(n [of S]?)
E:nthlastchild(n [of S]?)
E:firstchild
E:lastchild
E:onlychild
E:nthoftype(n)
E:nthlastoftype(n)
E:firstoftype
E:lastoftype
E:onlyoftype
E F
E > F
E + F
E ~ F
F || E Unsupported
E:nthcol(n) Unsupported
E:nthlastcol(n) Unsupported
:host
:host(s)
:hostcontext(s)

Acknowledgments

The following resources have been of great help in the development of the DOM Selector.


Copyright (c) 2023 asamuzaK (Kazz)