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 Accessing element.ref was removed in React 19 #74334

Open
wants to merge 1 commit into
base: canary
Choose a base branch
from

Conversation

oliviertassinari
Copy link
Contributor

@oliviertassinari oliviertassinari commented Dec 27, 2024

See https://codesandbox.io/p/devbox/muddy-http-h3r423?file=%2Fpages%2Findex.tsx%3A14%2C1&workspaceId=ws_JTzKEPRDQXMzzhKd3x4aSM as a reproduction of the problem

import NextLink from "next/link";

const ref = { current: null };

export default function Index() {
  return (
    <div>
      <NextLink href="/bar" legacyBehavior>
        <a ref={ref}>Link fail</a>
      </NextLink>
    </div>
  );
}
SCR-20241227-tphm

Context #72873 (comment) doesn't look accurate. However, going to https://github.com/mui/material-ui/tree/master/examples/material-ui-nextjs-pages-router and opening the /about page is enough to reproduce the problem.

@ijjk
Copy link
Member

ijjk commented Dec 27, 2024

Allow CI Workflow Run

  • approve CI run for commit: a089535

Note: this should only be enabled once the PR is ready to go and can only be enabled by a maintainer

element: React.ReactElement
): React.Ref<any> | undefined {
// 'ref' is passed as prop in React 19, whereas 'ref' is directly attached to children in older versions
if (parseInt(React.version, 10) >= 19) {
Copy link
Contributor Author

@oliviertassinari oliviertassinari Dec 27, 2024

Choose a reason for hiding this comment

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

I wasn't sure how you guys want to check this, another option is:

Suggested change
if (parseInt(React.version, 10) >= 19) {
if ((element.props as any).propertyIsEnumerable('ref')) {

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Projects
None yet
Development

Successfully merging this pull request may close these issues.

2 participants