¿Cómo funcionan las pruebas de instantáneas y qué hace la función toMatchSnapshot () en las pruebas de instantáneas de Jest para los componentes de React?

Solución:

¡Creo que esta pregunta no ha sido respondida con suficientes detalles! Las pruebas instantáneas se basan en el historial de sus pruebas anteriores. Cuando ejecuta por primera vez una prueba de instantánea, crea un archivo de texto que incluye el renderizado textual de su árbol de componentes. Por ejemplo, la siguiente prueba:

import React from 'react';
import renderer from 'react-test-renderer';

it('renders correctly', () => {
  const tree = renderer
    .create(<Link page="http://www.facebook.com">Facebook</Link>)
    .toJSON();
  expect(tree).toMatchSnapshot();
});

Generará el siguiente archivo de texto:

exports[`renders correctly 1`] = `
<a
  className="normal"
  href="http://www.facebook.com"
  onMouseEnter={[Function]}
  onMouseLeave={[Function]}
>
  Facebook
</a>
`;

Necesita mantener estos archivos de instantáneas en su VCS (git). Cuando realiza un cambio, puede ejecutar estas pruebas para ver si aún coincide con el archivo de texto de la instantánea o no.

para leer más, estudie este documento: https://jestjs.io/docs/en/snapshot-testing

Snapshots le permite probar si su componente se representa correctamente, por lo que en su caso

expect(Wrapper).toMatchSnapshot()

Si desea probar el número de ocurrencias de un componente dado, importe su segundo componente y cree su prueba:

it("displays the result", () => {
  const test = Wrapper.find(Second_Component).length;
  expect(test).toEqual(1); // or the number of occurrence you're expecting
});

Si está interesado en la representación JSON de sus componentes, puede usar el paquete de enzima a json que sirve para este propósito

---

---

Utiliza Nuestro Buscador