Narzędzia Chrome do sprawnego i automatycznego testowania

Testowanie jest ważne. Jest to kluczowy krok przed udostępnieniem użytkownikom tego, co stworzyliśmy – niezależnie od tego, czy chodzi o całą witrynę, o aplikację czy nową funkcję – i sprawdzenie, czy działają one zgodnie z oczekiwaniami. Jednak nadal wiele testów jest przeprowadzanych ręcznie, a współpracownicy lub inżynierowie testowi proszą o zapoznanie się z nową funkcją i zgłoszenie problemów.

Matthias Rohmer
Matthias Rohmer

Takie ręczne testowanie może wykazać pewne klasy problemów, ale może pomijać jeszcze więcej. Osoby przeprowadzające testy mogą przegapić przypadki skrajne lub w ogóle nie przetestować konkretnej ścieżki w aplikacji. Poza tym osoby te nie mają wszystkich informacji posiadanych podczas pisania kodu i nie wiedzą o konkretnych problemach z kodem, którym mają zapobiegać. Czy z upływem czasu i dodaniem nowych funkcji wrócą i ponownie przetestują wszystkie wcześniej działające rzeczy, aby upewnić się, że zmiany ich nie zakłóciły?

Dlatego zespół Chrome wierzy, że testy automatyczne są tak ważne. Używając pakietu testowego, który niezawodnie i wielokrotnie testuje funkcje pod kątem awarii, możesz mieć pewność, że testujemy każdy najdrobniejszy szczegół – teraz i w przyszłości. Test obejmuje Twoją wiedzę jako dewelopera danej funkcji.

Wiemy jednak, że testy automatyczne mogą być trudne. Dlatego zespół Chrome udostępnia poniższe narzędzia i wskazówki, aby cała procedura była bezproblemowa.

Animator

Puppeteer to biblioteka środowiska Node.js. Pozwala zautomatyzować działania Chrome, Chromium i Firefoksa za pomocą łatwego w użyciu, wysokiego poziomu interfejsu API.

Chociaż ten interfejs API pierwotnie był oparty na protokole Chrome DevTools protokołu Chrome, celem jest, aby do końca roku stał się podstawą nowego, zaawansowanego protokołu WebDriver BiDi dla platformy Puppeteer. Aplikacja WebDriver BiDi, współtworzona przez wszystkich największych dostawców przeglądarek, upraszcza wiele zastosowań automatyzacji i pozwala na wiele nowych rozwiązań oraz jest zgodna z różnymi przeglądarkami.

Nie musisz jednak czekać. Interfejs API Puppeteer umożliwia obecnie wiele zastosowań automatyzacji, które usprawnią się tylko dzięki narzędziu WebDriver BiDi. Możesz korzystać z takich funkcji jak interakcje ze stroną, przechwytywanie żądań czy zrzuty ekranu – od testowania przez wizualne indeksowanie i automatyzację procesów. Możesz go nawet używać do testowania modeli sztucznej inteligencji w chmurze za pomocą WebGPU i WebGPU.

Z platformy Puppeteer korzystają też takie narzędzia jak WebdriverIO, czyli w pełni wyposażony mechanizm testowania przeglądarek, oraz narzędzie analizy Piaskownicy prywatności, dzięki którym możesz lepiej zrozumieć użycie plików cookie i danych użytkowników w witrynie.

Chrome bez interfejsu graficznego

Jeśli zdarzyło Ci się kiedykolwiek zautomatyzować przeglądarkę Chrome za pomocą Puppeteer, możliwe, że podczas testów nie wyświetla się żadne okno przeglądarki. Puppeteer domyślnie uruchamia Chrome w trybie Headless. Oznacza to, że gdy automatyzacja jest uruchomiona, nie ma rzeczywistego okna przeglądarki.

Ale czy wiesz, że tryb bez interfejsu graficznego w Chrome to nie tylko Chrome bez okna, ale tak naprawdę jego zupełnie osobna wersja? Przez długi czas to było nieporozumienie i trudno było śledzić błędy i problemy.

W Chrome 112 wprowadziliśmy nowy tryb bez interfejsu graficznego, który bazuje teraz na tej samej bazie kodu co standardowa przeglądarka Chrome. W ten sposób nie tylko eliminuje to dezorientację, ale wprowadza też funkcje, które wcześniej nie były możliwe, takie jak używanie rozszerzeń podczas automatyzacji.

Ten nowy tryb bez interfejsu graficznego Puppeteer jest używany domyślnie od wersji 22. Jeśli używasz interfejsu Chrome bez interfejsu graficznego za pomocą innych rozwiązań do automatyzacji, możesz wymusić nowy tryb bez interfejsu graficznego za pomocą przełącznika wiersza poleceń --headless=new.

Nowy tryb bez interfejsu graficznego w Chrome jest zaawansowany, ale nie jest tak lekki jak stary tryb bez interfejsu graficznego. Jeśli masz duże ograniczenia zasobów lub nie potrzebujesz wszystkich funkcji Chrome, możesz skorzystać ze starego trybu bez interfejsu graficznego jako chrome-headless-shell.

Chrome for Testing

Podczas testowania musisz mieć szczegółową kontrolę nad środowiskiem testowym: systemem operacyjnym, przeglądarką i jej wersją. Przy automatycznych aktualizacjach Chrome może być to trudne.

Dlatego stworzyliśmy Chrome for Testing – wersję Chrome bez automatycznych aktualizacji, która jest publikowana razem z każdą wersją Chrome na wszystkie główne systemy operacyjne i jest dostępna w archiwum z różnymi wersjami. Dzięki temu możesz bez trudu uruchamiać swoje procesy automatyzacji w konkretnej wersji Chrome.

Dostęp do plików binarnych Chrome for Testing możesz uzyskać przez panel dostępności Chrome for Testing, interfejs JSON API lub narzędzie wiersza poleceń Puppeteer.


Puppeteer, zaktualizowany tryb bez interfejsu graficznego w Chrome i Chrome for Testing to tylko część prac, które nasz zespół obecnie robi, aby automatyzacja i przeprowadzanie testów były jak najbardziej płynne. Powiązane narzędzia, takie jak DevTools Recorder, pomagają w tworzeniu testów: rejestrują to, co dzieje się w Chrome, i odtwarzają go ponownie w aplikacji Puppeteer.

Dowiedz się więcej o testowaniu na web.dev

Narzędzia opisane w tym poście pomogą Ci ulepszyć automatyczne testowanie. Ale jeśli dopiero zaczynasz, może się wydawać, że musisz dużo zrozumieć i wyciągnąć. Przygotowaliśmy więc nowy, 10-modułowy kurs o nazwie Learn Testing on web.dev. W nim szczegółowo omawiamy podstawowe pojęcia związane z testowaniem, miejsce i sposób przeprowadzania testów, ich typy oraz tematy, które warto przetestować. To świetny punkt wyjścia do testowania. Gdy poznasz już podstawowe informacje, przejdź do naszej kolekcji o automatyzacji testów, w której znajdziesz szczegółowe informacje i praktyczne wskazówki dotyczące bardziej konkretnych pytań testowych.