Data Module: Refactor Higher-order components to avoid the use of componentWillMount#7206
Conversation
|
It looks good as far as I can see, but it definitely should be confirmed by @aduth 👍 |
packages/data/src/index.js
Outdated
| */ | ||
| this.shouldComponentUpdate = false; | ||
| this.state = { | ||
| mergeProps: mapStateToProps( select, props ) || {}, |
There was a problem hiding this comment.
Minor: If we rely on the behavior to fall back to object, wonder if we should put this in a common getter function between the constructor and runSelection usage, e.g.
static function getNextMergeProps( props ) {
return mapStateToProps( select, props ) || {};
}There was a problem hiding this comment.
Unless it doesn't matter, I'm not sure :)
It shouldn't matter. We're running a shallow equality on the result, so, with your example:
isShallowEqual( test(), test() );
// trueThere was a problem hiding this comment.
That said, it could be a micro-optimization since strict equality is a shortcutting case in @wordpress/is-shallow-equal:
This would only happen on cases where we're returning undefined (falsey), which for withSelect is probably not so frequent.
packages/data/src/index.js
Outdated
| } | ||
|
|
||
| componentDidMount() { | ||
| this.canRunSelection = true; |
There was a problem hiding this comment.
Can you clarify what the potential issue is that warranted the assignment here? Can we add a unit test which would otherwise fail without it?
There was a problem hiding this comment.
you can't setState if the component is not mounted so selection can be only run when the component is really mounted.
There was a problem hiding this comment.
How do we get from setState to having runSelection being called?
There was a problem hiding this comment.
runSelection calls setState?
There was a problem hiding this comment.
You mentioned that the issue is setState could be called between constructor and componentDidMount. When will that occur?
There was a problem hiding this comment.
Oh, I don't know exactly :) I just had errors when loading Gutenberg when I tried.
Also, I guess in an async React mode, Components can be initialized but not mounted directly which means a lot of subscribe calls will happen in between.
There was a problem hiding this comment.
We should track it down and get a unit test in place which would fail without this assignment.
There was a problem hiding this comment.
Haha, it looks like I'm not able to reproduce anymore :). Maybe it was related to another fix I did. I'm removing this for now
635f54f to
ffc8e27
Compare

In #7202 I'm trying to enable StrictMode and this surfaces a big number of files we're relying on deprecated Lifecycle methods.
This PR updates the data module HoC to avoid using
componentWillMountlifecycle method.Testing instructions