shallow.get() returns ReactElement with wrong type
See original GitHub issueCurrent behavior
Grabbing a connected component by using shallow().get(0)
returns a ReactElement with the wrong type (type: function ConnectionFunction()
instead of type: Object
).
Looks like this issue did not arise in enzyme-adapter-react-16 1.12.1 (setting the adapter version to 1.12.1 in the sandbox makes the test pass), but subsequent versions do have this issue.
Expected behavior
Should return a ReactElement with type: Object
.
Your environment
https://codesandbox.io/s/happy-sammet-6o3li
API
- shallow
- mount
- render
Version
library | version |
---|---|
enzyme | 3.10.0 (latest as of writing) |
react | 16.8.6 (latest stable as of writing) |
react-dom | 16.8.6 (latest stable as of writing) |
react-test-renderer | (not a direct dependency) |
adapter (below) | 1.14.0 (latest as of writing) |
Adapter
- enzyme-adapter-react-16
- enzyme-adapter-react-16.3
- enzyme-adapter-react-16.2
- enzyme-adapter-react-16.1
- enzyme-adapter-react-15
- enzyme-adapter-react-15.4
- enzyme-adapter-react-14
- enzyme-adapter-react-13
- enzyme-adapter-react-helper
- others ( )
Issue Analytics
- State:
- Created 4 years ago
- Comments:6 (3 by maintainers)
Top Results From Across the Web
shallow.get() returns ReactElement with wrong type #2168
Current behavior Grabbing a connected component by using shallow().get(0) returns a ReactElement with the wrong type (type: function ...
Read more >How to test style for a React component attribute with Enzyme
It returns ReactElement. let containerStyle = container.get(0).style; expect(containerStyle).to.have.property('opacity', '1');.
Read more >React Top-Level API
Return a function that produces React elements of a given type. Like React.createElement() , the type argument can be either a tag name...
Read more >Why I Never Use Shallow Rendering
This is a very common misconception: "To unit test a react component you must use shallow rendering so other components are not rendered."...
Read more >Understanding common frustrations with React Hooks
What was wrong with class components? ... async componentDidMount() { const response = await get(`/users`); this.
Read more >
Top Related Medium Post
No results found
Top Related StackOverflow Question
No results found
Troubleshoot Live Code
Lightrun enables developers to add logs, metrics and snapshots to live code - no restarts or redeploys required.
Start Free
Top Related Reddit Thread
No results found
Top Related Hackernoon Post
No results found
Top Related Tweet
No results found
Top Related Dev.to Post
No results found
Top Related Hashnode Post
No results found
That one seems to work. It’s gonna be a real hefty change in our codebase to change our usages of
.toEqual
or.toEqualJSX
tomatchesElement
, but if we’re not using shallow as intended, that just might be the way we have to go. Thanks!I also wouldn’t rely on that - enzyme has
matchesElement
, what happens if youexpect(component.matchesElement(<Child />)).toBe(true)
?