Claude Desktop + Playwright = agent AI, który działa zamiast gadać
Źródło: Link
Źródło: Link
118 lekcji bez kodowania. ChatGPT, Claude, Gemini, automatyzacje. Notatnik AI i AI Coach w cenie.
Ile razy ChatGPT albo Claude podpowiedział Ci, co zrobić - a Ty i tak musiałeś ręcznie klikać przez pięć zakładek, kopiować dane i wypełniać formularze? Właśnie. Claude Cowork zmienia zasady. AI przestaje mówić "zrób to", a zaczyna robić samo.
Połączenie Claude Desktop z Playwright MCP daje Ci agenta, który otwiera strony, klika przyciski, wypełnia pola i wyciąga informacje. Bez Twojego udziału. Analytics Vidhya pokazuje, jak to zbudować - z kodem, bez marketingowej otoczki.
Standardowy tryb pracy z AI wygląda tak: pytasz, model odpowiada, Ty kopiujesz odpowiedź i ręcznie wykonujesz kroki. Claude Cowork odwraca ten schemat. Zamiast instrukcji dostajesz wykonane zadanie.
Playwright MCP to protokół, który pozwala Claude Desktop kontrolować przeglądarkę Chromium. Konkretnie: otwierać strony, klikać elementy, wypełniać formularze, pobierać dane ze stron. To nie jest makro. To agent, który rozumie kontekst i dostosowuje działania do sytuacji.
Przykład z artykułu: zamiast prosić Claude o "wyjaśnij, jak wypełnić formularz kontaktowy", dajesz polecenie "wypełnij formularz na stronie X moimi danymi". Claude otwiera stronę, znajduje pola, wpisuje dane i klika "wyślij". Ty patrzysz, jak to się dzieje. Albo robisz kawę.
Playwright to biblioteka do automatyzacji przeglądarek - znana z testów end-to-end. MCP (Model Context Protocol) to standard Anthropic, który pozwala Claude łączyć się z zewnętrznymi narzędziami. Playwright MCP to most między nimi.
Instalujesz serwer MCP lokalnie, konfigurujesz Claude Desktop (plik JSON z ustawieniami), uruchamiasz. Claude dostaje dostęp do funkcji Playwright: navigate, click, fill, screenshot, extract. Każda z nich to narzędzie, które model może wywołać w odpowiedzi na Twoje polecenie.
Artykuł podaje gotowy kod serwera MCP w Node.js. Definiujesz narzędzia (np. playwright_navigate, playwright_click), każde z parametrami (URL, selektor CSS). Claude analizuje Twoje polecenie, wybiera odpowiednie narzędzia i wywołuje je w kolejności. Ty widzisz efekt w oknie przeglądarki.
Przykłady z artykułu:
To nie zastępuje narzędzi typu Selenium czy Puppeteer w produkcji. To narzędzie do szybkiego prototypowania i zadań jednorazowych, gdzie pisanie skryptu zajęłoby więcej czasu niż samo zadanie.
Artykuł Analytics Vidhya podaje implementację krok po kroku. Potrzebujesz Node.js, Claude Desktop i 20 minut. Instalujesz Playwright i bibliotekę MCP SDK, piszesz serwer (albo kopiujesz gotowy kod z artykułu), konfigurujesz Claude Desktop przez plik claude_desktop_config.json.
Serwer MCP definiuje narzędzia jako funkcje. Przykład z artykułu - narzędzie navigate:
{
name: "playwright_navigate",
description: "Navigate to a URL",
inputSchema: {
type: "object",
properties: {
url: { type: "string" }
}
}
}
Claude widzi to jako dostępne narzędzie. Gdy piszesz "otwórz stronę example.com", model wywołuje playwright_navigate z parametrem url: "https://example.com". Serwer przekazuje to do Playwright, przeglądarka otwiera stronę.
Artykuł pokazuje też, jak dodać logowanie (żeby widzieć, co Claude wywołuje), obsługę błędów (co się stanie, gdy element nie istnieje) i screenshoty (Claude robi zrzut ekranu i analizuje, co widzi).
Możesz rozszerzyć agenta o własne narzędzia - np. zapisywanie danych do bazy, wysyłanie maili, integrację z API. MCP to otwarty standard. Nie jesteś ograniczony do Playwright.
To nie jest produkcyjne narzędzie do automatyzacji. Playwright MCP działa lokalnie - Claude kontroluje przeglądarkę na Twoim komputerze. Nie możesz uruchomić tego na serwerze bez dodatkowej konfiguracji.
Claude nie widzi strony jak człowiek - analizuje HTML i selektory CSS. Jeśli strona ma dynamiczne ładowanie (JavaScript renderuje treść po załadowaniu), agent może nie znaleźć elementu. Artykuł sugeruje dodanie opóźnień albo czekania na konkretne selektory.
Bezpieczeństwo: dajesz Claude dostęp do przeglądarki. Jeśli jesteś zalogowany na kontach, agent może wykonać działania w Twoim imieniu. Testuj na czystym profilu przeglądarki, nie na swoim głównym.
Koszt: każde wywołanie narzędzia to tokeny. Złożone zadania (wiele kroków, duże strony) mogą zużyć sporo kontekstu. Claude Opus ma 200k tokenów kontekstu, ale to się kończy szybciej, niż myślisz.
Testerzy QA - zamiast ręcznie klikać przez scenariusze testowe, delegują to Claude. Szybkie prototypowanie testów bez pisania kodu Selenium.
Analitycy danych - pobieranie danych ze stron, które nie mają API. Claude nawiguje, klika "pokaż więcej", wyciąga tabele i zapisuje do CSV.
Osoby pracujące z formularzami - wypełnianie powtarzalnych formularzy (np. zgłoszenia, wnioski) na podstawie danych z arkusza. Claude czyta wiersz, otwiera stronę, wypełnia, wysyła.
Deweloperzy - szybkie sprawdzenie, czy flow działa (logowanie, dodanie do koszyka, checkout) bez pisania testu. Jednorazowe zadania, gdzie skrypt nie ma sensu.
To nie zastąpi narzędzi do kodowania ani profesjonalnych platform do automatyzacji. To narzędzie do zadań, które robisz raz albo kilka razy - i gdzie szybkość ważniejsza niż perfekcja.
Playwright obsługuje Chromium, Firefox i WebKit. Możesz skonfigurować serwer MCP, żeby używał innej przeglądarki - zmiana jednej linii kodu. Artykuł pokazuje przykład z Chromium, bo jest najszybszy i najlepiej obsługiwany.
Tak, Claude Desktop wymaga konta Pro (20 USD miesięcznie). Darmowa wersja webowa nie obsługuje MCP. To ograniczenie Anthropic, nie techniczne.
Serwer MCP działa lokalnie, Claude nie ma dostępu do Twoich plików ani haseł - tylko do tego, co widzisz w przeglądarce. Ale jeśli jesteś zalogowany na kontach, agent może wykonać działania w Twoim imieniu. Używaj czystego profilu przeglądarki do testów.
Technicznie tak, ale wymaga konfiguracji headless Playwright i serwera MCP dostępnego przez sieć. Artykuł pokazuje setup lokalny - produkcyjne wdrożenie to temat na osobny projekt.
Selenium z ChatGPT Code Interpreter, Puppeteer z custom API, narzędzia no-code typu Zapier z integracją AI. Playwright MCP wyróżnia się tym, że Claude rozumie kontekst i dostosowuje działania - nie musisz pisać sztywnego skryptu.
Na podstawie: Analytics Vidhya
Podoba Ci się ten artykuł?
Co piątek wysyłam podsumowanie najlepszych artykułów tygodnia. Zapisz się!
90 minut praktycznej wiedzy o AI. Pokaze Ci krok po kroku, jak zaczac oszczedzac 10 godzin tygodniowo dzieki sztucznej inteligencji.
Zapisz sie na webinar