browser-extension-utils 0.2.1 → 0.3.1

package/lib/index.js

@@ -1,548 +0,0 @@
-export const doc = document
-
-export const win = globalThis
-
-export const uniq = (array) => [...new Set(array)]
-
-// Polyfill for String.prototype.replaceAll()
-// eslint-disable-next-line no-use-extend-native/no-use-extend-native
-if (typeof String.prototype.replaceAll !== "function") {
-  // eslint-disable-next-line no-use-extend-native/no-use-extend-native, no-extend-native
-  String.prototype.replaceAll = String.prototype.replace
-}
-
-export const toCamelCase = function (text) {
-  return text.replaceAll(/^([A-Z])|[\s-_](\w)/g, function (match, p1, p2) {
-    if (p2) return p2.toUpperCase()
-    return p1.toLowerCase()
-  })
-}
-
-export const $ = (selectors, element) =>
-  (element || doc).querySelector(selectors) || undefined
-export const $$ = (selectors, element) => [
-  ...(element || doc).querySelectorAll(selectors),
-]
-export const querySelector = $
-export const querySelectorAll = $$
-
-export const getRootElement = (type) =>
-  type === 1
-    ? doc.head || doc.body || doc.documentElement
-    : type === 2
-      ? doc.body || doc.documentElement
-      : doc.documentElement
-
-export const createElement = (tagName, attributes) =>
-  setAttributes(doc.createElement(tagName), attributes)
-
-export const addElement = (parentNode, tagName, attributes) => {
-  if (typeof parentNode === "string") {
-    return addElement(null, parentNode, tagName)
-  }
-
-  if (!tagName) {
-    return
-  }
-
-  if (!parentNode) {
-    parentNode = /^(script|link|style|meta)$/.test(tagName)
-      ? getRootElement(1)
-      : getRootElement(2)
-  }
-
-  if (typeof tagName === "string") {
-    const element = createElement(tagName, attributes)
-    parentNode.append(element)
-    return element
-  }
-
-  // tagName: HTMLElement
-  setAttributes(tagName, attributes)
-  parentNode.append(tagName)
-  return tagName
-}
-
-export const addStyle = (styleText) => {
-  const element = createElement("style", { textContent: styleText })
-  getRootElement(1).append(element)
-  return element
-}
-
-export const addEventListener = (element, type, listener, options) => {
-  if (!element) {
-    return
-  }
-
-  if (typeof type === "object") {
-    for (const type1 in type) {
-      if (Object.hasOwn(type, type1)) {
-        element.addEventListener(type1, type[type1])
-      }
-    }
-  } else if (typeof type === "string" && typeof listener === "function") {
-    element.addEventListener(type, listener, options)
-  }
-}
-
-export const removeEventListener = (element, type, listener, options) => {
-  if (!element) {
-    return
-  }
-
-  if (typeof type === "object") {
-    for (const type1 in type) {
-      if (Object.hasOwn(type, type1)) {
-        element.removeEventListener(type1, type[type1])
-      }
-    }
-  } else if (typeof type === "string" && typeof listener === "function") {
-    element.removeEventListener(type, listener, options)
-  }
-}
-
-export const getAttribute = (element, name) =>
-  element && element.getAttribute ? element.getAttribute(name) : undefined
-export const setAttribute = (element, name, value) =>
-  element && element.setAttribute
-    ? element.setAttribute(name, value)
-    : undefined
-export const removeAttribute = (element, name) =>
-  element && element.removeAttribute ? element.removeAttribute(name) : undefined
-
-export const setAttributes = (element, attributes) => {
-  if (element && attributes) {
-    for (const name in attributes) {
-      if (Object.hasOwn(attributes, name)) {
-        const value = attributes[name]
-        if (value === undefined) {
-          continue
-        }
-
-        if (/^(value|textContent|innerText)$/.test(name)) {
-          element[name] = value
-        } else if (/^(innerHTML)$/.test(name)) {
-          element[name] = createHTML(value)
-        } else if (name === "style") {
-          setStyle(element, value, true)
-        } else if (/on\w+/.test(name)) {
-          const type = name.slice(2)
-          addEventListener(element, type, value)
-        } else {
-          setAttribute(element, name, value)
-        }
-      }
-    }
-  }
-
-  return element
-}
-
-export const addAttribute = (element, name, value) => {
-  const orgValue = getAttribute(element, name)
-  if (!orgValue) {
-    setAttribute(element, name, value)
-  } else if (!orgValue.includes(value)) {
-    setAttribute(element, name, orgValue + " " + value)
-  }
-}
-
-export const addClass = (element, className) => {
-  if (!element || !element.classList) {
-    return
-  }
-
-  element.classList.add(className)
-}
-
-export const removeClass = (element, className) => {
-  if (!element || !element.classList) {
-    return
-  }
-
-  element.classList.remove(className)
-}
-
-export const hasClass = (element, className) => {
-  if (!element || !element.classList) {
-    return false
-  }
-
-  return element.classList.contains(className)
-}
-
-export const setStyle = (element, values, overwrite) => {
-  if (!element) {
-    return
-  }
-
-  // element.setAttribute("style", value) -> Fail when violates CSP
-  const style = element.style
-
-  if (typeof values === "string") {
-    style.cssText = overwrite ? values : style.cssText + ";" + values
-    return
-  }
-
-  if (overwrite) {
-    style.cssText = ""
-  }
-
-  for (const key in values) {
-    if (Object.hasOwn(values, key)) {
-      style[key] = values[key].replace("!important", "")
-    }
-  }
-}
-
-// convert `font-size: 12px; color: red` to `{"fontSize": "12px"; "color": "red"}`
-// eslint-disable-next-line no-unused-vars
-const toStyleKeyValues = (styleText) => {
-  const result = {}
-  const keyValues = styleText.split(/\s*;\s*/)
-  for (const keyValue of keyValues) {
-    const kv = keyValue.split(/\s*:\s*/)
-    // TODO: fix when key is such as -webkit-xxx
-    const key = toCamelCase(kv[0])
-    if (key) {
-      result[key] = kv[1]
-    }
-  }
-
-  return result
-}
-
-export const toStyleMap = (styleText) => {
-  styleText = noStyleSpace(styleText)
-  const map = {}
-  const keyValues = styleText.split("}")
-  for (const keyValue of keyValues) {
-    const kv = keyValue.split("{")
-    if (kv[0] && kv[1]) {
-      map[kv[0]] = kv[1]
-    }
-  }
-
-  return map
-}
-
-export const noStyleSpace = (text) =>
-  text.replaceAll(/\s*([^\w-+%!])\s*/gm, "$1")
-
-export const createSetStyle = (styleText) => {
-  const styleMap = toStyleMap(styleText)
-  return (element, value, overwrite) => {
-    if (typeof value === "object") {
-      setStyle(element, value, overwrite)
-    } else if (typeof value === "string") {
-      const key = noStyleSpace(value)
-      const value2 = styleMap[key]
-      setStyle(element, value2 || value, overwrite)
-    }
-  }
-}
-
-export const isUrl = (text) => /^https?:\/\//.test(text)
-
-/**
- *
- * @param { function } func
- * @param { number } interval
- * @returns
- */
-export const throttle = (func, interval) => {
-  let timeoutId = null
-  let next = false
-  const handler = (...args) => {
-    if (timeoutId) {
-      next = true
-    } else {
-      func.apply(this, args)
-      timeoutId = setTimeout(() => {
-        timeoutId = null
-        if (next) {
-          next = false
-          handler()
-        }
-      }, interval)
-    }
-  }
-
-  return handler
-}
-
-// Polyfill for Object.hasOwn()
-if (typeof Object.hasOwn !== "function") {
-  Object.hasOwn = (instance, prop) =>
-    // eslint-disable-next-line prefer-object-has-own
-    Object.prototype.hasOwnProperty.call(instance, prop)
-}
-
-export const registerMenuCommand = () => undefined
-
-export const extendHistoryApi = () => {
-  // https://dirask.com/posts/JavaScript-on-location-changed-event-on-url-changed-event-DKeyZj
-  const pushState = history.pushState
-  const replaceState = history.replaceState
-
-  history.pushState = function () {
-    // eslint-disable-next-line prefer-rest-params
-    pushState.apply(history, arguments)
-    globalThis.dispatchEvent(new Event("pushstate"))
-    globalThis.dispatchEvent(new Event("locationchange"))
-  }
-
-  history.replaceState = function () {
-    // eslint-disable-next-line prefer-rest-params
-    replaceState.apply(history, arguments)
-    globalThis.dispatchEvent(new Event("replacestate"))
-    globalThis.dispatchEvent(new Event("locationchange"))
-  }
-
-  globalThis.addEventListener("popstate", function () {
-    globalThis.dispatchEvent(new Event("locationchange"))
-  })
-
-  // Usage example:
-  // window.addEventListener("locationchange", function () {
-  //   console.log("onlocationchange event occurred!")
-  // })
-}
-
-// eslint-disable-next-line no-script-url
-export const actionHref = "javascript:;"
-
-export const getOffsetPosition = (element, referElement) => {
-  const position = { top: 0, left: 0 }
-  referElement = referElement || doc.body
-
-  while (element && element !== referElement) {
-    position.top += element.offsetTop
-    position.left += element.offsetLeft
-    element = element.offsetParent
-  }
-
-  return position
-}
-
-const runOnceCache = {}
-export const runOnce = async (key, func) => {
-  if (Object.hasOwn(runOnceCache, key)) {
-    return runOnceCache[key]
-  }
-
-  const result = await func()
-
-  if (key) {
-    runOnceCache[key] = result
-  }
-
-  return result
-}
-
-const cacheStore = {}
-const makeKey = (key /* string | any[] */) =>
-  Array.isArray(key) ? key.join(":") : key
-export const cache = {
-  get: (key /* string | any[] */) => cacheStore[makeKey(key)],
-  add(key /* string | any[] */, value /* any */) {
-    cacheStore[makeKey(key)] = value
-  },
-}
-
-export const sleep = async (time) => {
-  return new Promise((resolve) => {
-    setTimeout(() => {
-      resolve(1)
-    }, time)
-  })
-}
-
-export const parseInt10 = (number, defaultValue) => {
-  if (typeof number === "number" && !Number.isNaN(number)) {
-    return number
-  }
-
-  if (typeof defaultValue !== "number") {
-    defaultValue = Number.NaN
-  }
-
-  if (!number) {
-    return defaultValue
-  }
-
-  const result = Number.parseInt(number, 10)
-  return Number.isNaN(result) ? defaultValue : result
-}
-
-const rootFuncArray = []
-const headFuncArray = []
-const bodyFuncArray = []
-let headBodyObserver
-
-const startObserveHeadBodyExists = () => {
-  if (headBodyObserver) {
-    return
-  }
-
-  headBodyObserver = new MutationObserver(() => {
-    if (doc.head && doc.body) {
-      headBodyObserver.disconnect()
-    }
-
-    if (doc.documentElement && rootFuncArray.length > 0) {
-      for (const func of rootFuncArray) {
-        func()
-      }
-
-      rootFuncArray.length = 0
-    }
-
-    if (doc.head && headFuncArray.length > 0) {
-      for (const func of headFuncArray) {
-        func()
-      }
-
-      headFuncArray.length = 0
-    }
-
-    if (doc.body && bodyFuncArray.length > 0) {
-      for (const func of bodyFuncArray) {
-        func()
-      }
-
-      bodyFuncArray.length = 0
-    }
-  })
-
-  headBodyObserver.observe(doc, {
-    childList: true,
-    subtree: true,
-  })
-}
-
-/**
- * Run function when document.documentElement exsits.
- */
-export const runWhenRootExists = (func) => {
-  if (!doc.documentElement) {
-    rootFuncArray.push(func)
-    startObserveHeadBodyExists()
-    return
-  }
-
-  func()
-}
-
-/**
- * Run function when document.head exsits.
- */
-export const runWhenHeadExists = (func) => {
-  if (!doc.head) {
-    headFuncArray.push(func)
-    startObserveHeadBodyExists()
-    return
-  }
-
-  func()
-}
-
-/**
- * Run function when document.body exsits. The function executed before DOMContentLoaded.
- */
-export const runWhenBodyExists = (func) => {
-  if (!doc.body) {
-    bodyFuncArray.push(func)
-    startObserveHeadBodyExists()
-    return
-  }
-
-  func()
-}
-
-/**
- * Equals to jQuery.domready
- */
-export const runWhenDomReady = (func) => {
-  if (doc.readyState === "interactive" || doc.readyState === "complete") {
-    return func()
-  }
-
-  const handler = () => {
-    if (doc.readyState === "interactive" || doc.readyState === "complete") {
-      func()
-      removeEventListener(doc, "readystatechange", handler)
-    }
-  }
-
-  addEventListener(doc, "readystatechange", handler)
-}
-
-export const isVisible = (element) => {
-  if (typeof element.checkVisibility === "function") {
-    return element.checkVisibility()
-  }
-
-  return element.offsetParent !== null
-}
-
-export const isTouchScreen = () => "ontouchstart" in win
-
-const escapeHTMLPolicy =
-  typeof trustedTypes !== "undefined" &&
-  typeof trustedTypes.createPolicy === "function"
-    ? trustedTypes.createPolicy("beuEscapePolicy", {
-        createHTML: (string) => string,
-      })
-    : undefined
-
-export const createHTML = (html) => {
-  return escapeHTMLPolicy ? escapeHTMLPolicy.createHTML(html) : html
-}
-
-/**
- * Compare two semantic version strings
- * @param {string} v1 - First version string (e.g., "1.2.0")
- * @param {string} v2 - Second version string (e.g., "1.1.5")
- * @returns {number} - Returns 1 if v1 > v2, -1 if v1 < v2, 0 if equal
- * @throws {Error} - Throws error for invalid version strings
- */
-export function compareVersions(v1, v2) {
-  // Input validation
-  if (typeof v1 !== "string" || typeof v2 !== "string") {
-    throw new TypeError("Version strings must be of type string")
-  }
-
-  if (!v1.trim() || !v2.trim()) {
-    throw new Error("Version strings cannot be empty")
-  }
-
-  // Validate version format (basic semantic versioning)
-  const versionRegex = /^\d+(\.\d+)*$/
-  if (!versionRegex.test(v1) || !versionRegex.test(v2)) {
-    throw new Error(
-      "Invalid version format. Use semantic versioning (e.g., '1.2.3')"
-    )
-  }
-
-  const v1Parts = v1.split(".").map(Number)
-  const v2Parts = v2.split(".").map(Number)
-  const maxLength = Math.max(v1Parts.length, v2Parts.length)
-
-  for (let i = 0; i < maxLength; i++) {
-    const num1 = v1Parts[i] || 0 // Use logical OR for cleaner default assignment
-    const num2 = v2Parts[i] || 0
-
-    if (num1 !== num2) {
-      return num1 > num2 ? 1 : -1 // Simplified comparison
-    }
-  }
-
-  return 0 // Versions are equal
-}
-
-// Usage:
-// console.log(compareVersions("1.2.0", "1.1.5")); // Output: 1
-// console.log(compareVersions("1.0", "1.0.0"));   // Output: 0
-// console.log(compareVersions("2.0", "1.5.10"));  // Output: 1
-// console.log(compareVersions("1.0.0", "1.0.0.1")); // Output: -1

