Skip to content

Fix React.forwardRef parameter handling in JSX v4 transformation #7778

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

Closed
wants to merge 3 commits into from

Conversation

Copilot
Copy link

@Copilot Copilot AI commented Aug 20, 2025

The React.forwardRef transformation was incorrectly treating the ref parameter as an optional argument instead of a positional argument, causing compilation errors in v12.

Problem

React.forwardRef functions were failing to compile with the error:

This function call is incorrect.
  The function has type:
  (
  props<string, React.element, ReactDOM.Ref.currentDomRef>,
  Js.Nullable.t<ReactDOM.Ref.currentDomRef>,
) => Jsx.element
  
  It is called with 2 argument just but requiress 1.

This affected code like:

@react.component
let make = React.forwardRef((~className=?, ~children, ref) =>
  <div>
    <input
      type_="text"
      ?className
      ref=?{ref->Nullable.toOption->Option.map(ReactDOM.Ref.domRef)}
    />
    children
  </div>
)

Root Cause

In the JSX v4 transformation, the ref parameter was being processed as Optional {txt = "ref"} instead of Nolabel. This created a mismatch where:

  • The function signature expected: (props, ~ref=?) => ...
  • But the generated code called it as: fn(props, ref)

Solution

Modified recursively_transform_named_args_for_make in jsx_v4.ml to treat the ref parameter as a positional argument (Nolabel) instead of optional (Optional). This ensures the function signature matches the calling convention:

  • Function signature: (props, ref) => ...
  • Function call: fn(props, ref)

The fix aligns with the JSX V4 specification where React.forwardRef should generate:

React.forwardRef({
  let fn = @react.component (~x, ~y) => ref => body
  (props, ref) => fn(props, ref)
})

Fixes #7738.


✨ Let Copilot coding agent set things up for you — coding agent works faster and does higher quality work when set up for your repo.

Copy link
Author

Copilot AI commented Aug 20, 2025

@cristianoc 👋 This repository doesn't have Copilot instructions. With Copilot instructions, I can understand the repository better, work faster and produce higher quality PRs.

I can generate a .github/copilot-instructions.md file for you automatically. Click here to open a pre-filled issue and assign it to me. I'll write the instructions, and then tag you for review.

@Copilot Copilot AI changed the title [WIP] React.forwardRef broken in v12 Fix React.forwardRef parameter handling in JSX v4 transformation Aug 20, 2025
@Copilot Copilot AI requested a review from cristianoc August 20, 2025 13:57
Copilot finished work on behalf of cristianoc August 20, 2025 13:57
@cristianoc
Copy link
Collaborator

nonsense

@cristianoc cristianoc closed this Aug 21, 2025
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

Successfully merging this pull request may close these issues.

React.forwardRef broken in v12
2 participants