Dlaczego migracja z Selenium do Playwright to dobry pomysł?
Selenium przez lata było złotym standardem w automatyzacji testów UI. Narzędzia takie jak Selenide znacznie uprościły pracę z nim, ale architektura oparta na WebDriverze ma swoje ograniczenia. Playwright, stworzony przez Microsoft, wchodzi na scenę z nowym podejściem, które rozwiązuje wiele bolączek poprzednika.
Kluczowe zalety Playwright to szybkość, stabilność dzięki auto-waitom i wbudowanym mechanizmom ponawiania, a także potężne funkcje, takie jak przechwytywanie i mockowanie ruchu sieciowego czy generowanie śladów (traces) ułatwiających debugowanie. Jeśli Twoje testy w Selenium są wolne, niestabilne i trudne w utrzymaniu, migracja może być strzałem w dziesiątkę.
Jednak zmiana narzędzia w dojrzałym projekcie to poważne przedsięwzięcie. Poniższa checklista pomoże Ci zaplanować i przeprowadzić ten proces krok po kroku, minimalizując ryzyko i chaos.
Krok 1: Audyt istniejących testów i zdefiniowanie strategii
Zanim napiszesz pierwszą linijkę kodu w Playwright, musisz zrozumieć, co masz. Nie przenoś wszystkiego bezrefleksyjnie. To idealny moment na porządki.
- Analiza pokrycia: Przejrzyj swoje obecne testy. Które z nich są krytyczne dla biznesu? Które są niestabilne (flaky) i dlaczego? Które można usunąć, bo testują przestarzałe funkcjonalności?
- Wybór strategii: Zdecyduj, jak będziesz migrować. Podejście „big bang” (wszystko naraz) jest ryzykowne. Lepszym wyborem jest strategia stopniowa:
- Nowe funkcje w Playwright: Wszystkie nowe testy pisz już w nowym frameworku.
- Stopniowa migracja: Przenoś istniejące testy partiami, zaczynając od najważniejszych lub najbardziej problematycznych.
- Określenie metryk sukcesu: Zdefiniuj, co oznacza udana migracja. Czy celem jest skrócenie czasu wykonania testów o 30%? A może zmniejszenie wskaźnika niestabilnych testów poniżej 2%? Mierzalne cele pomogą Ci ocenić postęp.
Krok 2: Przygotowanie środowiska i zespołu
Migracja to nie tylko zmiana kodu, ale także zmiana narzędzi i sposobu myślenia. Odpowiednie przygotowanie jest kluczowe.
- Konfiguracja projektu: Zainicjuj nowy projekt Playwright (
npm init playwright@latest). Skonfiguruj go zgodnie ze standardami swojego zespołu – wybierz język (TypeScript jest zalecany), strukturę folderów i narzędzia do raportowania. - Integracja z CI/CD: Od samego początku zintegruj Playwright z Twoim systemem ciągłej integracji. Uruchamianie testów w pipeline'ach na wczesnym etapie pozwoli szybko wykryć problemy konfiguracyjne.
- Szkolenie zespołu: Zorganizuj warsztaty lub sesje pairingowe. Przedstaw kluczowe różnice między Selenium a Playwright: model lokatorów, mechanizm auto-wait, konteksty przeglądarki i obsługę API. Ustalcie wspólne dobre praktyki, np. preferowanie lokatorów opartych na rolach (
getByRole) zamiast kruchych selektorów CSS/XPath.
Krok 3: Konwersja kluczowych elementów frameworka
Nie zaczynaj od przepisywania testów. Najpierw odtwórz fundamenty swojego frameworka testowego w nowej technologii.
Page Object Model (POM)
Jeśli używasz wzorca Page Object, jego koncepcja pozostaje ta sama, ale implementacja się zmienia. Zamiast WebDriver i WebElement, będziesz operować na obiektach Page i Locator z Playwright. To świetna okazja, by poprawić jakość selektorów.
Przykład (Selenide vs Playwright):
- Selenide:
private SelenideElement loginButton = $("button[type='submit']"); - Playwright:
readonly loginButton = this.page.getByRole('button', { name: 'Log in' });
Inicjalizacja przeglądarki
Zapomnij o skomplikowanej konfiguracji WebDriverManagera. W Playwright zarządzanie przeglądarkami jest wbudowane i banalnie proste. Konfiguracja odbywa się w pliku playwright.config.ts, gdzie definiujesz, jakie przeglądarki (Chromium, Firefox, WebKit) i w jakich warunkach mają być używane.
Metody pomocnicze
Przenieś kluczowe metody pomocnicze, takie jak logowanie, obsługa ciasteczek czy generowanie danych testowych. Dostosuj je do API Playwright. Na przykład, zamiast ręcznie czyścić pola i wpisywać tekst, możesz użyć metody locator.fill(), która robi to automatycznie.
Krok 4: Migracja pierwszej grupy testów
Czas na pierwszy konkret. Zacznij od małej, ale wartościowej grupy testów. Dobre typy na start to testy dymne (smoke tests) lub proste scenariusze end-to-end.
Celem tego etapu jest nie tylko przeniesienie kodu, ale przede wszystkim zdobycie praktycznego doświadczenia. Zmierzysz się z realnymi problemami i nauczysz się myśleć „w stylu Playwright”. Dokumentuj napotkane wyzwania i ich rozwiązania – stworzysz w ten sposób przewodnik dla reszty zespołu.
Krok 5: Obsługa zaawansowanych interakcji i scenariuszy
Po opanowaniu podstaw przychodzi czas na bardziej złożone przypadki. To tutaj Playwright naprawdę pokazuje swoją siłę.
Czekanie (Waits)
Największa zmiana mentalna to przejście na auto-waity. Playwright automatycznie czeka, aż element będzie widoczny, stabilny i gotowy na interakcję przed wykonaniem akcji (np. click()). Eliminuje to 95% przypadków, w których w Selenium musiałbyś używać WebDriverWait. Explicit waits (waitForSelector, waitForResponse) przydają się tylko w specyficznych sytuacjach, np. czekając na odpowiedź z API.
Mockowanie API
To jedna z rewolucyjnych funkcji Playwright. Nie potrzebujesz już zewnętrznych narzędzi do mockowania backendu. Za pomocą page.route() możesz przechwytywać żądania sieciowe i zwracać dowolne odpowiedzi. Pozwala to na:
- Izolowanie frontendu od backendu i testowanie go niezależnie.
- Symulowanie błędów serwera (np. status 500) i sprawdzanie, jak aplikacja na nie reaguje.
- Przyspieszenie testów poprzez zastąpienie wolnych zapytań do bazy danych statycznymi danymi.
Krok 6: Optymalizacja i refaktoryzacja
Gdy większa część testów jest już w Playwright, pora na ich doszlifowanie. Uruchomione testy to jedno, ale wydajne i łatwe w utrzymaniu testy to drugie.
- Wykorzystaj Trace Viewer: To potężne narzędzie diagnostyczne. Dla każdego testu Playwright może wygenerować szczegółowy ślad, który zawiera zrzuty ekranu dla każdej akcji, logi konsoli, ruch sieciowy i oś czasu. Analiza nieudanych testów, która w Selenium zajmowała godziny, w Playwright sprowadza się do kilku minut.
- Równoległość: Playwright jest zaprojektowany do równoległego uruchamiania testów od podstaw. Skonfiguruj
workersw pliku konfiguracyjnym, aby maksymalnie wykorzystać zasoby maszyny CI i drastycznie skrócić czas wykonania całej suity testowej. - Refaktoryzacja kodu: Przejrzyj zmigrowany kod. Czy na pewno w pełni korzystasz z możliwości Playwright? Może gdzieś zostały stare nawyki z Selenium, np. niepotrzebne jawne czekanie? Uprość kod, stosując nowoczesne lokatory i polegając na wbudowanych mechanizmach.
Krok 7: Finalizacja migracji i wycofanie Selenium
Nadszedł moment, na który wszyscy czekali. Po zmigrowaniu i ustabilizowaniu wszystkich krytycznych scenariuszy, możesz rozpocząć proces wycofywania starego rozwiązania.
Przez pewien czas (np. 1-2 sprinty) uruchamiaj obie suity testowe równolegle na CI. Daje Ci to pewność, że nowa suita jest równie niezawodna i wyłapuje te same problemy co stara. Gdy zdobędziesz pełne zaufanie do testów w Playwright, usuń stare zależności (Selenium, Selenide, WebDriverManager) i cały powiązany z nimi kod. To ważny krok, który zapobiega powstawaniu długu technologicznego.