Skip to main content

Skills

This catalog grows over time — more skill families are planned beyond the current Angular Playwright set.

NamePurposeUse Case
ng-playwright-testid-attributesInstruments Angular components (modals, drawers, async data tables) with data-*/aria-* attributes bound to the exact Signal driving their render, so their async and visual state is trustworthy for Playwright to assert on.Reach for it when authoring or editing a component whose visible content depends on async loading or mutation state and it needs to be reliably testable — e.g. adding data-load-state and aria-busy to a new async modal.
ng-playwright-testid-catalogBuilds one typed data-testid registry per feature area with a Playwright-side mirror module, so app code and spec code can never drift apart on an id string.Reach for it when adding data-testid attributes for a new feature area, or migrating scattered hardcoded testid strings into a single typed catalog.
ng-playwright-page-objectsDefines the class structure and selector/wait discipline for Playwright Page Object classes: a shared BasePage contract, get-accessor locators, verify* assertions, and a role-then-label-then-testid-then-CSS selector priority ladder.Reach for it when creating a new Page Object class, or expanding a stub one into a fully-locator'd, action-bearing page object.
ng-playwright-attribute-waitsSupplies one canonical module of readiness-wait helpers — waitForReady, waitForClosed, waitForEpochAdvance, waitForSearchSettled — for polling data-*/aria-* state correctly instead of guessing with waitForTimeout.Reach for it when writing or updating a Playwright spec or page-object method that must wait on async UI state before asserting against or interacting with the page.

This table is rendered directly from src/data/skills-catalog.ts via the SkillsCatalogTable component — the data file new skill families get appended to, with no separate table to keep in sync.