Merge cc2158cf7b into sapling-pr-archive-poteto

compiler/apps/playground/components/AccordionWindow.tsx

@@ -23,6 +23,7 @@ export default function AccordionWindow(props: {
   tabsOpen: Set<string>;
   setTabsOpen: (newTab: Set<string>) => void;
   changedPasses: Set<string>;
+  isFailure: boolean;
 }): React.ReactElement {
   return (
     <div className="flex-1 min-w-[550px] sm:min-w-0">
@@ -36,6 +37,7 @@ export default function AccordionWindow(props: {
               tabsOpen={props.tabsOpen}
               setTabsOpen={props.setTabsOpen}
               hasChanged={props.changedPasses.has(name)}
+              isFailure={props.isFailure}
             />
           );
         })}
@@ -50,15 +52,17 @@ function AccordionWindowItem({
   tabsOpen,
   setTabsOpen,
   hasChanged,
+  isFailure,
 }: {
   name: string;
   tabs: TabsRecord;
   tabsOpen: Set<string>;
   setTabsOpen: (newTab: Set<string>) => void;
   hasChanged: boolean;
+  isFailure: boolean;
 }): React.ReactElement {
   const id = useId();
-  const isShow = tabsOpen.has(name);
+  const isShow = isFailure ? name === 'Output' : tabsOpen.has(name);
 
   const transitionName = `accordion-window-item-${id}`;
 

compiler/apps/playground/components/Editor/Output.tsx

@@ -265,14 +265,8 @@ function OutputContent({store, compilerOutput}: Props): JSX.Element {
    * Update the active tab back to the output or errors tab when the compilation state
    * changes between success/failure.
    */
-  const [previousOutputKind, setPreviousOutputKind] = useState(
-    compilerOutput.kind,
-  );
-  if (compilerOutput.kind !== previousOutputKind) {
-    setPreviousOutputKind(compilerOutput.kind);
-    setTabsOpen(new Set(['Output']));
-    setActiveTab('Output');
-  }
+
+  const isFailure = compilerOutput.kind !== 'ok';
   const changedPasses: Set<string> = new Set(['Output', 'HIR']); // Initial and final passes should always be bold
   let lastResult: string = '';
   for (const [passName, results] of compilerOutput.results) {
@@ -301,6 +295,8 @@ function OutputContent({store, compilerOutput}: Props): JSX.Element {
           tabs={tabs}
           activeTab={activeTab}
           onTabChange={setActiveTab}
+          // Display the Output tab on compilation failure
+          activeTabOverride={isFailure ? 'Output' : undefined}
         />
       </ViewTransition>
     );
@@ -319,6 +315,7 @@ function OutputContent({store, compilerOutput}: Props): JSX.Element {
         tabsOpen={tabsOpen}
         tabs={tabs}
         changedPasses={changedPasses}
+        isFailure={isFailure}
       />
     </ViewTransition>
   );

compiler/apps/playground/components/TabbedWindow.tsx

@@ -17,11 +17,15 @@ export default function TabbedWindow({
   tabs,
   activeTab,
   onTabChange,
+  activeTabOverride,
 }: {
   tabs: Map<string, React.ReactNode>;
   activeTab: string;
   onTabChange: (tab: string) => void;
+  activeTabOverride?: string;
 }): React.ReactElement {
+  const currentActiveTab = activeTabOverride ? activeTabOverride : activeTab;
+
   const id = useId();
   const transitionName = `tab-highlight-${id}`;
 
@@ -37,7 +41,7 @@ export default function TabbedWindow({
       <div className="flex flex-col h-full max-w-full">
         <div className="flex p-2 flex-shrink-0">
           {Array.from(tabs.keys()).map(tab => {
-            const isActive = activeTab === tab;
+            const isActive = currentActiveTab === tab;
             return (
               <button
                 key={tab}
@@ -49,6 +53,8 @@ export default function TabbedWindow({
                 {isActive && (
                   <ViewTransition
                     name={transitionName}
+                    enter={{default: 'none'}}
+                    exit={{default: 'none'}}
                     share={{
                       [TOGGLE_TAB_TRANSITION]: 'tab-highlight',
                       default: 'none',
@@ -58,6 +64,8 @@ export default function TabbedWindow({
                   </ViewTransition>
                 )}
                 <ViewTransition
+                  enter={{default: 'none'}}
+                  exit={{default: 'none'}}
                   update={{
                     [TOGGLE_TAB_TRANSITION]: 'tab-text',
                     default: 'none',
@@ -69,7 +77,7 @@ export default function TabbedWindow({
           })}
         </div>
         <div className="flex-1 overflow-hidden w-full h-full">
-          {tabs.get(activeTab)}
+          {tabs.get(currentActiveTab)}
         </div>
       </div>
     </div>

compiler/packages/babel-plugin-react-compiler/src/HIR/CollectHoistablePropertyLoads.ts

@@ -454,6 +454,32 @@ function collectNonNullsInBlocks(
             assumedNonNullObjects.add(entry);
           }
         }
+      } else if (
+        fn.env.config.enablePreserveExistingMemoizationGuarantees &&
+        instr.value.kind === 'StartMemoize' &&
+        instr.value.deps != null
+      ) {
+        for (const dep of instr.value.deps) {
+          if (dep.root.kind === 'NamedLocal') {
+            if (
+              !isImmutableAtInstr(dep.root.value.identifier, instr.id, context)
+            ) {
+              continue;
+            }
+            for (let i = 0; i < dep.path.length; i++) {
+              const pathEntry = dep.path[i]!;
+              if (pathEntry.optional) {
+                break;
+              }
+              const depNode = context.registry.getOrCreateProperty({
+                identifier: dep.root.value.identifier,
+                path: dep.path.slice(0, i),
+                reactive: dep.root.value.reactive,
+              });
+              assumedNonNullObjects.add(depNode);
+            }
+          }
+        }
       }
     }
 

compiler/packages/babel-plugin-react-compiler/src/HIR/Environment.ts

@@ -210,7 +210,7 @@ export const EnvironmentConfigSchema = z.object({
    * that if a useEffect or useCallback references a function value, that function value will be
    * considered frozen, and in turn all of its referenced variables will be considered frozen as well.
    */
-  enablePreserveExistingMemoizationGuarantees: z.boolean().default(false),
+  enablePreserveExistingMemoizationGuarantees: z.boolean().default(true),
 
   /**
    * Validates that all useMemo/useCallback values are also memoized by Forget. This mode can be

compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/allocating-primitive-as-dep.expect.md

@@ -2,6 +2,7 @@
 ## Input
 
 ```javascript
+// @enablePreserveExistingMemoizationGuarantees:false
 // bar(props.b) is an allocating expression that produces a primitive, which means
 // that Forget should memoize it.
 // Correctness:
@@ -16,7 +17,8 @@ function AllocatingPrimitiveAsDep(props) {
 ## Code
 
 ```javascript
-import { c as _c } from "react/compiler-runtime"; // bar(props.b) is an allocating expression that produces a primitive, which means
+import { c as _c } from "react/compiler-runtime"; // @enablePreserveExistingMemoizationGuarantees:false
+// bar(props.b) is an allocating expression that produces a primitive, which means
 // that Forget should memoize it.
 // Correctness:
 //   - y depends on either bar(props.b) or bar(props.b) + 1

compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/allocating-primitive-as-dep.js

@@ -1,3 +1,4 @@
+// @enablePreserveExistingMemoizationGuarantees:false
 // bar(props.b) is an allocating expression that produces a primitive, which means
 // that Forget should memoize it.
 // Correctness:

compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/allow-modify-global-in-callback-jsx.expect.md

@@ -2,6 +2,7 @@
 ## Input
 
 ```javascript
+// @enablePreserveExistingMemoizationGuarantees:false
 import {useMemo} from 'react';
 
 const someGlobal = {value: 0};
@@ -32,7 +33,7 @@ export const FIXTURE_ENTRYPOINT = {
 ## Code
 
 ```javascript
-import { c as _c } from "react/compiler-runtime";
+import { c as _c } from "react/compiler-runtime"; // @enablePreserveExistingMemoizationGuarantees:false
 import { useMemo } from "react";
 
 const someGlobal = { value: 0 };

compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/allow-modify-global-in-callback-jsx.js

@@ -1,3 +1,4 @@
+// @enablePreserveExistingMemoizationGuarantees:false
 import {useMemo} from 'react';
 
 const someGlobal = {value: 0};

compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/computed-load-primitive-as-dependency.expect.md

@@ -2,6 +2,7 @@
 ## Input
 
 ```javascript
+// @enablePreserveExistingMemoizationGuarantees:false
 function Component(props) {
   let a = foo();
   // freeze `a` so we know the next line cannot mutate it
@@ -17,7 +18,7 @@ function Component(props) {
 ## Code
 
 ```javascript
-import { c as _c } from "react/compiler-runtime";
+import { c as _c } from "react/compiler-runtime"; // @enablePreserveExistingMemoizationGuarantees:false
 function Component(props) {
   const $ = _c(2);
   const a = foo();

compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/computed-load-primitive-as-dependency.js

@@ -1,3 +1,4 @@
+// @enablePreserveExistingMemoizationGuarantees:false
 function Component(props) {
   let a = foo();
   // freeze `a` so we know the next line cannot mutate it

compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/constant-propagation-template-literal.expect.md

@@ -2,6 +2,7 @@
 ## Input
 
 ```javascript
+// @enablePreserveExistingMemoizationGuarantees:false
 import {Stringify, identity} from 'shared-runtime';
 
 function foo() {
@@ -64,7 +65,7 @@ export const FIXTURE_ENTRYPOINT = {
 ## Code
 
 ```javascript
-import { c as _c } from "react/compiler-runtime";
+import { c as _c } from "react/compiler-runtime"; // @enablePreserveExistingMemoizationGuarantees:false
 import { Stringify, identity } from "shared-runtime";
 
 function foo() {

compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/constant-propagation-template-literal.js

@@ -1,3 +1,4 @@
+// @enablePreserveExistingMemoizationGuarantees:false
 import {Stringify, identity} from 'shared-runtime';
 
 function foo() {

compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/context-variable-as-jsx-element-tag.expect.md

@@ -2,6 +2,7 @@
 ## Input
 
 ```javascript
+// @enablePreserveExistingMemoizationGuarantees:false
 import {useMemo} from 'react';
 import {Stringify} from 'shared-runtime';
 
@@ -25,7 +26,7 @@ export const FIXTURE_ENTRYPOINT = {
 ## Code
 
 ```javascript
-import { c as _c } from "react/compiler-runtime";
+import { c as _c } from "react/compiler-runtime"; // @enablePreserveExistingMemoizationGuarantees:false
 import { useMemo } from "react";
 import { Stringify } from "shared-runtime";
 

compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/context-variable-as-jsx-element-tag.js

@@ -1,3 +1,4 @@
+// @enablePreserveExistingMemoizationGuarantees:false
 import {useMemo} from 'react';
 import {Stringify} from 'shared-runtime';
 

compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/destructure-direct-reassignment.expect.md

@@ -2,6 +2,7 @@
 ## Input
 
 ```javascript
+// @enablePreserveExistingMemoizationGuarantees:false
 function foo(props) {
   let x, y;
   ({x, y} = {x: props.a, y: props.b});
@@ -21,6 +22,7 @@ export const FIXTURE_ENTRYPOINT = {
 ## Code
 
 ```javascript
+// @enablePreserveExistingMemoizationGuarantees:false
 function foo(props) {
   let x;
   let y;

compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/destructure-direct-reassignment.js

@@ -1,3 +1,4 @@
+// @enablePreserveExistingMemoizationGuarantees:false
 function foo(props) {
   let x, y;
   ({x, y} = {x: props.a, y: props.b});

compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/error.invalid-uncalled-function-capturing-mutable-values-memoizes-with-captures-values.expect.md

@@ -2,7 +2,7 @@
 ## Input
 
 ```javascript
-// @flow @enableNewMutationAliasingModel
+// @flow @enableNewMutationAliasingModel @enablePreserveExistingMemoizationGuarantees:false
 /**
  * This hook returns a function that when called with an input object,
  * will return the result of mapping that input with the supplied map

compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/error.invalid-uncalled-function-capturing-mutable-values-memoizes-with-captures-values.js

@@ -1,4 +1,4 @@
-// @flow @enableNewMutationAliasingModel
+// @flow @enableNewMutationAliasingModel @enablePreserveExistingMemoizationGuarantees:false
 /**
  * This hook returns a function that when called with an input object,
  * will return the result of mapping that input with the supplied map

compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/error.repro-preserve-memoization-inner-destructured-value-mistaken-as-dependency-later-mutation.expect.md

@@ -2,7 +2,7 @@
 ## Input
 
 ```javascript
-// @validatePreserveExistingMemoizationGuarantees
+// @validatePreserveExistingMemoizationGuarantees @enablePreserveExistingMemoizationGuarantees:false
 
 /**
  * Repro from https://github.com/facebook/react/issues/34262

compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/error.repro-preserve-memoization-inner-destructured-value-mistaken-as-dependency-later-mutation.js

@@ -1,4 +1,4 @@
-// @validatePreserveExistingMemoizationGuarantees
+// @validatePreserveExistingMemoizationGuarantees @enablePreserveExistingMemoizationGuarantees:false
 
 /**
  * Repro from https://github.com/facebook/react/issues/34262

compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/error.repro-preserve-memoization-inner-destructured-value-mistaken-as-dependency-mutated-dep.expect.md

@@ -2,7 +2,7 @@
 ## Input
 
 ```javascript
-// @validatePreserveExistingMemoizationGuarantees
+// @validatePreserveExistingMemoizationGuarantees @enablePreserveExistingMemoizationGuarantees:false
 
 import {identity, Stringify, useHook} from 'shared-runtime';
 

compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/error.repro-preserve-memoization-inner-destructured-value-mistaken-as-dependency-mutated-dep.js

@@ -1,4 +1,4 @@
-// @validatePreserveExistingMemoizationGuarantees
+// @validatePreserveExistingMemoizationGuarantees @enablePreserveExistingMemoizationGuarantees:false
 
 import {identity, Stringify, useHook} from 'shared-runtime';
 

compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/error.todo-preserve-memo-deps-mixed-optional-nonoptional-property-chain.expect.md

@@ -0,0 +1,91 @@
+
+## Input
+
+```javascript
+// @enablePreserveExistingMemoizationGuarantees @validatePreserveExistingMemoizationGuarantees @enableOptionalDependencies @enableTreatFunctionDepsAsConditional:false
+
+import {useMemo} from 'react';
+import {identity, ValidateMemoization} from 'shared-runtime';
+
+function Component({x}) {
+  const object = useMemo(() => {
+    return identity({
+      callback: () => {
+        // This is a bug in our dependency inference: we stop capturing dependencies
+        // after x.a.b?.c. But what this dependency is telling us is that if `x.a.b`
+        // was non-nullish, then we can access `.c.d?.e`. Thus we should take the
+        // full property chain, exactly as-is with optionals/non-optionals, as a
+        // dependency
+        return identity(x.a.b?.c.d?.e);
+      },
+    });
+  }, [x.a.b?.c.d?.e]);
+  const result = useMemo(() => {
+    return [object.callback()];
+  }, [object]);
+  return <Inner x={x} result={result} />;
+}
+
+function Inner({x, result}) {
+  'use no memo';
+  return <ValidateMemoization inputs={[x.y.z]} output={result} />;
+}
+
+export const FIXTURE_ENTRYPOINT = {
+  fn: Component,
+  params: [{x: {y: {z: 42}}}],
+  sequentialRenders: [
+    {x: {y: {z: 42}}},
+    {x: {y: {z: 42}}},
+    {x: {y: {z: 3.14}}},
+    {x: {y: {z: 42}}},
+    {x: {y: {z: 3.14}}},
+    {x: {y: {z: 42}}},
+  ],
+};
+
+```
+
+
+## Error
+
+```
+Found 1 error:
+
+Compilation Skipped: Existing memoization could not be preserved
+
+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. The inferred dependency was `x.a.b?.c`, but the source dependencies were [x.a.b?.c.d?.e]. Inferred less specific property than source.
+
+error.todo-preserve-memo-deps-mixed-optional-nonoptional-property-chain.ts:7:25
+   5 |
+   6 | function Component({x}) {
+>  7 |   const object = useMemo(() => {
+     |                          ^^^^^^^
+>  8 |     return identity({
+     | ^^^^^^^^^^^^^^^^^^^^^
+>  9 |       callback: () => {
+     | ^^^^^^^^^^^^^^^^^^^^^
+> 10 |         // This is a bug in our dependency inference: we stop capturing dependencies
+     | ^^^^^^^^^^^^^^^^^^^^^
+> 11 |         // after x.a.b?.c. But what this dependency is telling us is that if `x.a.b`
+     | ^^^^^^^^^^^^^^^^^^^^^
+> 12 |         // was non-nullish, then we can access `.c.d?.e`. Thus we should take the
+     | ^^^^^^^^^^^^^^^^^^^^^
+> 13 |         // full property chain, exactly as-is with optionals/non-optionals, as a
+     | ^^^^^^^^^^^^^^^^^^^^^
+> 14 |         // dependency
+     | ^^^^^^^^^^^^^^^^^^^^^
+> 15 |         return identity(x.a.b?.c.d?.e);
+     | ^^^^^^^^^^^^^^^^^^^^^
+> 16 |       },
+     | ^^^^^^^^^^^^^^^^^^^^^
+> 17 |     });
+     | ^^^^^^^^^^^^^^^^^^^^^
+> 18 |   }, [x.a.b?.c.d?.e]);
+     | ^^^^ Could not preserve existing manual memoization
+  19 |   const result = useMemo(() => {
+  20 |     return [object.callback()];
+  21 |   }, [object]);
+```
+          
+      

compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/error.todo-preserve-memo-deps-mixed-optional-nonoptional-property-chain.js

@@ -0,0 +1,41 @@
+// @enablePreserveExistingMemoizationGuarantees @validatePreserveExistingMemoizationGuarantees @enableOptionalDependencies @enableTreatFunctionDepsAsConditional:false
+
+import {useMemo} from 'react';
+import {identity, ValidateMemoization} from 'shared-runtime';
+
+function Component({x}) {
+  const object = useMemo(() => {
+    return identity({
+      callback: () => {
+        // This is a bug in our dependency inference: we stop capturing dependencies
+        // after x.a.b?.c. But what this dependency is telling us is that if `x.a.b`
+        // was non-nullish, then we can access `.c.d?.e`. Thus we should take the
+        // full property chain, exactly as-is with optionals/non-optionals, as a
+        // dependency
+        return identity(x.a.b?.c.d?.e);
+      },
+    });
+  }, [x.a.b?.c.d?.e]);
+  const result = useMemo(() => {
+    return [object.callback()];
+  }, [object]);
+  return <Inner x={x} result={result} />;
+}
+
+function Inner({x, result}) {
+  'use no memo';
+  return <ValidateMemoization inputs={[x.y.z]} output={result} />;
+}
+
+export const FIXTURE_ENTRYPOINT = {
+  fn: Component,
+  params: [{x: {y: {z: 42}}}],
+  sequentialRenders: [
+    {x: {y: {z: 42}}},
+    {x: {y: {z: 42}}},
+    {x: {y: {z: 3.14}}},
+    {x: {y: {z: 42}}},
+    {x: {y: {z: 3.14}}},
+    {x: {y: {z: 42}}},
+  ],
+};

compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/error.todo-repro-missed-memoization-from-capture-in-invoked-function-inferred-as-mutation.expect.md

@@ -2,7 +2,7 @@
 ## Input
 
 ```javascript
-// @flow @validatePreserveExistingMemoizationGuarantees
+// @flow @validatePreserveExistingMemoizationGuarantees @enablePreserveExistingMemoizationGuarantees:false
 import {useMemo} from 'react';
 import {logValue, useFragment, useHook, typedLog} from 'shared-runtime';
 

compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/error.todo-repro-missed-memoization-from-capture-in-invoked-function-inferred-as-mutation.js

@@ -1,4 +1,4 @@
-// @flow @validatePreserveExistingMemoizationGuarantees
+// @flow @validatePreserveExistingMemoizationGuarantees @enablePreserveExistingMemoizationGuarantees:false
 import {useMemo} from 'react';
 import {logValue, useFragment, useHook, typedLog} from 'shared-runtime';
 

compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/error.todo-repro-missed-memoization-from-inferred-mutation-in-logger.expect.md

@@ -2,7 +2,7 @@
 ## Input
 
 ```javascript
-// @flow @validatePreserveExistingMemoizationGuarantees
+// @flow @validatePreserveExistingMemoizationGuarantees @enablePreserveExistingMemoizationGuarantees:false
 import {useFragment} from 'react-relay';
 import LogEvent from 'LogEvent';
 import {useCallback, useMemo} from 'react';

compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/error.todo-repro-missed-memoization-from-inferred-mutation-in-logger.js

@@ -1,4 +1,4 @@
-// @flow @validatePreserveExistingMemoizationGuarantees
+// @flow @validatePreserveExistingMemoizationGuarantees @enablePreserveExistingMemoizationGuarantees:false
 import {useFragment} from 'react-relay';
 import LogEvent from 'LogEvent';
 import {useCallback, useMemo} from 'react';

compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/error.todo-repro-unmemoized-callback-captured-in-context-variable.expect.md

@@ -2,7 +2,7 @@
 ## Input
 
 ```javascript
-// @validatePreserveExistingMemoizationGuarantees
+// @validatePreserveExistingMemoizationGuarantees @enablePreserveExistingMemoizationGuarantees:false
 import {useMemo} from 'react';
 import {ValidateMemoization, useHook} from 'shared-runtime';
 

compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/error.todo-repro-unmemoized-callback-captured-in-context-variable.tsx

@@ -1,4 +1,4 @@
-// @validatePreserveExistingMemoizationGuarantees
+// @validatePreserveExistingMemoizationGuarantees @enablePreserveExistingMemoizationGuarantees:false
 import {useMemo} from 'react';
 import {ValidateMemoization, useHook} from 'shared-runtime';
 

compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/error.validate-object-entries-mutation.expect.md

@@ -2,7 +2,7 @@
 ## Input
 
 ```javascript
-// @validatePreserveExistingMemoizationGuarantees
+// @validatePreserveExistingMemoizationGuarantees @enablePreserveExistingMemoizationGuarantees:false
 import {makeObject_Primitives, Stringify} from 'shared-runtime';
 
 function Component(props) {

compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/error.validate-object-entries-mutation.js

@@ -1,4 +1,4 @@
-// @validatePreserveExistingMemoizationGuarantees
+// @validatePreserveExistingMemoizationGuarantees @enablePreserveExistingMemoizationGuarantees:false
 import {makeObject_Primitives, Stringify} from 'shared-runtime';
 
 function Component(props) {

compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/error.validate-object-values-mutation.expect.md

@@ -2,7 +2,7 @@
 ## Input
 
 ```javascript
-// @validatePreserveExistingMemoizationGuarantees
+// @validatePreserveExistingMemoizationGuarantees @enablePreserveExistingMemoizationGuarantees:false
 import {makeObject_Primitives, Stringify} from 'shared-runtime';
 
 function Component(props) {

compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/error.validate-object-values-mutation.js

@@ -1,4 +1,4 @@
-// @validatePreserveExistingMemoizationGuarantees
+// @validatePreserveExistingMemoizationGuarantees @enablePreserveExistingMemoizationGuarantees:false
 import {makeObject_Primitives, Stringify} from 'shared-runtime';
 
 function Component(props) {

compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/existing-variables-with-c-name.expect.md

@@ -2,6 +2,7 @@
 ## Input
 
 ```javascript
+// @enablePreserveExistingMemoizationGuarantees:false
 import {useMemo, useState} from 'react';
 import {ValidateMemoization} from 'shared-runtime';
 
@@ -28,7 +29,7 @@ export const FIXTURE_ENTRYPOINT = {
 ## Code
 
 ```javascript
-import { c as _c2 } from "react/compiler-runtime";
+import { c as _c2 } from "react/compiler-runtime"; // @enablePreserveExistingMemoizationGuarantees:false
 import { useMemo, useState } from "react";
 import { ValidateMemoization } from "shared-runtime";
 

compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/existing-variables-with-c-name.js

@@ -1,3 +1,4 @@
+// @enablePreserveExistingMemoizationGuarantees:false
 import {useMemo, useState} from 'react';
 import {ValidateMemoization} from 'shared-runtime';
 

compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/fbt/bug-fbt-plural-multiple-function-calls.expect.md

@@ -2,6 +2,7 @@
 ## Input
 
 ```javascript
+// @enablePreserveExistingMemoizationGuarantees:false
 import fbt from 'fbt';
 
 /**
@@ -35,7 +36,7 @@ export const FIXTURE_ENTRYPOINT = {
 ## Code
 
 ```javascript
-import { c as _c } from "react/compiler-runtime";
+import { c as _c } from "react/compiler-runtime"; // @enablePreserveExistingMemoizationGuarantees:false
 import fbt from "fbt";
 
 /**

compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/fbt/bug-fbt-plural-multiple-function-calls.ts

@@ -1,3 +1,4 @@
+// @enablePreserveExistingMemoizationGuarantees:false
 import fbt from 'fbt';
 
 /**

compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/for-in-statement-type-inference.expect.md

@@ -2,6 +2,7 @@
 ## Input
 
 ```javascript
+// @enablePreserveExistingMemoizationGuarantees:false
 const {identity, mutate} = require('shared-runtime');
 
 function Component(props) {
@@ -24,6 +25,7 @@ export const FIXTURE_ENTRYPOINT = {
 ## Code
 
 ```javascript
+// @enablePreserveExistingMemoizationGuarantees:false
 const { identity, mutate } = require("shared-runtime");
 
 function Component(props) {

compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/for-in-statement-type-inference.js

@@ -1,3 +1,4 @@
+// @enablePreserveExistingMemoizationGuarantees:false
 const {identity, mutate} = require('shared-runtime');
 
 function Component(props) {

compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/hooks-with-prefix.expect.md

@@ -2,7 +2,7 @@
 ## Input
 
 ```javascript
-// @hookPattern:".*\b(use[^$]+)$"
+// @hookPattern:".*\b(use[^$]+)$" @enablePreserveExistingMemoizationGuarantees:false
 
 import * as React from 'react';
 import {makeArray, useHook} from 'shared-runtime';
@@ -36,7 +36,7 @@ export const FIXTURE_ENTRYPOINT = {
 ## Code
 
 ```javascript
-import { c as _c } from "react/compiler-runtime"; // @hookPattern:".*\b(use[^$]+)$"
+import { c as _c } from "react/compiler-runtime"; // @hookPattern:".*\b(use[^$]+)$" @enablePreserveExistingMemoizationGuarantees:false
 
 import * as React from "react";
 import { makeArray, useHook } from "shared-runtime";

compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/hooks-with-prefix.js

@@ -1,4 +1,4 @@
-// @hookPattern:".*\b(use[^$]+)$"
+// @hookPattern:".*\b(use[^$]+)$" @enablePreserveExistingMemoizationGuarantees:false
 
 import * as React from 'react';
 import {makeArray, useHook} from 'shared-runtime';

compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/infer-computed-delete.expect.md

@@ -2,7 +2,7 @@
 ## Input
 
 ```javascript
-// @debug
+// @debug @enablePreserveExistingMemoizationGuarantees:false
 function Component(props) {
   const x = makeObject();
   const y = delete x[props.value];
@@ -14,7 +14,7 @@ function Component(props) {
 ## Code
 
 ```javascript
-// @debug
+// @debug @enablePreserveExistingMemoizationGuarantees:false
 function Component(props) {
   const x = makeObject();
   const y = delete x[props.value];

compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/infer-computed-delete.js

@@ -1,4 +1,4 @@
-// @debug
+// @debug @enablePreserveExistingMemoizationGuarantees:false
 function Component(props) {
   const x = makeObject();
   const y = delete x[props.value];

compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/infer-property-delete.expect.md

@@ -2,6 +2,7 @@
 ## Input
 
 ```javascript
+// @enablePreserveExistingMemoizationGuarantees:false
 function Component(props) {
   const x = makeObject();
   const y = delete x.value;
@@ -13,6 +14,7 @@ function Component(props) {
 ## Code
 
 ```javascript
+// @enablePreserveExistingMemoizationGuarantees:false
 function Component(props) {
   const x = makeObject();
   const y = delete x.value;

compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/infer-property-delete.js

@@ -1,3 +1,4 @@
+// @enablePreserveExistingMemoizationGuarantees:false
 function Component(props) {
   const x = makeObject();
   const y = delete x.value;

compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/new-mutability/error.invalid-useCallback-captures-reassigned-context.expect.md

@@ -2,7 +2,7 @@
 ## Input
 
 ```javascript
-// @validatePreserveExistingMemoizationGuarantees @enableNewMutationAliasingModel
+// @validatePreserveExistingMemoizationGuarantees @enableNewMutationAliasingModel @enablePreserveExistingMemoizationGuarantees:false
 import {useCallback} from 'react';
 import {makeArray} from 'shared-runtime';
 

compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/new-mutability/error.invalid-useCallback-captures-reassigned-context.js

@@ -1,4 +1,4 @@
-// @validatePreserveExistingMemoizationGuarantees @enableNewMutationAliasingModel
+// @validatePreserveExistingMemoizationGuarantees @enableNewMutationAliasingModel @enablePreserveExistingMemoizationGuarantees:false
 import {useCallback} from 'react';
 import {makeArray} from 'shared-runtime';
 

compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/new-mutability/mutate-through-identity-function-expression.expect.md

@@ -2,6 +2,7 @@
 ## Input
 
 ```javascript
+// @enablePreserveExistingMemoizationGuarantees:false
 import {useMemo} from 'react';
 import {identity, ValidateMemoization} from 'shared-runtime';
 
@@ -32,7 +33,7 @@ export const FIXTURE_ENTRYPOINT = {
 ## Code
 
 ```javascript
-import { c as _c } from "react/compiler-runtime";
+import { c as _c } from "react/compiler-runtime"; // @enablePreserveExistingMemoizationGuarantees:false
 import { useMemo } from "react";
 import { identity, ValidateMemoization } from "shared-runtime";
 

compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/new-mutability/mutate-through-identity-function-expression.js

@@ -1,3 +1,4 @@
+// @enablePreserveExistingMemoizationGuarantees:false
 import {useMemo} from 'react';
 import {identity, ValidateMemoization} from 'shared-runtime';
 

compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/new-mutability/mutate-through-identity.expect.md

@@ -2,6 +2,7 @@
 ## Input
 
 ```javascript
+// @enablePreserveExistingMemoizationGuarantees:false
 import {useMemo} from 'react';
 import {identity, ValidateMemoization} from 'shared-runtime';
 
@@ -29,7 +30,7 @@ export const FIXTURE_ENTRYPOINT = {
 ## Code
 
 ```javascript
-import { c as _c } from "react/compiler-runtime";
+import { c as _c } from "react/compiler-runtime"; // @enablePreserveExistingMemoizationGuarantees:false
 import { useMemo } from "react";
 import { identity, ValidateMemoization } from "shared-runtime";
 

compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/new-mutability/mutate-through-identity.js

@@ -1,3 +1,4 @@
+// @enablePreserveExistingMemoizationGuarantees:false
 import {useMemo} from 'react';
 import {identity, ValidateMemoization} from 'shared-runtime';
 

compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/new-mutability/todo-control-flow-sensitive-mutation.expect.md

@@ -2,6 +2,7 @@
 ## Input
 
 ```javascript
+// @enablePreserveExistingMemoizationGuarantees:false
 import {useMemo} from 'react';
 import {
   mutate,
@@ -49,7 +50,7 @@ export const FIXTURE_ENTRYPOINT = {
 ## Code
 
 ```javascript
-import { c as _c } from "react/compiler-runtime";
+import { c as _c } from "react/compiler-runtime"; // @enablePreserveExistingMemoizationGuarantees:false
 import { useMemo } from "react";
 import {
   mutate,

compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/new-mutability/todo-control-flow-sensitive-mutation.tsx

@@ -1,3 +1,4 @@
+// @enablePreserveExistingMemoizationGuarantees:false
 import {useMemo} from 'react';
 import {
   mutate,

compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/new-mutability/todo-transitivity-createfrom-capture-lambda.expect.md

@@ -2,6 +2,7 @@
 ## Input
 
 ```javascript
+// @enablePreserveExistingMemoizationGuarantees:false
 import {useMemo} from 'react';
 import {
   typedCapture,
@@ -41,7 +42,7 @@ export const FIXTURE_ENTRYPOINT = {
 ## Code
 
 ```javascript
-import { c as _c } from "react/compiler-runtime";
+import { c as _c } from "react/compiler-runtime"; // @enablePreserveExistingMemoizationGuarantees:false
 import { useMemo } from "react";
 import {
   typedCapture,

compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/new-mutability/todo-transitivity-createfrom-capture-lambda.tsx

@@ -1,3 +1,4 @@
+// @enablePreserveExistingMemoizationGuarantees:false
 import {useMemo} from 'react';
 import {
   typedCapture,

compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/new-mutability/transitivity-add-captured-array-to-itself.expect.md

@@ -2,6 +2,7 @@
 ## Input
 
 ```javascript
+// @enablePreserveExistingMemoizationGuarantees:false
 import {useMemo} from 'react';
 import {
   typedCapture,
@@ -42,7 +43,7 @@ export const FIXTURE_ENTRYPOINT = {
 ## Code
 
 ```javascript
-import { c as _c } from "react/compiler-runtime";
+import { c as _c } from "react/compiler-runtime"; // @enablePreserveExistingMemoizationGuarantees:false
 import { useMemo } from "react";
 import {
   typedCapture,

compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/new-mutability/transitivity-add-captured-array-to-itself.tsx

@@ -1,3 +1,4 @@
+// @enablePreserveExistingMemoizationGuarantees:false
 import {useMemo} from 'react';
 import {
   typedCapture,

compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/new-mutability/transitivity-capture-createfrom-lambda.expect.md

@@ -2,6 +2,7 @@
 ## Input
 
 ```javascript
+// @enablePreserveExistingMemoizationGuarantees:false
 import {useMemo} from 'react';
 import {
   typedCapture,
@@ -40,7 +41,7 @@ export const FIXTURE_ENTRYPOINT = {
 ## Code
 
 ```javascript
-import { c as _c } from "react/compiler-runtime";
+import { c as _c } from "react/compiler-runtime"; // @enablePreserveExistingMemoizationGuarantees:false
 import { useMemo } from "react";
 import {
   typedCapture,

compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/new-mutability/transitivity-capture-createfrom-lambda.tsx

@@ -1,3 +1,4 @@
+// @enablePreserveExistingMemoizationGuarantees:false
 import {useMemo} from 'react';
 import {
   typedCapture,

compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/new-mutability/transitivity-capture-createfrom.expect.md

@@ -2,6 +2,7 @@
 ## Input
 
 ```javascript
+// @enablePreserveExistingMemoizationGuarantees:false
 import {useMemo} from 'react';
 import {
   typedCapture,
@@ -36,7 +37,7 @@ export const FIXTURE_ENTRYPOINT = {
 ## Code
 
 ```javascript
-import { c as _c } from "react/compiler-runtime";
+import { c as _c } from "react/compiler-runtime"; // @enablePreserveExistingMemoizationGuarantees:false
 import { useMemo } from "react";
 import {
   typedCapture,

compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/new-mutability/transitivity-capture-createfrom.tsx

@@ -1,3 +1,4 @@
+// @enablePreserveExistingMemoizationGuarantees:false
 import {useMemo} from 'react';
 import {
   typedCapture,

compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/new-mutability/transitivity-phi-assign-or-capture.expect.md

@@ -2,6 +2,7 @@
 ## Input
 
 ```javascript
+// @enablePreserveExistingMemoizationGuarantees:false
 import {useMemo} from 'react';
 import {
   typedCapture,
@@ -40,7 +41,7 @@ export const FIXTURE_ENTRYPOINT = {
 ## Code
 
 ```javascript
-import { c as _c } from "react/compiler-runtime";
+import { c as _c } from "react/compiler-runtime"; // @enablePreserveExistingMemoizationGuarantees:false
 import { useMemo } from "react";
 import {
   typedCapture,

compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/new-mutability/transitivity-phi-assign-or-capture.tsx

@@ -1,3 +1,4 @@
+// @enablePreserveExistingMemoizationGuarantees:false
 import {useMemo} from 'react';
 import {
   typedCapture,

compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/new-mutability/useCallback-reordering-deplist-controlflow.expect.md

@@ -2,7 +2,7 @@
 ## Input
 
 ```javascript
-// @enableNewMutationAliasingModel
+// @enableNewMutationAliasingModel @enablePreserveExistingMemoizationGuarantees:false
 import {useCallback} from 'react';
 import {Stringify} from 'shared-runtime';
 
@@ -36,7 +36,7 @@ export const FIXTURE_ENTRYPOINT = {
 ## Code
 
 ```javascript
-import { c as _c } from "react/compiler-runtime"; // @enableNewMutationAliasingModel
+import { c as _c } from "react/compiler-runtime"; // @enableNewMutationAliasingModel @enablePreserveExistingMemoizationGuarantees:false
 import { useCallback } from "react";
 import { Stringify } from "shared-runtime";
 

compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/new-mutability/useCallback-reordering-deplist-controlflow.tsx

@@ -1,4 +1,4 @@
-// @enableNewMutationAliasingModel
+// @enableNewMutationAliasingModel @enablePreserveExistingMemoizationGuarantees:false
 import {useCallback} from 'react';
 import {Stringify} from 'shared-runtime';
 

compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/new-mutability/useCallback-reordering-depslist-assignment.expect.md

@@ -2,7 +2,7 @@
 ## Input
 
 ```javascript
-// @enableNewMutationAliasingModel
+// @enableNewMutationAliasingModel @enablePreserveExistingMemoizationGuarantees:false
 import {useCallback} from 'react';
 import {Stringify} from 'shared-runtime';
 
@@ -31,7 +31,7 @@ export const FIXTURE_ENTRYPOINT = {
 ## Code
 
 ```javascript
-import { c as _c } from "react/compiler-runtime"; // @enableNewMutationAliasingModel
+import { c as _c } from "react/compiler-runtime"; // @enableNewMutationAliasingModel @enablePreserveExistingMemoizationGuarantees:false
 import { useCallback } from "react";
 import { Stringify } from "shared-runtime";
 

compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/new-mutability/useCallback-reordering-depslist-assignment.tsx

@@ -1,4 +1,4 @@
-// @enableNewMutationAliasingModel
+// @enableNewMutationAliasingModel @enablePreserveExistingMemoizationGuarantees:false
 import {useCallback} from 'react';
 import {Stringify} from 'shared-runtime';
 

compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/new-mutability/useMemo-reordering-depslist-assignment.expect.md

@@ -2,7 +2,7 @@
 ## Input
 
 ```javascript
-// @enableNewMutationAliasingModel
+// @enableNewMutationAliasingModel @enablePreserveExistingMemoizationGuarantees:false
 import {useMemo} from 'react';
 
 function useFoo(arr1, arr2) {
@@ -27,7 +27,7 @@ export const FIXTURE_ENTRYPOINT = {
 ## Code
 
 ```javascript
-import { c as _c } from "react/compiler-runtime"; // @enableNewMutationAliasingModel
+import { c as _c } from "react/compiler-runtime"; // @enableNewMutationAliasingModel @enablePreserveExistingMemoizationGuarantees:false
 import { useMemo } from "react";
 
 function useFoo(arr1, arr2) {

compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/new-mutability/useMemo-reordering-depslist-assignment.ts

@@ -1,4 +1,4 @@
-// @enableNewMutationAliasingModel
+// @enableNewMutationAliasingModel @enablePreserveExistingMemoizationGuarantees:false
 import {useMemo} from 'react';
 
 function useFoo(arr1, arr2) {

compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/preserve-memo-deps-conditional-property-chain-less-precise-deps.expect.md

@@ -0,0 +1,122 @@
+
+## Input
+
+```javascript
+// @enablePreserveExistingMemoizationGuarantees @validatePreserveExistingMemoizationGuarantees @enableOptionalDependencies @enableTreatFunctionDepsAsConditional:false
+
+import {useMemo} from 'react';
+import {identity, ValidateMemoization} from 'shared-runtime';
+
+function Component({x}) {
+  const object = useMemo(() => {
+    return identity({
+      callback: () => {
+        return identity(x.y.z); // accesses more levels of properties than the manual memo
+      },
+    });
+    // x.y as a manual dep only tells us that x is non-nullable, not that x.y is non-nullable
+    // we can only take a dep on x.y, not x.y.z
+  }, [x.y]);
+  const result = useMemo(() => {
+    return [object.callback()];
+  }, [object]);
+  return <ValidateMemoization inputs={[x.y]} output={result} />;
+}
+
+const input1 = {x: {y: {z: 42}}};
+const input1b = {x: {y: {z: 42}}};
+const input2 = {x: {y: {z: 3.14}}};
+export const FIXTURE_ENTRYPOINT = {
+  fn: Component,
+  params: [input1],
+  sequentialRenders: [
+    input1,
+    input1,
+    input1b, // should reset even though .z didn't change
+    input1,
+    input2,
+  ],
+};
+
+```
+
+## Code
+
+```javascript
+import { c as _c } from "react/compiler-runtime"; // @enablePreserveExistingMemoizationGuarantees @validatePreserveExistingMemoizationGuarantees @enableOptionalDependencies @enableTreatFunctionDepsAsConditional:false
+
+import { useMemo } from "react";
+import { identity, ValidateMemoization } from "shared-runtime";
+
+function Component(t0) {
+  const $ = _c(11);
+  const { x } = t0;
+  let t1;
+  if ($[0] !== x.y) {
+    t1 = identity({ callback: () => identity(x.y.z) });
+    $[0] = x.y;
+    $[1] = t1;
+  } else {
+    t1 = $[1];
+  }
+  const object = t1;
+  let t2;
+  if ($[2] !== object) {
+    t2 = object.callback();
+    $[2] = object;
+    $[3] = t2;
+  } else {
+    t2 = $[3];
+  }
+  let t3;
+  if ($[4] !== t2) {
+    t3 = [t2];
+    $[4] = t2;
+    $[5] = t3;
+  } else {
+    t3 = $[5];
+  }
+  const result = t3;
+  let t4;
+  if ($[6] !== x.y) {
+    t4 = [x.y];
+    $[6] = x.y;
+    $[7] = t4;
+  } else {
+    t4 = $[7];
+  }
+  let t5;
+  if ($[8] !== result || $[9] !== t4) {
+    t5 = <ValidateMemoization inputs={t4} output={result} />;
+    $[8] = result;
+    $[9] = t4;
+    $[10] = t5;
+  } else {
+    t5 = $[10];
+  }
+  return t5;
+}
+
+const input1 = { x: { y: { z: 42 } } };
+const input1b = { x: { y: { z: 42 } } };
+const input2 = { x: { y: { z: 3.14 } } };
+export const FIXTURE_ENTRYPOINT = {
+  fn: Component,
+  params: [input1],
+  sequentialRenders: [
+    input1,
+    input1,
+    input1b, // should reset even though .z didn't change
+    input1,
+    input2,
+  ],
+};
+
+```
+      
+### Eval output
+(kind: ok) <div>{"inputs":[{"z":42}],"output":[42]}</div>
+<div>{"inputs":[{"z":42}],"output":[42]}</div>
+<div>{"inputs":[{"z":42}],"output":[42]}</div>
+<div>{"inputs":[{"z":42}],"output":[42]}</div>
+<div>{"inputs":[{"z":3.14}],"output":[3.14]}</div>

compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/preserve-memo-deps-conditional-property-chain-less-precise-deps.js

@@ -0,0 +1,35 @@
+// @enablePreserveExistingMemoizationGuarantees @validatePreserveExistingMemoizationGuarantees @enableOptionalDependencies @enableTreatFunctionDepsAsConditional:false
+
+import {useMemo} from 'react';
+import {identity, ValidateMemoization} from 'shared-runtime';
+
+function Component({x}) {
+  const object = useMemo(() => {
+    return identity({
+      callback: () => {
+        return identity(x.y.z); // accesses more levels of properties than the manual memo
+      },
+    });
+    // x.y as a manual dep only tells us that x is non-nullable, not that x.y is non-nullable
+    // we can only take a dep on x.y, not x.y.z
+  }, [x.y]);
+  const result = useMemo(() => {
+    return [object.callback()];
+  }, [object]);
+  return <ValidateMemoization inputs={[x.y]} output={result} />;
+}
+
+const input1 = {x: {y: {z: 42}}};
+const input1b = {x: {y: {z: 42}}};
+const input2 = {x: {y: {z: 3.14}}};
+export const FIXTURE_ENTRYPOINT = {
+  fn: Component,
+  params: [input1],
+  sequentialRenders: [
+    input1,
+    input1,
+    input1b, // should reset even though .z didn't change
+    input1,
+    input2,
+  ],
+};

compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/preserve-memo-deps-conditional-property-chain.expect.md

@@ -0,0 +1,117 @@
+
+## Input
+
+```javascript
+// @enablePreserveExistingMemoizationGuarantees @validatePreserveExistingMemoizationGuarantees @enableOptionalDependencies @enableTreatFunctionDepsAsConditional:false
+
+import {useMemo} from 'react';
+import {identity, ValidateMemoization} from 'shared-runtime';
+
+function Component({x}) {
+  const object = useMemo(() => {
+    return identity({
+      callback: () => {
+        return identity(x.y.z);
+      },
+    });
+  }, [x.y.z]);
+  const result = useMemo(() => {
+    return [object.callback()];
+  }, [object]);
+  return <ValidateMemoization inputs={[x.y.z]} output={result} />;
+}
+
+export const FIXTURE_ENTRYPOINT = {
+  fn: Component,
+  params: [{x: {y: {z: 42}}}],
+  sequentialRenders: [
+    {x: {y: {z: 42}}},
+    {x: {y: {z: 42}}},
+    {x: {y: {z: 3.14}}},
+    {x: {y: {z: 42}}},
+    {x: {y: {z: 3.14}}},
+    {x: {y: {z: 42}}},
+  ],
+};
+
+```
+
+## Code
+
+```javascript
+import { c as _c } from "react/compiler-runtime"; // @enablePreserveExistingMemoizationGuarantees @validatePreserveExistingMemoizationGuarantees @enableOptionalDependencies @enableTreatFunctionDepsAsConditional:false
+
+import { useMemo } from "react";
+import { identity, ValidateMemoization } from "shared-runtime";
+
+function Component(t0) {
+  const $ = _c(11);
+  const { x } = t0;
+  let t1;
+  if ($[0] !== x.y.z) {
+    t1 = identity({ callback: () => identity(x.y.z) });
+    $[0] = x.y.z;
+    $[1] = t1;
+  } else {
+    t1 = $[1];
+  }
+  const object = t1;
+  let t2;
+  if ($[2] !== object) {
+    t2 = object.callback();
+    $[2] = object;
+    $[3] = t2;
+  } else {
+    t2 = $[3];
+  }
+  let t3;
+  if ($[4] !== t2) {
+    t3 = [t2];
+    $[4] = t2;
+    $[5] = t3;
+  } else {
+    t3 = $[5];
+  }
+  const result = t3;
+  let t4;
+  if ($[6] !== x.y.z) {
+    t4 = [x.y.z];
+    $[6] = x.y.z;
+    $[7] = t4;
+  } else {
+    t4 = $[7];
+  }
+  let t5;
+  if ($[8] !== result || $[9] !== t4) {
+    t5 = <ValidateMemoization inputs={t4} output={result} />;
+    $[8] = result;
+    $[9] = t4;
+    $[10] = t5;
+  } else {
+    t5 = $[10];
+  }
+  return t5;
+}
+
+export const FIXTURE_ENTRYPOINT = {
+  fn: Component,
+  params: [{ x: { y: { z: 42 } } }],
+  sequentialRenders: [
+    { x: { y: { z: 42 } } },
+    { x: { y: { z: 42 } } },
+    { x: { y: { z: 3.14 } } },
+    { x: { y: { z: 42 } } },
+    { x: { y: { z: 3.14 } } },
+    { x: { y: { z: 42 } } },
+  ],
+};
+
+```
+      
+### Eval output
+(kind: ok) <div>{"inputs":[42],"output":[42]}</div>
+<div>{"inputs":[42],"output":[42]}</div>
+<div>{"inputs":[3.14],"output":[3.14]}</div>
+<div>{"inputs":[42],"output":[42]}</div>
+<div>{"inputs":[3.14],"output":[3.14]}</div>
+<div>{"inputs":[42],"output":[42]}</div>

compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/preserve-memo-deps-conditional-property-chain.js

@@ -0,0 +1,31 @@
+// @enablePreserveExistingMemoizationGuarantees @validatePreserveExistingMemoizationGuarantees @enableOptionalDependencies @enableTreatFunctionDepsAsConditional:false
+
+import {useMemo} from 'react';
+import {identity, ValidateMemoization} from 'shared-runtime';
+
+function Component({x}) {
+  const object = useMemo(() => {
+    return identity({
+      callback: () => {
+        return identity(x.y.z);
+      },
+    });
+  }, [x.y.z]);
+  const result = useMemo(() => {
+    return [object.callback()];
+  }, [object]);
+  return <ValidateMemoization inputs={[x.y.z]} output={result} />;
+}
+
+export const FIXTURE_ENTRYPOINT = {
+  fn: Component,
+  params: [{x: {y: {z: 42}}}],
+  sequentialRenders: [
+    {x: {y: {z: 42}}},
+    {x: {y: {z: 42}}},
+    {x: {y: {z: 3.14}}},
+    {x: {y: {z: 42}}},
+    {x: {y: {z: 3.14}}},
+    {x: {y: {z: 42}}},
+  ],
+};

compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/preserve-memo-deps-optional-property-chain.expect.md

@@ -0,0 +1,125 @@
+
+## Input
+
+```javascript
+// @enablePreserveExistingMemoizationGuarantees @validatePreserveExistingMemoizationGuarantees @enableOptionalDependencies @enableTreatFunctionDepsAsConditional:false
+
+import {useMemo} from 'react';
+import {identity, ValidateMemoization} from 'shared-runtime';
+
+function Component({x, y, z}) {
+  const object = useMemo(() => {
+    return identity({
+      callback: () => {
+        return identity(x?.y?.z, y.a?.b, z.a.b?.c);
+      },
+    });
+  }, [x?.y?.z, y.a?.b, z.a.b?.c]);
+  const result = useMemo(() => {
+    return [object.callback()];
+  }, [object]);
+  return <Inner x={x} result={result} />;
+}
+
+function Inner({x, result}) {
+  'use no memo';
+  return <ValidateMemoization inputs={[x.y.z]} output={result} />;
+}
+
+export const FIXTURE_ENTRYPOINT = {
+  fn: Component,
+  params: [{x: {y: {z: 42}}}],
+  sequentialRenders: [
+    {x: {y: {z: 42}}},
+    {x: {y: {z: 42}}},
+    {x: {y: {z: 3.14}}},
+    {x: {y: {z: 42}}},
+    {x: {y: {z: 3.14}}},
+    {x: {y: {z: 42}}},
+  ],
+};
+
+```
+
+## Code
+
+```javascript
+import { c as _c } from "react/compiler-runtime"; // @enablePreserveExistingMemoizationGuarantees @validatePreserveExistingMemoizationGuarantees @enableOptionalDependencies @enableTreatFunctionDepsAsConditional:false
+
+import { useMemo } from "react";
+import { identity, ValidateMemoization } from "shared-runtime";
+
+function Component(t0) {
+  const $ = _c(11);
+  const { x, y, z } = t0;
+
+  x?.y?.z;
+  y.a?.b;
+  z.a.b?.c;
+  let t1;
+  if ($[0] !== x?.y?.z || $[1] !== y.a?.b || $[2] !== z.a.b?.c) {
+    t1 = identity({ callback: () => identity(x?.y?.z, y.a?.b, z.a.b?.c) });
+    $[0] = x?.y?.z;
+    $[1] = y.a?.b;
+    $[2] = z.a.b?.c;
+    $[3] = t1;
+  } else {
+    t1 = $[3];
+  }
+  const object = t1;
+  let t2;
+  if ($[4] !== object) {
+    t2 = object.callback();
+    $[4] = object;
+    $[5] = t2;
+  } else {
+    t2 = $[5];
+  }
+  let t3;
+  if ($[6] !== t2) {
+    t3 = [t2];
+    $[6] = t2;
+    $[7] = t3;
+  } else {
+    t3 = $[7];
+  }
+  const result = t3;
+  let t4;
+  if ($[8] !== result || $[9] !== x) {
+    t4 = <Inner x={x} result={result} />;
+    $[8] = result;
+    $[9] = x;
+    $[10] = t4;
+  } else {
+    t4 = $[10];
+  }
+  return t4;
+}
+
+function Inner({ x, result }) {
+  "use no memo";
+  return <ValidateMemoization inputs={[x.y.z]} output={result} />;
+}
+
+export const FIXTURE_ENTRYPOINT = {
+  fn: Component,
+  params: [{ x: { y: { z: 42 } } }],
+  sequentialRenders: [
+    { x: { y: { z: 42 } } },
+    { x: { y: { z: 42 } } },
+    { x: { y: { z: 3.14 } } },
+    { x: { y: { z: 42 } } },
+    { x: { y: { z: 3.14 } } },
+    { x: { y: { z: 42 } } },
+  ],
+};
+
+```
+      
+### Eval output
+(kind: ok) [[ (exception in render) TypeError: Cannot read properties of undefined (reading 'a') ]]
+[[ (exception in render) TypeError: Cannot read properties of undefined (reading 'a') ]]
+[[ (exception in render) TypeError: Cannot read properties of undefined (reading 'a') ]]
+[[ (exception in render) TypeError: Cannot read properties of undefined (reading 'a') ]]
+[[ (exception in render) TypeError: Cannot read properties of undefined (reading 'a') ]]
+[[ (exception in render) TypeError: Cannot read properties of undefined (reading 'a') ]]

compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/preserve-memo-deps-optional-property-chain.js

@@ -0,0 +1,36 @@
+// @enablePreserveExistingMemoizationGuarantees @validatePreserveExistingMemoizationGuarantees @enableOptionalDependencies @enableTreatFunctionDepsAsConditional:false
+
+import {useMemo} from 'react';
+import {identity, ValidateMemoization} from 'shared-runtime';
+
+function Component({x, y, z}) {
+  const object = useMemo(() => {
+    return identity({
+      callback: () => {
+        return identity(x?.y?.z, y.a?.b, z.a.b?.c);
+      },
+    });
+  }, [x?.y?.z, y.a?.b, z.a.b?.c]);
+  const result = useMemo(() => {
+    return [object.callback()];
+  }, [object]);
+  return <Inner x={x} result={result} />;
+}
+
+function Inner({x, result}) {
+  'use no memo';
+  return <ValidateMemoization inputs={[x.y.z]} output={result} />;
+}
+
+export const FIXTURE_ENTRYPOINT = {
+  fn: Component,
+  params: [{x: {y: {z: 42}}}],
+  sequentialRenders: [
+    {x: {y: {z: 42}}},
+    {x: {y: {z: 42}}},
+    {x: {y: {z: 3.14}}},
+    {x: {y: {z: 42}}},
+    {x: {y: {z: 3.14}}},
+    {x: {y: {z: 42}}},
+  ],
+};

compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/preserve-memo-validation/error.false-positive-useMemo-infer-mutate-deps.expect.md

@@ -2,7 +2,7 @@
 ## Input
 
 ```javascript
-// @validatePreserveExistingMemoizationGuarantees
+// @validatePreserveExistingMemoizationGuarantees @enablePreserveExistingMemoizationGuarantees:false
 import {useMemo} from 'react';
 import {identity} from 'shared-runtime';
 

compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/preserve-memo-validation/error.false-positive-useMemo-infer-mutate-deps.ts

@@ -1,4 +1,4 @@
-// @validatePreserveExistingMemoizationGuarantees
+// @validatePreserveExistingMemoizationGuarantees @enablePreserveExistingMemoizationGuarantees:false
 import {useMemo} from 'react';
 import {identity} from 'shared-runtime';
 

compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/preserve-memo-validation/error.hoist-useCallback-conditional-access-own-scope.expect.md

@@ -2,7 +2,7 @@
 ## Input
 
 ```javascript
-// @validatePreserveExistingMemoizationGuarantees
+// @validatePreserveExistingMemoizationGuarantees @enablePreserveExistingMemoizationGuarantees:false
 import {useCallback} from 'react';
 
 function Component({propA, propB}) {

compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/preserve-memo-validation/error.hoist-useCallback-conditional-access-own-scope.ts

@@ -1,4 +1,4 @@
-// @validatePreserveExistingMemoizationGuarantees
+// @validatePreserveExistingMemoizationGuarantees @enablePreserveExistingMemoizationGuarantees:false
 import {useCallback} from 'react';
 
 function Component({propA, propB}) {

compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/preserve-memo-validation/error.hoist-useCallback-infer-conditional-value-block.expect.md

@@ -2,7 +2,7 @@
 ## Input
 
 ```javascript
-// @validatePreserveExistingMemoizationGuarantees
+// @validatePreserveExistingMemoizationGuarantees @enablePreserveExistingMemoizationGuarantees:false
 import {useCallback} from 'react';
 import {identity, mutate} from 'shared-runtime';
 

compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/preserve-memo-validation/error.hoist-useCallback-infer-conditional-value-block.ts

@@ -1,4 +1,4 @@
-// @validatePreserveExistingMemoizationGuarantees
+// @validatePreserveExistingMemoizationGuarantees @enablePreserveExistingMemoizationGuarantees:false
 import {useCallback} from 'react';
 import {identity, mutate} from 'shared-runtime';
 

compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/preserve-memo-validation/error.invalid-useCallback-captures-reassigned-context.expect.md

@@ -2,7 +2,7 @@
 ## Input
 
 ```javascript
-// @validatePreserveExistingMemoizationGuarantees
+// @validatePreserveExistingMemoizationGuarantees @enablePreserveExistingMemoizationGuarantees:false
 
 import {useCallback} from 'react';
 import {makeArray} from 'shared-runtime';

compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/preserve-memo-validation/error.invalid-useCallback-captures-reassigned-context.ts

@@ -1,4 +1,4 @@
-// @validatePreserveExistingMemoizationGuarantees
+// @validatePreserveExistingMemoizationGuarantees @enablePreserveExistingMemoizationGuarantees:false
 
 import {useCallback} from 'react';
 import {makeArray} from 'shared-runtime';

compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/preserve-memo-validation/error.useCallback-conditional-access-noAlloc.expect.md

@@ -2,7 +2,7 @@
 ## Input
 
 ```javascript
-// @validatePreserveExistingMemoizationGuarantees
+// @validatePreserveExistingMemoizationGuarantees @enablePreserveExistingMemoizationGuarantees:false
 import {useCallback} from 'react';
 
 function Component({propA, propB}) {

compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/preserve-memo-validation/error.useCallback-conditional-access-noAlloc.ts

@@ -1,4 +1,4 @@
-// @validatePreserveExistingMemoizationGuarantees
+// @validatePreserveExistingMemoizationGuarantees @enablePreserveExistingMemoizationGuarantees:false
 import {useCallback} from 'react';
 
 function Component({propA, propB}) {

compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/preserve-memo-validation/error.useCallback-infer-less-specific-conditional-access.expect.md

@@ -2,7 +2,7 @@
 ## Input
 
 ```javascript
-// @validatePreserveExistingMemoizationGuarantees
+// @validatePreserveExistingMemoizationGuarantees @enablePreserveExistingMemoizationGuarantees:false
 import {useCallback} from 'react';
 import {mutate} from 'shared-runtime';
 

compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/preserve-memo-validation/error.useCallback-infer-less-specific-conditional-access.ts

@@ -1,4 +1,4 @@
-// @validatePreserveExistingMemoizationGuarantees
+// @validatePreserveExistingMemoizationGuarantees @enablePreserveExistingMemoizationGuarantees:false
 import {useCallback} from 'react';
 import {mutate} from 'shared-runtime';
 

compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/preserve-memo-validation/error.useMemo-infer-less-specific-conditional-access.expect.md

@@ -2,7 +2,7 @@
 ## Input
 
 ```javascript
-// @validatePreserveExistingMemoizationGuarantees
+// @validatePreserveExistingMemoizationGuarantees @enablePreserveExistingMemoizationGuarantees:false
 import {useMemo} from 'react';
 import {mutate} from 'shared-runtime';
 

compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/preserve-memo-validation/error.useMemo-infer-less-specific-conditional-access.ts

@@ -1,4 +1,4 @@
-// @validatePreserveExistingMemoizationGuarantees
+// @validatePreserveExistingMemoizationGuarantees @enablePreserveExistingMemoizationGuarantees:false
 import {useMemo} from 'react';
 import {mutate} from 'shared-runtime';
 

compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/preserve-memo-validation/error.useMemo-infer-less-specific-conditional-value-block.expect.md

@@ -2,7 +2,7 @@
 ## Input
 
 ```javascript
-// @validatePreserveExistingMemoizationGuarantees
+// @validatePreserveExistingMemoizationGuarantees @enablePreserveExistingMemoizationGuarantees:false
 import {useMemo} from 'react';
 import {identity, mutate} from 'shared-runtime';
 

compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/preserve-memo-validation/error.useMemo-infer-less-specific-conditional-value-block.ts

@@ -1,4 +1,4 @@
-// @validatePreserveExistingMemoizationGuarantees
+// @validatePreserveExistingMemoizationGuarantees @enablePreserveExistingMemoizationGuarantees:false
 import {useMemo} from 'react';
 import {identity, mutate} from 'shared-runtime';
 

compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/preserve-memo-validation/useCallback-reordering-deplist-controlflow.expect.md

@@ -2,6 +2,7 @@
 ## Input
 
 ```javascript
+// @enablePreserveExistingMemoizationGuarantees:false
 import {useCallback} from 'react';
 import {Stringify} from 'shared-runtime';
 
@@ -35,7 +36,7 @@ export const FIXTURE_ENTRYPOINT = {
 ## Code
 
 ```javascript
-import { c as _c } from "react/compiler-runtime";
+import { c as _c } from "react/compiler-runtime"; // @enablePreserveExistingMemoizationGuarantees:false
 import { useCallback } from "react";
 import { Stringify } from "shared-runtime";
 

compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/preserve-memo-validation/useCallback-reordering-deplist-controlflow.tsx

@@ -1,3 +1,4 @@
+// @enablePreserveExistingMemoizationGuarantees:false
 import {useCallback} from 'react';
 import {Stringify} from 'shared-runtime';
 

compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/preserve-memo-validation/useCallback-reordering-depslist-assignment.expect.md

@@ -2,6 +2,7 @@
 ## Input
 
 ```javascript
+// @enablePreserveExistingMemoizationGuarantees:false
 import {useCallback} from 'react';
 import {Stringify} from 'shared-runtime';
 
@@ -30,7 +31,7 @@ export const FIXTURE_ENTRYPOINT = {
 ## Code
 
 ```javascript
-import { c as _c } from "react/compiler-runtime";
+import { c as _c } from "react/compiler-runtime"; // @enablePreserveExistingMemoizationGuarantees:false
 import { useCallback } from "react";
 import { Stringify } from "shared-runtime";
 

compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/preserve-memo-validation/useCallback-reordering-depslist-assignment.tsx

@@ -1,3 +1,4 @@
+// @enablePreserveExistingMemoizationGuarantees:false
 import {useCallback} from 'react';
 import {Stringify} from 'shared-runtime';
 

compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/preserve-memo-validation/useMemo-reordering-depslist-assignment.expect.md

@@ -2,6 +2,7 @@
 ## Input
 
 ```javascript
+// @enablePreserveExistingMemoizationGuarantees:false
 import {useMemo} from 'react';
 
 function useFoo(arr1, arr2) {
@@ -26,7 +27,7 @@ export const FIXTURE_ENTRYPOINT = {
 ## Code
 
 ```javascript
-import { c as _c } from "react/compiler-runtime";
+import { c as _c } from "react/compiler-runtime"; // @enablePreserveExistingMemoizationGuarantees:false
 import { useMemo } from "react";
 
 function useFoo(arr1, arr2) {

compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/preserve-memo-validation/useMemo-reordering-depslist-assignment.ts

@@ -1,3 +1,4 @@
+// @enablePreserveExistingMemoizationGuarantees:false
 import {useMemo} from 'react';
 
 function useFoo(arr1, arr2) {

compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/preserve-memo-validation/useMemo-reordering-depslist-controlflow.expect.md

@@ -2,6 +2,7 @@
 ## Input
 
 ```javascript
+// @enablePreserveExistingMemoizationGuarantees:false
 import {useMemo} from 'react';
 import {Stringify} from 'shared-runtime';
 
@@ -35,7 +36,7 @@ export const FIXTURE_ENTRYPOINT = {
 ## Code
 
 ```javascript
-import { c as _c } from "react/compiler-runtime";
+import { c as _c } from "react/compiler-runtime"; // @enablePreserveExistingMemoizationGuarantees:false
 import { useMemo } from "react";
 import { Stringify } from "shared-runtime";