@ginger-ai/ginger-js 0.0.1

package/src/device/utils/browser_.ts

@@ -0,0 +1,347 @@
+import { countTruthy } from './data'
+import { isFunctionNative } from './misc'
+
+/*
+ * Functions to help with features that vary through browsers
+ */
+
+/**
+ * Checks whether the browser is based on Trident (the Internet Explorer engine) without using user-agent.
+ *
+ * Warning for package users:
+ * This function is out of Semantic Versioning, i.e. can change unexpectedly. Usage is at your own risk.
+ */
+export function isTrident(): boolean {
+  const w = window
+  const n = navigator
+
+  // The properties are checked to be in IE 10, IE 11 and not to be in other browsers in October 2020
+  return (
+    countTruthy([
+      'MSCSSMatrix' in w,
+      'msSetImmediate' in w,
+      'msIndexedDB' in w,
+      'msMaxTouchPoints' in n,
+      'msPointerEnabled' in n,
+    ]) >= 4
+  )
+}
+
+/**
+ * Checks whether the browser is based on EdgeHTML (the pre-Chromium Edge engine) without using user-agent.
+ *
+ * Warning for package users:
+ * This function is out of Semantic Versioning, i.e. can change unexpectedly. Usage is at your own risk.
+ */
+export function isEdgeHTML(): boolean {
+  // Based on research in October 2020
+  const w = window
+  const n = navigator
+
+  return (
+    countTruthy(['msWriteProfilerMark' in w, 'MSStream' in w, 'msLaunchUri' in n, 'msSaveBlob' in n]) >= 3 &&
+    !isTrident()
+  )
+}
+
+/**
+ * Checks whether the browser is based on Chromium without using user-agent.
+ *
+ * Warning for package users:
+ * This function is out of Semantic Versioning, i.e. can change unexpectedly. Usage is at your own risk.
+ */
+export function isChromium(): boolean {
+  // Based on research in October 2020. Tested to detect Chromium 42-86.
+  const w = window
+  const n = navigator
+
+  return (
+    countTruthy([
+      'webkitPersistentStorage' in n,
+      'webkitTemporaryStorage' in n,
+      (n.vendor || '').indexOf('Google') === 0,
+      'webkitResolveLocalFileSystemURL' in w,
+      'BatteryManager' in w,
+      'webkitMediaStream' in w,
+      'webkitSpeechGrammar' in w,
+    ]) >= 5
+  )
+}
+
+/**
+ * Checks whether the browser is based on mobile or desktop Safari without using user-agent.
+ * All iOS browsers use WebKit (the Safari engine).
+ *
+ * Warning for package users:
+ * This function is out of Semantic Versioning, i.e. can change unexpectedly. Usage is at your own risk.
+ */
+export function isWebKit(): boolean {
+  // Based on research in August 2024
+  const w = window
+  const n = navigator
+
+  return (
+    countTruthy([
+      'ApplePayError' in w,
+      'CSSPrimitiveValue' in w,
+      'Counter' in w,
+      n.vendor.indexOf('Apple') === 0,
+      'RGBColor' in w,
+      'WebKitMediaKeys' in w,
+    ]) >= 4
+  )
+}
+
+/**
+ * Checks whether this WebKit browser is a desktop browser.
+ * It doesn't check that the browser is based on WebKit, there is a separate function for this.
+ *
+ * Warning for package users:
+ * This function is out of Semantic Versioning, i.e. can change unexpectedly. Usage is at your own risk.
+ */
+export function isDesktopWebKit(): boolean {
+  // Checked in Safari and DuckDuckGo
+
+  const w = window
+  const { HTMLElement, Document } = w
+
+  return (
+    countTruthy([
+      'safari' in w, // Always false in Karma and BrowserStack Automate
+      !('ongestureend' in w),
+      !('TouchEvent' in w),
+      !('orientation' in w),
+      HTMLElement && !('autocapitalize' in HTMLElement.prototype),
+      Document && 'pointerLockElement' in Document.prototype,
+    ]) >= 4
+  )
+}
+
+/**
+ * Checks whether this WebKit browser is Safari.
+ * It doesn't check that the browser is based on WebKit, there is a separate function for this.
+ *
+ * Warning! The function works properly only for Safari version 15.4 and newer.
+ */
+export function isSafariWebKit(): boolean {
+  // Checked in Safari, Chrome, Firefox, Yandex, UC Browser, Opera, Edge and DuckDuckGo.
+  // iOS Safari and Chrome were checked on iOS 11-18. DuckDuckGo was checked on iOS 17-18 and macOS 14-15.
+  // Desktop Safari versions 12-18 were checked.
+  // The other browsers were checked on iOS 17 and 18; there was no chance to check them on the other OS versions.
+
+  const w = window
+
+  return (
+    // Filters-out Chrome, Yandex, DuckDuckGo (macOS and iOS), Edge
+    isFunctionNative(w.print) &&
+    // Doesn't work in Safari < 15.4
+    String((w as unknown as Record<string, unknown>).browser) === '[object WebPageNamespace]'
+  )
+}
+
+/**
+ * Checks whether the browser is based on Gecko (Firefox engine) without using user-agent.
+ *
+ * Warning for package users:
+ * This function is out of Semantic Versioning, i.e. can change unexpectedly. Usage is at your own risk.
+ */
+export function isGecko(): boolean {
+  const w = window
+
+  // Based on research in September 2020
+  return (
+    countTruthy([
+      'buildID' in navigator,
+      'MozAppearance' in (document.documentElement?.style ?? {}),
+      'onmozfullscreenchange' in w,
+      'mozInnerScreenX' in w,
+      'CSSMozDocumentRule' in w,
+      'CanvasCaptureMediaStream' in w,
+    ]) >= 4
+  )
+}
+
+/**
+ * Checks whether the browser is based on Chromium version ≥86 without using user-agent.
+ * It doesn't check that the browser is based on Chromium, there is a separate function for this.
+ */
+export function isChromium86OrNewer(): boolean {
+  // Checked in Chrome 85 vs Chrome 86 both on desktop and Android. Checked in macOS Chrome 128, Android Chrome 127.
+  const w = window
+
+  return (
+    countTruthy([
+      !('MediaSettingsRange' in w),
+      'RTCEncodedAudioFrame' in w,
+      '' + w.Intl === '[object Intl]',
+      '' + w.Reflect === '[object Reflect]',
+    ]) >= 3
+  )
+}
+
+/**
+ * Checks whether the browser is based on Chromium version ≥122 without using user-agent.
+ * It doesn't check that the browser is based on Chromium, there is a separate function for this.
+ */
+export function isChromium122OrNewer(): boolean {
+  // Checked in Chrome 121 vs Chrome 122 and 129 both on desktop and Android
+  const w: any = window
+  const { URLPattern } = w
+
+  return (
+    countTruthy([
+      'union' in Set.prototype,
+      'Iterator' in w,
+      URLPattern && 'hasRegExpGroups' in URLPattern.prototype,
+      'RGB8' in WebGLRenderingContext.prototype,
+    ]) >= 3
+  )
+}
+
+/**
+ * Checks whether the browser is based on WebKit version ≥606 (Safari ≥12) without using user-agent.
+ * It doesn't check that the browser is based on WebKit, there is a separate function for this.
+ *
+ * @see https://en.wikipedia.org/wiki/Safari_version_history#Release_history Safari-WebKit versions map
+ */
+export function isWebKit606OrNewer(): boolean {
+  // Checked in Safari 9–18
+  const w = window
+
+  return (
+    countTruthy([
+      'DOMRectList' in w,
+      'RTCPeerConnectionIceEvent' in w,
+      'SVGGeometryElement' in w,
+      'ontransitioncancel' in w,
+    ]) >= 3
+  )
+}
+
+/**
+ * Checks whether the browser is based on WebKit version ≥616 (Safari ≥17) without using user-agent.
+ * It doesn't check that the browser is based on WebKit, there is a separate function for this.
+ *
+ * @see https://developer.apple.com/documentation/safari-release-notes/safari-17-release-notes Safari 17 release notes
+ * @see https://tauri.app/v1/references/webview-versions/#webkit-versions-in-safari Safari-WebKit versions map
+ */
+export function isWebKit616OrNewer(): boolean {
+  const w = window
+  const n = navigator
+  const { CSS, HTMLButtonElement } = w
+
+  return (
+    countTruthy([
+      !('getStorageUpdates' in n),
+      HTMLButtonElement && 'popover' in HTMLButtonElement.prototype,
+      'CSSCounterStyleRule' in w,
+      CSS.supports('font-size-adjust: ex-height 0.5'),
+      CSS.supports('text-transform: full-width'),
+    ]) >= 4
+  )
+}
+
+/**
+ * Checks whether the device is an iPad.
+ * It doesn't check that the engine is WebKit and that the WebKit isn't desktop.
+ */
+export function isIPad(): boolean {
+  // Checked on:
+  // Safari on iPadOS (both mobile and desktop modes): 8, 11-18
+  // Chrome on iPadOS (both mobile and desktop modes): 11-18
+  // Safari on iOS (both mobile and desktop modes): 9-18
+  // Chrome on iOS (both mobile and desktop modes): 9-18
+
+  // Before iOS 13. Safari tampers the value in "request desktop site" mode since iOS 13.
+  if (navigator.platform === 'iPad') {
+    return true
+  }
+
+  const s = screen
+  const screenRatio = s.width / s.height
+
+  return (
+    countTruthy([
+      // Since iOS 13. Doesn't work in Chrome on iPadOS <15, but works in desktop mode.
+      'MediaSource' in window,
+      // Since iOS 12. Doesn't work in Chrome on iPadOS.
+      !!(Element as any).prototype.webkitRequestFullscreen,
+      // iPhone 4S that runs iOS 9 matches this, but it is not supported
+      // Doesn't work in incognito mode of Safari ≥17 with split screen because of tracking prevention
+      screenRatio > 0.65 && screenRatio < 1.53,
+    ]) >= 2
+  )
+}
+
+/**
+ * Warning for package users:
+ * This function is out of Semantic Versioning, i.e. can change unexpectedly. Usage is at your own risk.
+ */
+export function getFullscreenElement(): Element | null {
+  const d: any = document
+  return d.fullscreenElement || d.msFullscreenElement || d.mozFullScreenElement || d.webkitFullscreenElement || null
+}
+
+export function exitFullscreen(): Promise<void> {
+  const d: any = document
+  // `call` is required because the function throws an error without a proper "this" context
+  return (d.exitFullscreen || d.msExitFullscreen || d.mozCancelFullScreen || d.webkitExitFullscreen).call(d)
+}
+
+/**
+ * Checks whether the device runs on Android without using user-agent.
+ *
+ * Warning for package users:
+ * This function is out of Semantic Versioning, i.e. can change unexpectedly. Usage is at your own risk.
+ */
+export function isAndroid(): boolean {
+  const isItChromium = isChromium()
+  const isItGecko = isGecko()
+  const w = window
+  const n = navigator
+  // Chrome removes all words "Android" from `navigator` when desktop version is requested
+  // Firefox keeps "Android" in `navigator.appVersion` when desktop version is requested
+  if (isItChromium) {
+    return (
+      countTruthy([
+        !('SharedWorker' in w),
+        // `typechange` is deprecated, but it's still present on Android (tested on Chrome Mobile 117)
+        // Removal proposal https://bugs.chromium.org/p/chromium/issues/detail?id=699892
+        // Note: this expression returns true on ChromeOS, so additional detectors are required to avoid false-positives
+        // n[c] && 'ontypechange' in n[c],
+        !('sinkId' in new Audio()),
+      ]) >= 2
+    )
+  } else if (isItGecko) {
+    return countTruthy(['onorientationchange' in w, 'orientation' in w, /android/i.test(n.appVersion)]) >= 2
+  } else {
+    // Only 2 browser engines are presented on Android.
+    // Actually, there is also Android 4.1 browser, but it's not worth detecting it at the moment.
+    return false
+  }
+}
+
+/**
+ * Checks whether the browser is Samsung Internet without using user-agent.
+ * It doesn't check that the browser is based on Chromium, please use `isChromium` before using this function.
+ *
+ * Warning for package users:
+ * This function is out of Semantic Versioning, i.e. can change unexpectedly. Usage is at your own risk.
+ */
+export function isSamsungInternet(): boolean {
+  // Checked in Samsung Internet 21, 25 and 27
+  const n = navigator
+  const w = window
+  const audioPrototype = Audio.prototype
+  const { visualViewport } = w
+
+  return (
+    countTruthy([
+      'srLatency' in audioPrototype,
+      'srChannelCount' in audioPrototype,
+      'devicePosture' in n, // Not available in HTTP
+      visualViewport && 'segments' in visualViewport,
+      'getTextInformation' in Image.prototype, // Not available in Samsung Internet 21
+    ]) >= 3
+  )
+}

