0

I tried to test my react project with enzyme and jest, when run my project with yarn test all be right, but when I tried to run the coverage report with the script yarn test --coverage and all test with enzyme has been failed.

import '@testing-library/jest-dom/extend-expect';

import {configure} from 'enzyme';
import Adapter from 'enzyme-adapter-react-16';
import 'jest-enzyme';


configure({adapter: new Adapter()});

This is my test.

it("should render Form", () => {
    console.log(wrapper.debug());
    expect(wrapper.exists(FormSignup)).toBe(true);
  });

When I run with yarn test and y try to log wrapper.debug()

Console.log src/pages/patient-auth/patient-auth.test.js:99
      <div class="sc-iwaifL fibzQF"><div class="sc-cxNIbT dbZAGD">
<h3>Authorización de paciente</h3></div><div class="sc-lmgQde gQjQQD">
<form autoComplete="off" class="sc-fKgIGh fFDhjo">
<div class="sc-bCwgka cYnlCt"><div><h4>Nombre: test test test</h4>
<h4>Correo : test@test.com</h4></div></div><div class="sc-bCwgka cYnlCt">
<div class="sc-gtssRu cHOYTA"><input type="date" name="expiration_date" min="1980-01-01" max="2021-01-19" class="sc-dlnjPT lbPlE"/>
<label class="sc-hKFyIo htgnEd shrink">Fecha de expiración</label></div><div class="sc-kEqYlL jRpfDg"> <div class="sc-jSFkmK hwcRol"><span> Autorización</span></div><div class="sc-gKAblj fxkdfC"><input type="checkbox" name="auth" id="auth" class="sc-jrsJCI iFWYuj"/><label for="auth" class="sc-iCoHVE gpnzXF"><span data-yes="Si" data-no="No" class="sc-fujyUd bbprCb"></span><label class="sc-pNWxx fvvsLs"></label></label></div></div> </div><button type="submit" class="sc-bdnylx jqdcFs">&quot;Actualizar Paciente&quot;</button><div style="max-width:100%"><p style="font-size:10px">{&quot;expiration_date&quot;:&quot;&quot;,&quot;auth&quot;:null}</p>
</div>
</form>
</div>
<div class="sc-iJCRLp iZsMhV"></div></div>

and the test is right

When I run with yarn test --coverage and y try to log wrapper.debug()

console.log src/pages/patient-auth/patient-auth.test.js:99
      null

 expect(received).toBe(expected) // Object.is equality

    Expected: true
    Received: false

      103 | 
      104 |   it("should render Form", () => {
    > 105 |     expect(wrapper.exists(FormSignup)).toBe(true);
          |                                        ^
      106 |   });

Thanks a lot

Manoj
  • 2,059
  • 3
  • 12
  • 24
Huss Russ
  • 1
  • 1
  • What is the `test` script in your package.json? And what is `wrapper`? – Zac Anger Jan 20 '21 at 00:13
  • Hello, the script is "test": "react-scripts test ", the wrapper is " wrapper = shallow()" – Huss Russ Jan 20 '21 at 00:41
  • Is this a functional component, and if so, do you have a `displayName` set on it? (There's a [package](https://www.npmjs.com/package/babel-plugin-transform-react-stateless-component-name) that does this automatically if you want to try that.) – Zac Anger Jan 20 '21 at 00:44
  • Yes, its is a functional component, there are any way to set "displayName" manually ? – Huss Russ Jan 20 '21 at 01:09
  • Yes, it's just a property on the component, so `SomeComponent.displayName = 'SomeComponent'` ([examples here](https://stackoverflow.com/a/43376213/5774952)). – Zac Anger Jan 20 '21 at 01:15
  • I tried with both but test keep fail – Huss Russ Jan 20 '21 at 05:08

0 Answers0