-
-
Notifications
You must be signed in to change notification settings - Fork 2k
Don't wrap functional components in react >=16.5 to shallow render #2014
New issue
Have a question about this project? # for a free GitHub account to open an issue and contact its maintainers and the community.
By clicking “#”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.
Already on GitHub? # to your account
Don't wrap functional components in react >=16.5 to shallow render #2014
Conversation
454c51c
to
ae30cfd
Compare
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
Seems great! Can you add a test that fails without this change?
@ljharb sure, I guess I'll wait for the react PR to be merged to do a more meaningful test for it. |
I don't understand what this fix is supposed to do or why it makes sense. Could you please explain it? |
Huh I see. I didn't realize Enzyme wraps the passed type... In that case this fix makes sense. |
b202023
to
2f6f002
Compare
Seems like It was introduced to solve #1683, which is linked to issue facebook/react#13141 fixed since react 16.5.0. For now, I've updated the PR with tests |
I'd remove the wrapper if we're targeting 16.5+. |
That’s definitely something we can and should do - and it can be done in the adapter. We have all sorts of version-conditional hacks and bugfixes patches in the adapters. |
@ljharb I've updated the PR approach, to only wrap the component fn on version < 16.5 |
(...args) => Component(...args), // eslint-disable-line new-cap | ||
Component, | ||
); | ||
cachedComponent = Component; |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
this line is important here; we don't want to create a new wrapper every time. Can we preserve it?
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
PR updated with the requested change. I can also simplify the wrap-function using lodash.memoize or similar, if you think is worth adding the dep.
Also, a test started failing, I've tracked to this change:
abed5df (it started failing because it no longer tries to wrap the component)
I've reverted it since React.Memo also work on class component, but let me know if there is a better approach.
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
Nah, no need to add the dep.
Your change seems good :-)
abed5df
to
f695b6a
Compare
k, i've rebased this on top of a major tests refactor; i'm not sure if your tests are still passing. |
Thanks, seems the test still pass after the rebase |
This is necessary because ReactShallowRender checks for equality in function components to decide if it should keep hooks state between renders.
This along with facebook/react#14802 / facebook/react#14840 should help in test components with some of the core hooks.
link #2011 , #2008 and #1996