package/src/device/utils/commonPixels.ts

@@ -0,0 +1,38 @@
+export function getCommonPixels(images: ImageData[], width: number, height: number ): ImageData {
+    let finalData: number[] = [];
+    for (let i = 0; i < images[0].data.length; i++) {
+        let indice: number[] = [];
+        for (let u = 0; u < images.length; u++) {
+            indice.push(images[u].data[i]);
+        }
+        finalData.push(getMostFrequent(indice));
+    }
+
+    const pixelData = finalData;
+    const pixelArray = new Uint8ClampedArray(pixelData);
+    return new ImageData(pixelArray, width, height);
+}
+
+function getMostFrequent(arr: number[]): number {
+    if (arr.length === 0) {
+      return 0; // Handle empty array case
+    }
+  
+    const frequencyMap: { [key: number]: number } = {};
+    
+    // Count occurrences of each number in the array
+    for (const num of arr) {
+      frequencyMap[num] = (frequencyMap[num] || 0) + 1;
+    }
+  
+    let mostFrequent: number = arr[0];
+    
+    // Find the number with the highest frequency
+    for (const num in frequencyMap) {
+      if (frequencyMap[num] > frequencyMap[mostFrequent]) {
+        mostFrequent = parseInt(num, 10);
+      }
+    }
+  
+    return mostFrequent;
+  }

