From 179197a22a0c00bc30c1a44275e7b4b1b2cec019 Mon Sep 17 00:00:00 2001
From: Mike Vitousek <mmvitousek@gmail.com>
Date: Wed, 14 Aug 2024 13:54:38 -0400
Subject: [PATCH] [compiler] Allow different dependencies from explicit
 memoization when dependency is a ref

Summary:
In theory, as I understand it, the result of a useRef will never change between renders, because we'll always provide the same ref value consistently. That means that memoization that depends on a ref value will never re-compute, so I think we could not infer it as a dependency in Forget. This diff, however, doesn't do that: it instead allows the validatePreserveExistingMemoizationGuarantees analysis to admit mismatches between explicit dependencies and implicit ones when the implicit dependency is a ref that doesn't exist in source.

ghstack-source-id: 685d859d1eed5d1e19dbbbfadc75be3875ddb6ea
Pull Request resolved: https://github.com/facebook/react/pull/30679
---
 .../src/HIR/HIR.ts                            |  7 ++-
 ...-callback-passed-to-jsx-indirect.expect.md | 53 +++++-------------
 ...ng-ref-in-callback-passed-to-jsx.expect.md | 34 +++--------
 ...-callback-passed-to-jsx-indirect.expect.md | 53 +++++-------------
 ...operty-in-callback-passed-to-jsx.expect.md | 34 +++--------
 .../allow-passing-refs-as-props.expect.md     |  9 ++-
 ...ow-ref-access-in-effect-indirect.expect.md | 37 ++++++------
 .../allow-ref-access-in-effect.expect.md      |  9 ++-
 ...access-in-unused-callback-nested.expect.md |  9 ++-
 .../capture-ref-for-later-mutation.expect.md  | 45 +++++++--------
 ...ve-use-memo-ref-missing-reactive.expect.md | 48 ++++++++++++++++
 ....preserve-use-memo-ref-missing-reactive.ts | 19 +++++++
 ...preserve-use-memo-ref-missing-ok.expect.md | 56 +++++++++++++++++++
 .../preserve-use-memo-ref-missing-ok.ts       | 17 ++++++
 .../compiler/react-namespace.expect.md        | 11 ++--
 ...-current-aliased-no-added-to-dep.expect.md | 17 ++----
 ...f-current-field-not-added-to-dep.expect.md | 17 ++----
 ...ent-field-write-not-added-to-dep.expect.md | 17 ++----
 .../ref-current-not-added-to-dep.expect.md    | 17 ++----
 ...t-optional-field-no-added-to-dep.expect.md | 17 ++----
 ...f-current-write-not-added-to-dep.expect.md | 17 ++----
 .../fixtures/compiler/ref-in-effect.expect.md |  9 ++-
 .../ref-like-name-in-useCallback-2.expect.md  |  9 ++-
 .../ref-like-name-in-useCallback.expect.md    |  9 ++-
 ...ng-same-ref-preserve-memoization.expect.md | 10 ++--
 ...ed-property-preserve-memoization.expect.md |  9 ++-
 ...Callback-set-ref-nested-property.expect.md |  9 ++-
 ...-value-dont-preserve-memoization.expect.md |  9 ++-
 ...t-ref-value-preserve-memoization.expect.md |  9 ++-
 29 files changed, 306 insertions(+), 310 deletions(-)
 create mode 100644 compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/preserve-memo-validation/error.preserve-use-memo-ref-missing-reactive.expect.md
 create mode 100644 compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/preserve-memo-validation/error.preserve-use-memo-ref-missing-reactive.ts
 create mode 100644 compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/preserve-memo-validation/preserve-use-memo-ref-missing-ok.expect.md
 create mode 100644 compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/preserve-memo-validation/preserve-use-memo-ref-missing-ok.ts

