Skip to content
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

Fix unrecognised forwardedRef prop #8570

Merged
merged 2 commits into from
Aug 7, 2018

Conversation

noisysocks
Copy link
Member

Description

Fixes a warning I noticed while testing #8556.

withGlobalEvents was setting forwardedRef on the wrapped component, which caused an Unrecognised forwardedRef prop React warning in FocusableIframe.

Also corrects some incorrect indentation in some embedded JavaScript.

How has this been tested?

  1. Click to add a new block
  2. Select Custom HTML block
  3. Click Preview button

No errors or warnings should appear in the console.

@noisysocks noisysocks added [Type] Code Quality Issues or PRs that relate to code quality [Type] Bug An existing feature does not function as intended labels Aug 6, 2018
@gziolo gziolo requested review from aduth and nerrad August 6, 2018 05:42
Copy link
Contributor

@nerrad nerrad left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

I think it might be better to remove the forwardedRef prop on any leaf components rather than in the HOC.

return <WrappedComponent { ...this.props } ref={ this.handleRef } />;
return (
<WrappedComponent
{ ...omit( this.props, [ 'forwardedRef' ] ) }
Copy link
Member

@aduth aduth Aug 6, 2018

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Performance-wise, we could probably benefit by just passing the original props as a standalone prop value from within forwardRef, rather than iterating the props object to remove forwardedRef on every render.

 		return forwardRef( ( props, ref ) => {
 			return <Wrapper ownProps={ props } forwardedRef={ ref } />;
 		} );

For example, we do this with withSelect:

Copy link
Member Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Good suggestion! I've updated the PR.

@aduth
Copy link
Member

aduth commented Aug 6, 2018

I think it might be better to remove the forwardedRef prop on any leaf components rather than in the HOC.

How would this be implemented?

@nerrad
Copy link
Contributor

nerrad commented Aug 6, 2018

How would this be implemented?

Your suggestion here: #8570 (review) would make my suggestion moot :).

@noisysocks noisysocks force-pushed the fix/unrecognised-forwardedRef-prop branch from 9078205 to d9b7032 Compare August 7, 2018 00:20
Have `withGlobalEvents` omit the `forwardedRef` prop. This prevents the
prop being added to HTML in some cases, e.g. when used in
`FocusableIframe`.
@noisysocks noisysocks force-pushed the fix/unrecognised-forwardedRef-prop branch from d9b7032 to 13dcbda Compare August 7, 2018 00:21
Copy link
Member

@aduth aduth left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

👍

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
[Type] Bug An existing feature does not function as intended [Type] Code Quality Issues or PRs that relate to code quality
Projects
None yet
Development

Successfully merging this pull request may close these issues.

3 participants