Solución:
Si su objetivo es una cobertura del 100% en su proyecto y el código en su index.js archivo es trivial, entonces podría ser una buena opción excluir el archivo del informe de cobertura, como señala Andreas Köberle en su respuesta.
Create-react-app actualmente solo admite estas cuatro claves en la configuración de Jest (fuente):
collectCoverageFrom
coverageReporters
coverageThreshold
snapshotSerializers
Esta es la razón por
coveragePathIgnorePatterns": ["src/index.js"]
no funcionará.
Agregue el siguiente código al alcance más externo de su package.json expediente:
"jest": {
"collectCoverageFrom": [
"src/**/*.{js,jsx}",
"!src/index.js"
]
}
En la imagen a continuación, puede ver el resultado de una ejecución de prueba con este código agregado al package.json de la aplicación inicial creada con create-react-app v1.4.3. Tenga en cuenta que el index.js El archivo ya no aparece en el informe y tampoco afecta el porcentaje de cobertura.
Así es como probé index.js
index.js
import React from "react";
import ReactDOM from "react-dom";
import App from "./App";
ReactDOM.render(<App />, document.getElementById("root"));
index.test.js
import React from "react";
import ReactDOM from "react-dom";
import App from "./App";
jest.mock("react-dom", () => ({ render: jest.fn() }));
describe("Application root", () => {
it("should render without crashing", () => {
const div = document.createElement("div");
div.id = "root";
document.body.appendChild(div);
require("./index.js");
expect(ReactDOM.render).toHaveBeenCalledWith(<App />, div);
});
});
La pregunta principal es qué quieres probar allí. Si quieres probar eso tu el código funciona correctamente, escribe una prueba unitaria que espíe ReactDOM.render y se burla document.getElementById('root'). Porque esto es todo lo que hace tu código, llamando ReactDOM.render con nuestro componente de aplicación y un div.
import ReactDOM from 'react-dom';
...
jest.mock('react-dom', ()=> ({render: jest.fn()}))
it('renders without crashing', () => {
const div = document.createElement('div');
ReactDOM.render(<App/>, div);
global.document.getElementById = (id) => id ==='root' && div
expect(ReactDOM.render).toHaveBeenCalledWith(...)
});
Si desea probar que la aplicación realmente se inicia en su página, debe escribir una prueba de integración con Selenium o Nightwatch.js
Para obtener una cobertura del 100%, también puede ignorar este archivo agregándolo al coveragePathIgnorePatterns en tu configuración de broma