|
| 1 | +# Pruebas usando snapshots |
| 2 | + |
| 3 | +AVA permite realizar pruebas usando snapshots, [presentadas por Jest](https://facebook.github.io/jest/docs/snapshot-testing.html), usando su interface de [aserciones](./03-assertions.md). Puedes tomar un snapshot de cualquier valor, así como de los elementos de React: |
| 4 | + |
| 5 | +```js |
| 6 | +// Your component |
| 7 | +const HelloWorld = () => <h1>Hello World...!</h1>; |
| 8 | + |
| 9 | +export default HelloWorld; |
| 10 | +``` |
| 11 | + |
| 12 | +```js |
| 13 | +// Your test |
| 14 | +const test = require('ava'); |
| 15 | +const render = require('react-test-renderer'); |
| 16 | +const HelloWorld = require('.'); |
| 17 | + |
| 18 | +test('HelloWorld component', t => { |
| 19 | + const tree = render.create(<HelloWorld/>).toJSON(); |
| 20 | + t.snapshot(tree); |
| 21 | +}); |
| 22 | +``` |
| 23 | + |
| 24 | +[Prueba este proyecto de ejemplo.](https://github.com/avajs/ava-snapshot-example) |
| 25 | + |
| 26 | +Los snapshots se almacenan junto con tus archivos de prueba. Si tus pruebas estan en una carpeta `test` o `tests` los snapshots seran guardados en una carpeta `snapshots`. Si sus pruebas están en una carpeta `__tests__`, entonces se almacenarán en una carpeta `__snapshots__`. |
| 27 | + |
| 28 | +Digamos que tienes `~/project/test/main.js` que contiene aserciones sobre snapshots. AVA creará dos archivos: |
| 29 | + |
| 30 | +* `~/project/test/snapshots/main.js.snap` |
| 31 | +* `~/project/test/snapshots/main.js.md` |
| 32 | + |
| 33 | +El primer archivo contiene el snapshot como tal y es necesario para futuras comparaciones. El segundo archivo contiene un *snapshot report*. Este se regenera cuando actualizan los snapshots. Si lo subes a tu versional de codigo fuente, puedes chequear las diferencias para ver los cambios en tu snapshot. |
| 34 | + |
| 35 | +AVA te mostrará por qué falló la verificacion de tu snapshot: |
| 36 | + |
| 37 | +<img src="../media/snapshot-testing.png" width="1048"> |
| 38 | + |
| 39 | +Entonces puedes verificar tu código. Si el cambio fue intencional, puede usar la bandera `--update-snapshots` (o` -u`) para actualizar los snapshots: |
| 40 | + |
| 41 | +```console |
| 42 | +$ ava --update-snapshots |
| 43 | +``` |
| 44 | + |
| 45 | +Puede especificar una ubicación fija para almacenar los snapshot en la [configuración `package.json`] de AVA (./06-configuration.md): |
| 46 | + |
| 47 | +**`package.json`:** |
| 48 | + |
| 49 | +```json |
| 50 | +{ |
| 51 | + "ava": { |
| 52 | + "snapshotDir": "custom-directory" |
| 53 | + } |
| 54 | +} |
| 55 | +``` |
| 56 | + |
| 57 | +Los archivos de snapshots se guardarán en una estructura de directorio que refleja la de tus archivos de prueba. |
| 58 | + |
| 59 | +Si estás ejecutando AVA contra archivos de prueba precompilados, AVA intentará mapeará el origen para determinar la ubicación de los archivos originales. Los snapshots se almacenarán junto a estos archivos, siguiendo las mismas reglas como si AVA hubiera ejecutado los archivos originales directamente. |
| 60 | +Esto es genial si estás escribiendo pruebas en TypeScript (mira nuestra [receta de TypeScript] (./recipes/typescript.md)). |
0 commit comments