samedi 11 janvier 2020

Testing with Jest, Enzyme

Good day, everyone. I'm learning React and React Testing by trying to replicate one of the example projects from official React page. https://github.com/jeffersonRibeiro/react-shopping-cart

I have stumbled on a problem. Specifically with testing. When I'm trying to replicate testing code for App Component https://github.com/jeffersonRibeiro/react-shopping-cart/blob/master/src/components/App/tests/App.test.js

import Root from '../../../Root';
import App from '../';

import Shelf from '../../Shelf';
import FloatCart from '../../FloatCart';

let wrapped;

beforeEach(() => {
  wrapped = mount(
    <Root>
      <App />
    </Root>
  );
});

afterEach(() => {
  wrapped.unmount();
});

it('shows a shelf', () => {
  expect(wrapped.find(Shelf).length).toEqual(1);
});

it('shows a floating cart', () => {
  expect(wrapped.find(FloatCart).length).toEqual(1);
});

it throws an error that 'fetch method is undefined'. I understand that I need to use the library to mock fetch, but why it doesn't throw the error in original code? The only difference is that I'm using Typescript. If I change mount() to shallow() it works fine. If I will try to mock state for redux in other tests, the test is still trying to fetch data and throws the error 'fetch method is undefined'. Can you please point out what I'm missing. Thank you.

Aucun commentaire:

Enregistrer un commentaire