score:2

Accepted answer

enzyme shallow is primarily intended for isolated unit tests like the one that was listed, only the implementation of tested unit is asserted. it offers some instrumentation (and also non-compliant behaviour) that doesn't exist in react itself.

react-testing-library is primarily intended for blackbox functional tests, the effects of units on resulting dom are asserted.

react's own reacttestutils also offer some basic functionality, a subset of enzyme and react-testing-library features, including shallow renderer for isolated tests.

it's possible to do isolated tests and assert the implementation without enzyme, this results in boilerplate code. the approach isn't specific to testing library, it could be achieved with any renderer, including react's test renderer's snapshot testing. everything (counter component) but tested unit (app component) should be mocked with jest, e.g.:

  it('passes all props to counter wrapper', async () => {
    const countermock = jest.fn(() => 'counter');
    jest.mock('./counter-module', () => countermock);
    const app = await import('./app-module');

    // render <app/> and assert that the result is <div>counter</div> 

    expect(countermock).tobecalledwith({ counter: 0 });
  });

Related Query

More Query from same tag