StevenBoutcher cursorrules-playwright .cursorrules file for unknown (stars: 3)

# Playwright Testing - Best Practices
0. Always use TypeScript instead of vanilla JavaScript whenever possible.
1. For locators, always bias towards using Playwright's `getByTestId()` locator method instead of any other method.
2. Add a `data-testid` attribute for elements you need to target if they don't already have a `data-testid` attribute.
3. Every `data-testid` should follow this format: `ComponentName_camelCaseDescriptorOfElement`
4. 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();
    ```
5. 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.
6. 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.
7. 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.
8. Never use `.not.toBeVisible()` or `.toBeHidden()`. Instead of these, use our custom matcher `.toNotExist()`.
java
javascript
playwright
typescript

First Time Repository

My personal cursorrules file for writing top-notch Playwright tests assisted by Cursor

unknown
Created: 9/14/2024
Updated: 1/5/2025

All Repositories (1)

My personal cursorrules file for writing top-notch Playwright tests assisted by Cursor