HashLoc

HashLoc is a web element locator short-code and UI-change-tolerant localisaion technique based on Similo.

Example

↓ UI v1 ↓

<input id="mail" type="email" placeholder="hci@example.com">

HashLoc

C600003TG00001ASXV99MMAE26NAWK800002000EVT8Q

↓ UI v2 ↓

<input id="e-mail" placeholder="hci@example.com">

Find by HashLoc

{
  status: "confident",
  confidence: 0.984,
  element: HTMLInputElement
}

Integration

Module

npm install webfuse-com/HashLoc

import * as HashLoc from "@webfuse-com/hashloc";

Browser

<script src="dist.browser/HashLoc.js"></script>

The browser bundle exposes the API via the global window.HashLoc.

Usage

HashLoc.encode(
  element: Element,
  options?: EncodeOptions
): string

HashLoc.resolve(
  code: string | string[],
  options?: ResolveOptions
): {
  status: "confident" | "ambiguous" | "unconfident";
  element: Element | null;
  confidence: number;
  score: number;
  margin: number;
  candidates: {
    index: number;
    element: Element | null;
    score: number;
  }[];
  profile: string;
}

Read the full API Documentation.

Experiments

Setup

Requires Node.js 22 (and Python 3.10 or later for the evaluation).

npm install

Build

npm run build

Test

npm run test

npm run test:<SUITE>
node --test [--test-name-pattern="<TEST-TITLE>"] "test/<SUITE>/<FILE=*>.test.js"   # e.g., HashLoc.codes

Suite	Note
unit
end-to-end	DOM release simulation, training and evaluation
eval	Baseline ports vs Java/Scala reference (Python)

Tests use the built-in Node.js test runner (node:test) and run against dist.lib: build first.

Evaluate

Copy the Kluge & Stocco dataset to the /dataset directory.

cd eval && pip install -r requirements.txt

Relocalization

npm run eval:all

npm run eval:<study>

<study> ∈ { accuracy, accuracy:no-spatial, decomposition, drift, crossval, sketches, ablation }

npm run eval -- --verbose --split 2 --modes 1,firstlast --profiles M

Inline Identity: Change-Tolerant Web Element Locators from Similarity Sketches
_{Thassilo M. Schiepanski
Surfly BV}