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
Copy file name to clipboardExpand all lines: content/docs/addons-test-utils.md
+20-21Lines changed: 20 additions & 21 deletions
Original file line number
Diff line number
Diff line change
@@ -19,9 +19,9 @@ var ReactTestUtils = require('react-dom/test-utils'); // ES5 with npm
19
19
20
20
> Nota:
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
+
> Recomendamos utilizar [`react-testing-library`](https://git.io/react-testing-library)que está diseñada para permitir e incentivar la escritura de las pruebas para que usen los componentes de la misma forma en que lo harían los usuarios finales.
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
+
> Como otra opción, Airbnb ha liberado una utilidad de pruebas llamada [Enzyme](http://airbnb.io/enzyme/), que hace fácil asegurar, manipular y navegar por los resultados de tus Componentes de React.
25
25
26
26
-[`act()`](#act)
27
27
-[`mockComponent()`](#mockcomponent)
@@ -44,13 +44,13 @@ var ReactTestUtils = require('react-dom/test-utils'); // ES5 with npm
44
44
45
45
### `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
+
Para preparar un componente en ser asegurado, debes envolver el código que lo renderiza y que realiza actualizaciones sobre este en un llamado a `act()`. Esto hace que tus pruebas corran de una forma más parecida a como lo hace React en el navegador.
48
48
49
-
>Note
49
+
>Nota
50
50
>
51
-
>If you use `react-test-renderer`, it also provides an `act`export that behaves the same way.
51
+
>Si usas `react-test-renderer`, este también provee un método `act`que se comporta de la misma forma.
52
52
53
-
For example, let's say we have this`Counter` component:
53
+
Por ejemplo, digamos que tenemos este componente`Counter`:
54
54
55
55
```js
56
56
classAppextendsReact.Component {
@@ -83,7 +83,7 @@ class App extends React.Component {
83
83
}
84
84
```
85
85
86
-
Here is how we can test it:
86
+
Y así es como podemos probarlo:
87
87
88
88
```js{3,20-22,29-31}
89
89
import React from 'react';
@@ -104,7 +104,7 @@ afterEach(() => {
104
104
});
105
105
106
106
it('can render and update a counter', () => {
107
-
// Test first render and componentDidMount
107
+
// Prueba la primer renderización y componentDidMount
108
108
act(() => {
109
109
ReactDOM.render(<Counter />, container);
110
110
});
@@ -113,7 +113,7 @@ it('can render and update a counter', () => {
@@ -122,7 +122,7 @@ it('can render and update a counter', () => {
122
122
});
123
123
```
124
124
125
-
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
+
No olvides que la ejecución de eventos del DOM sólo funciona cuando el contenedor del DOM es agregado al `document`. Puedes utilizar una ayuda como [`react-testing-library`](https://github.com/kentcdodds/react-testing-library)para reducir todo el código repetitivo.
126
126
127
127
* * *
128
128
@@ -296,20 +296,20 @@ Igual a [`scryRenderedComponentsWithType()`](#scryrenderedcomponentswithtype) pe
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
+
Renderiza un Elemento de React en un nodo separado del DOM en el documento. **Esta función requiere un DOM.**Esto es equivalente a hacer:
300
300
301
301
```js
302
302
constdomContainer=document.createElement('div');
303
303
ReactDOM.render(element, domContainer);
304
304
```
305
305
306
-
> Note:
306
+
> Nota:
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
+
> Necesitarás tener `window`, `window.document`y`window.document.createElement`habilitados de forma global **antes**de importar`React`. De otro modo React pensará que no tiene acceso al DOM y los métodos como `setState`no funcionarán.
309
309
310
310
* * *
311
311
312
-
## Other Utilities
312
+
## Otras utilidades
313
313
314
314
### `Simulate`
315
315
@@ -320,19 +320,19 @@ Simulate.{eventName}(
320
320
)
321
321
```
322
322
323
-
Simulate an event dispatch on a DOM node with optional `eventData`event data.
323
+
Simula la ejecución de un evento en un nodo del DOM con los datos de evento `eventData`opcionales.
324
324
325
-
`Simulate`has a method for [every event that React understands](/docs/events.html#supported-events).
325
+
`Simulate`tiene un método para [cada uno de los eventos que React comprende](/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.
345
+
> Nota
346
+
> Se debe proveer cualquiera de las propiedades del evento que se esté usando en tu componente (p.e. keyCode, which, etc...) ya que React no creará ninguna de estas por ti.
0 commit comments