TesterUtilities - Selector Test Pages

Note: These pages serve as test environments for the TesterUtilities Chrome extension. Each page demonstrates different types of selectors and form structures to test the extension's capabilities.

What is this?

This is a collection of test pages designed to showcase all the selector types supported by the TesterUtilities Chrome extension. Each page focuses on a specific selector strategy and provides ready-to-use JSON configurations that you can copy directly into the extension.

How to use these pages

  1. Browse to the test page that demonstrates the selector type you want to use
  2. Review the form structure and see how elements are marked up
  3. Copy the provided JSON configuration
  4. Paste it into the TesterUtilities extension's Custom Site Selectors configuration
  5. Run the extension on the test page to see it in action

Available Test Pages

Data TestID Selectors

Form elements with data-testid attributes for direct targeting.

Ideal for pages with explicit test identifiers.

View TestID Form →

ARIA Role Selectors

Form elements selected by their ARIA roles and accessible properties.

Great for accessibility-focused applications.

View ARIA Form →

Label Selectors

Form elements selected by their associated label text.

Perfect for standard forms with proper labels.

View Label Form →

Text Content Selectors

Elements selected by their visible text content.

Useful for buttons, links, and other text elements.

View Text Form →

Shadow DOM Selectors

Form elements inside Shadow DOM encapsulation.

For modern web components and frameworks.

View Shadow DOM Form →

Multi-step Form

Complex workflow with sequential steps and dynamic content.

For testing multi-stage interactions.

View Multi-step Form →

Complex Form

Combines all selector types in a single comprehensive form.

For testing complex real-world scenarios.

View Complex Form →

Online Access

These test pages are hosted on GitHub Pages and are accessible online at:

https://pawel-albert.github.io/utilities-for-testing-extension/

You can directly use these pages to test the extension without setting up a local server.

Local Development

If you want to make changes or run these pages locally, you can clone the repository and run: 

cd test-pages && npx http-server -p 5252

Source Code

The source code for these test pages is available in the TesterUtilities GitHub repository.