Playwright CLI - nowa era pisania testów E2E z AI

Próbowałem używać Playwright MCP do pisania testów E2E z AI. Próbowałem - bo w praktyce częściej wracałem do klasycznego pisania kodu albo podsyłałem agentowi fragmenty DOM, żeby wygenerował mi Page Object Model. MCP było za wolne, za drogie w tokenach i ograniczone w konfiguracji. Potem Microsoft wypuścił playwright-cli i nagle okazało się, że tak powinno to wyglądać od początku.

Czym jest playwright-cli?

Playwright CLI to samodzielne narzędzie konsolowe od zespołu Playwright (Microsoft), stworzone specjalnie pod agenty AI z dostępem do terminala - oficjalnie wspiera Claude Code i GitHub Copilot. Zamiast protokołu MCP, komunikacja odbywa się przez zwykłe komendy w shellu.

Brzmi banalnie? Ale to zmienia sposób, w jaki AI współpracuje z przeglądarką - i to mocno.

Jak to działa od środka?

Pod spodem działa to tak:

Sesje i stany

Każda komenda operuje na nazwanej sesji (-s=mySession). Przeglądarka żyje w pamięci między komendami - dokładnie tak, jak w testach automatycznych. Możesz mieć kilka sesji równolegle, każda z własnym kontekstem.

Snapshoty zamiast drzew dostępności

Po każdej akcji playwright-cli zapisuje stan strony jako kompaktowy plik YAML na dysku. Elementy dostają krótkie referencje - e21, e255 - zamiast pełnych selektorów CSS czy XPath. Agent widzi tylko ścieżkę do pliku i sam decyduje, czy go czytać.

I to jest ta różnica. MCP wrzucał pełne drzewo dostępności do kontekstu przy każdym kroku. Playwright CLI trzyma to na dysku.

Disk-first output

Screenshoty, snapshoty, artefakty - wszystko ląduje na dysku. Agent dostaje jednolinijkową ścieżkę do pliku. Kontekst zostaje czysty.

Dlaczego to lepsze od MCP?

Playwright MCP miał poważne ograniczenia, przez które częściej kończyłem z ręcznym kopiowaniem DOM-u niż z faktyczną automatyzacją. Playwright CLI rozwiązuje większość z nich.

Tokeny: 4x mniej

Zespół Playwright opublikował benchmark: typowe zadanie automatyzacji przeglądarki zużyło ~114 000 tokenów przez MCP i ~27 000 przez CLI. Czterokrotna redukcja. W dłuższych sesjach różnica rośnie jeszcze bardziej, bo overhead MCP się kumuluje.

W praktyce to oznacza, że za ten sam budżet tokenów zrobisz cztery razy więcej.

Szybsza eksploracja

Z MCP każdy krok to: wyślij żądanie → czekaj na pełne drzewo dostępności → parsuj → działaj. Z CLI agent odpala komendę w terminalu, dostaje lekki snapshot z referencjami do elementów i od razu wie, w co kliknąć albo co wypełnić. Nie musi przetwarzać megabajtów accessibility tree. Kiedy debugujesz formularz albo sprawdzasz flow rejestracji, ta różnica jest znacząca.

Pełna kontrola nad przeglądarką

I tu dochodzimy do rzeczy, która mnie najbardziej przekonała. W playwright-cli masz dostęp do pełnej konfiguracji przeglądarki m.in. możesz ustawić:

• Ciasteczka
• localStorage i sessionStorage
• User Agent
• Profile i wtyczki
• Mockowanie sieci

Z MCP miałem z tym realny problem. Konfiguracja kontekstu przeglądarki była ograniczona i wymagała obejść. W CLI? Wszystko jest dostępne przez komendy i konfigurację w playwright-cli.json.

Sesje jak w prawdziwych testach

Możesz zapisać stan sesji (state-save) i odtworzyć go później (state-load). Zalogowałeś się? Zapisz stan. Następnym razem startujesz z zalogowaną sesją - zero powtarzania flow logowania.

Dokładnie tak, jak robimy to w dobrze napisanych testach E2E. Tyle że teraz AI robi to za Ciebie.

Podgląd na żywo

Komenda show uruchamia dashboard z podglądem sesji przeglądarki w czasie rzeczywistym. Widzisz dokładnie, co robi agent. Możesz nawet przejąć sterowanie. To świetne do debugowania i weryfikacji - patrzysz, jak AI klika, i od razu widzisz, czy idzie dobrą ścieżką.

Jak zainstalować?

Instalacja jest prosta. Node.js 18+ i jedna komenda:

# Instalacja globalna
npm install -g @playwright/cli@latest

# Weryfikacja
playwright-cli --help

