Testowanie kodu z React Testing Library Bydgoszcz

W ostatnich latach zdecydowanie wzrosła popularność frameworka React, pozwalającego w pełni skorzystać z możliwości nowoczesnych przeglądarek i urządzeń mobilnych. Nowym narzędziem służącym do testowania obiektowego modelu dokumentu (DOM) jest React Testing Library. Zostało ono zaprojektowane tak, aby ułatwiać projektantom pracę zgodną z podejściem test-driven development (TDD). Jest to bardzo cenna właściwość, gdyż prawidłowo napisane komponenty testowe znacznie obniżają ryzyko wystąpienia poważnych błędów aplikacji. W tej książce przystępnie wyjaśniono, w jaki sposób używać nowoczesnego narzędzia, jakim jest React Testing Library (RTL), do testowania komponentów napisanych w React. Dzięki niej zrozumiesz główne aspekty działania tej biblioteki. Nauczysz się symulować interakcje użytkownika i zrozumiesz podejście TDD. Znajdziesz tu wskazówki, jak tworzyć testy jednostkowe komponentów, które wchodzą w interakcje z interfejsami API, a także jak testować komponenty za pomocą takich bibliotek jak GraphQL i Redux. Zapoznasz się też z technikami testowania aplikacji, które podległy poważnej refaktoryzacji. Na koniec dowiesz się, jak pisać całościowe testy funkcjonalne z wykorzystaniem biblioteki Cypress i które wzorce projektowe są najbardziej przydatne do ustrukturyzowania profesjonalnego zbioru testów. W książce między innymi: wprowadzenie do RTL i jego zastosowań użycie jest-dom do rozbudowy testów opartych na RTL techniki tworzenia komponentów testowych łatwych do modyfikacji integracja zestawów testowych z Cucumber i Cypress podejście TDD React: z łatwością napiszesz doskonałe komponenty testowe! Spis treści: O autorze O recenzencie Przedmowa Rozdział 1. Wstęp do React Testing Library Wymagania techniczne Wprowadzenie do DOM Testing Library Czym jest DOM Testing Library Główne zasady Uruchamianie przypadków testowych z Jest Uruchamianie testów z Jest Rozbudowanie asercji Jest dzięki jest-dom Dodawanie jest-dom do projektu Zalety stosowania jest-dom z Jest Szczegóły implementacyjne w testach Problemy z testami koncentrującymi się na szczegółach implementacyjnych Przykład testu szczegółów implementacyjnych Czym zastąpić testowanie szczegółów implementacyjnych Podsumowanie Pytania Rozdział 2. Praca z React Testing Library Wymagania techniczne Dodawanie React Testing Library od istniejących projektów Ręczna instalacja Automatyczna instalacja z create-react-app Nadawanie testom struktury z React Testing Library Renderowanie elementów Wybieranie elementów Asercje dotyczące oczekiwanego zachowania Testowanie komponentów warstwy prezentacji Tworzenie testów migawek Testowanie oczekiwanych właściwości Zastosowanie metody debug Debugowanie całego komponentu DOM Debugowanie konkretnych elementów komponentu Podsumowanie Pytania Rozdział 3. Testowanie złożonych komponentów przy użyciu React Testing Library Wymagania techniczne Testowanie zdarzeń użytkowników Symulowanie akcji użytkownika za pomocą fireEvent Symulowanie działań użytkownika z user-event Testowanie komponentów wywołujących procedury obsługi zdarzeń w izolacji Testowanie komponentów, które współpracują z interfejsami API Żądanie danych z API poprzez fetch Tworzenie atrap danych API z MSW Testowanie komponentu DrinkSearch Zastosowanie MSW w budowaniu oprogramowania Implementacja programowania sterowanego testami Budowanie komponentu Vote z wykorzystaniem TDD Budowanie formularza rejestracji z wykorzystaniem TDD Podsumowanie Pytania Rozdział 4. Testy integracyjne i zewnętrzne biblioteki w Twojej aplikacji Wymagania techniczne Testowanie zintegrowanych komponentów Testy integracyjne komponentu Vote Planowanie scenariuszy testowych do testów w izolacji Testowanie komponentów z Context API Testowanie kontekstu korzystającego z komponentu Retail Testowanie komponentu Cart w izolacji Testowanie komponentu Product w izolacji Testowanie komponentu ProductDetail w izolacji Testowanie błędów kontekstu z wykorzystaniem granic Wykorzystanie testów integracyjnych do testowania widoku szczegółów produktu Testowanie komponentów wykorzystujących Redux Tworzenie specjalnej metody render do testowania komponentów w Redux Zastosowanie Redux Provider w testach Testowanie komponentów wykorzystujących GraphQL Testowanie komponentów zbudowanych przy użyciu Material-UI Dodanie etykiety ARIA w testach komponentu Vote Dodawanie testID do testowego komponentu CustomerTable Podsumowanie Pytania Rozdział 5. Refaktoryzacja starych aplikacji z React Testing Library Wymagania techniczne Korzystanie z testów do wykrywania regresji przy aktualizacji zależności Stworzenie zestawu testów regresyjnych Aktualizacja zależności Material-UI Refaktoryzacja testów napisanych z wykorzystaniem Enzyme Refaktoryzacja testów wykorzystujących ReactTestUtils Refaktoryzacja testów pod kątem zgodności z dobrymi praktykami testowania Podsumowanie Pytania Rozdział 6. Implementacja dodatkowych narzędzi i rozszerzeń do testów Wymagania techniczne Implementowanie dobrych praktyk z rozszerzeniami ESLint Instalacja i konfiguracja rozszerzenia eslint-plugin-testing-library Instalacja i konfiguracja eslint-plugin-jest-dom Testowanie dostępności z jest-axe Dobór zapytań z Testing Playground Dobór zapytań z wykorzystaniem strony internetowej Testing Playground Dobór zapytań z wykorzystaniem rozszerzenia Testing Playground do przeglądarki Chrome Zwiększanie produktywności z Wallaby.js Instalacja i konfiguracja Wallaby.js Pisanie testów z Interactive Test Output Podsumowanie Pytania Rozdział 7. Testy end-to-end z Cypress Wymagania techniczne Wprowadzenie do Cypress Rozszerzenie metod zapytań z Cypress Testing Library Programowanie sterowane narzędziem Cypress Pisanie testów z wykorzystaniem wzorców projektowych w Cypress Tworzenie obiektowych modeli stron w Cypress Tworzenie specjalnych metod w Cypress Testowanie API z Cypress Testy w stylu Gherkin z Cucumber Korzystanie z React Developer Tools z Cypress Podsumowanie Pytania Odpowiedzi O autorze: Scottie Crump jest starszym inżynierem testów. Od kilku lat doradza klientom z różnych branż, między innymi handlowej, motoryzacyjnej, telekomunikacyjnej, ochrony zdrowia. Bierze też udział w ważnych projektach z zakresu zapewniania jakości oprogramowania. Jego pasją jest popularyzowanie najlepszych praktyk branży i technik wspierania procesów decyzyjnych za pomocą danych.