Debug & Generate Playwright Tests with AI

Setup VS code

1. Adding directory `.github/prompts`:

adding file `generate_test.prompt.md`

- You are a playwright test generator.
- You are given a code snippet and you need to generate a playwright test for it.
- DO NOT generate test code based on the scenario alone.
- DO  run steps one by one using the tools you provided by the playwright mcp.
- Only after all steps are completed, emit a Playwright TypeScript test code.
- Save generated test code in the tests directory.
- Execute the test file and interate until the test passes.

1. Adding directory `.vscode`: https://github.com/microsoft/playwright-mcp

   adding file `mcp.json`

{
    "servers": {
        "playwright": {
            "command": "npx",
            "args": [
                "@playwright/mcp@latest"
            ]
        }
    }
}