react icon indicating copy to clipboard operation
react copied to clipboard

Bug: React 18 vs 19 callback refs

Open telam opened this issue 5 months ago • 6 comments

I'm not entirely sure if this is a bug with React or expected behavior in React 18 vs 19. However, this is something I noticed while I was implementing a custom hook for an IntersectionObserver, and my useEffect was called twice, but my callback ref wasn't in StrictMode. I have created minimal code examples in codesandbox that reproduce the issue I'm seeing. I have viewed the following React documentation pages:

  • https://react.dev/reference/react/StrictMode#fixing-bugs-found-by-re-running-ref-callbacks-in-development
  • https://18.react.dev/reference/react/StrictMode#fixing-bugs-found-by-re-running-effects-in-development
  • https://18.react.dev/learn/manipulating-the-dom-with-refs#how-to-manage-a-list-of-refs-using-a-ref-callback

Note, there is no mention of callback refs and how they behave in strict mode in React 18's docs that I could find, but perhaps I missed it.

React version: 18.3.1 and 19.1.1

Steps To Reproduce

  1. Reload the page
  2. View the console and see the difference in what's logged in 18 vs 19

Link to code examples:

Note: I used the default TypeScript sandboxes from codesandbox

The current behavior

The callback ref used in React 18 is not called three times in StrictMode.

The expected behavior

It should display the same output as React 19, where the node is a HTMLDivElement, null, and then HTMLDivElement again.

telam avatar Jul 31 '25 15:07 telam

https://codesandbox.io/p/sandbox/react19-strict-mode-test-4cdw34 says sandbox not found

gaearon avatar Aug 01 '25 00:08 gaearon

https://codesandbox.io/p/sandbox/react19-strict-mode-test-4cdw34 says sandbox not found

Sorry about that, I accidentally left that as private. They should both be accessible now.

telam avatar Aug 01 '25 13:08 telam

Hello! 👋 I came across issue and would love to work on this. I’ve set up the repo locally and started digging into it.

Just wanted to check in before starting — is anyone already working on this? If not, I’d love to take it up.

Thanks!

Shonferns004 avatar Aug 05 '25 06:08 Shonferns004

https://codesandbox.io/p/sandbox/react19-strict-mode-test-4cdw34 says sandbox not found

@gaearon I have fixed the link. Hopefully I didn't miss anything. Thanks for looking into this!

telam avatar Aug 11 '25 18:08 telam

@gaearon Just pinging this issue again to see if it's legitimate or not.

telam avatar Sep 02 '25 13:09 telam

This issue has been automatically marked as stale. If this issue is still affecting you, please leave any comment (for example, "bump"), and we'll keep it open. We are sorry that we haven't been able to prioritize it yet. If you have any new additional information, please include it with your comment!

github-actions[bot] avatar Dec 01 '25 17:12 github-actions[bot]