Selector Forge: AI-Powered Browser Extension for Resilient Selectors

Selector Forge provides AI-generated, DOM-verified selectors for automation

Selector Forge is a standalone browser extension for Chrome and Firefox (MV3) designed to create robust CSS and XPath selectors. Unlike traditional selector tools, it uses an AI-driven loop to propose candidates and then mandates re-verification against the live DOM to ensure the resulting selector is accurate and resilient before it is presented to the user.

This tool is primarily aimed at developers writing end-to-end tests, building web scrapers, and automating web pages where brittle selectors frequently lead to maintenance overhead.

How the AI-Verification Loop Works

The core value of Selector Forge is its "trust boundary," which ensures that the AI proposes candidates but the browser remains the final authority on correctness.

  1. Element Selection: The user picks an element or set of elements on a live page.
  2. Snapshot Capture: The extension captures a compact snapshot of the selected targets, DOM context, and seed candidates.
  3. AI Proposal: This snapshot is sent to the Intuned backend, which proposes and ranks candidate selectors.
  4. Live DOM Testing: The extension tests every AI-proposed candidate against the actual live DOM.
  5. Iterative Refinement: This loop repeats until the backend settles on a verified winner.
  6. Final Output: Only re-verified selectors are displayed to the user for copying.

For list selections, the verification process checks the full intended set to reject selectors that either over-match or under-match the target elements.

Selection Modes

Selector Forge offers two primary modes for generating selectors:

Mode Action Result
Single Pick one element Verified selectors for specific targets like buttons, inputs, links, or labels.
List Pick two examples from a repeating set A verified container selector for the entire set, previewed before saving.

Technical Architecture and Development

Selector Forge is built using WXT and React for the popup interface. The project is structured to separate concerns across different browser contexts:

  • Background Service Worker: Manages session state, the agent loop, and network I/O.
  • Content Script: Handles the picker overlay, DOM access, and selector testing.
  • Popup: A React-based interface for mode controls and results.
  • Messaging Layer: A typed, direction-partitioned runtime-message protocol for communication between contexts.

Testing Infrastructure

The project employs a three-layer testing strategy to ensure reliability:

  • Unit Tests: Fast Vitest tests using node/happy-dom for selector logic and state transforms.
  • Browser Tests: Vitest browser-mode tests that run generation against a real DOM to prove each candidate resolves to the expected element set.
  • E2E Tests: Playwright tests run against the packaged MV3 extension to validate the full pointer flow and background worker interaction.

Future Roadmap

Upcoming features for Selector Forge include:

  • CLI Control: Enabling the Intuned CLI to drive the extension, facilitating local agents and MCP (Model Context Protocol) exposure.
  • Smart Picker: A mode for selecting multiple elements in one flow to automatically group them into items and list-like sets, including AI-driven field detection.
  • Drill-down Modes: Tools for precision refinement to walk the XPath/DOM tree (e.g., moving from a child span to a parent container).
  • Self-Hostable Backend: A reference backend and open-source agent to allow users to run the entire selector generation loop on their own infrastructure, replacing the dependency on Intuned.

Long-term goals include support for automatic pagination detection, cross-iframe/shadow-DOM support, and exports to Playwright or plain JavaScript.

Sources