package/lib/userscript.js

@@ -1,86 +0,0 @@
-import {
-  getRootElement,
-  setAttributes,
-  addElement as _addElement,
-} from "./index.js"
-
-export * from "./index.js"
-
-// eslint-disable-next-line no-unused-expressions, n/prefer-global/process
-process.env.PLASMO_TAG === "dev" &&
-  (() => {
-    const functions = document.GMFunctions
-    if (typeof functions === "object") {
-      for (const key in functions) {
-        if (Object.hasOwn(functions, key)) {
-          window[key] = functions[key]
-        }
-      }
-    }
-  })()
-
-/* eslint-disable new-cap, camelcase */
-export const addElement =
-  typeof GM_addElement === "function"
-    ? (parentNode, tagName, attributes) => {
-        if (typeof parentNode === "string") {
-          return addElement(null, parentNode, tagName)
-        }
-
-        if (!tagName) {
-          return
-        }
-
-        if (!parentNode) {
-          parentNode = /^(script|link|style|meta)$/.test(tagName)
-            ? getRootElement(1)
-            : getRootElement(2)
-        }
-
-        if (typeof tagName === "string") {
-          let attributes2
-          if (attributes) {
-            const entries1 = []
-            const entries2 = []
-            for (const entry of Object.entries(attributes)) {
-              if (/^(on\w+|innerHTML)$/.test(entry[0])) {
-                entries2.push(entry)
-              } else {
-                entries1.push(entry)
-              }
-            }
-
-            attributes = Object.fromEntries(entries1)
-            attributes2 = Object.fromEntries(entries2)
-          }
-
-          const element = GM_addElement(null, tagName, attributes)
-          setAttributes(element, attributes2)
-          parentNode.append(element)
-          return element
-        }
-
-        // tagName: HTMLElement
-        setAttributes(tagName, attributes)
-        parentNode.append(tagName)
-        return tagName
-      }
-    : _addElement
-
-export const addStyle = (styleText) =>
-  addElement(null, "style", { textContent: styleText })
-
-// Only register menu on top frame
-export const registerMenuCommand = (name, callback, options) => {
-  if (globalThis !== top) {
-    return
-  }
-
-  if (typeof GM.registerMenuCommand !== "function") {
-    console.warn("Do not support GM.registerMenuCommand!")
-    return
-  }
-
-  return GM.registerMenuCommand(name, callback, options)
-}
-/* eslint-enable new-cap, camelcase */