-
Notifications
You must be signed in to change notification settings - Fork 842
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
[breaking change] Remove findDOMNode #1285
[breaking change] Remove findDOMNode #1285
Conversation
I'm holding off on adding changelog / wanting to merge until Monday |
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.
Nice, I like it that the APIs are less overloaded 👍 Left just a few inline comments below...
this.updateChildNode(); | ||
if (this.childNode == null) { | ||
throw new Error('EuiMutationObserver did not receive a ref'); | ||
} |
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.
I wonder why we need this? What's wrong with registering a ref later, e.g. when rendering conditionally?
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.
I don't feel too strongly here, but my thoughts on requiring a ref from the beginning:
- when possible, error earlier and faster for better dev experience
- MutationObserver is inherently an invisible thing, it would be trivial to forget to forward the ref or do so incorrectly and assume things are working as expected with no feedback
- if conditional rendering is required, it's trivial to wrap
EuiMutationObserver
instead
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 conditional means the component only works if all child component mount operations are flushed to the DOM and ref callbacks are called before the componentDidMount
of this component is called. Is that always guaranteed to be the case?
We might be relying too much on the mounting behavior across multiple components here, which is not documented in that detail to my knowledge. For example, the behavior might change with lazy rendering in newer React version.
It also artificially restricts a capability the consumer might expect from a "normal" react component (i.e. the ability to change refs at any point during the lifecycle).
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.
Is that always guaranteed to be the case?
Yes, React provides that guarantee to support all DOM-related side effectives in didMount. You're right that lazy rendering could interfere here, but I think that goes back to if conditional rendering is required, it's trivial to wrap EuiMutationObserver instead.
It also artificially restricts a capability the consumer might expect from a "normal" react component (i.e. the ability to change refs at any point during the lifecycle).
The updateChildNode
method supports that ref changing at any point. This error simply enforces that ref being set on the first render pass.
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.
LGTM 👍
Summary
Closes #1261
Removes all uses of
ReactDOM.findDOMNode
from EUI.Breaking Changes
insert.sibling
valueNon-Breaking Changes
findDOMNode
Checklist
- [ ] This was checked in mobile- [ ] This was checked in dark mode- [ ] Any props added have proper autodocs- [ ] Documentation examples were added- [ ] This required updates to Framer X components