Developer Tools

AegisRunner Selector Recorder

A Chrome extension that lets you visually capture CSS selectors from any website — then use them directly in your AegisRunner test steps.

Works with Chrome, Edge, Brave, and other Chromium-based browsers

How It Works

1

Start Recording

Click the AegisRunner icon in your toolbar, then press "Start Recording". Your cursor changes to a crosshair.

2

Browse & Click Elements

Navigate to the website you're testing. Hover over any element to see it highlighted in cyan. Click to capture its CSS selector — it's copied to your clipboard automatically.

3

Import into Suite Editor

Open any test suite and click the "Extension" button next to a step's selector field. All your captured selectors appear in a picker — click one to fill it in. You can also click "Use in AegisRunner" from the extension popup to jump straight to a suite.

Features

Point & Click Capture

Hover over any element to highlight it, then click to capture the optimal CSS selector automatically.

Smart Selector Generation

Generates stable selectors using #id, [data-testid], [aria-label], tag.class, or contextual paths — in that priority order.

Auto-Copy to Clipboard

Every captured selector is instantly copied to your clipboard, ready to paste into the suite editor.

Selector History

All captured selectors are saved (up to 50) with element tag, source URL, and one-click copy.

Use in AegisRunner

Send any captured selector directly to the AegisRunner suite editor with one click.

Privacy-First

No data leaves your browser. Everything is stored locally using chrome.storage. No analytics, no tracking.

Installation

Get up and running in under a minute.

1

Install from Chrome Web Store

Click "Chrome Web Store" above and hit "Add to Chrome". The extension installs automatically — no unzipping or developer mode needed.

2

Restart your browser

Close and reopen Chrome after installing. The extension requires a browser restart to work correctly.

3

Pin the extension

Click the puzzle-piece icon in your toolbar and pin AegisRunner Selector Recorder for easy access.

4

Start recording

Click the AegisRunner icon and press "Start Recording". Hover over any element to highlight it, then click to capture its CSS selector.

5

Use in your tests

Captured selectors are copied to your clipboard automatically. Use them directly in the AegisRunner suite editor.

Selector Strategy

The extension picks the most stable, unique selector using this priority:

PriorityStrategyExample
1Unique ID#login-btn
2data-testid attribute[data-testid="submit"]
3aria-label attribute[aria-label="Close dialog"]
4Tag + class (if unique)button.primary-action
5Contextual path#sidebar > nav > a.active
6nth-child pathdiv:nth-child(2) > ul > li:nth-child(3)

Ready to speed up your test creation?

Install the Selector Recorder from the Chrome Web Store and start building test steps with point-and-click precision.

Install from Chrome Web Store