package/src/device/utils/data.ts

@@ -0,0 +1,161 @@
+/*
+ * This file contains functions to work with pure data only (no browser features, DOM, side effects, etc).
+ */
+
+/**
+ * Does the same as Array.prototype.includes but has better typing
+ */
+export function includes<THaystack>(haystack: ArrayLike<THaystack>, needle: unknown): needle is THaystack {
+    for (let i = 0, l = haystack.length; i < l; ++i) {
+      if (haystack[i] === needle) {
+        return true
+      }
+    }
+    return false
+  }
+  
+  /**
+   * Like `!includes()` but with proper typing
+   */
+  export function excludes<THaystack, TNeedle>(
+    haystack: ArrayLike<THaystack>,
+    needle: TNeedle,
+  ): needle is Exclude<TNeedle, THaystack> {
+    return !includes(haystack, needle)
+  }
+  
+  /**
+   * Be careful, NaN can return
+   */
+  export function toInt(value: unknown): number {
+    return parseInt(value as string)
+  }
+  
+  /**
+   * Be careful, NaN can return
+   */
+  export function toFloat(value: unknown): number {
+    return parseFloat(value as string)
+  }
+  
+  export function replaceNaN<T, U>(value: T, replacement: U): T | U {
+    return typeof value === 'number' && isNaN(value) ? replacement : value
+  }
+  
+  export function countTruthy(values: unknown[]): number {
+    return values.reduce<number>((sum, value) => sum + (value ? 1 : 0), 0)
+  }
+  
+  export function round(value: number, base = 1): number {
+    if (Math.abs(base) >= 1) {
+      return Math.round(value / base) * base
+    } else {
+      // Sometimes when a number is multiplied by a small number, precision is lost,
+      // for example 1234 * 0.0001 === 0.12340000000000001, and it's more precise divide: 1234 / (1 / 0.0001) === 0.1234.
+      const counterBase = 1 / base
+      return Math.round(value * counterBase) / counterBase
+    }
+  }
+  
+  /**
+   * Parses a CSS selector into tag name with HTML attributes.
+   * Only single element selector are supported (without operators like space, +, >, etc).
+   *
+   * Multiple values can be returned for each attribute. You decide how to handle them.
+   */
+  export function parseSimpleCssSelector(
+    selector: string,
+  ): [tag: string | undefined, attributes: Record<string, string[]>] {
+    const errorMessage = `Unexpected syntax '${selector}'`
+    const tagMatch = /^\s*([a-z-]*)(.*)$/i.exec(selector) as RegExpExecArray
+    const tag = tagMatch[1] || undefined
+    const attributes: Record<string, string[]> = {}
+    const partsRegex = /([.:#][\w-]+|\[.+?\])/gi
+  
+    const addAttribute = (name: string, value: string) => {
+      attributes[name] = attributes[name] || []
+      attributes[name].push(value)
+    }
+  
+    for (;;) {
+      const match = partsRegex.exec(tagMatch[2])
+      if (!match) {
+        break
+      }
+      const part = match[0]
+      switch (part[0]) {
+        case '.':
+          addAttribute('class', part.slice(1))
+          break
+        case '#':
+          addAttribute('id', part.slice(1))
+          break
+        case '[': {
+          const attributeMatch = /^\[([\w-]+)([~|^$*]?=("(.*?)"|([\w-]+)))?(\s+[is])?\]$/.exec(part)
+          if (attributeMatch) {
+            addAttribute(attributeMatch[1], attributeMatch[4] ?? attributeMatch[5] ?? '')
+          } else {
+            throw new Error(errorMessage)
+          }
+          break
+        }
+        default:
+          throw new Error(errorMessage)
+      }
+    }
+  
+    return [tag, attributes]
+  }
+  
+  export function areSetsEqual(set1: Set<unknown>, set2: Set<unknown>): boolean {
+    if (set1 === set2) {
+      return true
+    }
+    if (set1.size !== set2.size) {
+      return false
+    }
+  
+    for (let iter = set1.values(), step = iter.next(); !step.done; step = iter.next()) {
+      if (!set2.has(step.value)) {
+        return false
+      }
+    }
+    return true
+  }
+  
+  export function maxInIterator<T>(iterator: Iterator<T>, getItemScore: (item: T) => number): T | undefined {
+    let maxItem: T | undefined
+    let maxItemScore: number | undefined
+  
+    for (let step = iterator.next(); !step.done; step = iterator.next()) {
+      const item = step.value
+      const score = getItemScore(item)
+      if (maxItemScore === undefined || score > maxItemScore) {
+        maxItem = item
+        maxItemScore = score
+      }
+    }
+  
+    return maxItem
+  }
+  
+  /**
+   * Converts a string to UTF8 bytes
+   */
+  export function getUTF8Bytes(input: string): Uint8Array {
+    // Benchmark: https://jsbench.me/b6klaaxgwq/1
+    // If you want to just count bytes, see solutions at https://jsbench.me/ehklab415e/1
+    const result = new Uint8Array(input.length)
+    for (let i = 0; i < input.length; i++) {
+      // `charCode` is faster than encoding, so we prefer that when it's possible
+      const charCode = input.charCodeAt(i)
+  
+      // In case of non-ASCII symbols we use proper encoding
+      if (charCode > 127) {
+        return new TextEncoder().encode(input)
+      }
+      result[i] = charCode
+    }
+    return result
+  }
+  

package/src/device/utils/dom.ts

@@ -0,0 +1,148 @@
+import { MaybePromise, wait } from './async'
+import { parseSimpleCssSelector } from './data'
+
+/**
+ * Creates and keeps an invisible iframe while the given function runs.
+ * The given function is called when the iframe is loaded and has a body.
+ * The iframe allows to measure DOM sizes inside itself.
+ *
+ * Notice: passing an initial HTML code doesn't work in IE.
+ *
+ * Warning for package users:
+ * This function is out of Semantic Versioning, i.e. can change unexpectedly. Usage is at your own risk.
+ */
+export async function withIframe<T>(
+  action: (iframe: HTMLIFrameElement, iWindow: typeof window) => MaybePromise<T>,
+  initialHtml?: string,
+  domPollInterval = 50,
+): Promise<T> {
+  const d = document
+
+  // document.body can be null while the page is loading
+  while (!d.body) {
+    await wait(domPollInterval)
+  }
+
+  const iframe = d.createElement('iframe')
+
+  try {
+    await new Promise<void>((_resolve, _reject) => {
+      let isComplete = false
+      const resolve = () => {
+        isComplete = true
+        _resolve()
+      }
+      const reject = (error: unknown) => {
+        isComplete = true
+        _reject(error)
+      }
+
+      iframe.onload = resolve
+      iframe.onerror = reject
+      const { style } = iframe
+      style.setProperty('display', 'block', 'important') // Required for browsers to calculate the layout
+      style.position = 'absolute'
+      style.top = '0'
+      style.left = '0'
+      style.visibility = 'hidden'
+      if (initialHtml && 'srcdoc' in iframe) {
+        iframe.srcdoc = initialHtml
+      } else {
+        iframe.src = 'about:blank'
+      }
+      d.body.appendChild(iframe)
+
+      // WebKit in WeChat doesn't fire the iframe's `onload` for some reason.
+      // This code checks for the loading state manually.
+      // See https://github.com/fingerprintjs/fingerprintjs/issues/645
+      const checkReadyState = () => {
+        // The ready state may never become 'complete' in Firefox despite the 'load' event being fired.
+        // So an infinite setTimeout loop can happen without this check.
+        // See https://github.com/fingerprintjs/fingerprintjs/pull/716#issuecomment-986898796
+        if (isComplete) {
+          return
+        }
+
+        // Make sure iframe.contentWindow and iframe.contentWindow.document are both loaded
+        // The contentWindow.document can miss in JSDOM (https://github.com/jsdom/jsdom).
+        if (iframe.contentWindow?.document?.readyState === 'complete') {
+          resolve()
+        } else {
+          setTimeout(checkReadyState, 10)
+        }
+      }
+      checkReadyState()
+    })
+
+    while (!iframe.contentWindow?.document?.body) {
+      await wait(domPollInterval)
+    }
+
+    return await action(iframe, iframe.contentWindow as typeof window)
+  } finally {
+    iframe.parentNode?.removeChild(iframe)
+  }
+}
+
+/**
+ * Creates a DOM element that matches the given selector.
+ * Only single element selector are supported (without operators like space, +, >, etc).
+ */
+export function selectorToElement(selector: string): HTMLElement {
+  const [tag, attributes] = parseSimpleCssSelector(selector)
+  const element = document.createElement(tag ?? 'div')
+  for (const name of Object.keys(attributes)) {
+    const value = attributes[name].join(' ')
+    // Changing the `style` attribute can cause a CSP error, therefore we change the `style.cssText` property.
+    // https://github.com/fingerprintjs/fingerprintjs/issues/733
+    if (name === 'style') {
+      addStyleString(element.style, value)
+    } else {
+      element.setAttribute(name, value)
+    }
+  }
+  return element
+}
+
+/**
+ * Adds CSS styles from a string in such a way that doesn't trigger a CSP warning (unsafe-inline or unsafe-eval)
+ */
+export function addStyleString(style: CSSStyleDeclaration, source: string): void {
+  // We don't use `style.cssText` because browsers must block it when no `unsafe-eval` CSP is presented: https://csplite.com/csp145/#w3c_note
+  // Even though the browsers ignore this standard, we don't use `cssText` just in case.
+  for (const property of source.split(';')) {
+    const match = /^\s*([\w-]+)\s*:\s*(.+?)(\s*!([\w-]+))?\s*$/.exec(property)
+    if (match) {
+      const [, name, value, , priority] = match
+      style.setProperty(name, value, priority || '') // The last argument can't be undefined in IE11
+    }
+  }
+}
+
+/**
+ * Returns true if the code runs in an iframe, and any parent page's origin doesn't match the current origin
+ */
+export function isAnyParentCrossOrigin(): boolean {
+  let currentWindow: Window = window
+
+  for (;;) {
+    const parentWindow = currentWindow.parent
+    if (!parentWindow || parentWindow === currentWindow) {
+      return false // The top page is reached
+    }
+
+    try {
+      if (parentWindow.location.origin !== currentWindow.location.origin) {
+        return true
+      }
+    } catch (error) {
+      // The error is thrown when `origin` is accessed on `parentWindow.location` when the parent is cross-origin
+      if (error instanceof Error && error.name === 'SecurityError') {
+        return true
+      }
+      throw error
+    }
+
+    currentWindow = parentWindow
+  }
+}