AI Skill StudioAI Skill Studio
Skill Library
Presets:

Target Standard & File Format

AI Agent Rules & Skills
Context Shields & Privacy (Ignore Files)
Integrations & Machine Documentation
AI Governance & Multi-Agent Planning Suite

Identity & Activation Rules

3 chips
Scoped domain keywords evaluated in real time
api-routescode-auditsrefactoring
Suggested Chips:

Technology Stack Context

Engineering Philosophy

Flexible & Adaptable

Architectural & Code Quality Conventions

Less rigid & configurable

Agent Behavioral Guardrails

Select active rules
Security & Trust Boundaries
Always included
  • Untrusted Content Is Data
  • Encoded Payloads
  • Least-Privilege File Access
  • Confirm Irreversible Actions
  • Secret Handling
  • Validation Failures
  • Conflicting Requests

Step-by-Step Workflow Procedures

DevOps & Tooling · Windsurf Cascade

Playwright End-to-End Testing Windsurf Cascade Rules

Generate Windsurf Cascade rules for Playwright End-to-End Testing in .windsurf/rules/, with the stack's conventions and checks.

Path
.windsurf/rules/playwright-e2e.md
Loads
Per-rule trigger
Format
Markdown with frontmatter (.md)
Used by
Windsurf Cascade
All Windsurf presets and how <rule-name>.md works

What this file tells the agent

Windsurf's Cascade agent reads rules from .windsurf/rules/. This rule gives Cascade the Playwright End-to-End Testing conventions, commands and patterns to avoid, so its edits follow the stack instead of generic or outdated defaults.

  • Strictly ban hardcoded delays (page.waitForTimeout()); rely exclusively on Playwright web-first auto-waiting assertions (expect(locator).toBeVisible()).
  • Prioritize user-facing accessible locators: page.getByRole(), page.getByLabel(), and page.getByTestId(); never write fragile CSS selectors or brittle XPaths.
  • Encapsulate multi-step interactions inside modular Page Object Models (POM) with typed parameters.
  • Ensure total test isolation: authenticate via storage state (storageState) instead of repeating manual UI logins in every test.
  • Configure trace viewer and video capture on first retry (trace: 'on-first-retry') for painless CI debugging.

Code to avoid, and what to write instead

The rule steers the agent away from the left and toward the right.

avoid
// Flaky: Brittle selectors, arbitrary sleep timeouts, and no auto-waiting
test("bad test", async ({ page }) => {
  await page.goto("/catalog");
  await page.click("div.col-md-4 > button:nth-child(2)"); // Breaks on minor CSS tweak!
  await page.waitForTimeout(5000); // Flaky anti-pattern!
  const text = await page.innerText("#cart-total");
  expect(text).toBe("1");
});
write instead
import { test, expect } from "@playwright/test";

test.describe("Checkout Flow", () => {
  test("allows user to complete cart purchase", async ({ page }) => {
    await page.goto("/catalog");
    
    // Accessible, user-facing locators
    await page.getByRole("button", { name: "Add to Cart" }).first().click();
    await page.getByRole("link", { name: "Cart (1)" }).click();
    
    // Auto-waiting assertions
    await expect(page.getByRole("heading", { name: "Your Shopping Cart" })).toBeVisible();
    await page.getByRole("button", { name: "Proceed to Checkout" }).click();
    
    await expect(page).toHaveURL(/.*checkout/);
  });
});

Install it in one command

  1. 01

    Go to your project root

    The file goes at .windsurf/rules/playwright-e2e.md, relative to the root.

  2. 02

    Download the file

    Run the command on the right. It downloads this preset and writes the file.

  3. 03

    Make sure it gets used

    Cascade reads rules in .windsurf/rules/ and applies this one according to its trigger.

$ mkdir -p ".windsurf/rules" && curl -fsSL "https://www.devscratchpad.tech/api/raw/windsurf-rules/playwright-e2e" -o ".windsurf/rules/playwright-e2e.md"

writes .windsurf/rules/playwright-e2e.md

path

.windsurf/rules/playwright-e2e.md

To write the file from your own code instead, use Read your code or Convert Legacy Rules in the editor above.

Questions

Where do I save this Windsurf rule?
Save it as .windsurf/rules/playwright-e2e.md in your project. Cascade picks up rules in that folder automatically.
When does Windsurf apply this rule?
According to the trigger in its frontmatter: always on, on a glob match, when Cascade decides the description fits the task, or when you @-mention it.