question-mark
Stuck on an issue?

Lightrun Answers was designed to reduce the constant googling that comes with debugging 3rd party libraries. It collects links to all the places you might be looking at while hunting down a tough bug.

And, if you’re still stuck at the end, we’re happy to hop on a call to see how we can help out.

Warning if React.forwardRef render function doesn't take exactly two arguments is confusing when more than 2 arguments

See original GitHub issue

Do you want to request a feature or report a bug?

A feature (an improvement)

What is the current behavior?

When defining more than two parameters for a React.forwardRef render function a warning message stating “forwardRef render functions accept two parameters: props and ref. Did you forget to use the ref parameter?” gets logged.

If the current behavior is a bug, please provide the steps to reproduce and if possible a minimal demo of the problem. Your bug will get fixed much faster if we can run your code and it doesn’t have dependencies other than React. Paste the link to your JSFiddle (https://jsfiddle.net/Luktwrdm/) or CodeSandbox (https://codesandbox.io/s/new) example below:

https://codesandbox.io/s/5v704qxvnx

What is the expected behavior?

Option 1

Overall the message could be more explicit on accepting exactly two parameters. Also, when the arity is greater than 2 the second part of the message may be omitted. For instance:

"“forwardRef render functions accept exactly two parameters: props and ref”

Option 2

If defining more than 2 arguments to the function is ok, which may be the case since the real goal for this warning is just to make sure people use the ref parameter, I think the message could not be shown for arity > 2, therefore chaging the condition of === 2 to > 1.

Which versions of React, and which browser / OS are affected by this issue? Did this work in previous versions of React?

16.5.0 which is the one that includes this new warning

Issue Analytics

  • State:closed
  • Created 5 years ago
  • Comments:13 (5 by maintainers)

github_iconTop GitHub Comments

13reactions
sachbazjancommented, Nov 11, 2021

This warning is still visible in react 17.0.1

5reactions
gaearoncommented, Sep 12, 2018

Happy to take a PR for “option 1”.

The purpose of accepting more arguments is not clear to me because they’d never get filled in.

Read more comments on GitHub >

github_iconTop Results From Across the Web

The argument function of React.forwardRef ... - Rule | DeepScan
This rule applies when the argument function of React.forwardRef() does not use its second ref parameter. The purpose of applying React.
Read more >
props and ref. Did you forget to use the ref parameter?native ...
Warning : forwardRef render functions accept exactly two parameters: props and ref. Did you forget to use the ref parameter?native base · Ask ......
Read more >
forwardRef render functions accept exactly two parameters ...
A create-react-app project based on react and react-dom.
Read more >
How to use React's forwardRef function | Felix Gerschau
forwardRef is a helper function from React that allows us to forward a component's ref to another one. This tutorial will teach what...
Read more >
Forwarding Refs - React
The second ref argument only exists when you define a component with React.forwardRef call. Regular function or class components don't receive the ref...
Read more >

github_iconTop Related Medium Post

No results found

github_iconTop Related StackOverflow Question

No results found

github_iconTroubleshoot Live Code

Lightrun enables developers to add logs, metrics and snapshots to live code - no restarts or redeploys required.
Start Free

github_iconTop Related Reddit Thread

No results found

github_iconTop Related Hackernoon Post

No results found

github_iconTop Related Tweet

No results found

github_iconTop Related Dev.to Post

No results found

github_iconTop Related Hashnode Post

No results found