[Planning] Onyx break forwardRef flow.

If you haven’t already, check out our contributing guidelines for onboarding and email [e-mail] to request to join our Slack channel!

---

Due to we stop rendering of the WrappedComponent until Onyx is ready to pass the props. It breaks the ForwardRef flow. Usually, Ref should be available in componentDidMount of the Parent component. But this is not the case in our App. If we use WithOnyx and ref is not available in the parent component’s componentDidMount.

Although this is against the best practice of React, I think we can’t solve this problem but I want to discuss the best approach to mitigate this.

Code Example:

Check the ReportActionMessageEdit.js component. TextInput Ref is not available in componentDidMount. Try removing withOnyx subscription in the TextInputFocusable.js and recheck.

Platform:

Where is this issue occurring?

Web ✔️ iOS ✔️ Android ✔️ Desktop App ✔️ Mobile Web ✔️

Version Number: Logs: https://stackoverflow.com/c/expensify/questions/4856 Notes/Photos/Videos: Any additional supporting documentation Expensify/Expensify Issue URL:

View all open jobs on Upwork

[marcaaron]

Gonna close this as it’s not actionable right now. I feel like this could be a valuable problem to solve, but only if we are running into trouble where a withOnyx wrapped component needs to access a ref.

Even in that case, it might worth lifting the withOnyx wrapper higher in the chain if possible.

[parasharrajat]

I agree this is more of a planning issue thus I not proposing to solve it. I would raise this on Slack to see if I get anything out of it and decide to close accordingly.