All files / src/utils dom-utils.ts

100% Statements 24/24
90.9% Branches 10/11
100% Functions 8/8
100% Lines 24/24

Press n or j to go to the next uncovered block, b, p or k for the previous block.

1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55 56 57 58 59 60 61 62 63 64 65 66 67 68 69              1x         1x 34x           1x             1x 30x             1x 27x           1x 5x             1x 57x 57x 57x 57x 57x 57x 57x 57x           1x 20x 20x 20x 20x  
import type { Func } from '@/types/generic/function.ts'
import type { HTMLString, NodeSelector } from '@/types/semantic/string.ts'
import type { ElementRef } from '@/types/dom.ts'
 
/**
 * Shortened Document getter
 */
export const doc: Func<Document> = (): Document => globalThis.document
 
/**
 * Shortened Body getter
 */
export const bod: Func<HTMLElement> = (): HTMLElement =>
  globalThis.document.body
 
/**
 * Convert iterables and array-like structures into an array
 * @param x
 */
export const toArray = <T>(x: Iterable<T> | ArrayLike<T>) => Array.from(x)
 
/**
 * Scoped node selector
 * @param node Current scope
 * @param ref Selector
 */
export const all = (node: ParentNode, ref: NodeSelector) =>
  toArray(node.querySelectorAll(ref))
 
/**
 * Scoped node selector returning the first match
 * @param node Current scope
 * @param ref Selector
 */
export const first = (node: ParentNode, ref: NodeSelector): Element | null =>
  all(node, ref)[0] ?? null
 
/**
 * Parse an ambiguous element reference into an actual element
 * @param ref Element reference
 */
export const parseRef = <T extends Element>(ref: ElementRef): T | null =>
  ref instanceof Element ? (ref as T) : (first(doc(), ref) as T)
 
/**
 * Create div
 * @param className Optional CSS class name
 * @param children Optional children
 */
export const div = (
  className?: string,
  ...children: (Node | HTMLString)[]
): HTMLDivElement => {
  const node: HTMLDivElement = doc().createElement('div')
  if (className) node.classList.add(className)
  node.append(...children)
  return node
}
 
/**
 * Parse HTML code into HTML elements
 * @param html
 */
export const parseHtml = <T extends HTMLElement>(html: HTMLString): T => {
  const node: HTMLDivElement = div()
  node.innerHTML = html
  return node.firstChild as T
}