[compiler] ValidatePreservedManualMemoization reports detailed errors

This pass didn't previously report the precise difference btw inferred/manual dependencies unless a debug flag was set. But the error message is really good (nice job mofeiz): the only catch is that in theory the inferred dep could be a temporary that can't trivially be reported to the user.

But the messages are really useful for quickly verifying why the compiler couldn't preserve memoization. So here we switch to outputting a detailed message about the discrepancy btw inferred/manual deps so long as the inferred dep root is a named variable. I also slightly adjusted the message to handle the case where there is no diagnostic, which can occur if there were no manual deps but the compiler inferred a dependency.

ghstack-source-id: 534f6f1
Pull Request resolved: #33095

DiffTrain build for [73d7e81](73d7e81)

Author: josephsavona

compiled/eslint-plugin-react-hooks/index.js

@@ -50010,7 +50010,7 @@ class ReactiveScopeDependencyTreeHIR {
             depCursor = nextDepCursor;
             hoistableCursor = nextHoistableCursor;
         }
-        depCursor.accessType = merge(depCursor.accessType, PropertyAccessType.OptionalDependency);
+        depCursor.accessType = merge$1(depCursor.accessType, PropertyAccessType.OptionalDependency);
     }
     deriveMinimalDependencies() {
         const results = new Set();
@@ -50068,7 +50068,7 @@ function isDependency(access) {
     return (access === PropertyAccessType.OptionalDependency ||
         access === PropertyAccessType.UnconditionalDependency);
 }
-function merge(access1, access2) {
+function merge$1(access1, access2) {
     const resultIsUnconditional = !(isOptional(access1) && isOptional(access2));
     const resultIsDependency = isDependency(access1) || isDependency(access2);
     if (resultIsUnconditional) {
@@ -50125,7 +50125,7 @@ function makeOrMergeProperty(node, property, accessType) {
         node.properties.set(property, child);
     }
     else {
-        child.accessType = merge(child.accessType, accessType);
+        child.accessType = merge$1(child.accessType, accessType);
     }
     return child;
 }
@@ -53319,6 +53319,17 @@ function validatePreservedManualMemoization(fn) {
     visitReactiveFunction(fn, new Visitor(), state);
     return state.errors.asResult();
 }
+function prettyPrintScopeDependency(val) {
+    var _a;
+    let rootStr;
+    if (((_a = val.identifier.name) === null || _a === void 0 ? void 0 : _a.kind) === 'named') {
+        rootStr = val.identifier.name.value;
+    }
+    else {
+        rootStr = '[unnamed]';
+    }
+    return `${rootStr}${val.path.map(v => `${v.optional ? '?.' : '.'}${v.property}`).join('')}`;
+}
 var CompareDependencyResult;
 (function (CompareDependencyResult) {
     CompareDependencyResult[CompareDependencyResult["Ok"] = 0] = "Ok";
@@ -53327,6 +53338,22 @@ var CompareDependencyResult;
     CompareDependencyResult[CompareDependencyResult["Subpath"] = 3] = "Subpath";
     CompareDependencyResult[CompareDependencyResult["RefAccessDifference"] = 4] = "RefAccessDifference";
 })(CompareDependencyResult || (CompareDependencyResult = {}));
+function merge(a, b) {
+    return Math.max(a, b);
+}
+function getCompareDependencyResultDescription(result) {
+    switch (result) {
+        case CompareDependencyResult.Ok:
+            return 'Dependencies equal';
+        case CompareDependencyResult.RootDifference:
+        case CompareDependencyResult.PathDifference:
+            return 'Inferred different dependency than source';
+        case CompareDependencyResult.RefAccessDifference:
+            return 'Differences in ref.current access';
+        case CompareDependencyResult.Subpath:
+            return 'Inferred less specific property than source';
+    }
+}
 function compareDeps(inferred, source) {
     const rootsEqual = (inferred.root.kind === 'Global' &&
         source.root.kind === 'Global' &&
@@ -53404,16 +53431,26 @@ function validateInferredDep(dep, temporaries, declsWithinMemoBlock, validDepsIn
             return;
         }
     }
+    let errorDiagnostic = null;
     for (const originalDep of validDepsInMemoBlock) {
         const compareResult = compareDeps(normalizedDep, originalDep);
         if (compareResult === CompareDependencyResult.Ok) {
             return;
         }
+        else {
+            errorDiagnostic = merge(errorDiagnostic !== null && errorDiagnostic !== void 0 ? errorDiagnostic : compareResult, compareResult);
+        }
     }
     errorState.push({
         severity: ErrorSeverity.CannotPreserveMemoization,
         reason: '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',
-        description: null,
+        description: (dep.identifier.name != null && dep.identifier.name.kind === 'named')
+            ? `The inferred dependency was \`${prettyPrintScopeDependency(dep)}\`, but the source dependencies were [${validDepsInMemoBlock
+                .map(dep => printManualMemoDependency(dep, true))
+                .join(', ')}]. ${errorDiagnostic
+                ? getCompareDependencyResultDescription(errorDiagnostic)
+                : 'Inferred dependency not present in source'}`
+            : null,
         loc: memoLocation,
         suggestions: null,
     });

compiled/facebook-www/REVISION

@@ -1 +1 @@
-ac2cae524576b8091a6d78d9ab05627053949df1
+73d7e816b7746c700ab843964aaf11c17351fac1

compiled/facebook-www/REVISION_TRANSFORMS

@@ -1 +1 @@
-ac2cae524576b8091a6d78d9ab05627053949df1
+73d7e816b7746c700ab843964aaf11c17351fac1

compiled/facebook-www/React-dev.classic.js

@@ -1538,7 +1538,7 @@ __DEV__ &&
     exports.useTransition = function () {
       return resolveDispatcher().useTransition();
     };
-    exports.version = "19.2.0-www-classic-ac2cae52-20250503";
+    exports.version = "19.2.0-www-classic-73d7e816-20250503";
     "undefined" !== typeof __REACT_DEVTOOLS_GLOBAL_HOOK__ &&
       "function" ===
         typeof __REACT_DEVTOOLS_GLOBAL_HOOK__.registerInternalModuleStop &&

compiled/facebook-www/React-dev.modern.js

@@ -1538,7 +1538,7 @@ __DEV__ &&
     exports.useTransition = function () {
       return resolveDispatcher().useTransition();
     };
-    exports.version = "19.2.0-www-modern-ac2cae52-20250503";
+    exports.version = "19.2.0-www-modern-73d7e816-20250503";
     "undefined" !== typeof __REACT_DEVTOOLS_GLOBAL_HOOK__ &&
       "function" ===
         typeof __REACT_DEVTOOLS_GLOBAL_HOOK__.registerInternalModuleStop &&

compiled/facebook-www/React-prod.classic.js

@@ -636,4 +636,4 @@ exports.useSyncExternalStore = function (
 exports.useTransition = function () {
   return ReactSharedInternals.H.useTransition();
 };
-exports.version = "19.2.0-www-classic-ac2cae52-20250503";
+exports.version = "19.2.0-www-classic-73d7e816-20250503";

compiled/facebook-www/React-prod.modern.js

@@ -636,4 +636,4 @@ exports.useSyncExternalStore = function (
 exports.useTransition = function () {
   return ReactSharedInternals.H.useTransition();
 };
-exports.version = "19.2.0-www-modern-ac2cae52-20250503";
+exports.version = "19.2.0-www-modern-73d7e816-20250503";

compiled/facebook-www/React-profiling.classic.js

@@ -640,7 +640,7 @@ exports.useSyncExternalStore = function (
 exports.useTransition = function () {
   return ReactSharedInternals.H.useTransition();
 };
-exports.version = "19.2.0-www-classic-ac2cae52-20250503";
+exports.version = "19.2.0-www-classic-73d7e816-20250503";
 "undefined" !== typeof __REACT_DEVTOOLS_GLOBAL_HOOK__ &&
   "function" ===
     typeof __REACT_DEVTOOLS_GLOBAL_HOOK__.registerInternalModuleStop &&

compiled/facebook-www/React-profiling.modern.js

@@ -640,7 +640,7 @@ exports.useSyncExternalStore = function (
 exports.useTransition = function () {
   return ReactSharedInternals.H.useTransition();
 };
-exports.version = "19.2.0-www-modern-ac2cae52-20250503";
+exports.version = "19.2.0-www-modern-73d7e816-20250503";
 "undefined" !== typeof __REACT_DEVTOOLS_GLOBAL_HOOK__ &&
   "function" ===
     typeof __REACT_DEVTOOLS_GLOBAL_HOOK__.registerInternalModuleStop &&

compiled/facebook-www/ReactART-dev.classic.js

@@ -19014,10 +19014,10 @@ __DEV__ &&
     (function () {
       var internals = {
         bundleType: 1,
-        version: "19.2.0-www-classic-ac2cae52-20250503",
+        version: "19.2.0-www-classic-73d7e816-20250503",
         rendererPackageName: "react-art",
         currentDispatcherRef: ReactSharedInternals,
-        reconcilerVersion: "19.2.0-www-classic-ac2cae52-20250503"
+        reconcilerVersion: "19.2.0-www-classic-73d7e816-20250503"
       };
       internals.overrideHookState = overrideHookState;
       internals.overrideHookStateDeletePath = overrideHookStateDeletePath;
@@ -19051,7 +19051,7 @@ __DEV__ &&
     exports.Shape = Shape;
     exports.Surface = Surface;
     exports.Text = Text;
-    exports.version = "19.2.0-www-classic-ac2cae52-20250503";
+    exports.version = "19.2.0-www-classic-73d7e816-20250503";
     "undefined" !== typeof __REACT_DEVTOOLS_GLOBAL_HOOK__ &&
       "function" ===
         typeof __REACT_DEVTOOLS_GLOBAL_HOOK__.registerInternalModuleStop &&