Playwright_MCP_LocalLLM_Docker_TypeScript_Framework
Allows local Ollama models to control the browser from plain English, generate Playwright tests, and heal broken locators after test ID changes.
Click on "Deploy Server".
Wait a few minutes for the server to deploy. Once ready, it will show a "Started" state.
In the chat, type
@followed by the MCP server name and your instructions, e.g., "@Playwright_MCP_LocalLLM_Docker_TypeScript_FrameworkSign in as admin on the login site and verify the dashboard loads"
That's it! The server will respond to your query, and you can continue using it as needed.
Here is a step-by-step guide with screenshots.
Playwright + local Ollama
This project lets you test a website on your own machine.
For architecture, folder map, how to add a test, and a first-hour walkthrough, see WALKTHROUGH.md.
You get three things:
A small login website you can open in the browser
Playwright tests that check login, register, and logout
Local Ollama that can drive the browser or write a new test from plain English
Nothing is sent to a cloud AI. Ollama and the site both run on your computer.
What you need first
Node.js 20 or newer
Ollama installed
Start Ollama and download a model that can use tools:
ollama serve
ollama pull qwen2.5-coder:7bThis repo is already set to use qwen2.5-coder:7b. If you use another model, change OLLAMA_MODEL in .env.
Related MCP server: RunAutomation MCP Server
One-time setup
cp .env.example .env
npm install
npx playwright install chromiumCheck that Ollama is ready:
npm run ollama:health1. Open the login website
npm run site:startThen open http://127.0.0.1:4173/login.html.
You can sign in with:
Password | |
|
|
|
|
You can also create a new account from the register page.
2. Run the tests
When you run tests, Playwright starts the website for you. You do not need to start it first.
npm run test:e2e # full local-site suite, browser stays open
npm run test:auth # login, register, logout (faster, headless)
npm run test:auth:headed # same auth tests, browser visible
npm run test:smoke # a few quick login checks
npm run test:heal # prove tests still pass after test IDs change
npm test # auth + TodoMVC demoThe headed E2E suite walks through the real site: home redirects, login, register, session reload, logout, and login after test IDs change. You will see one Chrome window. In VS Code use Run and Debug → Playwright: E2E headed or the Playwright: E2E headed task.
Run one file or one test by name:
npx playwright test tests/auth/login.spec.ts
npx playwright test --grep "wrong password"3. See auto-heal when test IDs change
Tests first look for data-testid (for example login-email).
If you rename that id, the test does not stop. It looks for the field by label, placeholder, or button name. If it still needs help, it asks local Ollama. The new locator is saved in artifacts/healed-locators.json.
Easiest check
npm run test:heal
npx playwright show-reportThis runs 3 headed cases. You will see a red LOCATOR FAILED banner, then a green HEALED banner, in the browser and in the terminal. The HTML report includes fail/heal screenshots plus an auto-heal-report.md attachment on each test.
Change IDs for the whole site
npm run site:shift-testids
npm run test:auth
npm run site:reset-testidsOr open the login page and click Toggle remapped test IDs.
To see tests fail after a rename, set AUTO_HEAL=false in .env.
4. Ask Ollama to use the browser
Ollama cannot talk to Playwright by itself. This project connects them.
Type what you want in English:
npm run agent -- "Open http://127.0.0.1:4173/login.html and sign in as admin@local.test / Admin123!"Start the website first (npm run site:start) so the agent can open it.
A written log of what happened is saved in artifacts/.
To also write a Playwright test from that run:
npm run agent -- "Sign in as admin and open the dashboard" --generateOr write a test without opening the browser:
npm run generate -- "Sign in as admin@local.test and land on the dashboard"New tests go to tests/generated/. Read them before you trust them, then run npm test.
Run the same things in VS Code
File → Open Folder and choose this project.
Install Playwright Test for VS Code when VS Code asks.
Then use any of these:
Testing (flask icon) — run or debug one test
Run and Debug — Auth site, auth tests, healing demo, Ollama agent
Terminal → Run Task — start the site, shift test IDs, run suites
Explorer → NPM SCRIPTS — every command from
package.json
Run with Docker
You can build one image that starts the login site or runs the tests.
npm run docker:buildStart the website (then open http://127.0.0.1:4173/login.html):
npm run docker:siteRun the auth tests inside the image:
npm run docker:testOr use Compose:
docker compose up auth-lab
docker compose --profile test run --rm testsOllama is optional and stays separate:
docker compose --profile ollama up ollamaHeaded auto-heal and E2E demos still work best on your machine (npm run test:heal). In Docker they run headless because there is no window.
Useful folders
Folder | What is in it |
| The login / register / dashboard website |
| Tests for that website |
| Page objects used by the tests |
| Auto-heal when a test id changes |
| Ollama + browser agent |
| VS Code tasks, debug, and MCP setup |
If something fails
Ollama is not ready — run
ollama serve, thennpm run ollama:healthWebsite will not open — run
npm run site:startand use port4173Browser is missing — run
npx playwright install chromiumAgent talks but does not click — use a model that supports tools, such as
qwen2.5-coder:7b
This server cannot be deployed
Related MCP Connectors
Approved test intent, reviewed Playwright automation and run evidence, inside your editor.
Browser-based QA for AI-built software. Test pages with real browsers via agents.
AI-powered browser automation — navigate, click, fill forms, and extract data from any website.
Run, debug, and triage tests from your IDE using natural language, no dashboard switching, no manual data transfers. The TestMu AI (formerly LambdaTest) MCP Server is a single remote server exposing four tool suites: HyperExecute — analyze your project, generate YAML configs and test runner commands, then monitor jobs and sessions. Automation — pull a TestID's details plus command, network, and console logs into one chat for instant root-cause analysis. Includes mobile app upload. SmartUI — explain pixel, layout, DOM, and perceptual changes in a visual regression run, with context-aware React/HTML/CSS fixes. Accessibility — audit any public URL or a local React app against WCAG and get ready-to-apply remediation steps. Connects over https://mcp.lambdatest.com/mcp using OAuth 2.1 — no API keys in your config. One-click install in Cursor; works with Claude, GitHub Copilot, Cline, and any MCP client. Tests execute on the TestMu AI cloud: 3,000+ browsers and 10,000+ real devices.
Related MCP Servers
- AlicenseAqualityDmaintenanceGenerates intelligent Playwright locators with reliability rankings, creates Page Object Models, and runs test automation scripts directly from your IDE or AI assistant.56 npm1MIT
- FlicenseNot gradedqualityCmaintenanceEnables AI assistants to execute browser automation, perform QA tasks, and generate test code through natural language commands using Playwright.6-
- AlicenseNot gradedqualityDmaintenanceEnables AI-first accessibility testing by investigating pages, explaining findings, and applying fixes via natural language, integrated with Playwright tests and local or cloud AI models.MIT
- AlicenseNot gradedqualityBmaintenanceEnables AI agents to drive Playwright-based browser automation for UI testing, returning JSON/HTML reports with screenshots without server-side LLM or test scripts.1MIT