Web-App im echten Browser testen: MCP-Setup

So hängt es zusammen

Ihre KI erreicht Ihre Apps über kleine Connectoren, sogenannte MCP-Server.

Ihre KI

Claude CodeCursor

Connectoren

PlaywrightGitHub

Ihre Apps

GitHub

Dieses Setup ist für Entwickler und QA-Teams, die nach jeder Änderung dieselben Abläufe erneut durchklicken. Der Agent steuert über den Playwright-MCP-Server von Microsoft einen echten Browser, folgt dem Ablauf, den Sie in normaler Sprache beschreiben, und meldet, was fehlschlägt. Am Ende haben Sie pro Ablauf ein Ergebnis bestanden oder fehlgeschlagen und GitHub-Issues mit Reproduktionsschritten für jeden Fehler.

Einrichten

3 Schritte. Öffnen Sie einen für Details.

1Playwright-MCP hinzufügen
Registrieren Sie den Playwright-MCP-Server in Claude Code oder Cursor mit dem Befehl npx @playwright/mcp@latest. Beim ersten Start werden Sie eventuell aufgefordert, einen Browser zu installieren; folgen Sie dem Hinweis oder führen Sie npx playwright install aus. Lassen Sie den Agenten Ihre Staging-URL öffnen und die Seite beschreiben, um die Einrichtung zu prüfen.
Tipp: Mit der Option --headless läuft der Browser unsichtbar, wenn Sie nicht zusehen müssen.
2Flow beschreiben
Beschreiben Sie den Ablauf Schritt für Schritt: URL, Testkonto, was angeklickt oder eingegeben wird und wie ein korrektes Ergebnis aussieht. Der Agent liest die Seite über Accessibility-Snapshots, daher helfen klare Beschriftungen von Buttons und Formularfeldern. Bitten Sie um eine Meldung pro Schritt, bestanden oder fehlgeschlagen, mit Fehlertext oder Screenshot bei Problemen.
Tipp: Nennen Sie für jeden Schritt das erwartete Ergebnis, sonst muss der Agent raten, was "funktioniert" heißt.
3Fehler erfassen
Verbinden Sie den GitHub-MCP-Server mit der Berechtigung, Issues in Ihrem Repository anzulegen. Lassen Sie den Agenten pro Fehler ein Issue mit Reproduktionsschritten, erwartetem und tatsächlichem Ergebnis, verwendetem Browser und Konsolenfehlern erstellen. Prüfen Sie jedes Issue, bevor Sie das Anlegen freigeben.
Tipp: Lassen Sie einen häufig fehlschlagenden Ablauf vom Agenten als Playwright-Testdatei für die CI schreiben.

Dann einfach fragen

Was Sie sagen können, sobald es verbunden ist. Zum Kopieren klicken.

Fragen Sie Claude Code…Claude Code

Gut zu wissen

Was Sie brauchen, was es nicht kann und wie es sicher bleibt.

Was Sie brauchen

Lokal installiertes Node.js
Claude Code oder Cursor
Staging-Umgebung und Testkonten
Zugriff auf das GitHub-Repository zum Anlegen von Issues

Grenzen

Bei komplexen oder schlecht beschrifteten Seiten kann der Agent das falsche Element anklicken.
Explorative Läufe sind langsamer und weniger reproduzierbar als eine geschriebene Testsuite.
CAPTCHAs, Zwei-Faktor-Abfragen und E-Mail-Bestätigungen brauchen meist einen manuellen Umweg.

Sicher bleiben

Auf Staging testen, nicht in Produktion.
Testkonten nutzen, nie echte Kundendaten.

Playwright MCP Server (browser-control) GitHub MCP Server (repository-read, issue-write, pull-request-write)

Häufige Fragen

Klare Antworten vor dem Start

Ersetzt das meine Playwright-Testsuite?

Nein. Der Agent erkundet Abläufe anhand von Anweisungen in normaler Sprache, was für schnelle Prüfungen und neue Features hilft. Für Prüfungen bei jedem Commit lassen Sie ihn eine Playwright-Testdatei schreiben und in der CI ausführen.

Welche Browser werden unterstützt?

Playwright MCP nutzt standardmäßig Chromium und lässt sich auf Firefox, WebKit oder ein installiertes Chrome oder Edge umstellen. Den Browser wählen Sie über die Kommandozeilenoptionen des Servers.

Kann ich es gegen Produktion laufen lassen?

Nutzen Sie Staging mit Testkonten. Der Agent klickt wirklich und sendet Formulare ab; in Produktion könnte er Bestellungen auslösen oder E-Mails verschicken.

Was kostet das?

Playwright und sein MCP-Server sind kostenlos und Open Source. Sie zahlen nur die Nutzung Ihres KI-Hosts, etwa Claude Code oder Cursor.

Beteiligte Produkte

Die beteiligten Produkte

GitHub

Auf GitHub verwalten die meisten Softwareteams ihren Code, prüfen Pull Requests und verfolgen Issues. Actions übernimmt CI und Deployments, Projects die Planung, Copilot liefert KI-Hilfe beim Programmieren. GitHub ist mit Slack, Linear und Jira verbunden. Öffentliche und private Repositories sind kostenlos, bezahlte Tarife bieten Funktionen für größere Teams und Sicherheit.

Gratis-TarifTesten