diff --git a/compiler/packages/babel-plugin-react-compiler/src/Entrypoint/Pipeline.ts b/compiler/packages/babel-plugin-react-compiler/src/Entrypoint/Pipeline.ts index dc00bf14925..4068cb24a42 100644 --- a/compiler/packages/babel-plugin-react-compiler/src/Entrypoint/Pipeline.ts +++ b/compiler/packages/babel-plugin-react-compiler/src/Entrypoint/Pipeline.ts @@ -147,7 +147,10 @@ function* runWithEnvironment( validateContextVariableLValues(hir); validateUseMemo(hir); - if (!env.config.enablePreserveExistingManualUseMemo) { + if ( + !env.config.enablePreserveExistingManualUseMemo && + !env.config.disableMemoizationForDebugging + ) { dropManualMemoization(hir); yield log({ kind: "hir", name: "DropManualMemoization", value: hir }); } diff --git a/compiler/packages/babel-plugin-react-compiler/src/HIR/Environment.ts b/compiler/packages/babel-plugin-react-compiler/src/HIR/Environment.ts index 7375c35c765..6809742d80a 100644 --- a/compiler/packages/babel-plugin-react-compiler/src/HIR/Environment.ts +++ b/compiler/packages/babel-plugin-react-compiler/src/HIR/Environment.ts @@ -350,6 +350,15 @@ const EnvironmentConfigSchema = z.object({ */ enableTreatFunctionDepsAsConditional: z.boolean().default(false), + /** + * When true, always act as though the dependencies of a memoized value + * have changed. This makes the compiler not actually perform any optimizations, + * but is useful for debugging. Implicitly also sets + * @enablePreserveExistingManualUseMemo, because otherwise memoization in the + * original source will be disabled as well. + */ + disableMemoizationForDebugging: z.boolean().default(false), + /** * The react native re-animated library uses custom Babel transforms that * requires the calls to library API remain unmodified. diff --git a/compiler/packages/babel-plugin-react-compiler/src/ReactiveScopes/CodegenReactiveFunction.ts b/compiler/packages/babel-plugin-react-compiler/src/ReactiveScopes/CodegenReactiveFunction.ts index 075fb987922..fac5ea32d38 100644 --- a/compiler/packages/babel-plugin-react-compiler/src/ReactiveScopes/CodegenReactiveFunction.ts +++ b/compiler/packages/babel-plugin-react-compiler/src/ReactiveScopes/CodegenReactiveFunction.ts @@ -616,6 +616,14 @@ function codegenReactiveScope( ); } + if (cx.env.config.disableMemoizationForDebugging) { + testCondition = t.logicalExpression( + "||", + testCondition, + t.booleanLiteral(true) + ); + } + let computationBlock = codegenBlock(cx, block); computationBlock.body.push(...cacheStoreStatements); const memoBlock = t.blockStatement(cacheLoadStatements); diff --git a/compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/useMemo-simple-preserved-nomemo.expect.md b/compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/useMemo-simple-preserved-nomemo.expect.md new file mode 100644 index 00000000000..eac86076288 --- /dev/null +++ b/compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/useMemo-simple-preserved-nomemo.expect.md @@ -0,0 +1,66 @@ + +## Input + +```javascript +// @disableMemoizationForDebugging +import { useMemo } from "react"; + +function Component({ a }) { + let x = useMemo(() => [a], []); + return