skills.rest
CodySwannGT
CodySwannGTCOMMUNITY
Explore all skills by this author →
GitHub

playwright-selectors

Define Playwright selector best practices for Expo web apps using testID and aria-label.

3|3|Updated Jan 18, 2026
Search Tags:#accessibility#playwright#e2e testing#testID#expo#selectors#aria-label
One-click install
npx skills add https://github.com/CodySwannGT/lisa --skill playwright-selectors
Or copy as Structured Prompt for Agent▼
Please help me install this Agent Skill.
Skill: playwright-selectors
Source: https://github.com/CodySwannGT/lisa/tree/main/plugins/lisa-expo/skills/playwright-selectors
Command: npx skills add https://github.com/CodySwannGT/lisa --skill playwright-selectors

SYSTEM DOCUMENTATION & REQUIREMENTS

What problem does it solve?

This Skill addresses the challenge of creating robust and maintainable end-to-end (E2E) tests for Expo web applications by establishing best practices for using testID and aria-label selectors with Playwright.

Core Features & Use Cases

  • Selector Prioritization: Guides users on the optimal order of selector strategies (getByRole, getByText, getByLabel, getByTestId).
  • testID Naming Convention: Enforces a clear, namespaced pattern (screen:element) for consistent testID usage.
  • Accessibility Integration: Emphasizes using aria-label and accessibilityRole for improved accessibility and testability.
  • Use Case: When developing a new feature, use this skill to ensure all interactive elements have appropriate selectors, making E2E tests less brittle and improving overall application quality.

Quick Start

Use the playwright-selectors skill to add a testID to the login button on the authentication screen following the recommended naming convention.

Frequently Asked Questions about playwright-selectors

High-intent search queries and answers about installing and using this skill.

FAQPage Schema
How do I use Playwright selectors for E2E testing in Expo web applications?▼

Playwright selectors for Expo web apps use `testID` and `aria-label` props mapped to HTML attributes. Prioritize selectors like `getByRole` and `getByText` over `getByTestId` to ensure reliable and accessible test automation.

What is the recommended naming convention for testID in Expo?▼

The recommended `testID` naming convention uses a namespaced pattern like `screen:element`. This ensures consistent `testID` usage across your Expo application, making your E2E test suite maintainable and less brittle.

How does Expo map React Native props to HTML attributes for Playwright?▼

Expo maps React Native props like `accessibilityRole` and `aria-label` to standard HTML attributes. This allows Playwright to locate elements using accessible roles and labels, improving both application accessibility and test reliability.

What is the best selector priority strategy for Playwright E2E tests?▼

The best selector priority strategy for Playwright is `getByRole`, then `getByText`, followed by `getByLabel`, and finally `getByTestId`. This approach ensures your E2E tests remain robust and maintainable.

Can I use aria-label and accessibilityRole to improve Expo E2E testing?▼

Yes, using `aria-label` and `accessibilityRole` improves Expo E2E testing by mapping to accessible HTML attributes. This integration allows Playwright to select elements reliably while enhancing overall application accessibility.

Why are my Playwright E2E tests brittle in Expo web apps?▼

Brittle Playwright E2E tests in Expo web apps often result from poor selector choices. Using inconsistent `testID` naming or ignoring accessible attributes like `aria-label` causes tests to break easily during UI changes.

Related Skills

Explore More Software Engineering Skills→
hasparushasparus

playwright-tests

Create and review Playwright tests using accessible selectors and web-first assertions.

Community
Advanced
froide-kkfroide-kk
1

test-playwright

Provide Playwright test patterns for stable end-to-end browser tests.

Official
Intermediate
timsvoicetimsvoice

specimin-ui-accessibility

Audit and fix generated UI code for WCAG 2.1 AA compliance.

Community
Advanced
guichefferguicheffer
3

test-ids-web

Standardize data-testid attributes with kebab-case naming for web testing.

Community
Intermediate