Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Shallow renderer spanish translation #130

Merged
Merged
Show file tree
Hide file tree
Changes from all commits
Commits
File filter

Filter by extension

Filter by extension

Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
4 changes: 4 additions & 0 deletions TRANSLATION.md
Original file line number Diff line number Diff line change
Expand Up @@ -110,12 +110,15 @@ Aquí hay algunas sugerencias para la traducción de términos de uso común en
| ------------------ | ---------- |
| array | *array* |
| arrow function | función flecha |
| assert | comprobar |
| bug | error |
| bundler | *bundler* |
| camelCase | *camelCase* |
| callback | *callback* |
| camelCase | *camelCase* |
| controlled component | componente controlado |
| debugging | depuración |
| DOM | DOM |
| framework | *framework* |
| function component | componente de función |
| hook | *hook* |
Expand All @@ -126,6 +129,7 @@ Aquí hay algunas sugerencias para la traducción de términos de uso común en
| props | *props* |
| React element | Elemento de React |
| render | renderizar (verb), renderizado (noun)
| shallow rendering | renderizado superficial |
| state | estado |
| string | *string* |
| template literals | *template literals* |
Expand Down
32 changes: 16 additions & 16 deletions content/docs/addons-shallow-renderer.md
Original file line number Diff line number Diff line change
@@ -1,23 +1,23 @@
---
id: shallow-renderer
title: Shallow Renderer
title: Renderizado superficial
permalink: docs/shallow-renderer.html
layout: docs
category: Reference
category: Referencia
---

**Importing**
**Importando**

```javascript
import ShallowRenderer from 'react-test-renderer/shallow'; // ES6
var ShallowRenderer = require('react-test-renderer/shallow'); // ES5 with npm
```

## Overview {#overview}
## Resumen {#resumen}

When writing unit tests for React, shallow rendering can be helpful. Shallow rendering lets you render a component "one level deep" and assert facts about what its render method returns, without worrying about the behavior of child components, which are not instantiated or rendered. This does not require a DOM.
El renderizado superficial es util cuando escribes pruebas unitarias. El renderizado superficial te permite renderizar un componente a "un nivel de profundidad" y comprobar lo que su método de renderizado retorna sin preocuparse sobre el comportamiento de los componentes hijos, los cuales no son instanciados ni renderizados. Esto no requiere un DOM.

For example, if you have the following component:
Por ejemplo, si tienes el siguiente componente:

```javascript
function MyComponent() {
Expand All @@ -30,12 +30,12 @@ function MyComponent() {
}
```

Then you can assert:
Entonces puedes comprobar:

```javascript
import ShallowRenderer from 'react-test-renderer/shallow';

// in your test:
// en tu test:
const renderer = new ShallowRenderer();
renderer.render(<MyComponent />);
const result = renderer.getRenderOutput();
Expand All @@ -47,22 +47,22 @@ expect(result.props.children).toEqual([
]);
```

Shallow testing currently has some limitations, namely not supporting refs.
Las pruebas superficiales tienen algunas limitaciones, es decir, no soportan refs.

> Note:
> Nota:
>
> We also recommend checking out Enzyme's [Shallow Rendering API](http://airbnb.io/enzyme/docs/api/shallow.html). It provides a nicer higher-level API over the same functionality.
> También recomendamos revisar [Shallow Rendering API](http://airbnb.io/enzyme/docs/api/shallow.html) de Enzyme. Provee un API de alto nivel mucho mejor de la misma funcionalidad.

## Reference {#reference}
## Referencia {#referencia}

### `shallowRenderer.render()` {#shallowrendererrender}

You can think of the shallowRenderer as a "place" to render the component you're testing, and from which you can extract the component's output.
Puedes ver el shallowRenderer como un "lugar" para renderizar el componente que quieres probar, y del cual quieres extraer el resultado del componente.

`shallowRenderer.render()` is similar to [`ReactDOM.render()`](/docs/react-dom.html#render) but it doesn't require DOM and only renders a single level deep. This means you can test components isolated from how their children are implemented.
`shallowRenderer.render()` es parecido a [`ReactDOM.render()`](/docs/react-dom.html#render) pero no necesita DOM y solamente rendeirza un único nivel de profundidad. Esto quiere decir que se pueden probar componentes sin tener en cuenta como sus hijos son implementados.

### `shallowRenderer.getRenderOutput()` {#shallowrenderergetrenderoutput}

After `shallowRenderer.render()` has been called, you can use `shallowRenderer.getRenderOutput()` to get the shallowly rendered output.
Despues que `shallowRenderer.render()` es llamado, se puede usar `shallowRenderer.getRenderOutput()` para obtener el resultado superficialmente renderizado.

You can then begin to assert facts about the output.
Entonces ya se pueden empezar a comprobar hechos sobre el resultado.