Browse

Automation Testing .cursorrules strategies

Filters

Tech

Clear

agency_swarm

openai

1. HTML

HTMX

AlpineJS

GitHub Pages

redis

morgan

winston

sequelize

prom-client

ExpressJs

Postgres

Prime React

Inertia.js

Pest

Jetstream

react-hook-form.

JsonKey

ChangeNotifierProvider

Flutter Hooks

cached_network_image

JsonValue

Riverpod Hooks

StateNotifierProvider

AssetImage

auto_route

StateProvider

Freezed

AsyncNotifierProvider

build_runner

GoRouter

ListView.builder

JsonSerializable

NotifierProvider

serverless environments

Nx

npm workspaces

API development

Lerna

swr

Postcss

Apollo Graphql

TypeORM

React.memo()

Lucide icons

RevenueCat

Shadcn UI components

Prisma ORM

Mux

RGAA

Jupyter Notebook

taskfile.dev

testify

loggo

TS

tailwind

shadcn

magicui

lucide

Supabase Client API

Supabase/Postgres

scikit-image

RPi.GPIO

SoundDevice

ORB

OpenCV

SIFT

YAML

cn utility

useCallback

useMemo

useImmerReducer

memo

temporal

frame motion

module css

Shopify Admin GraphQL API

Polaris

Genql

Vercel KV

NetCDF

nbdev

fastcore

Marisco

SASS

SCSS

Hugo

Go templating

Vinxi

React Query SSR

React Router

Tanstack Start

Obsidian Plugin Development

Google Chat

EditorConfig

nextjs app router

ShadCN-Graphs

ShadCN-UI

Google Calendar

Playwright Test TypeScript .cursorrules prompt file

Playwright Testing - Best Practices

Always use TypeScript instead of vanilla JavaScript whenever possible.
For locators, always bias towards using Playwright's getByTestId() locator method instead of any other method.
Add a data-testid attribute for elements you need to target if they don't already have a data-testid attribute.
Every data-testid should follow this format: ComponentName_camelCaseDescriptorOfElement
Save any locator to a variable before using it in a test. Examples:
DO:
```typescript
const exampleSignInButton = page.getByTestId("ExampleButton_signIn");
await exampleSignInButton.click();
```
DON'T:
```typescript
await page.getByTestId("ExampleButton_signIn").click();
```
If logic is being reused in multiple tests, recommend creating a reusable helper/utility function to share this logic across tests. a. If a helper function is created to follow the DRY principle, don't require more arguments in the function than are needed to share the logic. b. Never assert anything in a helper function. Helper functions are reserved for performing a series of user actions, not testing the outcome of those actions.
Whenever possible, use Playwright's built-in features, methods, and utilities instead of "reinventing the wheel" with raw JavaScript or TypeScript solutions to solved problems. Examples:
DO:
```typescript
await expect(async () => {
await radioButton.click(); // locator defined outside this block
await expect(radioButton).toBeChecked();
}).toPass();
```
DON'T:
```typescript
export async function radioButtonGroupClick(
page: Page,
urlToWaitFor: string, // The URL where the radio button is
radioButton: Locator,
errorTextTrigger: Locator // A button you can click that will throw error text if the radio button wasn't clicked
) {
await page.waitForURL(urlToWaitFor);
let iterationCounter = 0;
let errorTextIsVisible = await page.getByTestId("ErrorText").isVisible();
let buttonWasClicked = await radioButton.isChecked();
while (errorTextIsVisible || !buttonWasClicked) {
if (iterationCounter === 5) {
break;
} else {
iterationCounter++;
}
await radioButton.click();
buttonWasClicked = await radioButton.isChecked();
if (buttonWasClicked) {
await errorTextTrigger.click();
errorTextIsVisible = await page.getByTestId("ErrorText").isVisible();
}
}
}
```
The entry point to Playwright's documentation is here if you need to look available features: https://playwright.dev/docs/intro.
When doing so follows the other rules in this file, try to write tests similar to other existing tests in the Playwright suite. The Playwright suite consists of everything within the test/playwright directory.
Never use .not.toBeVisible() or .toBeHidden(). Instead of these, use our custom matcher .toNotExist().