Network Interception w Selenium 4

To co Ci dzisiaj pokażę, pozwoli Ci na przechwytywanie poszczególnych zapytań jakie zobaczysz w przeglądarce np. w momencie przejścia na stronę i np. na modyfikowanie odpowiedzi z zapytań.

Te zapytania możesz podejrzeć w konsoli deweloperskiej przeglądarki. Wystarczy, że wciśniesz F12 (np. w Chrome) i przejdziesz do zakładki Network. Teraz odśwież stronę. Zobaczysz listę rekordów, z których każdy zawiera podstawowe informacje: adres i metodę żądania (np. GET), typ zwracanego zasobu (np. text/html, text/css), status odpowiedzi, jej rozmiar oraz czas.

To właśnie te zapytania możemy przechwytywać w Selenium 4.

Uwaga: ta funkcjonalność działa tylko dla przeglądarki Chrome.

“Network” w narzędziach deweloperskich.

W przykładzie, który zobaczysz zarówno dla Javy jaki dla C# popsujemy wszystkie zapytania, których Content-Type to text/css, czyli mówiąc po ludzku arkusze stylów. Zamienimy po prostu arkusze stylów na jakiś nasz tekst.

Poniżej zobaczysz to, co widzę w zakładce “Network” w narzędziach deweloperskich na mojej testowej stronie.

Java

Poniżej zobaczysz działający przykład stworzony na podstawie dokumentacji.

Wywołujemy konstruktor NetworkInterceptor, który przyjmuje dwa parametry. Pierwszym z nich jest driver, a drugi jest typu Routable (to jest interfejs z Selenium). Interfejs Routable jest implementowany w klasie Route, w której to mamy dostępne statyczne metody. W naszym przykładzie używamy metody matching(). W jej parametrze przekazujemy predykat, albo inaczej mówiąc coś w rodzaju filtra. Ograniczamy w nim, że chcemy się dalej zajmować tylko takimi zapytaniami, które w URL mają “.css”. Następnie za pomocą metody to() mówimy, w jaki sposób zmienimy przefiltrowane i wychwycone zapytanie. W naszym przykładzie ustawiamy, że kod odpowiedzi ma być 200, Content-Type ma być “text/css”, a sama treść odpowiedzi to “Nie lubię CSSa”.

Teraz, żeby przetestować czy to rzeczywiście zrobi co należy proponuję ustawić breakpointy (te czerwone kropki) tak jak poniżej. Chodzi o to, żeby test zatrzymał się zaraz przed przejściem na stronę, żebyśmy mogli otworzyć narzędzia deweloperskie.

Dzięki temu zobaczymy coś w zakładce “Networks”. Jeżeli tego nie zrobimy i otworzymy narzędzia deweloperskie na koniec testu, to nic tam nie zobaczymy.

Po odpaleniu testu w debugu, otworzeniu na początku narzędzi deweloperskich i poczekaniu do końca wykonania testu, zobaczymy, że wszystkie arkusze mają całą zawartość podmienioną na “Nie lubię CSSa”.

Nasza strona również wygląda jakby jej czegoś brakowało. Zresztą słusznie, skoro brakuje jej styli.

To jest tylko przykład, ale polecam zabawę zarówno warunkami (chodzi o ten filtr, który użyliśmy) jak i tym, co chcemy zmienić w odpowiedzi naszego zapytania.

Poniżej podrzucam jeszcze całą klasę.

C#

Na temat tej funkcjonalności nie ma dokumentacji do C#, nie ma nawet przykładowego kodu, na którym mogłabym próbować wykombinować jak to ma działać. To, co zobaczysz poniżej ogarnęłam metodą prób i błędów oraz grzebiąc w repo Selenium, a w szczególności w testach. Najpierw pokażę Ci kod, a później wytłumaczę.

Jeżeli nie wiesz nic o obsłudze zdarzeń w .Net, to ten materiał będzie trudny do przetrawienia. Lepiej zacząć od oficjalnej dokumentacji.