shallow

[mi4uu]

hi,
Is it possible to shallow render a component?
I dont wont to test all of children but just my component. with normal render all of my snapshot will fail if I change some small child component .

[ZackKnopp]

See here. He doesn't support it.

Although for my use case (testing redux connected components that could have redux connected component grandchildren) I didn't want to mock my whole app state just to test that the container would call a function on mount. So, I just gave my container a shallowRender prop and passed that in the test.

[kentcdodds]

Yeah, react-testing-library wont support shallow rendering. Mocking is the correct way to go about this.

[dnsmob]

if for whatever reason you'd need to access methods in the rendered class, check this:
https://dev.to/mcrowder65/how-to-test-implementation-details-with-react-testing-library-4bln

test("that getData returns this.state.data", () => {
  const ref = React.createRef();
  render(<CustomCell ref={ref} />);
  expect(ref.current.getValue()).toEqual(ref.current.state.value);
})  

it works a treat! :D

[sr-shifu]

Here is the workaround I found working for my RTL-based tests: https://thesametech.com/snapshot-testing-in-rtl/

[Filipoliko]

If you mostly care about how the snapshot looks, you can use shallow-react-snapshot, which takes the result of the render method of react testing library and transforms the html element output into Enzyme-like shallow structure that can be used with jest snapshots.