New issue
Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.
By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.
Already on GitHub? Sign in to your account
v7.0.0 No styles found when shallow rendering nested styled-components #306
Comments
We have exactly the same problem - any news here? We are aware of the cheap solution -> switch tests to use |
The native version of component.props.styles However, Enzyme will only render the first level and not any further, so style prop will be undefined. If we dive three times into the given styled-components, the underlying components will be exposed, thus exposing the style prop: component.dive().dive().dive().debug()
// <View style={{...}}
component.dive().dive().dive().prop('style')
// works |
@MrCreeper1008 I created a pull request which fixes the issue for me. The cause seems to be that the |
It works differently for react native. I forgot to put that |
v7.0.1 might help |
I have posted a possible reason here: And I currently use v7.0.2 |
When upgrading to styled-components v5 and jest-styled-components v7, we had multiple components missing styling rules in tests when
shallow
rendering and checking withtoHaveStyleRule
.I came to the conclusion that it happens, when a styled-component has another styled-component as the root element in the mark up.
Example Test:
In my opinion this is a very common thing when using styled-components and should be supported by this library.
Something that is probably obvious, but just to be sure I point it out: There is no test for that case in
toHaveStyleRule.spec.js
and it fails when I add it.The text was updated successfully, but these errors were encountered: