# Testowanie React (React / Next.js)

> React Testing Library, Jest, Vitest, testowanie komponentów, mocking, interakcje użytkownika, coverage

- 20 pytań z rozmów
- Mid-Level
- [Pytania z rozmów: React / Next.js](https://sharpskill.dev/pl/technologies/react-next/pytania-rekrutacyjne.md)

## 1. Jaka jest główna różnica między getBy, queryBy i findBy w React Testing Library?

**Odpowiedź**

getBy rzuca błąd, jeśli element nie istnieje (synchroniczne assertions), queryBy zwraca null, jeśli element nie istnieje (sprawdzanie nieobecności), a findBy zwraca Promise dla elementów asynchronicznych. Używaj getBy domyślnie dla elementów, które muszą istnieć, queryBy, aby zweryfikować, że element nie jest obecny, i findBy, aby czekać na pojawienie się elementu po opóźnieniu.

## 2. Jaka jest główna zaleta getByRole w porównaniu z getByTestId?

**Odpowiedź**

getByRole promuje dobre praktyki dostępności, celując w elementy według ich semantycznej roli ARIA (button, textbox, heading), co poprawia dostępność komponentu dla czytników ekranu. getByTestId wymaga dodawania sztucznych atrybutów data-testid, które nie dają żadnej wartości użytkownikowi końcowemu. React Testing Library zaleca priorytetowe używanie getByRole, getByLabelText i getByText przed getByTestId.

## 3. Jak przetestować warunkowe renderowanie elementu, który NIE jest obecny w DOM?

**Odpowiedź**

Użyj queryBy, aby zweryfikować brak elementu, ponieważ zwraca null zamiast rzucać błąd. Przykład: expect(screen.queryByText('Error')).toBeNull() lub expect(screen.queryByText('Error')).not.toBeInTheDocument(). getBy rzuciłby błąd i spowodował niepowodzenie testu, podczas gdy findBy czeka na pojawienie się elementu (timeout przy braku).

## Jeszcze 17 dostępnych pytań

- Dlaczego React Testing Library zaleca, aby NIE testować szczegółów implementacji?
- Jaka jest różnica między render a screen w React Testing Library?

Zarejestruj się za darmo: https://sharpskill.dev/pl/login

## Inne tematy rekrutacyjne React / Next.js

- [Podstawy JavaScript](https://sharpskill.dev/pl/technologies/react-next/pytania-rekrutacyjne/javascript-essentials.md): 25 pytań, Junior
- [Podstawy React](https://sharpskill.dev/pl/technologies/react-next/pytania-rekrutacyjne/react-fundamentals.md): 20 pytań, Junior
- [React Hooks](https://sharpskill.dev/pl/technologies/react-next/pytania-rekrutacyjne/react-hooks.md): 22 pytań, Junior
- [Cykl życia komponentu](https://sharpskill.dev/pl/technologies/react-next/pytania-rekrutacyjne/component-lifecycle.md): 18 pytań, Junior
- [React Router](https://sharpskill.dev/pl/technologies/react-next/pytania-rekrutacyjne/react-router.md): 20 pytań, Junior
- [Zarządzanie stanem z Context](https://sharpskill.dev/pl/technologies/react-next/pytania-rekrutacyjne/state-management-context.md): 18 pytań, Junior
- [Formularze i Controlled Components](https://sharpskill.dev/pl/technologies/react-next/pytania-rekrutacyjne/forms-controlled-components.md): 20 pytań, Mid-Level
- [Pobieranie danych i API](https://sharpskill.dev/pl/technologies/react-next/pytania-rekrutacyjne/fetching-data-api.md): 20 pytań, Mid-Level
- [React Query (TanStack Query)](https://sharpskill.dev/pl/technologies/react-next/pytania-rekrutacyjne/react-query-tanstack.md): 20 pytań, Mid-Level
- [Styling & CSS-in-JS](https://sharpskill.dev/pl/technologies/react-next/pytania-rekrutacyjne/styling-css-in-js.md): 18 pytań, Mid-Level
- [Podstawy Next.js](https://sharpskill.dev/pl/technologies/react-next/pytania-rekrutacyjne/nextjs-fundamentals.md): 25 pytań, Mid-Level
- [TypeScript z React](https://sharpskill.dev/pl/technologies/react-next/pytania-rekrutacyjne/typescript-react.md): 20 pytań, Mid-Level
- [Pobieranie danych w Next.js](https://sharpskill.dev/pl/technologies/react-next/pytania-rekrutacyjne/nextjs-data-fetching.md): 24 pytań, Mid-Level
- [Server Actions w Next.js](https://sharpskill.dev/pl/technologies/react-next/pytania-rekrutacyjne/nextjs-server-actions.md): 20 pytań, Mid-Level
- [Routing i Nawigacja w Next.js](https://sharpskill.dev/pl/technologies/react-next/pytania-rekrutacyjne/nextjs-routing-navigation.md): 22 pytań, Mid-Level
- [API Routes w Next.js](https://sharpskill.dev/pl/technologies/react-next/pytania-rekrutacyjne/nextjs-api-routes.md): 20 pytań, Mid-Level
- [Metadata & SEO w Next.js](https://sharpskill.dev/pl/technologies/react-next/pytania-rekrutacyjne/nextjs-metadata-seo.md): 18 pytań, Mid-Level
- [Middleware i Auth w Next.js](https://sharpskill.dev/pl/technologies/react-next/pytania-rekrutacyjne/nextjs-middleware-auth.md): 22 pytań, Mid-Level
- [Zustand State Management](https://sharpskill.dev/pl/technologies/react-next/pytania-rekrutacyjne/zustand-state-management.md): 18 pytań, Mid-Level
- [Optymalizacja wydajności React](https://sharpskill.dev/pl/technologies/react-next/pytania-rekrutacyjne/react-performance-optimization.md): 22 pytań, Senior
- [Error Boundaries & Error Handling](https://sharpskill.dev/pl/technologies/react-next/pytania-rekrutacyjne/react-error-boundaries.md): 18 pytań, Senior
- [Advanced React Patterns](https://sharpskill.dev/pl/technologies/react-next/pytania-rekrutacyjne/advanced-react-patterns.md): 20 pytań, Senior
- [Zaawansowane funkcje Next.js](https://sharpskill.dev/pl/technologies/react-next/pytania-rekrutacyjne/nextjs-advanced-features.md): 24 pytań, Senior
- [Wdrożenie i Produkcja Next.js](https://sharpskill.dev/pl/technologies/react-next/pytania-rekrutacyjne/nextjs-deployment-production.md): 20 pytań, Senior
- [Architecture & Design Patterns](https://sharpskill.dev/pl/technologies/react-next/pytania-rekrutacyjne/react-architecture-patterns.md): 22 pytań, Senior
- [React Server Components](https://sharpskill.dev/pl/technologies/react-next/pytania-rekrutacyjne/react-server-components.md): 26 pytań, Senior
- [Internacjonalizacja Next.js](https://sharpskill.dev/pl/technologies/react-next/pytania-rekrutacyjne/nextjs-internationalization.md): 20 pytań, Senior
- [React Bezpieczeństwo & Najlepsze Praktyki](https://sharpskill.dev/pl/technologies/react-next/pytania-rekrutacyjne/react-security-best-practices.md): 22 pytań, Senior

---

Source: SharpSkill (https://sharpskill.dev), tech interview preparation for your real stack.
HTML version of this page: https://sharpskill.dev/pl/technologies/react-next/pytania-rekrutacyjne/react-testing