From the Enzyme docs shallow, render, and mount are described, but when to use which method?
The difference between shallow() and mount() is that shallow() tests components in isolation from the child components they render while mount()goes deeper and tests a component's children.
Shallow rendering lets you render a component “one level deep” and assert facts about what its render method returns, without worrying about the behavior of child components, which are not instantiated or rendered. This does not require a DOM.
shallow method is used to render the single component that we are testing. It does not render child components. In Enzyme version less than 3, the shallow method does not have the ability to access lifecycle methods. But in Enzyme version 3, we have this ability.
Shallow tests might be good quick win practice optimizing tests. Isolation. It's quite common to add a new dependency to a resuable directive or component. It tends to break other tests because something is missing in dependency injection tree.
setState
, debug
...) Will require jsdom or similar.
componentDidMount
If some of your children are connected components, you probably don't want to use mount
, or you will need to setup a <Provider>
and store creation, which would be a bit painful, just use shallow
in this case.
This post is really insightful about the subject.
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With