You signed in with another tab or window. Reload to refresh your session.You signed out in another tab or window. Reload to refresh your session.You switched accounts on another tab or window. Reload to refresh your session.Dismiss alert
var ReactTestUtils =require('react-dom/test-utils'); // ES5 with npm
13
+
var ReactTestUtils =require('react-dom/test-utils'); // ES5 z zainstalowanym npm
14
14
```
15
15
16
-
## Overview {#overview}
16
+
## Ogólne informacje {#overview}
17
17
18
-
`ReactTestUtils`makes it easy to test React components in the testing framework of your choice. At Facebook we use[Jest](https://facebook.github.io/jest/) for painless JavaScript testing. Learn how to get started with Jest through the Jest website's [React Tutorial](http://facebook.github.io/jest/docs/en/tutorial-react.html#content).
18
+
`ReactTestUtils`pozwala na łatwiejsze testowanie komponentów reactowych przy pomocy dowolnego frameworka. W Facebooku korzystamy do tego celu z biblioteki[Jest](https://facebook.github.io/jest/), która sprawia, że pisanie testów jest mniej kłopotliwe. Do nauki podstaw Jesta polecamy artykuł pt. ["Samouczek dla Reacta"](http://facebook.github.io/jest/docs/en/tutorial-react.html#content), znajdujący się na oficjalnej stronie biblioteki.
19
19
20
-
> Note:
20
+
> Uwaga:
21
21
>
22
-
> We recommend using [`react-testing-library`](https://git.io/react-testing-library) which is designed to enable and encourage writing tests that use your components as the end users do.
22
+
> Zalecamy korzystanie z biblioteki [`react-testing-library`](https://git.io/react-testing-library). Została on stworzona w celu propagowania idei pisania testów, które używają komponentów podobnie jak potencjalny użytkownik aplikacji.
23
23
>
24
-
> Alternatively, Airbnb has released a testing utility called[Enzyme](http://airbnb.io/enzyme/), which makes it easy to assert, manipulate, and traverse your React Components' output.
24
+
> Jako alternatywę, firma Airbnb opublikowała narzędzie do testowania o nazwie[Enzyme](http://airbnb.io/enzyme/), które pozwala na łatwe pisanie asercji, a także manipulowanie i przechodzenie drzewa zwróconego przez komponenty reactowe.
25
25
26
26
-[`act()`](#act)
27
27
-[`mockComponent()`](#mockcomponent)
@@ -40,17 +40,17 @@ var ReactTestUtils = require('react-dom/test-utils'); // ES5 with npm
40
40
-[`renderIntoDocument()`](#renderintodocument)
41
41
-[`Simulate`](#simulate)
42
42
43
-
## Reference {#reference}
43
+
## Dokumentacja {#reference}
44
44
45
45
### `act()` {#act}
46
46
47
-
To prepare a component for assertions, wrap the code rendering it and performing updates inside an`act()` call. This makes your test run closer to how React works in the browser.
47
+
Aby przygotować komponent do testowania, należy kod renderujący i aktualizujący go "opakować" w wywołanie funkcji`act()`. Dzięki temu test zostanie uruchomiony w taki sposób, aby jak najwierniej odtworzyć zachowanie Reacta w przeglądarce.
48
48
49
-
>Note
49
+
>Uwaga
50
50
>
51
-
>If you use `react-test-renderer`, it also provides an `act` export that behaves the same way.
51
+
>Biblioteka `react-test-renderer` również udostępnia funkcję `act`, która działa w podobny sposób.
52
52
53
-
For example, let's say we have this`Counter`component:
53
+
Dla przykładu, załóżmy, że napisaliśmy następujący komponent`Counter`(pol. *licznik*):
54
54
55
55
```js
56
56
classAppextendsReact.Component {
@@ -60,10 +60,10 @@ class App extends React.Component {
Don't forget that dispatching DOM events only works when the DOM container is added to the `document`. You can use a helper like [`react-testing-library`](https://github.com/kentcdodds/react-testing-library) to reduce the boilerplate code.
125
+
Zwróć uwagę, że przesyłanie zdarzeń DOM działa tylko wtedy, gdy kontener jest umieszczony w `document`. Możesz w tym celu użyć biblioteki pomocniczej, jak na przykład [`react-testing-library`](https://github.com/kentcdodds/react-testing-library), aby zredukować powtarzający się szablonowy kod.
126
126
127
127
* * *
128
128
@@ -135,11 +135,11 @@ mockComponent(
135
135
)
136
136
```
137
137
138
-
Pass a mocked component module to this method to augment it with useful methods that allow it to be used as a dummy React component. Instead of rendering as usual, the component will become a simple `<div>` (or other tag if `mockTagName` is provided) containing any provided children.
138
+
Jeśli przekażesz do tej funkcji atrapę komponentu (ang. *mocked component*), zostanie ona wzbogacona o przydatne funkcje, które pozwolą na traktowanie jej jak sztucznego komponentu reactowego. Zamiast wyrenderować się zgodnie z implementacją, komponent stanie się zwykłym elementem `<div>` (lub innym, jeśli podamy wartość w parametrze `mockTagName`) renderującym przekazanych potomków.
139
139
140
-
> Note:
140
+
> Uwaga:
141
141
>
142
-
> `mockComponent()`is a legacy API. We recommend using [shallow rendering](/docs/shallow-renderer.html)or [`jest.mock()`](https://facebook.github.io/jest/docs/en/tutorial-react-native.html#mock-native-modules-using-jestmock) instead.
142
+
> Funkcja `mockComponent()`jest przestarzała. Zamiast niej zalecamy używanie ["płytkiego renderowania"](/docs/shallow-renderer.html)(ang. *shallow rendering*) lub funkcji [`jest.mock()`](https://facebook.github.io/jest/docs/en/tutorial-react-native.html#mock-native-modules-using-jestmock).
143
143
144
144
* * *
145
145
@@ -149,7 +149,7 @@ Pass a mocked component module to this method to augment it with useful methods
149
149
isElement(element)
150
150
```
151
151
152
-
Returns`true` if `element`is any React element.
152
+
Zwraca`true`, jeśli argument `element`jest elementem reactowym.
153
153
154
154
* * *
155
155
@@ -162,7 +162,7 @@ isElementOfType(
162
162
)
163
163
```
164
164
165
-
Returns`true` if `element`is a React element whose type is of a React`componentClass`.
165
+
Zwraca`true`, jeśli argument `element`jest elementem reactowym o klasie podanej jako`componentClass`.
166
166
167
167
* * *
168
168
@@ -172,7 +172,7 @@ Returns `true` if `element` is a React element whose type is of a React `compone
172
172
isDOMComponent(instance)
173
173
```
174
174
175
-
Returns`true` if `instance`is a DOM component (such as a `<div>`or`<span>`).
175
+
Zwraca`true`, jeśli argument `instance`jest standardowym komponentem DOM (np. `<div>`lub`<span>`).
176
176
177
177
* * *
178
178
@@ -182,7 +182,7 @@ Returns `true` if `instance` is a DOM component (such as a `<div>` or `<span>`).
182
182
isCompositeComponent(instance)
183
183
```
184
184
185
-
Returns`true` if `instance`is a user-defined component, such as a class or a function.
185
+
Zwraca`true`, jeśli argument `instance`jest komponentem użytkownika, typu klasowego lub funkcyjnego.
186
186
187
187
* * *
188
188
@@ -195,7 +195,7 @@ isCompositeComponentWithType(
195
195
)
196
196
```
197
197
198
-
Returns`true` if `instance`is a component whose type is of a React`componentClass`.
198
+
Zwraca`true`, jeśli argument `instance`jest komponentem o klasie podanej jako`componentClass`.
199
199
200
200
* * *
201
201
@@ -208,7 +208,7 @@ findAllInRenderedTree(
208
208
)
209
209
```
210
210
211
-
Traverse all components in `tree`and accumulate all components where `test(component)`is`true`. This is not that useful on its own, but it's used as a primitive for other test utils.
211
+
Przeszukuje wszystkie komponenty w drzewie `tree`i zwraca te, dla których wywołanie funkcji `test(komponent)`daje`true`. Funkcja ta sama w sobie nie jest zbyt użyteczna, jednak jest podstawą dla innych narzędzi do testowania.
Like [`scryRenderedDOMComponentsWithClass()`](#scryrendereddomcomponentswithclass) but expects there to be one result, and returns that one result, or throws exception if there is any other number of matches besides one.
237
+
Podobna w działaniu do [`scryRenderedDOMComponentsWithClass()`](#scryrendereddomcomponentswithclass), lecz oczekuje dokładnie jednego wyniku. W przypadku znalezienia innej liczby elementów rzuca wyjątek.
Like [`scryRenderedDOMComponentsWithTag()`](#scryrendereddomcomponentswithtag) but expects there to be one result, and returns that one result, or throws exception if there is any other number of matches besides one.
263
+
Podobna w działaniu do [`scryRenderedDOMComponentsWithTag()`](#scryrendereddomcomponentswithtag), lecz oczekuje dokładnie jednego wyniku. W przypadku znalezienia innej liczby elementów rzuca wyjątek.
Same as [`scryRenderedComponentsWithType()`](#scryrenderedcomponentswithtype) but expects there to be one result and returns that one result, or throws exception if there is any other number of matches besides one.
289
+
Podobna w działaniu do [`scryRenderedComponentsWithType()`](#scryrenderedcomponentswithtype), lecz oczekuje dokładnie jednego wyniku. W przypadku znalezienia innej liczby elementów rzuca wyjątek.
290
290
291
291
***
292
292
@@ -296,20 +296,20 @@ Same as [`scryRenderedComponentsWithType()`](#scryrenderedcomponentswithtype) bu
296
296
renderIntoDocument(element)
297
297
```
298
298
299
-
Render a React element into a detached DOM node in the document. **This function requires a DOM.**It is effectively equivalent to:
299
+
Renderuje element reactowy do stworzonego w locie węzła drzewa DOM. **Ta funkcja działa tylko na drzewie DOM w ramach dokumentu.**Daje ten sam rezultat, co:
300
300
301
301
```js
302
302
constdomContainer=document.createElement('div');
303
303
ReactDOM.render(element, domContainer);
304
304
```
305
305
306
-
> Note:
306
+
> Uwaga:
307
307
>
308
-
> You will need to have `window`, `window.document`and`window.document.createElement` globally available **before** you import `React`. Otherwise React will think it can't access the DOM and methods like `setState` won't work.
308
+
> **Zanim** zaimportujesz bibliotekę React w kodzie, w globalnym zakresie muszą być dostępne zmienne `window`, `window.document`oraz`window.document.createElement`. W przeciwnym wypadku React będzie "myślał", że nie ma dostępu do drzewa DOM, co spowoduje wyłączenie niektórych funkcji, np. `setState`.
309
309
310
310
* * *
311
311
312
-
## Other Utilities {#other-utilities}
312
+
## Inne narzędzia {#other-utilities}
313
313
314
314
### `Simulate` {#simulate}
315
315
@@ -320,30 +320,30 @@ Simulate.{eventName}(
320
320
)
321
321
```
322
322
323
-
Simulate an event dispatch on a DOM node with optional `eventData` event data.
323
+
Symuluje przesłanie zdarzenia do węzła DOM, opcjonalnie dodając do niego dane zawarte w argumencie `eventData`.
324
324
325
-
`Simulate`has a method for [every event that React understands](/docs/events.html#supported-events).
325
+
Obiekt `Simulate`posiada odpowiednie metody [dla każdego ze zdarzeń obsługiwanego przez Reacta](/docs/events.html#supported-events).
> You will have to provide any event property that you're using in your component (e.g. keyCode, which, etc...) as React is not creating any of these for you.
347
+
> Wszelkie właściwości dla zdarzenia (np. `keyCode`, `which` itp.) należy przekazać jawnie, ponieważ React nie dodaje ich automatycznie.
0 commit comments