diff --git a/compiler/packages/babel-plugin-react-compiler/src/HIR/HIR.ts b/compiler/packages/babel-plugin-react-compiler/src/HIR/HIR.ts
index 1e807d6d2a5d0..84671712e9305 100644
--- a/compiler/packages/babel-plugin-react-compiler/src/HIR/HIR.ts
+++ b/compiler/packages/babel-plugin-react-compiler/src/HIR/HIR.ts
@@ -1616,7 +1616,12 @@ export function isDispatcherType(id: Identifier): boolean {
 }
 
 export function isStableType(id: Identifier): boolean {
-  return isSetStateType(id) || isSetActionStateType(id) || isDispatcherType(id);
+  return (
+    isSetStateType(id) ||
+    isSetActionStateType(id) ||
+    isDispatcherType(id) ||
+    isUseRefType(id)
+  );
 }
 
 export function isUseEffectHookType(id: Identifier): boolean {
diff --git a/compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/allow-mutating-ref-in-callback-passed-to-jsx-indirect.expect.md b/compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/allow-mutating-ref-in-callback-passed-to-jsx-indirect.expect.md
index 7e6dcaff76d10..70320c376274a 100644
--- a/compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/allow-mutating-ref-in-callback-passed-to-jsx-indirect.expect.md
+++ b/compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/allow-mutating-ref-in-callback-passed-to-jsx-indirect.expect.md
@@ -40,62 +40,37 @@ import { c as _c } from "react/compiler-runtime"; // @validateRefAccessDuringRen
 import { useRef } from "react";
 
 function Component() {
-  const $ = _c(10);
+  const $ = _c(2);
   const ref = useRef(null);
   let t0;
   if ($[0] === Symbol.for("react.memo_cache_sentinel")) {
-    t0 = () => {
+    const setRef = () => {
       if (ref.current !== null) {
         ref.current = "";
       }
     };
+
+    t0 = () => {
+      setRef();
+    };
     $[0] = t0;
   } else {
     t0 = $[0];
   }
-  const setRef = t0;
+  const onClick = t0;
   let t1;
-  if ($[1] !== setRef) {
-    t1 = () => {
-      setRef();
-    };
-    $[1] = setRef;
-    $[2] = t1;
-  } else {
-    t1 = $[2];
-  }
-  const onClick = t1;
-  let t2;
-  if ($[3] !== ref) {
-    t2 = <input ref={ref} />;
-    $[3] = ref;
-    $[4] = t2;
-  } else {
-    t2 = $[4];
-  }
-  let t3;
-  if ($[5] !== onClick) {
-    t3 = <button onClick={onClick} />;
-    $[5] = onClick;
-    $[6] = t3;
-  } else {
-    t3 = $[6];
-  }
-  let t4;
-  if ($[7] !== t2 || $[8] !== t3) {
-    t4 = (
+  if ($[1] === Symbol.for("react.memo_cache_sentinel")) {
+    t1 = (
       <>
-        {t2}
-        {t3}
+        <input ref={ref} />
+        <button onClick={onClick} />
       </>
     );
-    $[7] = t2;
-    $[8] = t3;
-    $[9] = t4;
+    $[1] = t1;
   } else {
-    t4 = $[9];
+    t1 = $[1];
   }
-  return t4;
+  return t1;
 }
 
 export const FIXTURE_ENTRYPOINT = {
diff --git a/compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/allow-mutating-ref-in-callback-passed-to-jsx.expect.md b/compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/allow-mutating-ref-in-callback-passed-to-jsx.expect.md
index e28de25bf45f7..3b65ecfb8d1a7 100644
--- a/compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/allow-mutating-ref-in-callback-passed-to-jsx.expect.md
+++ b/compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/allow-mutating-ref-in-callback-passed-to-jsx.expect.md
@@ -36,7 +36,7 @@ import { c as _c } from "react/compiler-runtime"; // @validateRefAccessDuringRen
 import { useRef } from "react";
 
 function Component() {
-  const $ = _c(8);
+  const $ = _c(2);
   const ref = useRef(null);
   let t0;
   if ($[0] === Symbol.for("react.memo_cache_sentinel")) {
@@ -51,36 +51,18 @@ function Component() {
   }
   const onClick = t0;
   let t1;
-  if ($[1] !== ref) {
-    t1 = <input ref={ref} />;
-    $[1] = ref;
-    $[2] = t1;
-  } else {
-    t1 = $[2];
-  }
-  let t2;
-  if ($[3] !== onClick) {
-    t2 = <button onClick={onClick} />;
-    $[3] = onClick;
-    $[4] = t2;
-  } else {
-    t2 = $[4];
-  }
-  let t3;
-  if ($[5] !== t1 || $[6] !== t2) {
-    t3 = (
+  if ($[1] === Symbol.for("react.memo_cache_sentinel")) {
+    t1 = (
       <>
-        {t1}
-        {t2}
+        <input ref={ref} />
+        <button onClick={onClick} />
       </>
     );
-    $[5] = t1;
-    $[6] = t2;
-    $[7] = t3;
+    $[1] = t1;
   } else {
-    t3 = $[7];
+    t1 = $[1];
   }
-  return t3;
+  return t1;
 }
 
 export const FIXTURE_ENTRYPOINT = {
diff --git a/compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/allow-mutating-ref-property-in-callback-passed-to-jsx-indirect.expect.md b/compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/allow-mutating-ref-property-in-callback-passed-to-jsx-indirect.expect.md
index d2ca8ec592d96..4c979728f685c 100644
--- a/compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/allow-mutating-ref-property-in-callback-passed-to-jsx-indirect.expect.md
+++ b/compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/allow-mutating-ref-property-in-callback-passed-to-jsx-indirect.expect.md
@@ -40,62 +40,37 @@ import { c as _c } from "react/compiler-runtime"; // @validateRefAccessDuringRen
 import { useRef } from "react";
 
 function Component() {
-  const $ = _c(10);
+  const $ = _c(2);
   const ref = useRef(null);
   let t0;
   if ($[0] === Symbol.for("react.memo_cache_sentinel")) {
-    t0 = () => {
+    const setRef = () => {
       if (ref.current !== null) {
         ref.current.value = "";
       }
     };
+
+    t0 = () => {
+      setRef();
+    };
     $[0] = t0;
   } else {
     t0 = $[0];
   }
-  const setRef = t0;
+  const onClick = t0;
   let t1;
-  if ($[1] !== setRef) {
-    t1 = () => {
-      setRef();
-    };
-    $[1] = setRef;
-    $[2] = t1;
-  } else {
-    t1 = $[2];
-  }
-  const onClick = t1;
-  let t2;
-  if ($[3] !== ref) {
-    t2 = <input ref={ref} />;
-    $[3] = ref;
-    $[4] = t2;
-  } else {
-    t2 = $[4];
-  }
-  let t3;
-  if ($[5] !== onClick) {
-    t3 = <button onClick={onClick} />;
-    $[5] = onClick;
-    $[6] = t3;
-  } else {
-    t3 = $[6];
-  }
-  let t4;
-  if ($[7] !== t2 || $[8] !== t3) {
-    t4 = (
+  if ($[1] === Symbol.for("react.memo_cache_sentinel")) {
+    t1 = (
       <>
-        {t2}
-        {t3}
+        <input ref={ref} />
+        <button onClick={onClick} />
       </>
     );
-    $[7] = t2;
-    $[8] = t3;
-    $[9] = t4;
+    $[1] = t1;
   } else {
-    t4 = $[9];
+    t1 = $[1];
   }
-  return t4;
+  return t1;
 }
 
 export const FIXTURE_ENTRYPOINT = {
diff --git a/compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/allow-mutating-ref-property-in-callback-passed-to-jsx.expect.md b/compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/allow-mutating-ref-property-in-callback-passed-to-jsx.expect.md
index 17639b213994f..0d8ac787e5c86 100644
--- a/compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/allow-mutating-ref-property-in-callback-passed-to-jsx.expect.md
+++ b/compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/allow-mutating-ref-property-in-callback-passed-to-jsx.expect.md
@@ -36,7 +36,7 @@ import { c as _c } from "react/compiler-runtime"; // @validateRefAccessDuringRen
 import { useRef } from "react";
 
 function Component() {
-  const $ = _c(8);
+  const $ = _c(2);
   const ref = useRef(null);
   let t0;
   if ($[0] === Symbol.for("react.memo_cache_sentinel")) {
@@ -51,36 +51,18 @@ function Component() {
   }
   const onClick = t0;
   let t1;
-  if ($[1] !== ref) {
-    t1 = <input ref={ref} />;
-    $[1] = ref;
-    $[2] = t1;
-  } else {
-    t1 = $[2];
-  }
-  let t2;
-  if ($[3] !== onClick) {
-    t2 = <button onClick={onClick} />;
-    $[3] = onClick;
-    $[4] = t2;
-  } else {
-    t2 = $[4];
-  }
-  let t3;
-  if ($[5] !== t1 || $[6] !== t2) {
-    t3 = (
+  if ($[1] === Symbol.for("react.memo_cache_sentinel")) {
+    t1 = (
       <>
-        {t1}
-        {t2}
+        <input ref={ref} />
+        <button onClick={onClick} />
       </>
     );
-    $[5] = t1;
-    $[6] = t2;
-    $[7] = t3;
+    $[1] = t1;
   } else {
-    t3 = $[7];
+    t1 = $[1];
   }
-  return t3;
+  return t1;
 }
 
 export const FIXTURE_ENTRYPOINT = {
diff --git a/compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/allow-passing-refs-as-props.expect.md b/compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/allow-passing-refs-as-props.expect.md
index 5c39260976128..7ec38df94be7f 100644
--- a/compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/allow-passing-refs-as-props.expect.md
+++ b/compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/allow-passing-refs-as-props.expect.md
@@ -14,15 +14,14 @@ function Component(props) {
 ```javascript
 import { c as _c } from "react/compiler-runtime";
 function Component(props) {
-  const $ = _c(2);
+  const $ = _c(1);
   const ref = useRef(null);
   let t0;
-  if ($[0] !== ref) {
+  if ($[0] === Symbol.for("react.memo_cache_sentinel")) {
     t0 = <Foo ref={ref} />;
-    $[0] = ref;
-    $[1] = t0;
+    $[0] = t0;
   } else {
-    t0 = $[1];
+    t0 = $[0];
   }
   return t0;
 }
diff --git a/compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/allow-ref-access-in-effect-indirect.expect.md b/compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/allow-ref-access-in-effect-indirect.expect.md
index e8ed54ef262e6..7c1f5ad3727b8 100644
--- a/compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/allow-ref-access-in-effect-indirect.expect.md
+++ b/compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/allow-ref-access-in-effect-indirect.expect.md
@@ -46,7 +46,7 @@ import { c as _c } from "react/compiler-runtime"; // @validateRefAccessDuringRen
 import { useCallback, useEffect, useRef, useState } from "react";
 
 function Component() {
-  const $ = _c(9);
+  const $ = _c(7);
   const ref = useRef(null);
   const [state, setState] = useState(false);
   let t0;
@@ -60,47 +60,42 @@ function Component() {
   }
   const setRef = t0;
   let t1;
-  if ($[1] !== setRef) {
+  let t2;
+  if ($[1] === Symbol.for("react.memo_cache_sentinel")) {
     t1 = () => {
       setRef();
     };
-    $[1] = setRef;
-    $[2] = t1;
-  } else {
-    t1 = $[2];
-  }
-  let t2;
-  if ($[3] === Symbol.for("react.memo_cache_sentinel")) {
     t2 = [];
-    $[3] = t2;
+    $[1] = t1;
+    $[2] = t2;
   } else {
-    t2 = $[3];
+    t1 = $[1];
+    t2 = $[2];
   }
   useEffect(t1, t2);
   let t3;
   let t4;
-  if ($[4] === Symbol.for("react.memo_cache_sentinel")) {
+  if ($[3] === Symbol.for("react.memo_cache_sentinel")) {
     t3 = () => {
       setState(true);
     };
     t4 = [];
-    $[4] = t3;
-    $[5] = t4;
+    $[3] = t3;
+    $[4] = t4;
   } else {
-    t3 = $[4];
-    t4 = $[5];
+    t3 = $[3];
+    t4 = $[4];
   }
   useEffect(t3, t4);
 
   const t5 = String(state);
   let t6;
-  if ($[6] !== t5 || $[7] !== ref) {
+  if ($[5] !== t5) {
     t6 = <Child key={t5} ref={ref} />;
-    $[6] = t5;
-    $[7] = ref;
-    $[8] = t6;
+    $[5] = t5;
+    $[6] = t6;
   } else {
-    t6 = $[8];
+    t6 = $[6];
   }
   return t6;
 }
diff --git a/compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/allow-ref-access-in-effect.expect.md b/compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/allow-ref-access-in-effect.expect.md
index 7df88ea8f16f5..3bdf358611db6 100644
--- a/compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/allow-ref-access-in-effect.expect.md
+++ b/compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/allow-ref-access-in-effect.expect.md
@@ -42,7 +42,7 @@ import { c as _c } from "react/compiler-runtime"; // @validateRefAccessDuringRen
 import { useEffect, useRef, useState } from "react";
 
 function Component() {
-  const $ = _c(7);
+  const $ = _c(6);
   const ref = useRef(null);
   const [state, setState] = useState(false);
   let t0;
@@ -76,13 +76,12 @@ function Component() {
 
   const t4 = String(state);
   let t5;
-  if ($[4] !== t4 || $[5] !== ref) {
+  if ($[4] !== t4) {
     t5 = <Child key={t4} ref={ref} />;
     $[4] = t4;
-    $[5] = ref;
-    $[6] = t5;
+    $[5] = t5;
   } else {
-    t5 = $[6];
+    t5 = $[5];
   }
   return t5;
 }
diff --git a/compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/allow-ref-access-in-unused-callback-nested.expect.md b/compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/allow-ref-access-in-unused-callback-nested.expect.md
index b992886f65e72..37a510b8c290a 100644
--- a/compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/allow-ref-access-in-unused-callback-nested.expect.md
+++ b/compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/allow-ref-access-in-unused-callback-nested.expect.md
@@ -44,7 +44,7 @@ import { c as _c } from "react/compiler-runtime"; // @validateRefAccessDuringRen
 import { useEffect, useRef, useState } from "react";
 
 function Component() {
-  const $ = _c(7);
+  const $ = _c(6);
   const ref = useRef(null);
   const [state, setState] = useState(false);
   let t0;
@@ -77,13 +77,12 @@ function Component() {
 
   const t4 = String(state);
   let t5;
-  if ($[4] !== t4 || $[5] !== ref) {
+  if ($[4] !== t4) {
     t5 = <Child key={t4} ref={ref} />;
     $[4] = t4;
-    $[5] = ref;
-    $[6] = t5;
+    $[5] = t5;
   } else {
-    t5 = $[6];
+    t5 = $[5];
   }
   return t5;
 }
diff --git a/compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/original-reactive-scopes-fork/capture-ref-for-later-mutation.expect.md b/compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/original-reactive-scopes-fork/capture-ref-for-later-mutation.expect.md
index 0ed1de559a1cb..52cea4b047c05 100644
--- a/compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/original-reactive-scopes-fork/capture-ref-for-later-mutation.expect.md
+++ b/compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/original-reactive-scopes-fork/capture-ref-for-later-mutation.expect.md
@@ -37,45 +37,42 @@ import { useRef } from "react";
 import { addOne } from "shared-runtime";
 
 function useKeyCommand() {
-  const $ = _c(7);
+  const $ = _c(6);
   const currentPosition = useRef(0);
   const handleKey = (direction) => () => {
     const position = currentPosition.current;
     const nextPosition = direction === "left" ? addOne(position) : position;
     currentPosition.current = nextPosition;
   };
-
-  const t0 = handleKey("left");
-  let t1;
-  if ($[0] !== t0) {
-    t1 = { handler: t0 };
+  let t0;
+  if ($[0] === Symbol.for("react.memo_cache_sentinel")) {
+    t0 = { handler: handleKey("left") };
     $[0] = t0;
-    $[1] = t1;
   } else {
-    t1 = $[1];
+    t0 = $[0];
   }
-  const moveLeft = t1;
+  const moveLeft = t0;
 
-  const t2 = handleKey("right");
-  let t3;
-  if ($[2] !== t2) {
-    t3 = { handler: t2 };
+  const t1 = handleKey("right");
+  let t2;
+  if ($[1] !== t1) {
+    t2 = { handler: t1 };
+    $[1] = t1;
     $[2] = t2;
-    $[3] = t3;
   } else {
-    t3 = $[3];
+    t2 = $[2];
   }
-  const moveRight = t3;
-  let t4;
-  if ($[4] !== moveLeft || $[5] !== moveRight) {
-    t4 = [moveLeft, moveRight];
-    $[4] = moveLeft;
-    $[5] = moveRight;
-    $[6] = t4;
+  const moveRight = t2;
+  let t3;
+  if ($[3] !== moveLeft || $[4] !== moveRight) {
+    t3 = [moveLeft, moveRight];
+    $[3] = moveLeft;
+    $[4] = moveRight;
+    $[5] = t3;
   } else {
-    t4 = $[6];
+    t3 = $[5];
   }
-  return t4;
+  return t3;
 }
 
 export const FIXTURE_ENTRYPOINT = {
diff --git a/compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/preserve-memo-validation/error.preserve-use-memo-ref-missing-reactive.expect.md b/compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/preserve-memo-validation/error.preserve-use-memo-ref-missing-reactive.expect.md
new file mode 100644
index 0000000000000..e639a34732226
--- /dev/null
+++ b/compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/preserve-memo-validation/error.preserve-use-memo-ref-missing-reactive.expect.md
@@ -0,0 +1,48 @@
+
+## Input
+
+```javascript
+// @validatePreserveExistingMemoizationGuarantees
+import {useCallback, useRef} from 'react';
+
+function useFoo({cond}) {
+  const ref1 = useRef<undefined | (() => undefined)>();
+  const ref2 = useRef<undefined | (() => undefined)>();
+  const ref = cond ? ref1 : ref2;
+
+  return useCallback(() => {
+    if (ref != null) {
+      ref.current();
+    }
+  }, []);
+}
+
+export const FIXTURE_ENTRYPOINT = {
+  fn: useFoo,
+  params: [],
+};
+
+```
+
+
+## Error
+
+```
+   7 |   const ref = cond ? ref1 : ref2;
+   8 |
+>  9 |   return useCallback(() => {
+     |                      ^^^^^^^
+> 10 |     if (ref != null) {
+     | ^^^^^^^^^^^^^^^^^^^^^^
+> 11 |       ref.current();
+     | ^^^^^^^^^^^^^^^^^^^^^^
+> 12 |     }
+     | ^^^^^^^^^^^^^^^^^^^^^^
+> 13 |   }, []);
+     | ^^^^ CannotPreserveMemoization: React Compiler has skipped optimizing this component because the existing manual memoization could not be preserved. The inferred dependencies did not match the manually specified dependencies, which could cause the value to change more or less frequently than expected (9:13)
+  14 | }
+  15 |
+  16 | export const FIXTURE_ENTRYPOINT = {
+```
+          
+      
\ No newline at end of file
diff --git a/compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/preserve-memo-validation/error.preserve-use-memo-ref-missing-reactive.ts b/compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/preserve-memo-validation/error.preserve-use-memo-ref-missing-reactive.ts
new file mode 100644
index 0000000000000..8238e1b74d0e2
--- /dev/null
+++ b/compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/preserve-memo-validation/error.preserve-use-memo-ref-missing-reactive.ts
@@ -0,0 +1,19 @@
+// @validatePreserveExistingMemoizationGuarantees
+import {useCallback, useRef} from 'react';
+
+function useFoo({cond}) {
+  const ref1 = useRef<undefined | (() => undefined)>();
+  const ref2 = useRef<undefined | (() => undefined)>();
+  const ref = cond ? ref1 : ref2;
+
+  return useCallback(() => {
+    if (ref != null) {
+      ref.current();
+    }
+  }, []);
+}
+
+export const FIXTURE_ENTRYPOINT = {
+  fn: useFoo,
+  params: [],
+};
diff --git a/compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/preserve-memo-validation/preserve-use-memo-ref-missing-ok.expect.md b/compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/preserve-memo-validation/preserve-use-memo-ref-missing-ok.expect.md
new file mode 100644
index 0000000000000..3625e2a6237d3
--- /dev/null
+++ b/compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/preserve-memo-validation/preserve-use-memo-ref-missing-ok.expect.md
@@ -0,0 +1,56 @@
+
+## Input
+
+```javascript
+// @validatePreserveExistingMemoizationGuarantees
+import {useCallback, useRef} from 'react';
+
+function useFoo() {
+  const ref = useRef<undefined | (() => undefined)>();
+
+  return useCallback(() => {
+    if (ref != null) {
+      ref.current();
+    }
+  }, []);
+}
+
+export const FIXTURE_ENTRYPOINT = {
+  fn: useFoo,
+  params: [],
+};
+
+```
+
+## Code
+
+```javascript
+import { c as _c } from "react/compiler-runtime"; // @validatePreserveExistingMemoizationGuarantees
+import { useCallback, useRef } from "react";
+
+function useFoo() {
+  const $ = _c(1);
+  const ref = useRef();
+  let t0;
+  if ($[0] === Symbol.for("react.memo_cache_sentinel")) {
+    t0 = () => {
+      if (ref != null) {
+        ref.current();
+      }
+    };
+    $[0] = t0;
+  } else {
+    t0 = $[0];
+  }
+  return t0;
+}
+
+export const FIXTURE_ENTRYPOINT = {
+  fn: useFoo,
+  params: [],
+};
+
+```
+      
+### Eval output
+(kind: ok) "[[ function params=0 ]]"
\ No newline at end of file
diff --git a/compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/preserve-memo-validation/preserve-use-memo-ref-missing-ok.ts b/compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/preserve-memo-validation/preserve-use-memo-ref-missing-ok.ts
new file mode 100644
index 0000000000000..92175ce5bba67
--- /dev/null
+++ b/compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/preserve-memo-validation/preserve-use-memo-ref-missing-ok.ts
@@ -0,0 +1,17 @@
+// @validatePreserveExistingMemoizationGuarantees
+import {useCallback, useRef} from 'react';
+
+function useFoo() {
+  const ref = useRef<undefined | (() => undefined)>();
+
+  return useCallback(() => {
+    if (ref != null) {
+      ref.current();
+    }
+  }, []);
+}
+
+export const FIXTURE_ENTRYPOINT = {
+  fn: useFoo,
+  params: [],
+};
diff --git a/compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/react-namespace.expect.md b/compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/react-namespace.expect.md
index 8c422c07cda0b..0afc5b651bb94 100644
--- a/compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/react-namespace.expect.md
+++ b/compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/react-namespace.expect.md
@@ -29,7 +29,7 @@ import { c as _c } from "react/compiler-runtime";
 const FooContext = React.createContext({ current: null });
 
 function Component(props) {
-  const $ = _c(6);
+  const $ = _c(5);
   React.useContext(FooContext);
   const ref = React.useRef();
   const [x, setX] = React.useState(false);
@@ -53,13 +53,12 @@ function Component(props) {
     t1 = $[2];
   }
   let t2;
-  if ($[3] !== onClick || $[4] !== t1) {
+  if ($[3] !== t1) {
     t2 = <div onClick={onClick}>{t1}</div>;
-    $[3] = onClick;
-    $[4] = t1;
-    $[5] = t2;
+    $[3] = t1;
+    $[4] = t2;
   } else {
-    t2 = $[5];
+    t2 = $[4];
   }
   return t2;
 }
diff --git a/compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/ref-current-aliased-no-added-to-dep.expect.md b/compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/ref-current-aliased-no-added-to-dep.expect.md
index 9113cec24bf40..0c8583d402c42 100644
--- a/compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/ref-current-aliased-no-added-to-dep.expect.md
+++ b/compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/ref-current-aliased-no-added-to-dep.expect.md
@@ -20,28 +20,21 @@ function VideoTab() {
 ```javascript
 import { c as _c } from "react/compiler-runtime"; // @validateRefAccessDuringRender false
 function VideoTab() {
-  const $ = _c(3);
+  const $ = _c(1);
   const ref = useRef();
   const t = ref.current;
   let t0;
   if ($[0] === Symbol.for("react.memo_cache_sentinel")) {
-    t0 = () => {
+    const x = () => {
       console.log(t);
     };
+
+    t0 = <VideoList videos={x} />;
     $[0] = t0;
   } else {
     t0 = $[0];
   }
-  const x = t0;
-  let t1;
-  if ($[1] !== x) {
-    t1 = <VideoList videos={x} />;
-    $[1] = x;
-    $[2] = t1;
-  } else {
-    t1 = $[2];
-  }
-  return t1;
+  return t0;
 }
 
 ```
diff --git a/compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/ref-current-field-not-added-to-dep.expect.md b/compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/ref-current-field-not-added-to-dep.expect.md
index 6ca83bf4dcfca..2d64bbd5ad51e 100644
--- a/compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/ref-current-field-not-added-to-dep.expect.md
+++ b/compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/ref-current-field-not-added-to-dep.expect.md
@@ -19,27 +19,20 @@ function VideoTab() {
 ```javascript
 import { c as _c } from "react/compiler-runtime"; // @validateRefAccessDuringRender false
 function VideoTab() {
-  const $ = _c(3);
+  const $ = _c(1);
   const ref = useRef();
   let t0;
   if ($[0] === Symbol.for("react.memo_cache_sentinel")) {
-    t0 = () => {
+    const x = () => {
       console.log(ref.current.x);
     };
+
+    t0 = <VideoList videos={x} />;
     $[0] = t0;
   } else {
     t0 = $[0];
   }
-  const x = t0;
-  let t1;
-  if ($[1] !== x) {
-    t1 = <VideoList videos={x} />;
-    $[1] = x;
-    $[2] = t1;
-  } else {
-    t1 = $[2];
-  }
-  return t1;
+  return t0;
 }
 
 ```
diff --git a/compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/ref-current-field-write-not-added-to-dep.expect.md b/compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/ref-current-field-write-not-added-to-dep.expect.md
index bce9e7ab11638..fab497b4aaaf2 100644
--- a/compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/ref-current-field-write-not-added-to-dep.expect.md
+++ b/compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/ref-current-field-write-not-added-to-dep.expect.md
@@ -27,7 +27,7 @@ import { c as _c } from "react/compiler-runtime";
 import { useRef } from "react";
 
 function Component() {
-  const $ = _c(4);
+  const $ = _c(2);
   let t0;
   if ($[0] === Symbol.for("react.memo_cache_sentinel")) {
     t0 = { text: { value: null } };
@@ -38,23 +38,16 @@ function Component() {
   const ref = useRef(t0);
   let t1;
   if ($[1] === Symbol.for("react.memo_cache_sentinel")) {
-    t1 = (e) => {
+    const inputChanged = (e) => {
       ref.current.text.value = e.target.value;
     };
+
+    t1 = <input onChange={inputChanged} />;
     $[1] = t1;
   } else {
     t1 = $[1];
   }
-  const inputChanged = t1;
-  let t2;
-  if ($[2] !== inputChanged) {
-    t2 = <input onChange={inputChanged} />;
-    $[2] = inputChanged;
-    $[3] = t2;
-  } else {
-    t2 = $[3];
-  }
-  return t2;
+  return t1;
 }
 
 export const FIXTURE_ENTRYPOINT = {
diff --git a/compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/ref-current-not-added-to-dep.expect.md b/compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/ref-current-not-added-to-dep.expect.md
index 9ace9ffc04582..567b6329a7c40 100644
--- a/compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/ref-current-not-added-to-dep.expect.md
+++ b/compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/ref-current-not-added-to-dep.expect.md
@@ -18,27 +18,20 @@ function VideoTab() {
 ```javascript
 import { c as _c } from "react/compiler-runtime";
 function VideoTab() {
-  const $ = _c(3);
+  const $ = _c(1);
   const ref = useRef();
   let t0;
   if ($[0] === Symbol.for("react.memo_cache_sentinel")) {
-    t0 = () => {
+    const x = () => {
       console.log(ref.current);
     };
+
+    t0 = <VideoList videos={x} />;
     $[0] = t0;
   } else {
     t0 = $[0];
   }
-  const x = t0;
-  let t1;
-  if ($[1] !== x) {
-    t1 = <VideoList videos={x} />;
-    $[1] = x;
-    $[2] = t1;
-  } else {
-    t1 = $[2];
-  }
-  return t1;
+  return t0;
 }
 
 ```
diff --git a/compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/ref-current-optional-field-no-added-to-dep.expect.md b/compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/ref-current-optional-field-no-added-to-dep.expect.md
index d903df376e3fd..85bb7b65c5af6 100644
--- a/compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/ref-current-optional-field-no-added-to-dep.expect.md
+++ b/compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/ref-current-optional-field-no-added-to-dep.expect.md
@@ -18,27 +18,20 @@ function VideoTab() {
 ```javascript
 import { c as _c } from "react/compiler-runtime";
 function VideoTab() {
-  const $ = _c(3);
+  const $ = _c(1);
   const ref = useRef();
   let t0;
   if ($[0] === Symbol.for("react.memo_cache_sentinel")) {
-    t0 = () => {
+    const x = () => {
       ref.current?.x;
     };
+
+    t0 = <VideoList videos={x} />;
     $[0] = t0;
   } else {
     t0 = $[0];
   }
-  const x = t0;
-  let t1;
-  if ($[1] !== x) {
-    t1 = <VideoList videos={x} />;
-    $[1] = x;
-    $[2] = t1;
-  } else {
-    t1 = $[2];
-  }
-  return t1;
+  return t0;
 }
 
 ```
diff --git a/compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/ref-current-write-not-added-to-dep.expect.md b/compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/ref-current-write-not-added-to-dep.expect.md
index 68762dba957ff..f2feb9ef52a1a 100644
--- a/compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/ref-current-write-not-added-to-dep.expect.md
+++ b/compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/ref-current-write-not-added-to-dep.expect.md
@@ -18,27 +18,20 @@ function VideoTab() {
 ```javascript
 import { c as _c } from "react/compiler-runtime";
 function VideoTab() {
-  const $ = _c(3);
+  const $ = _c(1);
   const ref = useRef();
   let t0;
   if ($[0] === Symbol.for("react.memo_cache_sentinel")) {
-    t0 = () => {
+    const x = () => {
       ref.current = 1;
     };
+
+    t0 = <VideoList videos={x} />;
     $[0] = t0;
   } else {
     t0 = $[0];
   }
-  const x = t0;
-  let t1;
-  if ($[1] !== x) {
-    t1 = <VideoList videos={x} />;
-    $[1] = x;
-    $[2] = t1;
-  } else {
-    t1 = $[2];
-  }
-  return t1;
+  return t0;
 }
 
 ```
diff --git a/compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/ref-in-effect.expect.md b/compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/ref-in-effect.expect.md
index 7f4aee831d9ee..8c620a698cd15 100644
--- a/compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/ref-in-effect.expect.md
+++ b/compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/ref-in-effect.expect.md
@@ -21,7 +21,7 @@ function Component(props) {
 ```javascript
 import { c as _c } from "react/compiler-runtime";
 function Component(props) {
-  const $ = _c(4);
+  const $ = _c(3);
   const ref = useRef(null);
   let t0;
   if ($[0] === Symbol.for("react.memo_cache_sentinel")) {
@@ -45,12 +45,11 @@ function Component(props) {
   }
   useEffect(t1);
   let t2;
-  if ($[2] !== onChange) {
+  if ($[2] === Symbol.for("react.memo_cache_sentinel")) {
     t2 = <Foo onChange={onChange} />;
-    $[2] = onChange;
-    $[3] = t2;
+    $[2] = t2;
   } else {
-    t2 = $[3];
+    t2 = $[2];
   }
   return t2;
 }
diff --git a/compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/ref-like-name-in-useCallback-2.expect.md b/compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/ref-like-name-in-useCallback-2.expect.md
index 98268f40bf5d7..c5f2f6a762850 100644
--- a/compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/ref-like-name-in-useCallback-2.expect.md
+++ b/compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/ref-like-name-in-useCallback-2.expect.md
@@ -47,7 +47,7 @@ function useCustomRef() {
 function _temp() {}
 
 function Foo() {
-  const $ = _c(3);
+  const $ = _c(2);
   const ref = useCustomRef();
   let t0;
   if ($[0] === Symbol.for("react.memo_cache_sentinel")) {
@@ -60,12 +60,11 @@ function Foo() {
   }
   const onClick = t0;
   let t1;
-  if ($[1] !== onClick) {
+  if ($[1] === Symbol.for("react.memo_cache_sentinel")) {
     t1 = <button onClick={onClick} />;
-    $[1] = onClick;
-    $[2] = t1;
+    $[1] = t1;
   } else {
-    t1 = $[2];
+    t1 = $[1];
   }
   return t1;
 }
diff --git a/compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/ref-like-name-in-useCallback.expect.md b/compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/ref-like-name-in-useCallback.expect.md
index 57a1bec24a878..fa81fd77d534f 100644
--- a/compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/ref-like-name-in-useCallback.expect.md
+++ b/compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/ref-like-name-in-useCallback.expect.md
@@ -47,7 +47,7 @@ function useCustomRef() {
 function _temp() {}
 
 function Foo() {
-  const $ = _c(3);
+  const $ = _c(2);
   const customRef = useCustomRef();
   let t0;
   if ($[0] === Symbol.for("react.memo_cache_sentinel")) {
@@ -60,12 +60,11 @@ function Foo() {
   }
   const onClick = t0;
   let t1;
-  if ($[1] !== onClick) {
+  if ($[1] === Symbol.for("react.memo_cache_sentinel")) {
     t1 = <button onClick={onClick} />;
-    $[1] = onClick;
-    $[2] = t1;
+    $[1] = t1;
   } else {
-    t1 = $[2];
+    t1 = $[1];
   }
   return t1;
 }
diff --git a/compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/useCallback-multiple-callbacks-modifying-same-ref-preserve-memoization.expect.md b/compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/useCallback-multiple-callbacks-modifying-same-ref-preserve-memoization.expect.md
index 1179df3096332..12eee85f66bbf 100644
--- a/compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/useCallback-multiple-callbacks-modifying-same-ref-preserve-memoization.expect.md
+++ b/compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/useCallback-multiple-callbacks-modifying-same-ref-preserve-memoization.expect.md
@@ -35,7 +35,7 @@ import { c as _c } from "react/compiler-runtime"; // @enablePreserveExistingMemo
 import { useCallback, useRef } from "react";
 
 function Component(props) {
-  const $ = _c(6);
+  const $ = _c(4);
   let t0;
   if ($[0] === Symbol.for("react.memo_cache_sentinel")) {
     t0 = { inner: null };
@@ -65,13 +65,11 @@ function Component(props) {
   }
   const onReset = t2;
   let t3;
-  if ($[3] !== onChange || $[4] !== onReset) {
+  if ($[3] === Symbol.for("react.memo_cache_sentinel")) {
     t3 = <input onChange={onChange} onReset={onReset} />;
-    $[3] = onChange;
-    $[4] = onReset;
-    $[5] = t3;
+    $[3] = t3;
   } else {
-    t3 = $[5];
+    t3 = $[3];
   }
   return t3;
 }
diff --git a/compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/useCallback-set-ref-nested-property-preserve-memoization.expect.md b/compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/useCallback-set-ref-nested-property-preserve-memoization.expect.md
index 302c5724b8205..864c746fcc0be 100644
--- a/compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/useCallback-set-ref-nested-property-preserve-memoization.expect.md
+++ b/compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/useCallback-set-ref-nested-property-preserve-memoization.expect.md
@@ -31,7 +31,7 @@ import { c as _c } from "react/compiler-runtime"; // @enablePreserveExistingMemo
 import { useCallback, useRef } from "react";
 
 function Component(props) {
-  const $ = _c(4);
+  const $ = _c(3);
   let t0;
   if ($[0] === Symbol.for("react.memo_cache_sentinel")) {
     t0 = { inner: null };
@@ -51,12 +51,11 @@ function Component(props) {
   }
   const onChange = t1;
   let t2;
-  if ($[2] !== onChange) {
+  if ($[2] === Symbol.for("react.memo_cache_sentinel")) {
     t2 = <input onChange={onChange} />;
-    $[2] = onChange;
-    $[3] = t2;
+    $[2] = t2;
   } else {
-    t2 = $[3];
+    t2 = $[2];
   }
   return t2;
 }
diff --git a/compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/useCallback-set-ref-nested-property.expect.md b/compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/useCallback-set-ref-nested-property.expect.md
index 7436107360ba6..77dbb0dcd516f 100644
--- a/compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/useCallback-set-ref-nested-property.expect.md
+++ b/compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/useCallback-set-ref-nested-property.expect.md
@@ -34,7 +34,7 @@ import { useCallback, useRef } from "react";
 // Identical to useCallback-set-ref-nested-property-preserve-memoization,
 // but with a different set of compiler flags
 function Component(t0) {
-  const $ = _c(4);
+  const $ = _c(3);
   let t1;
   if ($[0] === Symbol.for("react.memo_cache_sentinel")) {
     t1 = { inner: null };
@@ -54,12 +54,11 @@ function Component(t0) {
   }
   const onChange = t2;
   let t3;
-  if ($[2] !== onChange) {
+  if ($[2] === Symbol.for("react.memo_cache_sentinel")) {
     t3 = <input onChange={onChange} />;
-    $[2] = onChange;
-    $[3] = t3;
+    $[2] = t3;
   } else {
-    t3 = $[3];
+    t3 = $[2];
   }
   return t3;
 }
diff --git a/compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/useCallback-set-ref-value-dont-preserve-memoization.expect.md b/compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/useCallback-set-ref-value-dont-preserve-memoization.expect.md
index 2055108f1192a..43d6f1d712a3d 100644
--- a/compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/useCallback-set-ref-value-dont-preserve-memoization.expect.md
+++ b/compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/useCallback-set-ref-value-dont-preserve-memoization.expect.md
@@ -31,7 +31,7 @@ import { c as _c } from "react/compiler-runtime"; // @enablePreserveExistingMemo
 import { useCallback, useRef } from "react";
 
 function Component(props) {
-  const $ = _c(3);
+  const $ = _c(2);
   const ref = useRef(null);
   let t0;
   if ($[0] === Symbol.for("react.memo_cache_sentinel")) {
@@ -44,12 +44,11 @@ function Component(props) {
   }
   const onChange = t0;
   let t1;
-  if ($[1] !== onChange) {
+  if ($[1] === Symbol.for("react.memo_cache_sentinel")) {
     t1 = <input onChange={onChange} />;
-    $[1] = onChange;
-    $[2] = t1;
+    $[1] = t1;
   } else {
-    t1 = $[2];
+    t1 = $[1];
   }
   return t1;
 }
diff --git a/compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/useCallback-set-ref-value-preserve-memoization.expect.md b/compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/useCallback-set-ref-value-preserve-memoization.expect.md
index 2055108f1192a..43d6f1d712a3d 100644
--- a/compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/useCallback-set-ref-value-preserve-memoization.expect.md
+++ b/compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/useCallback-set-ref-value-preserve-memoization.expect.md
@@ -31,7 +31,7 @@ import { c as _c } from "react/compiler-runtime"; // @enablePreserveExistingMemo
 import { useCallback, useRef } from "react";
 
 function Component(props) {
-  const $ = _c(3);
+  const $ = _c(2);
   const ref = useRef(null);
   let t0;
   if ($[0] === Symbol.for("react.memo_cache_sentinel")) {
@@ -44,12 +44,11 @@ function Component(props) {
   }
   const onChange = t0;
   let t1;
-  if ($[1] !== onChange) {
+  if ($[1] === Symbol.for("react.memo_cache_sentinel")) {
     t1 = <input onChange={onChange} />;
-    $[1] = onChange;
-    $[2] = t1;
+    $[1] = t1;
   } else {
-    t1 = $[2];
+    t1 = $[1];
   }
   return t1;
 }