In the last post I explained why Playwright CLI is a better fit than Playwright MCP for AI coding agents. So before we talk about workflows, debugging, or best practices, let's make the tool clear. - What is it? - How do you install it? - And how do you run one simple command against a real website? ──────────────────────────────────────── 🟢 𝐖𝐡𝐚𝐭 𝐏𝐥𝐚𝐲𝐰𝐫𝐢𝐠𝐡𝐭 𝐂𝐋𝐈 𝐀𝐜𝐭𝐮𝐚𝐥𝐥𝐲 𝐈𝐬 Playwright CLI is a command-line tool for controlling a browser. You run commands in the terminal, and Playwright CLI can: ➜ Open a website ➜ Click buttons ➜ Fill inputs ➜ Press keys ➜ Take screenshots ➜ Read a page snapshot It was designed for AI coding agents. But it is not only for AI. You can use it yourself from the terminal to check that the browser opens, the page loads, and the command returns useful page information. ──────────────────────────────────────── 🧠 𝐇𝐨𝐰 𝐈𝐭 𝐅𝐢𝐭𝐬 𝐖𝐢𝐭𝐡 𝐀𝐈 𝐂𝐨𝐝𝐢𝐧𝐠 𝐀𝐠𝐞𝐧𝐭𝐬 The workflow is simple: 1. You ask the AI agent to inspect a page or debug a UI flow. 2. The agent runs Playwright CLI commands in the terminal. 3. Playwright CLI controls the browser. 4. The agent reads the result and decides what to do next. This does not replace Selenium, Cypress, or Playwright Test. It acts as a new layer on top of the testing frameworks. ──────────────────────────────────────── 🍎 𝐈𝐧𝐬𝐭𝐚𝐥𝐥 𝐏𝐥𝐚𝐲𝐰𝐫𝐢𝐠𝐡𝐭 𝐂𝐋𝐈 𝐎𝐧 𝐌𝐚𝐜 You need `Node.js` and `npm ` first. If you already have them, check in Terminal: ──────────────── > node -v ──────────────── > npm -v ──────────────── If those commands do not work, install Node.js LTS first: ──────────────── > brew install node ──────────────── Once `node` and `npm` work, install Playwright CLI: ──────────────── > npm install -g @playwright/cli@latest ──────────────── Then verify it: ──────────────── > playwright-cli --version ──────────────── You can also print the available commands: ──────────────── > playwright-cli --help ──────────────── Now go to the project where you want to use it: ──────────────── > cd your-project-folder

🧠 𝗔𝘂𝘁𝗼𝗺𝗮𝘁𝗶𝗼𝗻 𝘁𝗼𝗼𝗹𝘀 𝘂𝘀𝗲𝗱 𝘁𝗼 𝗯𝗲 𝗯𝘂𝗶𝗹𝘁 𝗳𝗼𝗿 𝗵𝘂𝗺𝗮𝗻𝘀. 1. A QA engineer wrote the code. 2. Read the errors. 3. Decided what to try next. That was the normal workflow for years. But now everything has changed. Starting in early 2026, AI Coding Agents can handle all of those steps, while QA engineers act as managers and agentic leads. ──────────────────────────────────────── 🟠 𝐏𝐥𝐚𝐲𝐰𝐫𝐢𝐠𝐡𝐭 𝐌𝐂𝐏 It was the first serious tool for this new AI QA workflow. It let an AI Agent look at the page, click buttons, take page snapshots, and do basic browser tasks. Main use cases for the Playwright MCP in Test Automation: - Gathering locators for the UI tests - Debugging flaky or failed tests - Read console and network logs How it works: 1. User asks an AI agent that has access to Playwright MCP to do a task. 2. The AI coding agent controls the Playwright MCP to interact with a browser. For a while, that seemed like a great option, but soon enough it was discovered that it has a few fatal issues... ──────────────────────────────────────── 🔴 𝗣𝗹𝗮𝘆𝘄𝗿𝗶𝗴𝗵𝘁 𝗠𝗖𝗣 𝗶𝘀 𝗻𝗼𝘁 𝘁𝗵𝗲 𝗯𝗲𝘀𝘁 𝗼𝗽𝘁𝗶𝗼𝗻 𝗳𝗼𝗿 𝘁𝗲𝘀𝘁 𝗮𝘂𝘁𝗼𝗺𝗮𝘁𝗶𝗼𝗻 Here is how Playwright MCP works: 1. It loads a full page snapshot (HTML + CSS) into the AI agent’s context after each page interaction. 2. It also loads large MCP metadata that tells the agent how to use the tool. That means Playwright MCP can eat 20–30% of that memory in a single use. And once context crosses 50–60%, agents start making mistakes and losing track of earlier instructions. So technically it works, but the context overhead and cost are not great. Quick recap: the AI agent’s context is its working memory. It holds the current conversation, instructions, code, and everything else the agent needs to stay on track. ──────────────────────────────────────── 🟢 𝐏𝐥𝐚𝐲𝐰𝐫𝐢𝐠𝐡𝐭 𝐂𝐋𝐈 Playwright CLI was built to solve those problems. It gives AI agents a simple command-line utility they can call like any other terminal command: - The agent runs small commands and gets back short results. - It reads the full HTML page only when needed, not on every interaction like Playwright MCP does.

AI is everywhere, and it's easy to feel overwhelmed. Codex. Claude Code. Cursor. Windsurf. Copilot. New names every week, new hype every day. But they all describe the same concept: AI coding agents. ──────────────────────────────────────── 𝐖𝐡𝐚𝐭 𝐈𝐬 𝐚𝐧 𝐀𝐈 𝐂𝐨𝐝𝐢𝐧𝐠 𝐀𝐠𝐞𝐧𝐭? Simple: it's a tool that interacts with AI and generates code. That's it. But like any tool in a QA engineer's kit, not all of them are equal. Some are great for specific tasks, some are poor at most things, and some are solid generalists you can use anywhere and get good results. I spent over $3,000 testing them so you don't have to. In this series of posts I'll share exactly what I found. Today, we start with the fundamentals. ──────────────────────────────────────── 🧠 𝐖𝐡𝐚𝐭 𝐈𝐬 𝐚𝐧 𝐋𝐋𝐌? LLM stands for Large Language Model, the brain powering every AI coding agent. But here's the key thing to understand: you never talk to the LLM directly. There's always a tool sitting in between: ► YOU ► Tool (Cursor / Copilot / Claude Code) ► LLM (GPT-5 / Claude / Gemini) The same pattern applies when you use AI chat apps, except the interface is built for conversation, not code. ──────────────────────────────────────── ⚡ 𝐖𝐡𝐲 𝐓𝐡𝐢𝐬 𝐌𝐚𝐭𝐭𝐞𝐫𝐬 𝐟𝐨𝐫 𝐘𝐨𝐮 The tool (cursor, etc) you pick is responsible for roughly 50% of your results. Here's why: the tool reads your code, decides what information to send to the LLM, and determines how much the AI actually understands about your project and how it can write the actual code. Different tools. Different developers. Different quality. Same LLM. Wildly different output. This is exactly why the same engineer, using the same LLM but a different tool, can get completely different results. For example, using the exact same ChatGPT LLM in Cursor versus Copilot for the same task will produce very different quality output. ──────────────────────────────────────── 📌 𝐊𝐞𝐲 𝐓𝐚𝐤𝐞𝐚𝐰𝐚𝐲𝐬 - LLM = the brain. You can't access it directly. - Tools (Cursor, Copilot, Claude Code) sit between you and the LLM. - The tool accounts for ~50% of the quality you get. - Different tools, different quality, different output even with the same LLM underneath.