# Instalacja przegladarek
playwright-cli install-browser

# Instalacja skilli dla agentow AI
playwright-cli install --skills

Albo bez instalacji globalnej:

npx playwright-cli open https://example.com --headed

Jak tego używam w praktyce?

Testowałem playwright-cli w Claude Code i tam sprawdza się świetnie.

Claude Code + playwright-cli

W Claude Code playwright-cli działa jako skill. Mówisz agentowi "otwórz stronę X, przetestuj formularz rejestracji" (oczywiście lepiej działa przy dokładniejszym zadaniu) i on odpala komendy w terminalu. Widzi snapshoty, klika w elementy po referencjach, wypełnia pola. Wszystko w jednej sesji, bez przełączania kontekstu.

Ale to nie jest tylko zabawka do rozmów z AI. Playwright-cli to pełnoprawne narzędzie konsolowe. Możesz go używać bezpośrednio w terminalu do szybkiej weryfikacji funkcji:

# Otworz strone
playwright-cli open https://app.example.com --headed

# Zrob snapshot
playwright-cli snapshot

# Kliknij przycisk logowania
playwright-cli click e255

# Wypelnij formularz
playwright-cli fill e35 '[email protected]'
playwright-cli fill e42 'password123'

# Kliknij submit
playwright-cli click e50

# Sprawdz wynik
playwright-cli snapshot
playwright-cli screenshot

To działa tak szybko, że zacząłem używać tego do weryfikacji feature'ów zamiast ręcznego klikania w przeglądarce.

CLAUDE.md robi różnicę

Jedna rzecz, o której warto pamiętać: w połączeniu z dobrze przygotowanym plikiem CLAUDE.md w repozytorium, agent generuje testy w odpowiedniej strukturze od razu. Zna konwencje projektu, wie gdzie umieścić pliki testowe, jakich locatorów używać, jak nazywać testy.

Bez CLAUDE.md agent pisze poprawny kod Playwright, ale w swojej strukturze. Z CLAUDE.md pisze kod, który pasuje do Twojego projektu. Testy trafiają do właściwych katalogów, używają getByRole() i getByTestId() zgodnie z konwencjami zespołu, mają odpowiednie nazwy i setup.

Ograniczenia - bądźmy uczciwi

Playwright CLI nie jest idealny. Kilka rzeczy warto wiedzieć:

• Wymaga dostępu do terminala - nie działa w środowiskach sandboxowanych (np. Claude Desktop bez shella). Tam zostaje MCP.
• Złożone flow'y potrafią się wysypać - OAuth, multi-step wizardy z dużą ilością dynamicznego contentu to wciąż wyzwanie dla AI.
• To boost, nie autopilot - testy piszą się szybciej, ale nadal musisz myśleć co testujesz i weryfikować wynik. AI przyśpiesza pisanie kodu, nie zwalnia z myślenia. Ale fajnie, że w QA w końcu mamy porządne narzędzie do tego - do tej pory takie doładowanie mieli głównie devowie.
• Dane strony trafiają do AI - snapshoty i konsola idą do modelu. W środowiskach z wrażliwymi danymi trzeba o tym pamiętać.

Dla kogo to narzędzie?

Jeśli jesteś testerem automatyzującym i używasz (albo chcesz używać) AI do pisania testów E2E - playwright-cli powinien być pierwszym narzędziem, które wypróbujesz.

Pracowałem z wieloma narzędziami, które obiecywały rewolucję w testowaniu i kończyło się na fajnym demo. Playwright CLI to co innego. AI potrzebuje dostępu do przeglądarki żeby pisać dobre testy. MCP dawał ten dostęp, ale drogo i niewygodnie. CLI daje go taniej i lepiej.

Podsumowanie

Od trzech dni intensywnie testuję playwright-cli i nie chcę wracać do starego workflow. Eksploracja jest szybsza, konfiguracja przeglądarki wreszcie pełna, a za czterokrotnie mniejszy budżet tokenów robię więcej niż wcześniej.

Najlepsza kombinacja to playwright-cli + agent AI + dobrze opisany CLAUDE.md. Mówisz co przetestować, dostajesz gotowe testy w strukturze swojego projektu. Bez wielu poprawek, bez przenoszenia plików.

Na koniec zostawiam krótką prezentację w praktyce. Na tej stronie, w podstawowym repozytorium bez żadnego specjalnego kontekstu, Claude Code z playwright-cli wygenerował w ~10 minut testy filtrowania w strukturze POM. Zweryfikował je zarówno na mobile, jak i na desktop. Testy nie są idealne - to gołe repo, bez przykłądu poprawnych testów - ale efekt po 10 minutach mówi sam za siebie.