Userscript Common Functions

userscript-common-fns.js

const $ = (s, p = document) => p.querySelector(s);

const $$ = (s, p = document) => [...p.querySelectorAll(s)];

const delay = (t, v) => new Promise((res) => setTimeout(res, t, v));

const $when = (sel) =>
  new Promise((res) => {
    if ($(sel)) return res($(sel));
    new MutationObserver((_, ob) => {
      if (!$(sel)) return;
      res($(sel));
      ob.disconnect();
    }).observe(document.body, {
      childList: true,
      subtree: true,
      attributeFilter: ["disabled"],
    });
  });

const $onDomReady = () =>
  new Promise((res) => {
    (document.readyState !== "interactive" &&
      document.readyState !== "complete") ? document.addEventListener("domcontentloaded", res) : res();
  });

const $onLoad = () =>
  new Promise((res) => {
    document.readyState !== "complete" ? addEventListener("load", res) : res();
  });

const $onNodeChange = (node, opts = { childList: true }) =>
  new Promise((res) => {
    if (!node) return;
    new MutationObserver(res).observe(node, opts);
    res();
  });

const $treeWalker = (node, nodeFilter, walkerFn) => {
  if (!node) return;
  const nodeIterator = document.createTreeWalker(node, nodeFilter, walkerFn);
  const nodeList = [];
  let currentNode;
  while ((currentNode = nodeIterator.nextNode())) {
    nodeList.push(currentNode);
  }
  return nodeList;
};

const setNativeValue = (el, value) => {
  if (!el) return;
  const nativeSet = Object.getOwnPropertyDescriptor(
    HTMLInputElement.prototype,
    "value"
  ).set;
  nativeSet.call(el, value);
  const event = new Event("input", { bubbles: true });
  el.dispatchEvent(event);
};