10. Jak testować komponenty?

Jedna z najpopularniejszych bibliotek do testów w JavaScript to jest.

Jest to biblioteka pozwalająca na uruchamianie testów i ich odpowiednią strukturyzację.

Zapewnia zestaw funkcji które służą do pisania pojedynczych testów jednostkowych oraz parametryzowanych (ten sam test dla wielu różnych argumentów i oczekiwanej odpowiedzi).

Do testowania stricte komponentów reacta można skorzystać z react-testing-library.

Ta biblioteka zapewnia funkcje do renderowania pojedynczych komponentów oraz sposoby, na uzyskiwanie dostępu do okrojonego drzewa DOM.

Na tej podstawie możliwe jest przeprowadzanie akcji na wyrenderowanym komponencie, takich jak klikanie, wpisywanie itp.

Dzięki dostępowi do okrojonego drzewa DOM możliwe jest stosowanie asercji z biblioteki jest oraz samej react-testing-library.

test(`renders the Button component`, () => {
    const {getByText} = render(<Button label={"Click Me"}/>) // react-testing-library renders button and returns method to access rendered component by text inside
    const button = getByText("Click Me");
    expect(button).toBeInTheDocument();
});