Skip to main content
The Chrome Extension is the primary capture interface. It collects element context, generates stable selectors, and ships data to the Element Library.

​
Purpose

  • Capture any UI element with full DOM context.
  • Produce stable selectors and confidence signals.
  • Record interaction context for step replays and bugs.

​
Primary users

  • QA engineers capturing unstable or flaky elements.
  • Developers validating selectors for automation.
  • Product teams attaching real UI evidence to issues.

​
Plan limits

Extension captures contribute to your plan’s saved element quota:
PlanSaved ElementsStep ReplaysIntegrations
Free10015/month1
Starter ($99/mo)Unlimited2,000/month3
Pro ($499/mo)Unlimited50,000/month20
EnterpriseUnlimitedUnlimitedCustom

​
Entry points

  • Browser toolbar icon.
  • Right-click context menu for capture.
  • In-product “View docs” and capture guidance.

​
Core capture flow

  1. Open the Chrome Extension and start capture mode.
  2. Hover to preview the target element highlight.
  3. Click to capture the element and its hierarchy.
  4. Review selectors, stability score, and context.
  5. Save to a project or attach to a bug report.

​
Data captured

  • Selectors: CSS, XPath, test ID, JS path, and alternatives.
  • Element context: attributes, text, bounding box, computed styles.
  • Stability signals: score, risk factors, and fallback selectors.
  • Interaction context: user action, timestamp, page URL, viewport.
  • Diagnostics: console logs, network signals, and optional screenshots.

​
Page structure (Chrome Extension UI)

​
1. Header

  • Project selector
  • Capture mode toggle
  • Environment indicator

​
2. Capture panel

  • Target preview and highlight controls
  • Confirm capture action
  • Quick status feedback (success or error)

​
3. Selector analysis

  • Primary selector
  • Alternate selectors with stability hints
  • Copy buttons and code snippets

​
4. Context panel

  • Attributes and text snapshot
  • CSS and layout summary
  • Optional screenshot preview

​
5. Actions

  • Save to project
  • Create bug report
  • Share element

​
Key settings

  • Use local API toggle
  • Include screenshot toggle
  • Host allowlist for capture

​
Output payload

  • Element ID and project ID
  • Selector set and stability score
  • Raw attributes and computed styles
  • Interaction metadata
  • Optional screenshot URL

​
Known limits

  • Restricted pages and browser security policies
  • Cross-origin iframes may limit capture depth
  • Very large DOMs may reduce capture speed