styled-components version 5+ causing invalid hooks call error with enzyme's .dive() and .shallow()

[manveers96]

Environment

System:

• OS: macOS Mojave 10.14
• CPU: (8) x64 Intel(R) Core(TM) i7-7820HQ CPU @ 2.90GHz
• Memory: 495.23 MB / 16.00 GB
• Shell: 5.3 - /bin/zsh

Binaries:

• Node: 10.9.0 - ~/.nvm/versions/node/v10.9.0/bin/node
• Yarn: 1.16.0 - ~/.yarn/bin/yarn
• npm: 6.9.2 - ~/.nvm/versions/node/v10.9.0/bin/npm

Issue Description

I recently upgraded from styled-components@4.3.2 to styled-components@5.0.1 and am getting an invalid Hook call error at a place where I'm using .dive() function of enzyme.
I was not getting this error with the previous version of styled-components@4.3.2. Probably, the error has been introduced after styled-components updated from 4.4.1 to 5.0.0 in which I can see one of the PRs as Reimplement StyledComponent using hooks #2390. I'm using enzyme's .dive() function in setting up the snapshots for my React components.

Can we have a look at why we might be getting this issue?

PS: This issue occurs with .shallow() function also. I've also upgraded jest-styled-components to 7.0.0

[andreyluiz]

@manveers96 Have you been able to go around this problem? Or do you still have it?

[goroya]

me too

[manveers96]

@andreyluiz Was not able to0 find a solution for this problem. Tried the workaround suggested by Dan Abramov over here: facebook/react#15315 (comment) but this was not the case for my app as I had a single version of react being used according to the bundler. I checked this using npm ls react.

If anyone has any fix for this, please suggest.

[Gi-Totev]

I had the same problem, turns out I installed styled-components in the parent folder of the project and not in the create-react-app folder. Deleted styled-components, cd [react-app], npm install styled-components and the error is gone

[hhnssl]

I had the same problem, turns out I installed styled-components in the parent folder of the project and not in the create-react-app folder. Deleted styled-components, cd [react-app], npm install styled-components and the error is gone

thanks a lot. i solved my problem refer to your comment!