[Compiler Bug]: NaN in dependency list of useMemo always causes re-evaluation

[jugglingcats]

What kind of issue is this?

• React Compiler core (the JS output is incorrect, or your app works incorrectly after optimization)
• babel-plugin-react-compiler (build issue installing or using the Babel plugin)
• eslint-plugin-react-hooks (build issue installing or using the eslint plugin)
• react-compiler-healthcheck (build issue installing or using the healthcheck script)

Link to repro

https://playground.react.dev/#N4Igzg9grgTgxgUxALhASwLYAcIwC4AEASggIZx4A0BwBUYCJAZtfQgMp6l4IEC+BJjAgYCAchhkKYgDoA7eUyhyKaCHIIZSAawQB9GKTkATEQAoAlDXkFbBSXlgaAstwAWAOkMnzF+X3l5BAAPHHwCYwQmUigAG0IlFTw1FwBPAEEsLEtrDTsAenyCMEwsWN4wLh4CPAgCOBiGewQAWkkTBBgbOzh1SoIAbUruBGoGPE4RgF0CAF5iKTwPNkmeMwAGPwU820KagjQwAlJYgHdSVKOAOVIr4rQVCqreE-PLggA+efXu2165fqEebDapfAjrAgAfgINzuyHBgR2BD26liqUEaEkR3UiAIpzQeDc0EIvWwaHKXSR-36ADc5gtyEs2M4EBgIGYcrMPrk7LzkUVXhcjgBzBByTojI7i072IymURyKAYABGnQIvz5DicBzAsLMeCs0K0ugMct8BHhPyRfGoAzwUy2iN5e3xhPqIiw5LVYtIyvKxmodMOdCwxhGxgI6gIUjc9ViaDg2g1WpgGgAPMY0HT1ABheOJ2bATnc8arBBmOBzblwADUAEYLHwPgAJBCxWJ1ADquFixnhwBpAiKwBBCD4afymZpHwA3P55CBKCB-kw0MKUOhsLhCHhUlheLQAAqxKDCh4AeSwyT6-EEwlEYmVvrbLTKp4ebUWLVJnopk8OeBiHO2xmMA3SFD+5LcCkzgQJE8IyCAJyxIh-jFNBYCrggRzHu+ciXteAIWDOi7gESpwAJJyDwqYnGAKDRLEDB8EAA

Repro steps

See playground link. Click on the div to increment the counter and see that the memoised value changes even though the single dependency is always NaN.

The example is obviously contrived and perhaps you consider having NaN in a dependency list not valid/supported. However useMemo without the compiler handles this case and does not re-evaluate. This caused a subtle bug in my app when enabling the compiler.

Apologies if this is a duplicate, I looked but could not find similar.

How often does this bug happen?

Every time

What version of React are you using?

19.2.4

What version of React Compiler are you using?

1.0.0

[jugglingcats]

My actual scenario was a bit more subtle... the value in the dependency array was undefined, but the compiler split the memoised function "in two", and in the second half had:

	const t8 = teacher ? highlight : 23 - highlight; // evalutes to NaN since teacher=false and highlight=undefined
	let t9;
	if ($[24] !== active || $[25] !== currentPlay || $[26] !== enabled || $[27] !== itemId || $[28] !== send_update || $[29] !== t8 || $[30] !== teacher || $[31] !== xgid) {
            // always executes since $[29] !== t8 (NaN !== NaN)
        ...

[rjgotten]

If that's what the compiler produces, then you've found a genuine bug.
React describes equality comparison as using Object.is semantics.
And those are not the same as strict value equality semantics.

Object.is(NaN, NaN) // true
NaN === NaN // false

This is only one of several cases where behavior differs. So there will be others broken as well.
The compiler should generate code that uses Object.is and have compliant behavior.