Bug: React 18 vs 19 callback refs

[telam]

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:

• React 18 Example
• React 19 Example

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.

[gaearon]

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

[telam]

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.

[Shonferns004]

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!