From 81e1ee7476a68fdf13c63d3002e5ef1b699b6842 Mon Sep 17 00:00:00 2001
From: Joseph Savona <6425824+josephsavona@users.noreply.github.com>
Date: Wed, 9 Jul 2025 22:21:02 -0700
Subject: [PATCH 1/6] [compiler] Support inline enums (flow/ts), type
declarations (#33747)
Supports inline enum declarations in both Flow and TS by treating the
node as pass-through (enums can't capture values mutably). Related, this
PR extends the set of type-related declarations that we ignore.
Previously we threw a todo for things like DeclareClass or
DeclareVariable, but these are type related and can simply be dropped
just like we dropped TypeAlias.
---
[//]: # (BEGIN SAPLING FOOTER)
Stack created with [Sapling](https://sapling-scm.com). Best reviewed
with [ReviewStack](https://reviewstack.dev/facebook/react/pull/33747).
* #33753
* #33752
* #33751
* #33750
* #33748
* __->__ #33747
---
.../src/HIR/BuildHIR.ts | 25 +++++---
.../src/HIR/PrintHIR.ts | 3 +-
.../ReactiveScopes/PruneNonEscapingScopes.ts | 14 +++--
.../compiler/flow-enum-inline.expect.md | 60 +++++++++++++++++++
.../fixtures/compiler/flow-enum-inline.js | 18 ++++++
.../compiler/ts-enum-inline.expect.md | 59 ++++++++++++++++++
.../fixtures/compiler/ts-enum-inline.tsx | 17 ++++++
7 files changed, 179 insertions(+), 17 deletions(-)
create mode 100644 compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/flow-enum-inline.expect.md
create mode 100644 compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/flow-enum-inline.js
create mode 100644 compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/ts-enum-inline.expect.md
create mode 100644 compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/ts-enum-inline.tsx
diff --git a/compiler/packages/babel-plugin-react-compiler/src/HIR/BuildHIR.ts b/compiler/packages/babel-plugin-react-compiler/src/HIR/BuildHIR.ts
index efcfecce78..5bcf27b333 100644
--- a/compiler/packages/babel-plugin-react-compiler/src/HIR/BuildHIR.ts
+++ b/compiler/packages/babel-plugin-react-compiler/src/HIR/BuildHIR.ts
@@ -1388,10 +1388,13 @@ function lowerStatement(
});
return;
}
- case 'TypeAlias':
- case 'TSInterfaceDeclaration':
- case 'TSTypeAliasDeclaration': {
- // We do not preserve type annotations/syntax through transformation
+ case 'EnumDeclaration':
+ case 'TSEnumDeclaration': {
+ lowerValueToTemporary(builder, {
+ kind: 'UnsupportedNode',
+ loc: stmtPath.node.loc ?? GeneratedSource,
+ node: stmtPath.node,
+ });
return;
}
case 'DeclareClass':
@@ -1404,15 +1407,19 @@ function lowerStatement(
case 'DeclareOpaqueType':
case 'DeclareTypeAlias':
case 'DeclareVariable':
- case 'EnumDeclaration':
+ case 'InterfaceDeclaration':
+ case 'OpaqueType':
+ case 'TSDeclareFunction':
+ case 'TSInterfaceDeclaration':
+ case 'TSTypeAliasDeclaration':
+ case 'TypeAlias': {
+ // We do not preserve type annotations/syntax through transformation
+ return;
+ }
case 'ExportAllDeclaration':
case 'ExportDefaultDeclaration':
case 'ExportNamedDeclaration':
case 'ImportDeclaration':
- case 'InterfaceDeclaration':
- case 'OpaqueType':
- case 'TSDeclareFunction':
- case 'TSEnumDeclaration':
case 'TSExportAssignment':
case 'TSImportEqualsDeclaration':
case 'TSModuleDeclaration':
diff --git a/compiler/packages/babel-plugin-react-compiler/src/HIR/PrintHIR.ts b/compiler/packages/babel-plugin-react-compiler/src/HIR/PrintHIR.ts
index caaced124e..23471a00b0 100644
--- a/compiler/packages/babel-plugin-react-compiler/src/HIR/PrintHIR.ts
+++ b/compiler/packages/babel-plugin-react-compiler/src/HIR/PrintHIR.ts
@@ -5,7 +5,6 @@
* LICENSE file in the root directory of this source tree.
*/
-import generate from '@babel/generator';
import {CompilerError} from '../CompilerError';
import {printReactiveScopeSummary} from '../ReactiveScopes/PrintReactiveFunction';
import DisjointSet from '../Utils/DisjointSet';
@@ -466,7 +465,7 @@ export function printInstructionValue(instrValue: ReactiveValue): string {
break;
}
case 'UnsupportedNode': {
- value = `UnsupportedNode(${generate(instrValue.node).code})`;
+ value = `UnsupportedNode ${instrValue.node.type}`;
break;
}
case 'LoadLocal': {
diff --git a/compiler/packages/babel-plugin-react-compiler/src/ReactiveScopes/PruneNonEscapingScopes.ts b/compiler/packages/babel-plugin-react-compiler/src/ReactiveScopes/PruneNonEscapingScopes.ts
index 52a0312dcd..8484a1ca8d 100644
--- a/compiler/packages/babel-plugin-react-compiler/src/ReactiveScopes/PruneNonEscapingScopes.ts
+++ b/compiler/packages/babel-plugin-react-compiler/src/ReactiveScopes/PruneNonEscapingScopes.ts
@@ -829,12 +829,14 @@ class CollectDependenciesVisitor extends ReactiveFunctionVisitor<
};
}
case 'UnsupportedNode': {
- CompilerError.invariant(false, {
- reason: `Unexpected unsupported node`,
- description: null,
- loc: value.loc,
- suggestions: null,
- });
+ const lvalues = [];
+ if (lvalue !== null) {
+ lvalues.push({place: lvalue, level: MemoizationLevel.Never});
+ }
+ return {
+ lvalues,
+ rvalues: [],
+ };
}
default: {
assertExhaustive(
diff --git a/compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/flow-enum-inline.expect.md b/compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/flow-enum-inline.expect.md
new file mode 100644
index 0000000000..dfbf4fbfd9
--- /dev/null
+++ b/compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/flow-enum-inline.expect.md
@@ -0,0 +1,60 @@
+
+## Input
+
+```javascript
+// @flow
+function Component(props) {
+ enum Bool {
+ True = 'true',
+ False = 'false',
+ }
+
+ let bool: Bool = Bool.False;
+ if (props.value) {
+ bool = Bool.True;
+ }
+ return {bool}
;
+}
+
+export const FIXTURE_ENTRYPOINT = {
+ fn: Component,
+ params: [{value: true}],
+};
+
+```
+
+## Code
+
+```javascript
+import { c as _c } from "react/compiler-runtime";
+function Component(props) {
+ const $ = _c(2);
+ enum Bool {
+ True = "true",
+ False = "false",
+ }
+
+ let bool = Bool.False;
+ if (props.value) {
+ bool = Bool.True;
+ }
+ let t0;
+ if ($[0] !== bool) {
+ t0 = {bool}
;
+ $[0] = bool;
+ $[1] = t0;
+ } else {
+ t0 = $[1];
+ }
+ return t0;
+}
+
+export const FIXTURE_ENTRYPOINT = {
+ fn: Component,
+ params: [{ value: true }],
+};
+
+```
+
+### Eval output
+(kind: exception) Bool is not defined
\ No newline at end of file
diff --git a/compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/flow-enum-inline.js b/compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/flow-enum-inline.js
new file mode 100644
index 0000000000..42708c19e0
--- /dev/null
+++ b/compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/flow-enum-inline.js
@@ -0,0 +1,18 @@
+// @flow
+function Component(props) {
+ enum Bool {
+ True = 'true',
+ False = 'false',
+ }
+
+ let bool: Bool = Bool.False;
+ if (props.value) {
+ bool = Bool.True;
+ }
+ return {bool}
;
+}
+
+export const FIXTURE_ENTRYPOINT = {
+ fn: Component,
+ params: [{value: true}],
+};
diff --git a/compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/ts-enum-inline.expect.md b/compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/ts-enum-inline.expect.md
new file mode 100644
index 0000000000..bb31427d08
--- /dev/null
+++ b/compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/ts-enum-inline.expect.md
@@ -0,0 +1,59 @@
+
+## Input
+
+```javascript
+function Component(props) {
+ enum Bool {
+ True = 'true',
+ False = 'false',
+ }
+
+ let bool: Bool = Bool.False;
+ if (props.value) {
+ bool = Bool.True;
+ }
+ return {bool}
;
+}
+
+export const FIXTURE_ENTRYPOINT = {
+ fn: Component,
+ params: [{value: true}],
+};
+
+```
+
+## Code
+
+```javascript
+import { c as _c } from "react/compiler-runtime";
+function Component(props) {
+ const $ = _c(2);
+ enum Bool {
+ True = "true",
+ False = "false",
+ }
+
+ let bool = Bool.False;
+ if (props.value) {
+ bool = Bool.True;
+ }
+ let t0;
+ if ($[0] !== bool) {
+ t0 = {bool}
;
+ $[0] = bool;
+ $[1] = t0;
+ } else {
+ t0 = $[1];
+ }
+ return t0;
+}
+
+export const FIXTURE_ENTRYPOINT = {
+ fn: Component,
+ params: [{ value: true }],
+};
+
+```
+
+### Eval output
+(kind: ok) true
\ No newline at end of file
diff --git a/compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/ts-enum-inline.tsx b/compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/ts-enum-inline.tsx
new file mode 100644
index 0000000000..7fcec79259
--- /dev/null
+++ b/compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/ts-enum-inline.tsx
@@ -0,0 +1,17 @@
+function Component(props) {
+ enum Bool {
+ True = 'true',
+ False = 'false',
+ }
+
+ let bool: Bool = Bool.False;
+ if (props.value) {
+ bool = Bool.True;
+ }
+ return {bool}
;
+}
+
+export const FIXTURE_ENTRYPOINT = {
+ fn: Component,
+ params: [{value: true}],
+};
From d221c0f5659e1f4902e4e3b8e04e42aa996ce242 Mon Sep 17 00:00:00 2001
From: Joe Savona
Date: Wed, 9 Jul 2025 22:22:08 -0700
Subject: [PATCH 2/6] [compiler] More precise errors for invalid
import/export/namespace statements
import, export, and TS namespace statements can only be used at the top-level of a module, which is enforced by parsers already. Here we add a backup validation of that. As of this PR, we now have only major statement type (class declarations) listed as a todo.
---
.../src/HIR/BuildHIR.ts | 57 ++++++++++++-------
1 file changed, 36 insertions(+), 21 deletions(-)
diff --git a/compiler/packages/babel-plugin-react-compiler/src/HIR/BuildHIR.ts b/compiler/packages/babel-plugin-react-compiler/src/HIR/BuildHIR.ts
index 5bcf27b333..996f92dd9b 100644
--- a/compiler/packages/babel-plugin-react-compiler/src/HIR/BuildHIR.ts
+++ b/compiler/packages/babel-plugin-react-compiler/src/HIR/BuildHIR.ts
@@ -1397,6 +1397,41 @@ function lowerStatement(
});
return;
}
+ case 'ExportAllDeclaration':
+ case 'ExportDefaultDeclaration':
+ case 'ExportNamedDeclaration':
+ case 'ImportDeclaration':
+ case 'TSExportAssignment':
+ case 'TSImportEqualsDeclaration': {
+ builder.errors.push({
+ reason:
+ 'JavaScript `import` and `export` statements may only appear at the top level of a module',
+ severity: ErrorSeverity.InvalidJS,
+ loc: stmtPath.node.loc ?? null,
+ suggestions: null,
+ });
+ lowerValueToTemporary(builder, {
+ kind: 'UnsupportedNode',
+ loc: stmtPath.node.loc ?? GeneratedSource,
+ node: stmtPath.node,
+ });
+ return;
+ }
+ case 'TSNamespaceExportDeclaration': {
+ builder.errors.push({
+ reason:
+ 'TypeScript `namespace` statements may only appear at the top level of a module',
+ severity: ErrorSeverity.InvalidJS,
+ loc: stmtPath.node.loc ?? null,
+ suggestions: null,
+ });
+ lowerValueToTemporary(builder, {
+ kind: 'UnsupportedNode',
+ loc: stmtPath.node.loc ?? GeneratedSource,
+ node: stmtPath.node,
+ });
+ return;
+ }
case 'DeclareClass':
case 'DeclareExportAllDeclaration':
case 'DeclareExportDeclaration':
@@ -1411,32 +1446,12 @@ function lowerStatement(
case 'OpaqueType':
case 'TSDeclareFunction':
case 'TSInterfaceDeclaration':
+ case 'TSModuleDeclaration':
case 'TSTypeAliasDeclaration':
case 'TypeAlias': {
// We do not preserve type annotations/syntax through transformation
return;
}
- case 'ExportAllDeclaration':
- case 'ExportDefaultDeclaration':
- case 'ExportNamedDeclaration':
- case 'ImportDeclaration':
- case 'TSExportAssignment':
- case 'TSImportEqualsDeclaration':
- case 'TSModuleDeclaration':
- case 'TSNamespaceExportDeclaration': {
- builder.errors.push({
- reason: `(BuildHIR::lowerStatement) Handle ${stmtPath.type} statements`,
- severity: ErrorSeverity.Todo,
- loc: stmtPath.node.loc ?? null,
- suggestions: null,
- });
- lowerValueToTemporary(builder, {
- kind: 'UnsupportedNode',
- loc: stmtPath.node.loc ?? GeneratedSource,
- node: stmtPath.node,
- });
- return;
- }
default: {
return assertExhaustive(
stmtNode,
From 21be5d2812e38087ef2ca2f7e684b2ede594da11 Mon Sep 17 00:00:00 2001
From: Joe Savona
Date: Wed, 9 Jul 2025 22:22:08 -0700
Subject: [PATCH 3/6] [compiler] Add CompilerError.UnsupportedJS variant
We use this variant for syntax we intentionally don't support: with statements, eval, and inline class declarations.
---
.../src/CompilerError.ts | 13 +++++++++++--
.../src/HIR/BuildHIR.ts | 16 +++++++++-------
.../error.invalid-eval-unsupported.expect.md | 2 +-
.../compiler/error.todo-kitchensink.expect.md | 2 +-
4 files changed, 22 insertions(+), 11 deletions(-)
diff --git a/compiler/packages/babel-plugin-react-compiler/src/CompilerError.ts b/compiler/packages/babel-plugin-react-compiler/src/CompilerError.ts
index 7285140de0..75e01abaef 100644
--- a/compiler/packages/babel-plugin-react-compiler/src/CompilerError.ts
+++ b/compiler/packages/babel-plugin-react-compiler/src/CompilerError.ts
@@ -15,6 +15,11 @@ export enum ErrorSeverity {
* misunderstanding on the user’s part.
*/
InvalidJS = 'InvalidJS',
+ /**
+ * JS syntax that is not supported and which we do not plan to support. Developers should
+ * rewrite to use supported forms.
+ */
+ UnsupportedJS = 'UnsupportedJS',
/**
* Code that breaks the rules of React.
*/
@@ -241,12 +246,16 @@ export class CompilerError extends Error {
case ErrorSeverity.InvalidJS:
case ErrorSeverity.InvalidReact:
case ErrorSeverity.InvalidConfig:
+ case ErrorSeverity.UnsupportedJS: {
return true;
+ }
case ErrorSeverity.CannotPreserveMemoization:
- case ErrorSeverity.Todo:
+ case ErrorSeverity.Todo: {
return false;
- default:
+ }
+ default: {
assertExhaustive(detail.severity, 'Unhandled error severity');
+ }
}
});
}
diff --git a/compiler/packages/babel-plugin-react-compiler/src/HIR/BuildHIR.ts b/compiler/packages/babel-plugin-react-compiler/src/HIR/BuildHIR.ts
index 996f92dd9b..d0335fb3a4 100644
--- a/compiler/packages/babel-plugin-react-compiler/src/HIR/BuildHIR.ts
+++ b/compiler/packages/babel-plugin-react-compiler/src/HIR/BuildHIR.ts
@@ -1359,7 +1359,7 @@ function lowerStatement(
builder.errors.push({
reason: `JavaScript 'with' syntax is not supported`,
description: `'with' syntax is considered deprecated and removed from JavaScript standards, consider alternatives`,
- severity: ErrorSeverity.InvalidJS,
+ severity: ErrorSeverity.UnsupportedJS,
loc: stmtPath.node.loc ?? null,
suggestions: null,
});
@@ -1371,13 +1371,15 @@ function lowerStatement(
return;
}
case 'ClassDeclaration': {
- /*
- * We can in theory support nested classes, similarly to functions where we track values
- * captured by the class and consider mutations of the instances to mutate the class itself
+ /**
+ * In theory we could support inline class declarations, but this is rare enough in practice
+ * and complex enough to support that we don't anticipate supporting anytime soon. Developers
+ * are encouraged to lift classes out of component/hook declarations.
*/
builder.errors.push({
- reason: `Support nested class declarations`,
- severity: ErrorSeverity.Todo,
+ reason: 'Inline `class` declarations are not supported',
+ description: `Move class declarations outside of components/hooks`,
+ severity: ErrorSeverity.UnsupportedJS,
loc: stmtPath.node.loc ?? null,
suggestions: null,
});
@@ -3560,7 +3562,7 @@ function lowerIdentifier(
reason: `The 'eval' function is not supported`,
description:
'Eval is an anti-pattern in JavaScript, and the code executed cannot be evaluated by React Compiler',
- severity: ErrorSeverity.InvalidJS,
+ severity: ErrorSeverity.UnsupportedJS,
loc: exprPath.node.loc ?? null,
suggestions: null,
});
diff --git a/compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/error.invalid-eval-unsupported.expect.md b/compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/error.invalid-eval-unsupported.expect.md
index 409fa2b85f..73eddd5dcf 100644
--- a/compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/error.invalid-eval-unsupported.expect.md
+++ b/compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/error.invalid-eval-unsupported.expect.md
@@ -15,7 +15,7 @@ function Component(props) {
```
1 | function Component(props) {
> 2 | eval('props.x = true');
- | ^^^^ InvalidJS: The 'eval' function is not supported. Eval is an anti-pattern in JavaScript, and the code executed cannot be evaluated by React Compiler (2:2)
+ | ^^^^ UnsupportedJS: The 'eval' function is not supported. Eval is an anti-pattern in JavaScript, and the code executed cannot be evaluated by React Compiler (2:2)
3 | return
;
4 | }
5 |
diff --git a/compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/error.todo-kitchensink.expect.md b/compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/error.todo-kitchensink.expect.md
index 7c415e467f..7da1b677bf 100644
--- a/compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/error.todo-kitchensink.expect.md
+++ b/compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/error.todo-kitchensink.expect.md
@@ -84,7 +84,7 @@ let moduleLocal = false;
> 3 | var x = [];
| ^^^^^^^^^^^ Todo: (BuildHIR::lowerStatement) Handle var kinds in VariableDeclaration (3:3)
-Todo: Support nested class declarations (5:10)
+UnsupportedJS: Inline `class` declarations are not supported. Move class declarations outside of components/hooks (5:10)
Todo: (BuildHIR::lowerStatement) Handle non-variable initialization in ForStatement (20:22)
From 4c893794c005cfd45bbae79bbf355a8e395223da Mon Sep 17 00:00:00 2001
From: Joe Savona
Date: Wed, 9 Jul 2025 22:22:08 -0700
Subject: [PATCH 4/6] [compiler][wip] Improve diagnostic infra
Work in progress, i'm experimenting with revamping our diagnostic infra. Starting with a better format for representing errors, with an ability to point ot multiple locations, along with better printing of errors. Of course, Babel still controls the printing in the majority case so this still needs more work.
---
.../src/CompilerError.ts | 169 +++++++++++++++++-
.../src/Entrypoint/Options.ts | 8 +-
.../ValidateNoUntransformedReferences.ts | 60 ++++---
.../src/HIR/BuildHIR.ts | 21 ++-
.../src/HIR/Environment.ts | 2 +-
.../src/HIR/HIRBuilder.ts | 17 +-
...odo.computed-lval-in-destructure.expect.md | 8 +-
...global-in-component-tag-function.expect.md | 8 +-
...or.assign-global-in-jsx-children.expect.md | 8 +-
...n-global-in-jsx-spread-attribute.expect.md | 8 +-
...rror.bailout-on-flow-suppression.expect.md | 10 +-
...ut-on-suppression-of-custom-rule.expect.md | 26 ++-
...ive-ref-validation-in-use-effect.expect.md | 22 ++-
...-destructuring-asignment-complex.expect.md | 8 +-
...apitalized-function-call-aliased.expect.md | 10 +-
.../error.capitalized-function-call.expect.md | 10 +-
.../error.capitalized-method-call.expect.md | 10 +-
.../error.capture-ref-for-mutation.expect.md | 50 +++++-
...ook-unknown-hook-react-namespace.expect.md | 8 +-
...conditional-hooks-as-method-call.expect.md | 8 +-
...ext-variable-only-chained-assign.expect.md | 10 +-
...variable-in-function-declaration.expect.md | 10 +-
...ror.default-param-accesses-local.expect.md | 8 +-
...rror.dont-hoist-inline-reference.expect.md | 10 +-
...r.emit-freeze-conflicting-global.expect.md | 10 +-
...erences-variable-its-assigned-to.expect.md | 10 +-
...ession-with-conditional-optional.expect.md | 10 +-
...mber-expression-with-conditional.expect.md | 10 +-
...ting-simple-function-declaration.expect.md | 8 +-
...call-freezes-captured-identifier.expect.md | 8 +-
...call-freezes-captured-memberexpr.expect.md | 8 +-
...or.hook-property-load-local-hook.expect.md | 22 ++-
.../compiler/error.hook-ref-value.expect.md | 22 ++-
...alid-ReactUseMemo-async-callback.expect.md | 8 +-
...invalid-access-ref-during-render.expect.md | 8 +-
...-callback-invoked-during-render-.expect.md | 8 +-
.../error.invalid-array-push-frozen.expect.md | 8 +-
...ror.invalid-assign-hook-to-local.expect.md | 8 +-
...d-computed-store-to-frozen-value.expect.md | 8 +-
...itional-call-aliased-hook-import.expect.md | 8 +-
...ditional-call-aliased-react-hook.expect.md | 8 +-
...l-call-non-hook-imported-as-hook.expect.md | 8 +-
...-conditional-setState-in-useMemo.expect.md | 22 ++-
...omputed-property-of-frozen-value.expect.md | 8 +-
...-delete-property-of-frozen-value.expect.md | 8 +-
...destructure-assignment-to-global.expect.md | 8 +-
...ucture-to-local-global-variables.expect.md | 8 +-
...-disallow-mutating-ref-in-render.expect.md | 8 +-
...tating-refs-in-render-transitive.expect.md | 22 ++-
.../error.invalid-eval-unsupported.expect.md | 10 +-
...pression-mutates-immutable-value.expect.md | 10 +-
...lid-global-reassignment-indirect.expect.md | 8 +-
.../error.invalid-hoisting-setstate.expect.md | 26 ++-
...-argument-mutates-local-variable.expect.md | 22 ++-
...valid-impure-functions-in-render.expect.md | 42 ++++-
...id-jsx-captures-context-variable.expect.md | 10 +-
...alid-mutate-after-aliased-freeze.expect.md | 8 +-
...rror.invalid-mutate-after-freeze.expect.md | 8 +-
...valid-mutate-context-in-callback.expect.md | 10 +-
.../error.invalid-mutate-context.expect.md | 8 +-
...-mutate-props-in-effect-fixpoint.expect.md | 10 +-
...mutate-props-via-for-of-iterator.expect.md | 8 +-
...rror.invalid-mutation-in-closure.expect.md | 10 +-
...n-of-possible-props-phi-indirect.expect.md | 10 +-
...eassign-local-variable-in-effect.expect.md | 10 +-
...d-reanimated-shared-value-writes.expect.md | 10 +-
...as-memo-dep-non-optional-in-body.expect.md | 10 +-
...or.invalid-pass-hook-as-call-arg.expect.md | 8 +-
.../error.invalid-pass-hook-as-prop.expect.md | 8 +-
...id-pass-mutable-function-as-prop.expect.md | 22 ++-
...ror.invalid-pass-ref-to-function.expect.md | 8 +-
...r.invalid-prop-mutation-indirect.expect.md | 10 +-
...d-property-store-to-frozen-value.expect.md | 8 +-
...rops-mutation-in-effect-indirect.expect.md | 10 +-
...d-ref-prop-in-render-destructure.expect.md | 8 +-
...ref-prop-in-render-property-load.expect.md | 8 +-
.../error.invalid-reassign-const.expect.md | 10 +-
...ssign-local-in-hook-return-value.expect.md | 10 +-
...local-variable-in-async-callback.expect.md | 10 +-
...eassign-local-variable-in-effect.expect.md | 10 +-
...-local-variable-in-hook-argument.expect.md | 10 +-
...n-local-variable-in-jsx-callback.expect.md | 10 +-
...n-callback-invoked-during-render.expect.md | 8 +-
...error.invalid-ref-value-as-props.expect.md | 8 +-
...eturn-mutable-function-from-hook.expect.md | 22 ++-
...d-set-and-read-ref-during-render.expect.md | 21 ++-
...ef-nested-property-during-render.expect.md | 21 ++-
...-in-useMemo-indirect-useCallback.expect.md | 8 +-
...rror.invalid-setState-in-useMemo.expect.md | 22 ++-
....invalid-sketchy-code-use-forget.expect.md | 26 ++-
...invalid-ternary-with-hook-values.expect.md | 47 ++++-
...name-not-typed-as-hook-namespace.expect.md | 10 +-
...ider-hook-name-not-typed-as-hook.expect.md | 10 +-
...hooklike-module-default-not-hook.expect.md | 10 +-
...vider-nonhook-name-typed-as-hook.expect.md | 10 +-
...es-memoizes-with-captures-values.expect.md | 22 ++-
...alid-unclosed-eslint-suppression.expect.md | 10 +-
...nconditional-set-state-in-render.expect.md | 22 ++-
...f-added-to-dep-without-type-info.expect.md | 22 ++-
...-memoized-bc-range-overlaps-hook.expect.md | 8 +-
...valid-useEffect-dep-not-memoized.expect.md | 8 +-
...InsertionEffect-dep-not-memoized.expect.md | 8 +-
...useLayoutEffect-dep-not-memoized.expect.md | 8 +-
...r.invalid-useMemo-async-callback.expect.md | 8 +-
...or.invalid-useMemo-callback-args.expect.md | 8 +-
...rite-but-dont-read-ref-in-render.expect.md | 8 +-
...invalid-write-ref-prop-in-render.expect.md | 8 +-
.../compiler/error.modify-state-2.expect.md | 8 +-
.../compiler/error.modify-state.expect.md | 8 +-
.../error.modify-useReducer-state.expect.md | 8 +-
...ange-shared-inner-outer-function.expect.md | 10 +-
.../error.mutate-function-property.expect.md | 8 +-
...lobal-increment-op-invalid-react.expect.md | 8 +-
.../error.mutate-hook-argument.expect.md | 21 ++-
...rror.mutate-property-from-global.expect.md | 8 +-
.../compiler/error.mutate-props.expect.md | 8 +-
.../error.nomemo-and-change-detect.expect.md | 1 +
...or.not-useEffect-external-mutate.expect.md | 22 ++-
...r.object-capture-global-mutation.expect.md | 8 +-
.../error.propertyload-hook.expect.md | 21 ++-
.../error.reassign-global-fn-arg.expect.md | 8 +-
....reassignment-to-global-indirect.expect.md | 22 ++-
.../error.reassignment-to-global.expect.md | 21 ++-
...ror.ref-initialization-arbitrary.expect.md | 22 ++-
.../error.ref-initialization-call-2.expect.md | 8 +-
.../error.ref-initialization-call.expect.md | 8 +-
.../error.ref-initialization-linear.expect.md | 8 +-
.../error.ref-initialization-nonif.expect.md | 24 ++-
.../error.ref-initialization-other.expect.md | 8 +-
...ref-initialization-post-access-2.expect.md | 8 +-
...r.ref-initialization-post-access.expect.md | 8 +-
.../error.ref-like-name-not-Ref.expect.md | 10 +-
.../error.ref-like-name-not-a-ref.expect.md | 10 +-
.../compiler/error.ref-optional.expect.md | 8 +-
.../error.repro-ref-mutable-range.expect.md | 8 +-
...ror.sketchy-code-exhaustive-deps.expect.md | 10 +-
...rror.sketchy-code-rules-of-hooks.expect.md | 10 +-
.../error.store-property-in-global.expect.md | 8 +-
.../error.todo-for-await-loops.expect.md | 8 +-
...p-with-context-variable-iterator.expect.md | 8 +-
...p-with-context-variable-iterator.expect.md | 8 +-
...ences-later-variable-declaration.expect.md | 10 +-
...error.todo-functiondecl-hoisting.expect.md | 8 +-
...andle-update-context-identifiers.expect.md | 8 +-
.../error.todo-hoist-function-decls.expect.md | 8 +-
...ted-function-in-unreachable-code.expect.md | 8 +-
...-hoisting-simple-var-declaration.expect.md | 8 +-
...ok-call-spreads-mutable-iterator.expect.md | 8 +-
...-catch-in-outer-try-with-finally.expect.md | 8 +-
...-invalid-jsx-in-try-with-finally.expect.md | 8 +-
.../compiler/error.todo-kitchensink.expect.md | 166 +++++++++++++++--
...ical-expression-within-try-catch.expect.md | 8 +-
...wer-property-load-into-temporary.expect.md | 8 +-
...or.todo-new-target-meta-property.expect.md | 8 +-
...after-construction-sequence-expr.expect.md | 8 +-
...dified-during-after-construction.expect.md | 8 +-
...te-key-while-constructing-object.expect.md | 8 +-
...odo-object-expression-get-syntax.expect.md | 8 +-
...ject-expression-member-expr-call.expect.md | 8 +-
...odo-object-expression-set-syntax.expect.md | 8 +-
...ional-call-chain-in-logical-expr.expect.md | 8 +-
...-optional-call-chain-in-optional.expect.md | 8 +-
...o-optional-call-chain-in-ternary.expect.md | 8 +-
.../error.todo-reassign-const.expect.md | 8 +-
...-declaration-for-all-identifiers.expect.md | 8 +-
...ed-function-inferred-as-mutation.expect.md | 8 +-
...from-inferred-mutation-in-logger.expect.md | 52 +++++-
...on-with-shadowed-local-same-name.expect.md | 10 +-
...ack-captured-in-context-variable.expect.md | 8 +-
...ified-later-preserve-memoization.expect.md | 8 +-
...todo-valid-functiondecl-hoisting.expect.md | 8 +-
.../error.todo.try-catch-with-throw.expect.md | 8 +-
...state-in-render-after-loop-break.expect.md | 8 +-
...l-set-state-in-render-after-loop.expect.md | 8 +-
...-state-in-render-with-loop-throw.expect.md | 8 +-
...r.unconditional-set-state-lambda.expect.md | 8 +-
...tate-nested-function-expressions.expect.md | 8 +-
...ror.update-global-should-bailout.expect.md | 8 +-
...ia-function-preserve-memoization.expect.md | 22 ++-
...operty-dont-preserve-memoization.expect.md | 8 +-
...error.useMemo-callback-generator.expect.md | 8 +-
...ror.useMemo-non-literal-depslist.expect.md | 8 +-
...ror.validate-blocklisted-imports.expect.md | 10 +-
...ffect-deps-invalidated-dep-value.expect.md | 8 +-
...alidate-mutate-ref-arg-in-render.expect.md | 8 +-
.../fbt/error.todo-fbt-as-local.expect.md | 8 +-
...rror.todo-fbt-unknown-enum-value.expect.md | 17 +-
.../error.todo-locally-require-fbt.expect.md | 8 +-
.../error.todo-multiple-fbt-plural.expect.md | 17 +-
...ntifier-nopanic-required-feature.expect.md | 8 +-
...ynamic-gating-invalid-identifier.expect.md | 10 +-
...e-in-non-react-fn-default-import.expect.md | 8 +-
.../error.callsite-in-non-react-fn.expect.md | 8 +-
.../error.non-inlined-effect-fn.expect.md | 8 +-
.../error.todo-dynamic-gating.expect.md | 8 +-
.../bailout-retry/error.todo-gating.expect.md | 8 +-
...mport-default-property-useEffect.expect.md | 8 +-
.../bailout-retry/error.todo-syntax.expect.md | 8 +-
.../bailout-retry/error.use-no-memo.expect.md | 8 +-
...in-catch-in-outer-try-with-catch.expect.md | 2 +-
.../invalid-jsx-in-try-with-catch.expect.md | 2 +-
...setState-in-useEffect-transitive.expect.md | 2 +-
.../invalid-setState-in-useEffect.expect.md | 2 +-
...valid-impure-functions-in-render.expect.md | 42 ++++-
...n-local-variable-in-jsx-callback.expect.md | 10 +-
...rozen-hoisted-storecontext-const.expect.md | 26 ++-
...back-captures-reassigned-context.expect.md | 22 ++-
.../error.mutate-frozen-value.expect.md | 8 +-
.../error.mutate-hook-argument.expect.md | 21 ++-
...or.not-useEffect-external-mutate.expect.md | 22 ++-
....reassignment-to-global-indirect.expect.md | 22 ++-
.../error.reassignment-to-global.expect.md | 21 ++-
...on-with-shadowed-local-same-name.expect.md | 10 +-
...ropped-infer-always-invalidating.expect.md | 8 +-
...sitive-useMemo-infer-mutate-deps.expect.md | 8 +-
...-positive-useMemo-overlap-scopes.expect.md | 8 +-
...ack-conditional-access-own-scope.expect.md | 10 +-
...ck-infer-conditional-value-block.expect.md | 42 ++++-
...back-captures-reassigned-context.expect.md | 22 ++-
...nvalid-useCallback-read-maybeRef.expect.md | 10 +-
...be-invalid-useMemo-read-maybeRef.expect.md | 10 +-
....maybe-mutable-ref-not-preserved.expect.md | 8 +-
...ve-use-memo-ref-missing-reactive.expect.md | 10 +-
...back-captures-invalidating-value.expect.md | 8 +-
.../error.useCallback-aliased-var.expect.md | 10 +-
...lback-conditional-access-noAlloc.expect.md | 10 +-
...less-specific-conditional-access.expect.md | 10 +-
...or.useCallback-property-call-dep.expect.md | 10 +-
.../error.useMemo-aliased-var.expect.md | 10 +-
...less-specific-conditional-access.expect.md | 10 +-
...specific-conditional-value-block.expect.md | 41 ++++-
...emo-property-call-chained-object.expect.md | 10 +-
.../error.useMemo-property-call-dep.expect.md | 10 +-
...o-unrelated-mutation-in-depslist.expect.md | 10 +-
.../error.useMemo-with-refs.flow.expect.md | 8 +-
....validate-useMemo-named-function.expect.md | 8 +-
...-optional-call-chain-in-optional.expect.md | 8 +-
...ession-with-conditional-optional.expect.md | 10 +-
...mber-expression-with-conditional.expect.md | 10 +-
...bail.rules-of-hooks-3d692676194b.expect.md | 10 +-
...bail.rules-of-hooks-8503ca76d6f8.expect.md | 10 +-
...r.invalid-call-phi-possibly-hook.expect.md | 35 +++-
...nally-call-local-named-like-hook.expect.md | 8 +-
...onally-call-prop-named-like-hook.expect.md | 8 +-
...dcall-hooklike-property-of-local.expect.md | 8 +-
...-call-hooklike-property-of-local.expect.md | 8 +-
...-dynamic-hook-via-hooklike-local.expect.md | 8 +-
....invalid-hook-after-early-return.expect.md | 8 +-
...invalid-hook-as-conditional-test.expect.md | 8 +-
.../error.invalid-hook-as-prop.expect.md | 8 +-
.../error.invalid-hook-for.expect.md | 22 ++-
...or.invalid-hook-from-hook-return.expect.md | 8 +-
...hook-from-property-of-other-hook.expect.md | 8 +-
.../error.invalid-hook-if-alternate.expect.md | 8 +-
...error.invalid-hook-if-consequent.expect.md | 8 +-
...ion-expression-object-expression.expect.md | 10 +-
...lid-hook-in-nested-object-method.expect.md | 10 +-
...invalid-hook-optional-methodcall.expect.md | 8 +-
...r.invalid-hook-optional-property.expect.md | 8 +-
.../error.invalid-hook-optionalcall.expect.md | 8 +-
...d-hook-reassigned-in-conditional.expect.md | 35 +++-
...alid-rules-of-hooks-1b9527f967f3.expect.md | 50 +++++-
...alid-rules-of-hooks-2aabd222fc6a.expect.md | 8 +-
...alid-rules-of-hooks-49d341e5d68f.expect.md | 8 +-
...alid-rules-of-hooks-79128a755612.expect.md | 8 +-
...alid-rules-of-hooks-9718e30b856c.expect.md | 8 +-
...alid-rules-of-hooks-9bf17c174134.expect.md | 21 ++-
...alid-rules-of-hooks-b4dcda3d60ed.expect.md | 8 +-
...alid-rules-of-hooks-c906cace44e9.expect.md | 8 +-
...alid-rules-of-hooks-d740d54e9c21.expect.md | 8 +-
...alid-rules-of-hooks-d85c144bdf40.expect.md | 22 ++-
...alid-rules-of-hooks-ea7c2fb545a9.expect.md | 8 +-
...alid-rules-of-hooks-f3d6c5e9c83d.expect.md | 8 +-
...alid-rules-of-hooks-f69800950ff0.expect.md | 35 +++-
...alid-rules-of-hooks-0a1dbff27ba0.expect.md | 10 +-
...alid-rules-of-hooks-0de1224ce64b.expect.md | 26 ++-
...alid-rules-of-hooks-449a37146a83.expect.md | 10 +-
...alid-rules-of-hooks-76a74b4666e9.expect.md | 10 +-
...alid-rules-of-hooks-d842d36db450.expect.md | 10 +-
...alid-rules-of-hooks-d952b82c2597.expect.md | 10 +-
...alid-rules-of-hooks-368024110a58.expect.md | 8 +-
...alid-rules-of-hooks-8566f9a360e2.expect.md | 8 +-
...alid-rules-of-hooks-a0058f0b446d.expect.md | 8 +-
...rror.rules-of-hooks-27c18dc8dad2.expect.md | 8 +-
...rror.rules-of-hooks-d0935abedc42.expect.md | 8 +-
...rror.rules-of-hooks-e29c874aa913.expect.md | 8 +-
...-constructed-component-in-render.expect.md | 4 +-
...ly-construct-component-in-render.expect.md | 4 +-
...y-constructed-component-function.expect.md | 4 +-
...onstructed-component-method-call.expect.md | 4 +-
...ically-constructed-component-new.expect.md | 4 +-
...rror.object-pattern-computed-key.expect.md | 8 +-
.../bailout-retry/error.todo-syntax.expect.md | 8 +-
...ror.untransformed-fire-reference.expect.md | 8 +-
.../bailout-retry/error.use-no-memo.expect.md | 8 +-
...ror.invalid-mix-fire-and-no-fire.expect.md | 10 +-
.../error.invalid-multiple-args.expect.md | 10 +-
.../error.invalid-nested-use-effect.expect.md | 10 +-
.../error.invalid-not-call.expect.md | 10 +-
.../error.invalid-outside-effect.expect.md | 26 ++-
...id-rewrite-deps-no-array-literal.expect.md | 10 +-
...rror.invalid-rewrite-deps-spread.expect.md | 10 +-
.../error.invalid-spread.expect.md | 10 +-
.../error.todo-method.expect.md | 10 +-
compiler/packages/snap/src/runner-worker.ts | 23 +--
305 files changed, 3375 insertions(+), 507 deletions(-)
diff --git a/compiler/packages/babel-plugin-react-compiler/src/CompilerError.ts b/compiler/packages/babel-plugin-react-compiler/src/CompilerError.ts
index 75e01abaef..8bc7566f48 100644
--- a/compiler/packages/babel-plugin-react-compiler/src/CompilerError.ts
+++ b/compiler/packages/babel-plugin-react-compiler/src/CompilerError.ts
@@ -5,6 +5,7 @@
* LICENSE file in the root directory of this source tree.
*/
+import {codeFrameColumns} from '@babel/code-frame';
import type {SourceLocation} from './HIR';
import {Err, Ok, Result} from './Utils/Result';
import {assertExhaustive} from './Utils/utils';
@@ -44,6 +45,40 @@ export enum ErrorSeverity {
Invariant = 'Invariant',
}
+export type CompilerDiagnosticOptions = {
+ severity: ErrorSeverity;
+ category: string;
+ description: string;
+ details: Array;
+ suggestions?: Array | null | undefined;
+};
+
+export type CompilerDiagnosticDetail =
+ /**
+ * Additional information not coupled to a specific location,
+ * generally linking to documentation.
+ */
+ | {
+ kind: 'info';
+ message: string;
+ }
+ /**
+ * The (a) source of the error
+ */
+ | {
+ kind: 'error';
+ loc: SourceLocation;
+ message: string;
+ }
+ /**
+ * A related part of the source code that does not directly contribute to the error
+ */
+ | {
+ kind: 'related';
+ loc: SourceLocation;
+ message: string;
+ };
+
export enum CompilerSuggestionOperation {
InsertBefore,
InsertAfter,
@@ -74,6 +109,73 @@ export type CompilerErrorDetailOptions = {
suggestions?: Array | null | undefined;
};
+export class CompilerDiagnostic {
+ options: CompilerDiagnosticOptions;
+
+ constructor(options: CompilerDiagnosticOptions) {
+ this.options = options;
+ }
+
+ get category(): CompilerDiagnosticOptions['category'] {
+ return this.options.category;
+ }
+ get description(): CompilerDiagnosticOptions['description'] {
+ return this.options.description;
+ }
+ get severity(): CompilerDiagnosticOptions['severity'] {
+ return this.options.severity;
+ }
+ get suggestions(): CompilerDiagnosticOptions['suggestions'] {
+ return this.options.suggestions;
+ }
+
+ printErrorMessage(source: string): string {
+ const buffer = [`${this.severity}: ${this.category}\n\n`, this.description];
+ for (const detail of this.options.details) {
+ switch (detail.kind) {
+ case 'error':
+ case 'related': {
+ const loc = detail.loc;
+ if (typeof loc === 'symbol') {
+ continue;
+ }
+ let codeFrame: string;
+ try {
+ codeFrame = codeFrameColumns(
+ source,
+ {
+ start: {
+ line: loc.start.line,
+ column: loc.start.column + 1,
+ },
+ end: {
+ line: loc.end.line,
+ column: loc.end.column + 1,
+ },
+ },
+ {
+ message: detail.message,
+ },
+ );
+ } catch (e) {
+ codeFrame = detail.message;
+ }
+ buffer.push(
+ `\n\n${loc.filename}:${loc.start.line}:${loc.start.column}\n`,
+ );
+ buffer.push(codeFrame);
+ }
+ }
+ }
+ return buffer.join('');
+ }
+
+ toString(): string {
+ const buffer = [`${this.severity}: ${this.category}\n\n`, this.description];
+ return buffer.join('');
+ }
+}
+
/*
* Each bailout or invariant in HIR lowering creates an {@link CompilerErrorDetail}, which is then
* aggregated into a single {@link CompilerError} later.
@@ -101,24 +203,58 @@ export class CompilerErrorDetail {
return this.options.suggestions;
}
- printErrorMessage(): string {
+ printErrorMessage(source: string): string {
const buffer = [`${this.severity}: ${this.reason}`];
if (this.description != null) {
- buffer.push(`. ${this.description}`);
+ buffer.push(`\n\n${this.description}.`);
}
- if (this.loc != null && typeof this.loc !== 'symbol') {
- buffer.push(` (${this.loc.start.line}:${this.loc.end.line})`);
+ const loc = this.loc;
+ if (loc != null && typeof loc !== 'symbol') {
+ let codeFrame: string;
+ try {
+ codeFrame = codeFrameColumns(
+ source,
+ {
+ start: {
+ line: loc.start.line,
+ column: loc.start.column + 1,
+ },
+ end: {
+ line: loc.end.line,
+ column: loc.end.column + 1,
+ },
+ },
+ {
+ message: this.reason,
+ },
+ );
+ } catch (e) {
+ codeFrame = '';
+ }
+ buffer.push(
+ `\n\n${loc.filename}:${loc.start.line}:${loc.start.column}\n`,
+ );
+ buffer.push(codeFrame);
+ buffer.push('\n\n');
}
return buffer.join('');
}
toString(): string {
- return this.printErrorMessage();
+ const buffer = [`${this.severity}: ${this.reason}`];
+ if (this.description != null) {
+ buffer.push(`. ${this.description}.`);
+ }
+ const loc = this.loc;
+ if (loc != null && typeof loc !== 'symbol') {
+ buffer.push(` (${loc.start.line}:${loc.start.column})`);
+ }
+ return buffer.join('');
}
}
export class CompilerError extends Error {
- details: Array = [];
+ details: Array = [];
static invariant(
condition: unknown,
@@ -136,6 +272,12 @@ export class CompilerError extends Error {
}
}
+ static throwDiagnostic(options: CompilerDiagnosticOptions): never {
+ const errors = new CompilerError();
+ errors.pushDiagnostic(new CompilerDiagnostic(options));
+ throw errors;
+ }
+
static throwTodo(
options: Omit,
): never {
@@ -210,6 +352,21 @@ export class CompilerError extends Error {
return this.name;
}
+ printErrorMessage(source: string): string {
+ return (
+ `Found ${this.details.length} errors:\n` +
+ this.details.map(detail => detail.printErrorMessage(source)).join('\n')
+ );
+ }
+
+ merge(other: CompilerError): void {
+ this.details.push(...other.details);
+ }
+
+ pushDiagnostic(diagnostic: CompilerDiagnostic): void {
+ this.details.push(diagnostic);
+ }
+
push(options: CompilerErrorDetailOptions): CompilerErrorDetail {
const detail = new CompilerErrorDetail({
reason: options.reason,
diff --git a/compiler/packages/babel-plugin-react-compiler/src/Entrypoint/Options.ts b/compiler/packages/babel-plugin-react-compiler/src/Entrypoint/Options.ts
index 0c23ceb345..f12ac76e34 100644
--- a/compiler/packages/babel-plugin-react-compiler/src/Entrypoint/Options.ts
+++ b/compiler/packages/babel-plugin-react-compiler/src/Entrypoint/Options.ts
@@ -7,7 +7,11 @@
import * as t from '@babel/types';
import {z} from 'zod';
-import {CompilerError, CompilerErrorDetailOptions} from '../CompilerError';
+import {
+ CompilerDiagnosticOptions,
+ CompilerError,
+ CompilerErrorDetailOptions,
+} from '../CompilerError';
import {
EnvironmentConfig,
ExternalFunction,
@@ -224,7 +228,7 @@ export type LoggerEvent =
export type CompileErrorEvent = {
kind: 'CompileError';
fnLoc: t.SourceLocation | null;
- detail: CompilerErrorDetailOptions;
+ detail: CompilerErrorDetailOptions | CompilerDiagnosticOptions;
};
export type CompileDiagnosticEvent = {
kind: 'CompileDiagnostic';
diff --git a/compiler/packages/babel-plugin-react-compiler/src/Entrypoint/ValidateNoUntransformedReferences.ts b/compiler/packages/babel-plugin-react-compiler/src/Entrypoint/ValidateNoUntransformedReferences.ts
index e288c227ad..83225effd9 100644
--- a/compiler/packages/babel-plugin-react-compiler/src/Entrypoint/ValidateNoUntransformedReferences.ts
+++ b/compiler/packages/babel-plugin-react-compiler/src/Entrypoint/ValidateNoUntransformedReferences.ts
@@ -8,32 +8,27 @@
import {NodePath} from '@babel/core';
import * as t from '@babel/types';
-import {
- CompilerError,
- CompilerErrorDetailOptions,
- EnvironmentConfig,
- ErrorSeverity,
- Logger,
-} from '..';
+import {CompilerError, EnvironmentConfig, ErrorSeverity, Logger} from '..';
import {getOrInsertWith} from '../Utils/utils';
-import {Environment} from '../HIR';
+import {Environment, GeneratedSource} from '../HIR';
import {DEFAULT_EXPORT} from '../HIR/Environment';
import {CompileProgramMetadata} from './Program';
+import {CompilerDiagnosticOptions} from '../CompilerError';
function throwInvalidReact(
- options: Omit,
+ options: Omit,
{logger, filename}: TraversalState,
): never {
- const detail: CompilerErrorDetailOptions = {
- ...options,
+ const detail: CompilerDiagnosticOptions = {
severity: ErrorSeverity.InvalidReact,
+ ...options,
};
logger?.logEvent(filename, {
kind: 'CompileError',
fnLoc: null,
detail,
});
- CompilerError.throw(detail);
+ CompilerError.throwDiagnostic(detail);
}
function assertValidEffectImportReference(
numArgs: number,
@@ -65,14 +60,18 @@ function assertValidEffectImportReference(
*/
throwInvalidReact(
{
- reason:
- '[InferEffectDependencies] React Compiler is unable to infer dependencies of this effect. ' +
- 'This will break your build! ' +
- 'To resolve, either pass your own dependency array or fix reported compiler bailout diagnostics.',
- description: maybeErrorDiagnostic
- ? `(Bailout reason: ${maybeErrorDiagnostic})`
- : null,
- loc: parent.node.loc ?? null,
+ category:
+ 'Cannot infer dependencies of this effect. This will break your build!',
+ description:
+ 'To resolve, either pass a dependency array or fix reported compiler bailout diagnostics.' +
+ (maybeErrorDiagnostic ? ` ${maybeErrorDiagnostic}` : ''),
+ details: [
+ {
+ kind: 'error',
+ message: 'Cannot infer dependencies',
+ loc: parent.node.loc ?? GeneratedSource,
+ },
+ ],
},
context,
);
@@ -92,13 +91,20 @@ function assertValidFireImportReference(
);
throwInvalidReact(
{
- reason:
- '[Fire] Untransformed reference to compiler-required feature. ' +
- 'Either remove this `fire` call or ensure it is successfully transformed by the compiler',
- description: maybeErrorDiagnostic
- ? `(Bailout reason: ${maybeErrorDiagnostic})`
- : null,
- loc: paths[0].node.loc ?? null,
+ category:
+ '[Fire] Untransformed reference to compiler-required feature.',
+ description:
+ 'Either remove this `fire` call or ensure it is successfully transformed by the compiler' +
+ maybeErrorDiagnostic
+ ? ` ${maybeErrorDiagnostic}`
+ : '',
+ details: [
+ {
+ kind: 'error',
+ message: 'Untransformed `fire` call',
+ loc: paths[0].node.loc ?? GeneratedSource,
+ },
+ ],
},
context,
);
diff --git a/compiler/packages/babel-plugin-react-compiler/src/HIR/BuildHIR.ts b/compiler/packages/babel-plugin-react-compiler/src/HIR/BuildHIR.ts
index d0335fb3a4..f21d0371ff 100644
--- a/compiler/packages/babel-plugin-react-compiler/src/HIR/BuildHIR.ts
+++ b/compiler/packages/babel-plugin-react-compiler/src/HIR/BuildHIR.ts
@@ -2271,11 +2271,17 @@ function lowerExpression(
});
for (const [name, locations] of Object.entries(fbtLocations)) {
if (locations.length > 1) {
- CompilerError.throwTodo({
- reason: `Support <${tagName}> tags with multiple <${tagName}:${name}> values`,
- loc: locations.at(-1) ?? GeneratedSource,
- description: null,
- suggestions: null,
+ CompilerError.throwDiagnostic({
+ severity: ErrorSeverity.Todo,
+ category: 'Support duplicate fbt tags',
+ description: `Support \`<${tagName}>\` tags with multiple \`<${tagName}:${name}>\` values`,
+ details: locations.map(loc => {
+ return {
+ kind: 'error',
+ message: `Multiple \`<${tagName}:${name}>\` tags found`,
+ loc,
+ };
+ }),
});
}
}
@@ -3501,9 +3507,8 @@ function lowerFunction(
);
let loweredFunc: HIRFunction;
if (lowering.isErr()) {
- lowering
- .unwrapErr()
- .details.forEach(detail => builder.errors.pushErrorDetail(detail));
+ const functionErrors = lowering.unwrapErr();
+ builder.errors.merge(functionErrors);
return null;
}
loweredFunc = lowering.unwrap();
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 90a352620c..f93dcf2ba8 100644
--- a/compiler/packages/babel-plugin-react-compiler/src/HIR/Environment.ts
+++ b/compiler/packages/babel-plugin-react-compiler/src/HIR/Environment.ts
@@ -779,7 +779,7 @@ export class Environment {
for (const error of errors.unwrapErr().details) {
this.logger.logEvent(this.filename, {
kind: 'CompileError',
- detail: error,
+ detail: error.options,
fnLoc: null,
});
}
diff --git a/compiler/packages/babel-plugin-react-compiler/src/HIR/HIRBuilder.ts b/compiler/packages/babel-plugin-react-compiler/src/HIR/HIRBuilder.ts
index c3a6c18d3a..81959ea361 100644
--- a/compiler/packages/babel-plugin-react-compiler/src/HIR/HIRBuilder.ts
+++ b/compiler/packages/babel-plugin-react-compiler/src/HIR/HIRBuilder.ts
@@ -7,7 +7,7 @@
import {Binding, NodePath} from '@babel/traverse';
import * as t from '@babel/types';
-import {CompilerError} from '../CompilerError';
+import {CompilerError, ErrorSeverity} from '../CompilerError';
import {Environment} from './Environment';
import {
BasicBlock,
@@ -308,9 +308,18 @@ export default class HIRBuilder {
resolveBinding(node: t.Identifier): Identifier {
if (node.name === 'fbt') {
- CompilerError.throwTodo({
- reason: 'Support local variables named "fbt"',
- loc: node.loc ?? null,
+ CompilerError.throwDiagnostic({
+ severity: ErrorSeverity.Todo,
+ category: 'Support local variables named `fbt`',
+ description:
+ 'Local variables named `fbt` may conflict with the fbt plugin and are not yet supported',
+ details: [
+ {
+ kind: 'error',
+ message: 'Rename to avoid conflict with fbt plugin',
+ loc: node.loc ?? GeneratedSource,
+ },
+ ],
});
}
const originalName = node.name;
diff --git a/compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/error._todo.computed-lval-in-destructure.expect.md b/compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/error._todo.computed-lval-in-destructure.expect.md
index f44ae83b2c..0b73e660e5 100644
--- a/compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/error._todo.computed-lval-in-destructure.expect.md
+++ b/compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/error._todo.computed-lval-in-destructure.expect.md
@@ -15,13 +15,19 @@ function Component(props) {
## Error
```
+Found 1 errors:
+Todo: (BuildHIR::lowerAssignment) Handle computed properties in ObjectPattern
+
+error._todo.computed-lval-in-destructure.ts:3:9
1 | function Component(props) {
2 | const computedKey = props.key;
> 3 | const {[computedKey]: x} = props.val;
- | ^^^^^^^^^^^^^^^^ Todo: (BuildHIR::lowerAssignment) Handle computed properties in ObjectPattern (3:3)
+ | ^^^^^^^^^^^^^^^^ (BuildHIR::lowerAssignment) Handle computed properties in ObjectPattern
4 |
5 | return x;
6 | }
+
+
```
\ No newline at end of file
diff --git a/compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/error.assign-global-in-component-tag-function.expect.md b/compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/error.assign-global-in-component-tag-function.expect.md
index 5553f235a0..4c4c1f3754 100644
--- a/compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/error.assign-global-in-component-tag-function.expect.md
+++ b/compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/error.assign-global-in-component-tag-function.expect.md
@@ -15,13 +15,19 @@ function Component() {
## Error
```
+Found 1 errors:
+InvalidReact: Unexpected reassignment of a variable which was defined outside of the component. Components and hooks should be pure and side-effect free, but variable reassignment is a form of side-effect. If this variable is used in rendering, use useState instead. (https://react.dev/reference/rules/components-and-hooks-must-be-pure#side-effects-must-run-outside-of-render)
+
+error.assign-global-in-component-tag-function.ts:3:4
1 | function Component() {
2 | const Foo = () => {
> 3 | someGlobal = true;
- | ^^^^^^^^^^ InvalidReact: Unexpected reassignment of a variable which was defined outside of the component. Components and hooks should be pure and side-effect free, but variable reassignment is a form of side-effect. If this variable is used in rendering, use useState instead. (https://react.dev/reference/rules/components-and-hooks-must-be-pure#side-effects-must-run-outside-of-render) (3:3)
+ | ^^^^^^^^^^ Unexpected reassignment of a variable which was defined outside of the component. Components and hooks should be pure and side-effect free, but variable reassignment is a form of side-effect. If this variable is used in rendering, use useState instead. (https://react.dev/reference/rules/components-and-hooks-must-be-pure#side-effects-must-run-outside-of-render)
4 | };
5 | return
;
7 | }
+
+
```
\ No newline at end of file
diff --git a/compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/error.bailout-on-flow-suppression.expect.md b/compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/error.bailout-on-flow-suppression.expect.md
index 1d5b4abdf7..d45d49b083 100644
--- a/compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/error.bailout-on-flow-suppression.expect.md
+++ b/compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/error.bailout-on-flow-suppression.expect.md
@@ -16,13 +16,21 @@ function Foo(props) {
## Error
```
+Found 1 errors:
+InvalidReact: React Compiler has skipped optimizing this component because one or more React rule violations were reported by Flow. React Compiler only works when your components follow all the rules of React, disabling them may result in unexpected or incorrect behavior
+
+$FlowFixMe[react-rule-hook].
+
+error.bailout-on-flow-suppression.ts:4:2
2 |
3 | function Foo(props) {
> 4 | // $FlowFixMe[react-rule-hook]
- | ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^ InvalidReact: React Compiler has skipped optimizing this component because one or more React rule violations were reported by Flow. React Compiler only works when your components follow all the rules of React, disabling them may result in unexpected or incorrect behavior. $FlowFixMe[react-rule-hook] (4:4)
+ | ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^ React Compiler has skipped optimizing this component because one or more React rule violations were reported by Flow. React Compiler only works when your components follow all the rules of React, disabling them may result in unexpected or incorrect behavior
5 | useX();
6 | return null;
7 | }
+
+
```
\ No newline at end of file
diff --git a/compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/error.bailout-on-suppression-of-custom-rule.expect.md b/compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/error.bailout-on-suppression-of-custom-rule.expect.md
index d74ebd119c..0bd596562f 100644
--- a/compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/error.bailout-on-suppression-of-custom-rule.expect.md
+++ b/compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/error.bailout-on-suppression-of-custom-rule.expect.md
@@ -19,15 +19,35 @@ function lowercasecomponent() {
## Error
```
+Found 2 errors:
+InvalidReact: React Compiler has skipped optimizing this component because one or more React ESLint rules were disabled. React Compiler only works when your components follow all the rules of React, disabling them may result in unexpected or incorrect behavior
+
+eslint-disable my-app/react-rule.
+
+error.bailout-on-suppression-of-custom-rule.ts:3:0
1 | // @eslintSuppressionRules:["my-app","react-rule"]
2 |
> 3 | /* eslint-disable my-app/react-rule */
- | ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^ InvalidReact: React Compiler has skipped optimizing this component because one or more React ESLint rules were disabled. React Compiler only works when your components follow all the rules of React, disabling them may result in unexpected or incorrect behavior. eslint-disable my-app/react-rule (3:3)
-
-InvalidReact: React Compiler has skipped optimizing this component because one or more React ESLint rules were disabled. React Compiler only works when your components follow all the rules of React, disabling them may result in unexpected or incorrect behavior. eslint-disable-next-line my-app/react-rule (7:7)
+ | ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^ React Compiler has skipped optimizing this component because one or more React ESLint rules were disabled. React Compiler only works when your components follow all the rules of React, disabling them may result in unexpected or incorrect behavior
4 | function lowercasecomponent() {
5 | 'use forget';
6 | const x = [];
+
+
+InvalidReact: React Compiler has skipped optimizing this component because one or more React ESLint rules were disabled. React Compiler only works when your components follow all the rules of React, disabling them may result in unexpected or incorrect behavior
+
+eslint-disable-next-line my-app/react-rule.
+
+error.bailout-on-suppression-of-custom-rule.ts:7:2
+ 5 | 'use forget';
+ 6 | const x = [];
+> 7 | // eslint-disable-next-line my-app/react-rule
+ | ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^ React Compiler has skipped optimizing this component because one or more React ESLint rules were disabled. React Compiler only works when your components follow all the rules of React, disabling them may result in unexpected or incorrect behavior
+ 8 | return {x}
;
+ 9 | }
+ 10 | /* eslint-enable my-app/react-rule */
+
+
```
\ No newline at end of file
diff --git a/compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/error.bug-old-inference-false-positive-ref-validation-in-use-effect.expect.md b/compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/error.bug-old-inference-false-positive-ref-validation-in-use-effect.expect.md
index e1cebb00df..59b7141798 100644
--- a/compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/error.bug-old-inference-false-positive-ref-validation-in-use-effect.expect.md
+++ b/compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/error.bug-old-inference-false-positive-ref-validation-in-use-effect.expect.md
@@ -36,6 +36,10 @@ function Component() {
## Error
```
+Found 2 errors:
+InvalidReact: This argument is a function which may reassign or mutate local variables after render, which can cause inconsistent behavior on subsequent renders. Consider using state instead
+
+error.bug-old-inference-false-positive-ref-validation-in-use-effect.ts:20:12
18 | );
19 | const ref = useRef(null);
> 20 | useEffect(() => {
@@ -47,12 +51,24 @@ function Component() {
> 23 | }
| ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^
> 24 | }, [update]);
- | ^^^^ InvalidReact: This argument is a function which may reassign or mutate local variables after render, which can cause inconsistent behavior on subsequent renders. Consider using state instead (20:24)
-
-InvalidReact: The function modifies a local variable here (14:14)
+ | ^^^^ This argument is a function which may reassign or mutate local variables after render, which can cause inconsistent behavior on subsequent renders. Consider using state instead
25 |
26 | return 'ok';
27 | }
+
+
+InvalidReact: The function modifies a local variable here
+
+error.bug-old-inference-false-positive-ref-validation-in-use-effect.ts:14:6
+ 12 | ...partialParams,
+ 13 | };
+> 14 | nextParams.param = 'value';
+ | ^^^^^^^^^^ The function modifies a local variable here
+ 15 | console.log(nextParams);
+ 16 | },
+ 17 | [params]
+
+
```
\ No newline at end of file
diff --git a/compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/error.call-args-destructuring-asignment-complex.expect.md b/compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/error.call-args-destructuring-asignment-complex.expect.md
index cb2ce1a20d..c7bd14d9fe 100644
--- a/compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/error.call-args-destructuring-asignment-complex.expect.md
+++ b/compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/error.call-args-destructuring-asignment-complex.expect.md
@@ -14,13 +14,19 @@ function Component(props) {
## Error
```
+Found 1 errors:
+Invariant: Const declaration cannot be referenced as an expression
+
+error.call-args-destructuring-asignment-complex.ts:3:9
1 | function Component(props) {
2 | let x = makeObject();
> 3 | x.foo(([[x]] = makeObject()));
- | ^^^^^ Invariant: Const declaration cannot be referenced as an expression (3:3)
+ | ^^^^^ Const declaration cannot be referenced as an expression
4 | return x;
5 | }
6 |
+
+
```
\ No newline at end of file
diff --git a/compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/error.capitalized-function-call-aliased.expect.md b/compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/error.capitalized-function-call-aliased.expect.md
index 94b3ae1035..1a1677a2e9 100644
--- a/compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/error.capitalized-function-call-aliased.expect.md
+++ b/compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/error.capitalized-function-call-aliased.expect.md
@@ -14,12 +14,20 @@ function Foo() {
## Error
```
+Found 1 errors:
+InvalidReact: Capitalized functions are reserved for components, which must be invoked with JSX. If this is a component, render it with JSX. Otherwise, ensure that it has no hook calls and rename it to begin with a lowercase letter. Alternatively, if you know for a fact that this function is not a component, you can allowlist it via the compiler config
+
+Bar may be a component..
+
+error.capitalized-function-call-aliased.ts:4:2
2 | function Foo() {
3 | let x = Bar;
> 4 | x(); // ERROR
- | ^^^ InvalidReact: Capitalized functions are reserved for components, which must be invoked with JSX. If this is a component, render it with JSX. Otherwise, ensure that it has no hook calls and rename it to begin with a lowercase letter. Alternatively, if you know for a fact that this function is not a component, you can allowlist it via the compiler config. Bar may be a component. (4:4)
+ | ^^^ Capitalized functions are reserved for components, which must be invoked with JSX. If this is a component, render it with JSX. Otherwise, ensure that it has no hook calls and rename it to begin with a lowercase letter. Alternatively, if you know for a fact that this function is not a component, you can allowlist it via the compiler config
5 | }
6 |
+
+
```
\ No newline at end of file
diff --git a/compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/error.capitalized-function-call.expect.md b/compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/error.capitalized-function-call.expect.md
index d8b0f8facf..fbd769a348 100644
--- a/compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/error.capitalized-function-call.expect.md
+++ b/compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/error.capitalized-function-call.expect.md
@@ -15,13 +15,21 @@ function Component() {
## Error
```
+Found 1 errors:
+InvalidReact: Capitalized functions are reserved for components, which must be invoked with JSX. If this is a component, render it with JSX. Otherwise, ensure that it has no hook calls and rename it to begin with a lowercase letter. Alternatively, if you know for a fact that this function is not a component, you can allowlist it via the compiler config
+
+SomeFunc may be a component..
+
+error.capitalized-function-call.ts:3:12
1 | // @validateNoCapitalizedCalls
2 | function Component() {
> 3 | const x = SomeFunc();
- | ^^^^^^^^^^ InvalidReact: Capitalized functions are reserved for components, which must be invoked with JSX. If this is a component, render it with JSX. Otherwise, ensure that it has no hook calls and rename it to begin with a lowercase letter. Alternatively, if you know for a fact that this function is not a component, you can allowlist it via the compiler config. SomeFunc may be a component. (3:3)
+ | ^^^^^^^^^^ Capitalized functions are reserved for components, which must be invoked with JSX. If this is a component, render it with JSX. Otherwise, ensure that it has no hook calls and rename it to begin with a lowercase letter. Alternatively, if you know for a fact that this function is not a component, you can allowlist it via the compiler config
4 |
5 | return x;
6 | }
+
+
```
\ No newline at end of file
diff --git a/compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/error.capitalized-method-call.expect.md b/compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/error.capitalized-method-call.expect.md
index 39dc43e4a5..8dee13830d 100644
--- a/compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/error.capitalized-method-call.expect.md
+++ b/compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/error.capitalized-method-call.expect.md
@@ -15,13 +15,21 @@ function Component() {
## Error
```
+Found 1 errors:
+InvalidReact: Capitalized functions are reserved for components, which must be invoked with JSX. If this is a component, render it with JSX. Otherwise, ensure that it has no hook calls and rename it to begin with a lowercase letter. Alternatively, if you know for a fact that this function is not a component, you can allowlist it via the compiler config
+
+SomeFunc may be a component..
+
+error.capitalized-method-call.ts:3:12
1 | // @validateNoCapitalizedCalls
2 | function Component() {
> 3 | const x = someGlobal.SomeFunc();
- | ^^^^^^^^^^^^^^^^^^^^^ InvalidReact: Capitalized functions are reserved for components, which must be invoked with JSX. If this is a component, render it with JSX. Otherwise, ensure that it has no hook calls and rename it to begin with a lowercase letter. Alternatively, if you know for a fact that this function is not a component, you can allowlist it via the compiler config. SomeFunc may be a component. (3:3)
+ | ^^^^^^^^^^^^^^^^^^^^^ Capitalized functions are reserved for components, which must be invoked with JSX. If this is a component, render it with JSX. Otherwise, ensure that it has no hook calls and rename it to begin with a lowercase letter. Alternatively, if you know for a fact that this function is not a component, you can allowlist it via the compiler config
4 |
5 | return x;
6 | }
+
+
```
\ No newline at end of file
diff --git a/compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/error.capture-ref-for-mutation.expect.md b/compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/error.capture-ref-for-mutation.expect.md
index cff34e3449..b6f6e91678 100644
--- a/compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/error.capture-ref-for-mutation.expect.md
+++ b/compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/error.capture-ref-for-mutation.expect.md
@@ -32,19 +32,55 @@ export const FIXTURE_ENTRYPOINT = {
## Error
```
+Found 4 errors:
+InvalidReact: This function accesses a ref value (the `current` property), which may not be accessed during render. (https://react.dev/reference/react/useRef)
+
+error.capture-ref-for-mutation.ts:12:13
10 | };
11 | const moveLeft = {
> 12 | handler: handleKey('left')(),
- | ^^^^^^^^^^^^^^^^^ InvalidReact: This function accesses a ref value (the `current` property), which may not be accessed during render. (https://react.dev/reference/react/useRef) (12:12)
-
-InvalidReact: Ref values (the `current` property) may not be accessed during render. (https://react.dev/reference/react/useRef) (12:12)
-
-InvalidReact: This function accesses a ref value (the `current` property), which may not be accessed during render. (https://react.dev/reference/react/useRef) (15:15)
-
-InvalidReact: Ref values (the `current` property) may not be accessed during render. (https://react.dev/reference/react/useRef) (15:15)
+ | ^^^^^^^^^^^^^^^^^ This function accesses a ref value (the `current` property), which may not be accessed during render. (https://react.dev/reference/react/useRef)
13 | };
14 | const moveRight = {
15 | handler: handleKey('right')(),
+
+
+InvalidReact: Ref values (the `current` property) may not be accessed during render. (https://react.dev/reference/react/useRef)
+
+error.capture-ref-for-mutation.ts:12:13
+ 10 | };
+ 11 | const moveLeft = {
+> 12 | handler: handleKey('left')(),
+ | ^^^^^^^^^^^^^^^^^ Ref values (the `current` property) may not be accessed during render. (https://react.dev/reference/react/useRef)
+ 13 | };
+ 14 | const moveRight = {
+ 15 | handler: handleKey('right')(),
+
+
+InvalidReact: This function accesses a ref value (the `current` property), which may not be accessed during render. (https://react.dev/reference/react/useRef)
+
+error.capture-ref-for-mutation.ts:15:13
+ 13 | };
+ 14 | const moveRight = {
+> 15 | handler: handleKey('right')(),
+ | ^^^^^^^^^^^^^^^^^^ This function accesses a ref value (the `current` property), which may not be accessed during render. (https://react.dev/reference/react/useRef)
+ 16 | };
+ 17 | return [moveLeft, moveRight];
+ 18 | }
+
+
+InvalidReact: Ref values (the `current` property) may not be accessed during render. (https://react.dev/reference/react/useRef)
+
+error.capture-ref-for-mutation.ts:15:13
+ 13 | };
+ 14 | const moveRight = {
+> 15 | handler: handleKey('right')(),
+ | ^^^^^^^^^^^^^^^^^^ Ref values (the `current` property) may not be accessed during render. (https://react.dev/reference/react/useRef)
+ 16 | };
+ 17 | return [moveLeft, moveRight];
+ 18 | }
+
+
```
\ No newline at end of file
diff --git a/compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/error.conditional-hook-unknown-hook-react-namespace.expect.md b/compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/error.conditional-hook-unknown-hook-react-namespace.expect.md
index 7ea8ae9809..de18121387 100644
--- a/compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/error.conditional-hook-unknown-hook-react-namespace.expect.md
+++ b/compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/error.conditional-hook-unknown-hook-react-namespace.expect.md
@@ -16,13 +16,19 @@ function Component(props) {
## Error
```
+Found 1 errors:
+InvalidReact: Hooks must always be called in a consistent order, and may not be called conditionally. See the Rules of Hooks (https://react.dev/warnings/invalid-hook-call-warning)
+
+error.conditional-hook-unknown-hook-react-namespace.ts:4:8
2 | let x = null;
3 | if (props.cond) {
> 4 | x = React.useNonexistentHook();
- | ^^^^^^^^^^^^^^^^^^^^^^^^ InvalidReact: Hooks must always be called in a consistent order, and may not be called conditionally. See the Rules of Hooks (https://react.dev/warnings/invalid-hook-call-warning) (4:4)
+ | ^^^^^^^^^^^^^^^^^^^^^^^^ Hooks must always be called in a consistent order, and may not be called conditionally. See the Rules of Hooks (https://react.dev/warnings/invalid-hook-call-warning)
5 | }
6 | return x;
7 | }
+
+
```
\ No newline at end of file
diff --git a/compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/error.conditional-hooks-as-method-call.expect.md b/compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/error.conditional-hooks-as-method-call.expect.md
index c2ad547414..0af4a0e0bc 100644
--- a/compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/error.conditional-hooks-as-method-call.expect.md
+++ b/compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/error.conditional-hooks-as-method-call.expect.md
@@ -16,13 +16,19 @@ function Component(props) {
## Error
```
+Found 1 errors:
+InvalidReact: Hooks must always be called in a consistent order, and may not be called conditionally. See the Rules of Hooks (https://react.dev/warnings/invalid-hook-call-warning)
+
+error.conditional-hooks-as-method-call.ts:4:8
2 | let x = null;
3 | if (props.cond) {
> 4 | x = Foo.useFoo();
- | ^^^^^^^^^^ InvalidReact: Hooks must always be called in a consistent order, and may not be called conditionally. See the Rules of Hooks (https://react.dev/warnings/invalid-hook-call-warning) (4:4)
+ | ^^^^^^^^^^ Hooks must always be called in a consistent order, and may not be called conditionally. See the Rules of Hooks (https://react.dev/warnings/invalid-hook-call-warning)
5 | }
6 | return x;
7 | }
+
+
```
\ No newline at end of file
diff --git a/compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/error.context-variable-only-chained-assign.expect.md b/compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/error.context-variable-only-chained-assign.expect.md
index 0318fa9525..2d8b629b2d 100644
--- a/compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/error.context-variable-only-chained-assign.expect.md
+++ b/compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/error.context-variable-only-chained-assign.expect.md
@@ -28,13 +28,21 @@ export const FIXTURE_ENTRYPOINT = {
## Error
```
+Found 1 errors:
+InvalidReact: Reassigning a variable after render has completed can cause inconsistent behavior on subsequent renders. Consider using state instead
+
+Variable `x` cannot be reassigned after render.
+
+error.context-variable-only-chained-assign.ts:10:19
8 | };
9 | const fn2 = () => {
> 10 | const copy2 = (x = 4);
- | ^ InvalidReact: Reassigning a variable after render has completed can cause inconsistent behavior on subsequent renders. Consider using state instead. Variable `x` cannot be reassigned after render (10:10)
+ | ^ Reassigning a variable after render has completed can cause inconsistent behavior on subsequent renders. Consider using state instead
11 | return [invoke(fn1), copy2, identity(copy2)];
12 | };
13 | return invoke(fn2);
+
+
```
\ No newline at end of file
diff --git a/compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/error.declare-reassign-variable-in-function-declaration.expect.md b/compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/error.declare-reassign-variable-in-function-declaration.expect.md
index 2a6dce11f2..31875f00ee 100644
--- a/compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/error.declare-reassign-variable-in-function-declaration.expect.md
+++ b/compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/error.declare-reassign-variable-in-function-declaration.expect.md
@@ -17,13 +17,21 @@ function Component() {
## Error
```
+Found 1 errors:
+InvalidReact: Reassigning a variable after render has completed can cause inconsistent behavior on subsequent renders. Consider using state instead
+
+Variable `x` cannot be reassigned after render.
+
+error.declare-reassign-variable-in-function-declaration.ts:4:4
2 | let x = null;
3 | function foo() {
> 4 | x = 9;
- | ^ InvalidReact: Reassigning a variable after render has completed can cause inconsistent behavior on subsequent renders. Consider using state instead. Variable `x` cannot be reassigned after render (4:4)
+ | ^ Reassigning a variable after render has completed can cause inconsistent behavior on subsequent renders. Consider using state instead
5 | }
6 | const y = bar(foo);
7 | return
;
6 | }
+
+
```
\ No newline at end of file
diff --git a/compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/error.hoist-optional-member-expression-with-conditional-optional.expect.md b/compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/error.hoist-optional-member-expression-with-conditional-optional.expect.md
index 048fee7ee1..65a7dc3652 100644
--- a/compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/error.hoist-optional-member-expression-with-conditional-optional.expect.md
+++ b/compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/error.hoist-optional-member-expression-with-conditional-optional.expect.md
@@ -24,6 +24,12 @@ function Component(props) {
## Error
```
+Found 1 errors:
+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
+
+The inferred dependency was `props.items`, but the source dependencies were [props?.items, props.cond]. Inferred different dependency than source.
+
+error.hoist-optional-member-expression-with-conditional-optional.ts:4:23
2 | import {ValidateMemoization} from 'shared-runtime';
3 | function Component(props) {
> 4 | const data = useMemo(() => {
@@ -41,10 +47,12 @@ function Component(props) {
> 10 | return x;
| ^^^^^^^^^^^^^^^^^
> 11 | }, [props?.items, props.cond]);
- | ^^^^ 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. The inferred dependency was `props.items`, but the source dependencies were [props?.items, props.cond]. Inferred different dependency than source (4:11)
+ | ^^^^ 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
12 | return (
13 | {props.items.map(item => renderItem(item))} ;
- | ^^^^^^^^^^^^^^^^^^^^^^^^ InvalidReact: Ref values (the `current` property) may not be accessed during render. (https://react.dev/reference/react/useRef) (9:9)
+ | ^^^^^^^^^^^^^^^^^^^^^^^^ Ref values (the `current` property) may not be accessed during render. (https://react.dev/reference/react/useRef)
10 | }
11 |
+
+
```
\ No newline at end of file
diff --git a/compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/error.invalid-array-push-frozen.expect.md b/compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/error.invalid-array-push-frozen.expect.md
index 0440117adb..5677496df7 100644
--- a/compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/error.invalid-array-push-frozen.expect.md
+++ b/compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/error.invalid-array-push-frozen.expect.md
@@ -15,13 +15,19 @@ function Component(props) {
## Error
```
+Found 1 errors:
+InvalidReact: Updating a value used previously in JSX is not allowed. Consider moving the mutation before the JSX
+
+error.invalid-array-push-frozen.ts:4:2
2 | const x = [];
3 | {x}
;
> 4 | x.push(props.value);
- | ^ InvalidReact: Updating a value used previously in JSX is not allowed. Consider moving the mutation before the JSX (4:4)
+ | ^ Updating a value used previously in JSX is not allowed. Consider moving the mutation before the JSX
5 | return x;
6 | }
7 |
+
+
```
\ No newline at end of file
diff --git a/compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/error.invalid-assign-hook-to-local.expect.md b/compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/error.invalid-assign-hook-to-local.expect.md
index a4327cf961..0b42f1c2ce 100644
--- a/compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/error.invalid-assign-hook-to-local.expect.md
+++ b/compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/error.invalid-assign-hook-to-local.expect.md
@@ -14,12 +14,18 @@ function Component(props) {
## Error
```
+Found 1 errors:
+InvalidReact: Hooks may not be referenced as normal values, they must be called. See https://react.dev/reference/rules/react-calls-components-and-hooks#never-pass-around-hooks-as-regular-values
+
+error.invalid-assign-hook-to-local.ts:2:12
1 | function Component(props) {
> 2 | const x = useState;
- | ^^^^^^^^ InvalidReact: Hooks may not be referenced as normal values, they must be called. See https://react.dev/reference/rules/react-calls-components-and-hooks#never-pass-around-hooks-as-regular-values (2:2)
+ | ^^^^^^^^ Hooks may not be referenced as normal values, they must be called. See https://react.dev/reference/rules/react-calls-components-and-hooks#never-pass-around-hooks-as-regular-values
3 | const state = x(null);
4 | return state[0];
5 | }
+
+
```
\ No newline at end of file
diff --git a/compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/error.invalid-computed-store-to-frozen-value.expect.md b/compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/error.invalid-computed-store-to-frozen-value.expect.md
index 2318d38feb..2649ed0b85 100644
--- a/compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/error.invalid-computed-store-to-frozen-value.expect.md
+++ b/compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/error.invalid-computed-store-to-frozen-value.expect.md
@@ -16,13 +16,19 @@ function Component(props) {
## Error
```
+Found 1 errors:
+InvalidReact: Updating a value used previously in JSX is not allowed. Consider moving the mutation before the JSX
+
+error.invalid-computed-store-to-frozen-value.ts:5:2
3 | // freeze
4 | {x}
;
> 5 | x[0] = true;
- | ^ InvalidReact: Updating a value used previously in JSX is not allowed. Consider moving the mutation before the JSX (5:5)
+ | ^ Updating a value used previously in JSX is not allowed. Consider moving the mutation before the JSX
6 | return x;
7 | }
8 |
+
+
```
\ No newline at end of file
diff --git a/compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/error.invalid-conditional-call-aliased-hook-import.expect.md b/compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/error.invalid-conditional-call-aliased-hook-import.expect.md
index 14bf830546..f2e6d48dce 100644
--- a/compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/error.invalid-conditional-call-aliased-hook-import.expect.md
+++ b/compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/error.invalid-conditional-call-aliased-hook-import.expect.md
@@ -18,13 +18,19 @@ function Component(props) {
## Error
```
+Found 1 errors:
+InvalidReact: Hooks must always be called in a consistent order, and may not be called conditionally. See the Rules of Hooks (https://react.dev/warnings/invalid-hook-call-warning)
+
+error.invalid-conditional-call-aliased-hook-import.ts:6:11
4 | let data;
5 | if (props.cond) {
> 6 | data = readFragment();
- | ^^^^^^^^^^^^ InvalidReact: Hooks must always be called in a consistent order, and may not be called conditionally. See the Rules of Hooks (https://react.dev/warnings/invalid-hook-call-warning) (6:6)
+ | ^^^^^^^^^^^^ Hooks must always be called in a consistent order, and may not be called conditionally. See the Rules of Hooks (https://react.dev/warnings/invalid-hook-call-warning)
7 | }
8 | return data;
9 | }
+
+
```
\ No newline at end of file
diff --git a/compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/error.invalid-conditional-call-aliased-react-hook.expect.md b/compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/error.invalid-conditional-call-aliased-react-hook.expect.md
index 6c81f3d2be..996f524f84 100644
--- a/compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/error.invalid-conditional-call-aliased-react-hook.expect.md
+++ b/compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/error.invalid-conditional-call-aliased-react-hook.expect.md
@@ -18,13 +18,19 @@ function Component(props) {
## Error
```
+Found 1 errors:
+InvalidReact: Hooks must always be called in a consistent order, and may not be called conditionally. See the Rules of Hooks (https://react.dev/warnings/invalid-hook-call-warning)
+
+error.invalid-conditional-call-aliased-react-hook.ts:6:10
4 | let s;
5 | if (props.cond) {
> 6 | [s] = state();
- | ^^^^^ InvalidReact: Hooks must always be called in a consistent order, and may not be called conditionally. See the Rules of Hooks (https://react.dev/warnings/invalid-hook-call-warning) (6:6)
+ | ^^^^^ Hooks must always be called in a consistent order, and may not be called conditionally. See the Rules of Hooks (https://react.dev/warnings/invalid-hook-call-warning)
7 | }
8 | return s;
9 | }
+
+
```
\ No newline at end of file
diff --git a/compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/error.invalid-conditional-call-non-hook-imported-as-hook.expect.md b/compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/error.invalid-conditional-call-non-hook-imported-as-hook.expect.md
index d0fb92e751..21c57fd244 100644
--- a/compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/error.invalid-conditional-call-non-hook-imported-as-hook.expect.md
+++ b/compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/error.invalid-conditional-call-non-hook-imported-as-hook.expect.md
@@ -18,13 +18,19 @@ function Component(props) {
## Error
```
+Found 1 errors:
+InvalidReact: Hooks must always be called in a consistent order, and may not be called conditionally. See the Rules of Hooks (https://react.dev/warnings/invalid-hook-call-warning)
+
+error.invalid-conditional-call-non-hook-imported-as-hook.ts:6:11
4 | let data;
5 | if (props.cond) {
> 6 | data = useArray();
- | ^^^^^^^^ InvalidReact: Hooks must always be called in a consistent order, and may not be called conditionally. See the Rules of Hooks (https://react.dev/warnings/invalid-hook-call-warning) (6:6)
+ | ^^^^^^^^ Hooks must always be called in a consistent order, and may not be called conditionally. See the Rules of Hooks (https://react.dev/warnings/invalid-hook-call-warning)
7 | }
8 | return data;
9 | }
+
+
```
\ No newline at end of file
diff --git a/compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/error.invalid-conditional-setState-in-useMemo.expect.md b/compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/error.invalid-conditional-setState-in-useMemo.expect.md
index f1666cc401..509d96f484 100644
--- a/compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/error.invalid-conditional-setState-in-useMemo.expect.md
+++ b/compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/error.invalid-conditional-setState-in-useMemo.expect.md
@@ -22,15 +22,31 @@ function Component({item, cond}) {
## Error
```
+Found 2 errors:
+InvalidReact: Calling setState from useMemo may trigger an infinite loop. (https://react.dev/reference/react/useState)
+
+error.invalid-conditional-setState-in-useMemo.ts:7:6
5 | useMemo(() => {
6 | if (cond) {
> 7 | setPrevItem(item);
- | ^^^^^^^^^^^ InvalidReact: Calling setState from useMemo may trigger an infinite loop. (https://react.dev/reference/react/useState) (7:7)
-
-InvalidReact: Calling setState from useMemo may trigger an infinite loop. (https://react.dev/reference/react/useState) (8:8)
+ | ^^^^^^^^^^^ Calling setState from useMemo may trigger an infinite loop. (https://react.dev/reference/react/useState)
8 | setState(0);
9 | }
10 | }, [cond, key, init]);
+
+
+InvalidReact: Calling setState from useMemo may trigger an infinite loop. (https://react.dev/reference/react/useState)
+
+error.invalid-conditional-setState-in-useMemo.ts:8:6
+ 6 | if (cond) {
+ 7 | setPrevItem(item);
+> 8 | setState(0);
+ | ^^^^^^^^ Calling setState from useMemo may trigger an infinite loop. (https://react.dev/reference/react/useState)
+ 9 | }
+ 10 | }, [cond, key, init]);
+ 11 |
+
+
```
\ No newline at end of file
diff --git a/compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/error.invalid-delete-computed-property-of-frozen-value.expect.md b/compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/error.invalid-delete-computed-property-of-frozen-value.expect.md
index 7116e4d197..a92053c023 100644
--- a/compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/error.invalid-delete-computed-property-of-frozen-value.expect.md
+++ b/compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/error.invalid-delete-computed-property-of-frozen-value.expect.md
@@ -16,13 +16,19 @@ function Component(props) {
## Error
```
+Found 1 errors:
+InvalidReact: Updating a value used previously in JSX is not allowed. Consider moving the mutation before the JSX
+
+error.invalid-delete-computed-property-of-frozen-value.ts:5:9
3 | // freeze
4 | {x}
;
> 5 | delete x[y];
- | ^ InvalidReact: Updating a value used previously in JSX is not allowed. Consider moving the mutation before the JSX (5:5)
+ | ^ Updating a value used previously in JSX is not allowed. Consider moving the mutation before the JSX
6 | return x;
7 | }
8 |
+
+
```
\ No newline at end of file
diff --git a/compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/error.invalid-delete-property-of-frozen-value.expect.md b/compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/error.invalid-delete-property-of-frozen-value.expect.md
index c6176d1afc..b1f9001caf 100644
--- a/compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/error.invalid-delete-property-of-frozen-value.expect.md
+++ b/compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/error.invalid-delete-property-of-frozen-value.expect.md
@@ -16,13 +16,19 @@ function Component(props) {
## Error
```
+Found 1 errors:
+InvalidReact: Updating a value used previously in JSX is not allowed. Consider moving the mutation before the JSX
+
+error.invalid-delete-property-of-frozen-value.ts:5:9
3 | // freeze
4 | {x}
;
> 5 | delete x.y;
- | ^ InvalidReact: Updating a value used previously in JSX is not allowed. Consider moving the mutation before the JSX (5:5)
+ | ^ Updating a value used previously in JSX is not allowed. Consider moving the mutation before the JSX
6 | return x;
7 | }
8 |
+
+
```
\ No newline at end of file
diff --git a/compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/error.invalid-destructure-assignment-to-global.expect.md b/compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/error.invalid-destructure-assignment-to-global.expect.md
index b3471873eb..cc130c020c 100644
--- a/compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/error.invalid-destructure-assignment-to-global.expect.md
+++ b/compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/error.invalid-destructure-assignment-to-global.expect.md
@@ -13,12 +13,18 @@ function useFoo(props) {
## Error
```
+Found 1 errors:
+InvalidReact: Unexpected reassignment of a variable which was defined outside of the component. Components and hooks should be pure and side-effect free, but variable reassignment is a form of side-effect. If this variable is used in rendering, use useState instead. (https://react.dev/reference/rules/components-and-hooks-must-be-pure#side-effects-must-run-outside-of-render)
+
+error.invalid-destructure-assignment-to-global.ts:2:3
1 | function useFoo(props) {
> 2 | [x] = props;
- | ^ InvalidReact: Unexpected reassignment of a variable which was defined outside of the component. Components and hooks should be pure and side-effect free, but variable reassignment is a form of side-effect. If this variable is used in rendering, use useState instead. (https://react.dev/reference/rules/components-and-hooks-must-be-pure#side-effects-must-run-outside-of-render) (2:2)
+ | ^ Unexpected reassignment of a variable which was defined outside of the component. Components and hooks should be pure and side-effect free, but variable reassignment is a form of side-effect. If this variable is used in rendering, use useState instead. (https://react.dev/reference/rules/components-and-hooks-must-be-pure#side-effects-must-run-outside-of-render)
3 | return {x};
4 | }
5 |
+
+
```
\ No newline at end of file
diff --git a/compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/error.invalid-destructure-to-local-global-variables.expect.md b/compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/error.invalid-destructure-to-local-global-variables.expect.md
index b3303fa189..d4e6928728 100644
--- a/compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/error.invalid-destructure-to-local-global-variables.expect.md
+++ b/compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/error.invalid-destructure-to-local-global-variables.expect.md
@@ -15,13 +15,19 @@ function Component(props) {
## Error
```
+Found 1 errors:
+InvalidReact: Unexpected reassignment of a variable which was defined outside of the component. Components and hooks should be pure and side-effect free, but variable reassignment is a form of side-effect. If this variable is used in rendering, use useState instead. (https://react.dev/reference/rules/components-and-hooks-must-be-pure#side-effects-must-run-outside-of-render)
+
+error.invalid-destructure-to-local-global-variables.ts:3:6
1 | function Component(props) {
2 | let a;
> 3 | [a, b] = props.value;
- | ^ InvalidReact: Unexpected reassignment of a variable which was defined outside of the component. Components and hooks should be pure and side-effect free, but variable reassignment is a form of side-effect. If this variable is used in rendering, use useState instead. (https://react.dev/reference/rules/components-and-hooks-must-be-pure#side-effects-must-run-outside-of-render) (3:3)
+ | ^ Unexpected reassignment of a variable which was defined outside of the component. Components and hooks should be pure and side-effect free, but variable reassignment is a form of side-effect. If this variable is used in rendering, use useState instead. (https://react.dev/reference/rules/components-and-hooks-must-be-pure#side-effects-must-run-outside-of-render)
4 |
5 | return [a, b];
6 | }
+
+
```
\ No newline at end of file
diff --git a/compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/error.invalid-disallow-mutating-ref-in-render.expect.md b/compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/error.invalid-disallow-mutating-ref-in-render.expect.md
index b5547a1328..5183a22f51 100644
--- a/compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/error.invalid-disallow-mutating-ref-in-render.expect.md
+++ b/compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/error.invalid-disallow-mutating-ref-in-render.expect.md
@@ -16,13 +16,19 @@ function Component() {
## Error
```
+Found 1 errors:
+InvalidReact: Ref values (the `current` property) may not be accessed during render. (https://react.dev/reference/react/useRef)
+
+error.invalid-disallow-mutating-ref-in-render.ts:4:2
2 | function Component() {
3 | const ref = useRef(null);
> 4 | ref.current = false;
- | ^^^^^^^^^^^ InvalidReact: Ref values (the `current` property) may not be accessed during render. (https://react.dev/reference/react/useRef) (4:4)
+ | ^^^^^^^^^^^ Ref values (the `current` property) may not be accessed during render. (https://react.dev/reference/react/useRef)
5 |
6 | return
;
4 | }
5 |
+
+
```
\ No newline at end of file
diff --git a/compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/error.invalid-function-expression-mutates-immutable-value.expect.md b/compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/error.invalid-function-expression-mutates-immutable-value.expect.md
index a2eb0e8a42..e561eac53f 100644
--- a/compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/error.invalid-function-expression-mutates-immutable-value.expect.md
+++ b/compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/error.invalid-function-expression-mutates-immutable-value.expect.md
@@ -18,13 +18,21 @@ function Component(props) {
## Error
```
+Found 1 errors:
+InvalidReact: Mutating a value returned from 'useState()', which should not be mutated. Use the setter function to update instead
+
+Found mutation of `x`.
+
+error.invalid-function-expression-mutates-immutable-value.ts:5:4
3 | const onChange = e => {
4 | // INVALID! should use copy-on-write and pass the new value
> 5 | x.value = e.target.value;
- | ^ InvalidReact: Mutating a value returned from 'useState()', which should not be mutated. Use the setter function to update instead. Found mutation of `x` (5:5)
+ | ^ Mutating a value returned from 'useState()', which should not be mutated. Use the setter function to update instead
6 | setX(x);
7 | };
8 | return 13 | y.push(props.p2);
- | ^ InvalidReact: Updating a value used previously in JSX is not allowed. Consider moving the mutation before the JSX (13:13)
+ | ^ Updating a value used previously in JSX is not allowed. Consider moving the mutation before the JSX
14 |
15 | return {_}
;
10 | }
+
+
```
\ No newline at end of file
diff --git a/compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/error.invalid-mutate-context-in-callback.expect.md b/compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/error.invalid-mutate-context-in-callback.expect.md
index 8137ec1391..7be453400a 100644
--- a/compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/error.invalid-mutate-context-in-callback.expect.md
+++ b/compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/error.invalid-mutate-context-in-callback.expect.md
@@ -24,13 +24,21 @@ function Component(props) {
## Error
```
+Found 1 errors:
+InvalidReact: Mutating a value returned from 'useContext()', which should not be mutated
+
+Found mutation of `FooContext`.
+
+error.invalid-mutate-context-in-callback.ts:12:4
10 | // independently
11 | const onClick = () => {
> 12 | FooContext.current = true;
- | ^^^^^^^^^^ InvalidReact: Mutating a value returned from 'useContext()', which should not be mutated. Found mutation of `FooContext` (12:12)
+ | ^^^^^^^^^^ Mutating a value returned from 'useContext()', which should not be mutated
13 | };
14 | return
;
15 | }
+
+
```
\ No newline at end of file
diff --git a/compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/error.invalid-mutate-context.expect.md b/compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/error.invalid-mutate-context.expect.md
index 4f8f2616e5..792ab93abf 100644
--- a/compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/error.invalid-mutate-context.expect.md
+++ b/compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/error.invalid-mutate-context.expect.md
@@ -14,13 +14,19 @@ function Component(props) {
## Error
```
+Found 1 errors:
+InvalidReact: Mutating a value returned from 'useContext()', which should not be mutated
+
+error.invalid-mutate-context.ts:3:2
1 | function Component(props) {
2 | const context = useContext(FooContext);
> 3 | context.value = props.value;
- | ^^^^^^^ InvalidReact: Mutating a value returned from 'useContext()', which should not be mutated (3:3)
+ | ^^^^^^^ Mutating a value returned from 'useContext()', which should not be mutated
4 | return context.value;
5 | }
6 |
+
+
```
\ No newline at end of file
diff --git a/compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/error.invalid-mutate-props-in-effect-fixpoint.expect.md b/compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/error.invalid-mutate-props-in-effect-fixpoint.expect.md
index 5c4b516b2a..86cf7dd9d8 100644
--- a/compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/error.invalid-mutate-props-in-effect-fixpoint.expect.md
+++ b/compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/error.invalid-mutate-props-in-effect-fixpoint.expect.md
@@ -25,13 +25,21 @@ function Component(props) {
## Error
```
+Found 1 errors:
+InvalidReact: Mutating component props or hook arguments is not allowed. Consider using a local variable instead
+
+Found mutation of `y`.
+
+error.invalid-mutate-props-in-effect-fixpoint.ts:10:4
8 | let y = x;
9 | let mutateProps = () => {
> 10 | y.foo = true;
- | ^ InvalidReact: Mutating component props or hook arguments is not allowed. Consider using a local variable instead. Found mutation of `y` (10:10)
+ | ^ Mutating component props or hook arguments is not allowed. Consider using a local variable instead
11 | };
12 | let mutatePropsIndirect = () => {
13 | mutateProps();
+
+
```
\ No newline at end of file
diff --git a/compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/error.invalid-mutate-props-via-for-of-iterator.expect.md b/compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/error.invalid-mutate-props-via-for-of-iterator.expect.md
index d7942fc6a5..14a3332007 100644
--- a/compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/error.invalid-mutate-props-via-for-of-iterator.expect.md
+++ b/compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/error.invalid-mutate-props-via-for-of-iterator.expect.md
@@ -17,13 +17,19 @@ function Component(props) {
## Error
```
+Found 1 errors:
+InvalidReact: Mutating component props or hook arguments is not allowed. Consider using a local variable instead
+
+error.invalid-mutate-props-via-for-of-iterator.ts:4:4
2 | const items = [];
3 | for (const x of props.items) {
> 4 | x.modified = true;
- | ^ InvalidReact: Mutating component props or hook arguments is not allowed. Consider using a local variable instead (4:4)
+ | ^ Mutating component props or hook arguments is not allowed. Consider using a local variable instead
5 | items.push(x);
6 | }
7 | return items;
+
+
```
\ No newline at end of file
diff --git a/compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/error.invalid-mutation-in-closure.expect.md b/compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/error.invalid-mutation-in-closure.expect.md
index c2988584cf..c501f9f1b3 100644
--- a/compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/error.invalid-mutation-in-closure.expect.md
+++ b/compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/error.invalid-mutation-in-closure.expect.md
@@ -16,13 +16,21 @@ function useInvalidMutation(options) {
## Error
```
+Found 1 errors:
+InvalidReact: Mutating component props or hook arguments is not allowed. Consider using a local variable instead
+
+Found mutation of `options`.
+
+error.invalid-mutation-in-closure.ts:4:4
2 | function test() {
3 | foo(options.foo); // error should not point on this line
> 4 | options.foo = 'bar';
- | ^^^^^^^ InvalidReact: Mutating component props or hook arguments is not allowed. Consider using a local variable instead. Found mutation of `options` (4:4)
+ | ^^^^^^^ Mutating component props or hook arguments is not allowed. Consider using a local variable instead
5 | }
6 | return test;
7 | }
+
+
```
\ No newline at end of file
diff --git a/compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/error.invalid-mutation-of-possible-props-phi-indirect.expect.md b/compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/error.invalid-mutation-of-possible-props-phi-indirect.expect.md
index 32d392f99f..54d4dae1c7 100644
--- a/compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/error.invalid-mutation-of-possible-props-phi-indirect.expect.md
+++ b/compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/error.invalid-mutation-of-possible-props-phi-indirect.expect.md
@@ -19,13 +19,21 @@ function Component(props) {
## Error
```
+Found 1 errors:
+InvalidReact: Writing to a variable defined outside a component or hook is not allowed. Consider using an effect
+
+Found mutation of `x`.
+
+error.invalid-mutation-of-possible-props-phi-indirect.ts:4:4
2 | let x = cond ? someGlobal : props.foo;
3 | const mutatePhiThatCouldBeProps = () => {
> 4 | x.y = true;
- | ^ InvalidReact: Writing to a variable defined outside a component or hook is not allowed. Consider using an effect. Found mutation of `x` (4:4)
+ | ^ Writing to a variable defined outside a component or hook is not allowed. Consider using an effect
5 | };
6 | const indirectMutateProps = () => {
7 | mutatePhiThatCouldBeProps();
+
+
```
\ No newline at end of file
diff --git a/compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/error.invalid-nested-function-reassign-local-variable-in-effect.expect.md b/compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/error.invalid-nested-function-reassign-local-variable-in-effect.expect.md
index c1aec8a432..9f79d257cb 100644
--- a/compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/error.invalid-nested-function-reassign-local-variable-in-effect.expect.md
+++ b/compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/error.invalid-nested-function-reassign-local-variable-in-effect.expect.md
@@ -46,13 +46,21 @@ function Component() {
## Error
```
+Found 1 errors:
+InvalidReact: Reassigning a variable after render has completed can cause inconsistent behavior on subsequent renders. Consider using state instead
+
+Variable `local` cannot be reassigned after render.
+
+error.invalid-nested-function-reassign-local-variable-in-effect.ts:7:6
5 | // Create the reassignment function inside another function, then return it
6 | const reassignLocal = newValue => {
> 7 | local = newValue;
- | ^^^^^ InvalidReact: Reassigning a variable after render has completed can cause inconsistent behavior on subsequent renders. Consider using state instead. Variable `local` cannot be reassigned after render (7:7)
+ | ^^^^^ Reassigning a variable after render has completed can cause inconsistent behavior on subsequent renders. Consider using state instead
8 | };
9 | return reassignLocal;
10 | };
+
+
```
\ No newline at end of file
diff --git a/compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/error.invalid-non-imported-reanimated-shared-value-writes.expect.md b/compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/error.invalid-non-imported-reanimated-shared-value-writes.expect.md
index ce278dda62..8e30d4678c 100644
--- a/compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/error.invalid-non-imported-reanimated-shared-value-writes.expect.md
+++ b/compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/error.invalid-non-imported-reanimated-shared-value-writes.expect.md
@@ -24,13 +24,21 @@ function SomeComponent() {
## Error
```
+Found 1 errors:
+InvalidReact: Updating a value returned from a hook is not allowed. Consider moving the mutation into the hook where the value is constructed
+
+Found mutation of `sharedVal`.
+
+error.invalid-non-imported-reanimated-shared-value-writes.ts:11:22
9 | return (
10 | 11 | onPress={() => (sharedVal.value = Math.random())}
- | ^^^^^^^^^ InvalidReact: Updating a value returned from a hook is not allowed. Consider moving the mutation into the hook where the value is constructed. Found mutation of `sharedVal` (11:11)
+ | ^^^^^^^^^ Updating a value returned from a hook is not allowed. Consider moving the mutation into the hook where the value is constructed
12 | title="Randomize"
13 | />
14 | );
+
+
```
\ No newline at end of file
diff --git a/compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/error.invalid-optional-member-expression-as-memo-dep-non-optional-in-body.expect.md b/compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/error.invalid-optional-member-expression-as-memo-dep-non-optional-in-body.expect.md
index 7d6c4b38a7..f3bba5b338 100644
--- a/compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/error.invalid-optional-member-expression-as-memo-dep-non-optional-in-body.expect.md
+++ b/compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/error.invalid-optional-member-expression-as-memo-dep-non-optional-in-body.expect.md
@@ -18,6 +18,12 @@ function Component(props) {
## Error
```
+Found 1 errors:
+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
+
+The inferred dependency was `props.items.edges.nodes`, but the source dependencies were [props.items?.edges?.nodes]. Inferred different dependency than source.
+
+error.invalid-optional-member-expression-as-memo-dep-non-optional-in-body.ts:3:23
1 | // @validatePreserveExistingMemoizationGuarantees
2 | function Component(props) {
> 3 | const data = useMemo(() => {
@@ -29,10 +35,12 @@ function Component(props) {
> 6 | // deps are optional
| ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^
> 7 | }, [props.items?.edges?.nodes]);
- | ^^^^ 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. The inferred dependency was `props.items.edges.nodes`, but the source dependencies were [props.items?.edges?.nodes]. Inferred different dependency than source (3:7)
+ | ^^^^ 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
8 | return {x}
;
> 5 | x.y = true;
- | ^ InvalidReact: Updating a value used previously in JSX is not allowed. Consider moving the mutation before the JSX (5:5)
+ | ^ Updating a value used previously in JSX is not allowed. Consider moving the mutation before the JSX
6 | return x;
7 | }
8 |
+
+
```
\ No newline at end of file
diff --git a/compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/error.invalid-props-mutation-in-effect-indirect.expect.md b/compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/error.invalid-props-mutation-in-effect-indirect.expect.md
index 372b1a9a85..973e5b327a 100644
--- a/compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/error.invalid-props-mutation-in-effect-indirect.expect.md
+++ b/compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/error.invalid-props-mutation-in-effect-indirect.expect.md
@@ -18,13 +18,21 @@ function Component(props) {
## Error
```
+Found 1 errors:
+InvalidReact: Mutating component props or hook arguments is not allowed. Consider using a local variable instead
+
+Found mutation of `props`.
+
+error.invalid-props-mutation-in-effect-indirect.ts:3:4
1 | function Component(props) {
2 | const mutateProps = () => {
> 3 | props.value = true;
- | ^^^^^ InvalidReact: Mutating component props or hook arguments is not allowed. Consider using a local variable instead. Found mutation of `props` (3:3)
+ | ^^^^^ Mutating component props or hook arguments is not allowed. Consider using a local variable instead
4 | };
5 | const indirectMutateProps = () => {
6 | mutateProps();
+
+
```
\ No newline at end of file
diff --git a/compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/error.invalid-read-ref-prop-in-render-destructure.expect.md b/compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/error.invalid-read-ref-prop-in-render-destructure.expect.md
index 6b63344a76..197fafc976 100644
--- a/compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/error.invalid-read-ref-prop-in-render-destructure.expect.md
+++ b/compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/error.invalid-read-ref-prop-in-render-destructure.expect.md
@@ -14,13 +14,19 @@ function Component({ref}) {
## Error
```
+Found 1 errors:
+InvalidReact: Ref values (the `current` property) may not be accessed during render. (https://react.dev/reference/react/useRef)
+
+error.invalid-read-ref-prop-in-render-destructure.ts:3:16
1 | // @validateRefAccessDuringRender @compilationMode:"infer"
2 | function Component({ref}) {
> 3 | const value = ref.current;
- | ^^^^^^^^^^^ InvalidReact: Ref values (the `current` property) may not be accessed during render. (https://react.dev/reference/react/useRef) (3:3)
+ | ^^^^^^^^^^^ Ref values (the `current` property) may not be accessed during render. (https://react.dev/reference/react/useRef)
4 | return {value}
;
5 | }
6 |
+
+
```
\ No newline at end of file
diff --git a/compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/error.invalid-read-ref-prop-in-render-property-load.expect.md b/compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/error.invalid-read-ref-prop-in-render-property-load.expect.md
index c49aea8740..20b6c1b761 100644
--- a/compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/error.invalid-read-ref-prop-in-render-property-load.expect.md
+++ b/compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/error.invalid-read-ref-prop-in-render-property-load.expect.md
@@ -14,13 +14,19 @@ function Component(props) {
## Error
```
+Found 1 errors:
+InvalidReact: Ref values (the `current` property) may not be accessed during render. (https://react.dev/reference/react/useRef)
+
+error.invalid-read-ref-prop-in-render-property-load.ts:3:16
1 | // @validateRefAccessDuringRender @compilationMode:"infer"
2 | function Component(props) {
> 3 | const value = props.ref.current;
- | ^^^^^^^^^^^^^^^^^ InvalidReact: Ref values (the `current` property) may not be accessed during render. (https://react.dev/reference/react/useRef) (3:3)
+ | ^^^^^^^^^^^^^^^^^ Ref values (the `current` property) may not be accessed during render. (https://react.dev/reference/react/useRef)
4 | return {value}
;
5 | }
6 |
+
+
```
\ No newline at end of file
diff --git a/compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/error.invalid-reassign-const.expect.md b/compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/error.invalid-reassign-const.expect.md
index adf45dad4f..02766d4044 100644
--- a/compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/error.invalid-reassign-const.expect.md
+++ b/compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/error.invalid-reassign-const.expect.md
@@ -13,12 +13,20 @@ function Component() {
## Error
```
+Found 1 errors:
+InvalidJS: Cannot reassign a `const` variable
+
+`x` is declared as const.
+
+error.invalid-reassign-const.ts:3:2
1 | function Component() {
2 | const x = 0;
> 3 | x = 1;
- | ^ InvalidJS: Cannot reassign a `const` variable. `x` is declared as const (3:3)
+ | ^ Cannot reassign a `const` variable
4 | }
5 |
+
+
```
\ No newline at end of file
diff --git a/compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/error.invalid-reassign-local-in-hook-return-value.expect.md b/compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/error.invalid-reassign-local-in-hook-return-value.expect.md
index 80625470ad..793168de26 100644
--- a/compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/error.invalid-reassign-local-in-hook-return-value.expect.md
+++ b/compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/error.invalid-reassign-local-in-hook-return-value.expect.md
@@ -15,13 +15,21 @@ function useFoo() {
## Error
```
+Found 1 errors:
+InvalidReact: Reassigning a variable after render has completed can cause inconsistent behavior on subsequent renders. Consider using state instead
+
+Variable `x` cannot be reassigned after render.
+
+error.invalid-reassign-local-in-hook-return-value.ts:4:4
2 | let x = 0;
3 | return value => {
> 4 | x = value;
- | ^ InvalidReact: Reassigning a variable after render has completed can cause inconsistent behavior on subsequent renders. Consider using state instead. Variable `x` cannot be reassigned after render (4:4)
+ | ^ Reassigning a variable after render has completed can cause inconsistent behavior on subsequent renders. Consider using state instead
5 | };
6 | }
7 |
+
+
```
\ No newline at end of file
diff --git a/compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/error.invalid-reassign-local-variable-in-async-callback.expect.md b/compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/error.invalid-reassign-local-variable-in-async-callback.expect.md
index ecb28a3968..dc0f386071 100644
--- a/compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/error.invalid-reassign-local-variable-in-async-callback.expect.md
+++ b/compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/error.invalid-reassign-local-variable-in-async-callback.expect.md
@@ -25,13 +25,21 @@ function Component() {
## Error
```
+Found 1 errors:
+InvalidReact: Reassigning a variable in an async function can cause inconsistent behavior on subsequent renders. Consider using state instead
+
+Variable `value` cannot be reassigned after render.
+
+error.invalid-reassign-local-variable-in-async-callback.ts:8:6
6 | // after render, so this should error regardless of where this ends up
7 | // getting called
> 8 | value = result;
- | ^^^^^ InvalidReact: Reassigning a variable in an async function can cause inconsistent behavior on subsequent renders. Consider using state instead. Variable `value` cannot be reassigned after render (8:8)
+ | ^^^^^ Reassigning a variable in an async function can cause inconsistent behavior on subsequent renders. Consider using state instead
9 | });
10 | };
11 |
+
+
```
\ No newline at end of file
diff --git a/compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/error.invalid-reassign-local-variable-in-effect.expect.md b/compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/error.invalid-reassign-local-variable-in-effect.expect.md
index 0e32547f87..95f295cf44 100644
--- a/compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/error.invalid-reassign-local-variable-in-effect.expect.md
+++ b/compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/error.invalid-reassign-local-variable-in-effect.expect.md
@@ -47,13 +47,21 @@ function Component() {
## Error
```
+Found 1 errors:
+InvalidReact: Reassigning a variable after render has completed can cause inconsistent behavior on subsequent renders. Consider using state instead
+
+Variable `local` cannot be reassigned after render.
+
+error.invalid-reassign-local-variable-in-effect.ts:7:4
5 |
6 | const reassignLocal = newValue => {
> 7 | local = newValue;
- | ^^^^^ InvalidReact: Reassigning a variable after render has completed can cause inconsistent behavior on subsequent renders. Consider using state instead. Variable `local` cannot be reassigned after render (7:7)
+ | ^^^^^ Reassigning a variable after render has completed can cause inconsistent behavior on subsequent renders. Consider using state instead
8 | };
9 |
10 | const onMount = newValue => {
+
+
```
\ No newline at end of file
diff --git a/compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/error.invalid-reassign-local-variable-in-hook-argument.expect.md b/compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/error.invalid-reassign-local-variable-in-hook-argument.expect.md
index d301a8de71..c1bb9bff02 100644
--- a/compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/error.invalid-reassign-local-variable-in-hook-argument.expect.md
+++ b/compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/error.invalid-reassign-local-variable-in-hook-argument.expect.md
@@ -48,13 +48,21 @@ function Component() {
## Error
```
+Found 1 errors:
+InvalidReact: Reassigning a variable after render has completed can cause inconsistent behavior on subsequent renders. Consider using state instead
+
+Variable `local` cannot be reassigned after render.
+
+error.invalid-reassign-local-variable-in-hook-argument.ts:8:4
6 |
7 | const reassignLocal = newValue => {
> 8 | local = newValue;
- | ^^^^^ InvalidReact: Reassigning a variable after render has completed can cause inconsistent behavior on subsequent renders. Consider using state instead. Variable `local` cannot be reassigned after render (8:8)
+ | ^^^^^ Reassigning a variable after render has completed can cause inconsistent behavior on subsequent renders. Consider using state instead
9 | };
10 |
11 | const callback = newValue => {
+
+
```
\ No newline at end of file
diff --git a/compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/error.invalid-reassign-local-variable-in-jsx-callback.expect.md b/compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/error.invalid-reassign-local-variable-in-jsx-callback.expect.md
index fe684586cb..237148be87 100644
--- a/compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/error.invalid-reassign-local-variable-in-jsx-callback.expect.md
+++ b/compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/error.invalid-reassign-local-variable-in-jsx-callback.expect.md
@@ -41,13 +41,21 @@ function Component() {
## Error
```
+Found 1 errors:
+InvalidReact: Reassigning a variable after render has completed can cause inconsistent behavior on subsequent renders. Consider using state instead
+
+Variable `local` cannot be reassigned after render.
+
+error.invalid-reassign-local-variable-in-jsx-callback.ts:5:4
3 |
4 | const reassignLocal = newValue => {
> 5 | local = newValue;
- | ^^^^^ InvalidReact: Reassigning a variable after render has completed can cause inconsistent behavior on subsequent renders. Consider using state instead. Variable `local` cannot be reassigned after render (5:5)
+ | ^^^^^ Reassigning a variable after render has completed can cause inconsistent behavior on subsequent renders. Consider using state instead
6 | };
7 |
8 | const onClick = newValue => {
+
+
```
\ No newline at end of file
diff --git a/compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/error.invalid-ref-in-callback-invoked-during-render.expect.md b/compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/error.invalid-ref-in-callback-invoked-during-render.expect.md
index b4c7ae72d1..10cc238473 100644
--- a/compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/error.invalid-ref-in-callback-invoked-during-render.expect.md
+++ b/compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/error.invalid-ref-in-callback-invoked-during-render.expect.md
@@ -18,12 +18,18 @@ function Component(props) {
## Error
```
+Found 1 errors:
+InvalidReact: Ref values (the `current` property) may not be accessed during render. (https://react.dev/reference/react/useRef)
+
+error.invalid-ref-in-callback-invoked-during-render.ts:8:33
6 | return {props.items.map(item => renderItem(item))} ;
- | ^^^^^^^^^^^^^^^^^^^^^^^^ InvalidReact: Ref values (the `current` property) may not be accessed during render. (https://react.dev/reference/react/useRef) (8:8)
+ | ^^^^^^^^^^^^^^^^^^^^^^^^ Ref values (the `current` property) may not be accessed during render. (https://react.dev/reference/react/useRef)
9 | }
10 |
+
+
```
\ No newline at end of file
diff --git a/compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/error.invalid-ref-value-as-props.expect.md b/compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/error.invalid-ref-value-as-props.expect.md
index f86f6b7a39..d2dfc7e728 100644
--- a/compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/error.invalid-ref-value-as-props.expect.md
+++ b/compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/error.invalid-ref-value-as-props.expect.md
@@ -14,12 +14,18 @@ function Component(props) {
## Error
```
+Found 1 errors:
+InvalidReact: Ref values (the `current` property) may not be accessed during render. (https://react.dev/reference/react/useRef)
+
+error.invalid-ref-value-as-props.ts:4:19
2 | function Component(props) {
3 | const ref = useRef(null);
> 4 | return {x}
;
+ 7 | }
+ 8 | /* eslint-enable react-hooks/rules-of-hooks */
+
+
```
\ No newline at end of file
diff --git a/compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/error.invalid-ternary-with-hook-values.expect.md b/compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/error.invalid-ternary-with-hook-values.expect.md
index 2e5d24e3a8..f33a820a85 100644
--- a/compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/error.invalid-ternary-with-hook-values.expect.md
+++ b/compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/error.invalid-ternary-with-hook-values.expect.md
@@ -13,18 +13,51 @@ function Component(props) {
## Error
```
+Found 4 errors:
+InvalidReact: Hooks may not be referenced as normal values, they must be called. See https://react.dev/reference/rules/react-calls-components-and-hooks#never-pass-around-hooks-as-regular-values
+
+error.invalid-ternary-with-hook-values.ts:2:25
1 | function Component(props) {
> 2 | const x = props.cond ? useA : useB;
- | ^^^^ InvalidReact: Hooks may not be referenced as normal values, they must be called. See https://react.dev/reference/rules/react-calls-components-and-hooks#never-pass-around-hooks-as-regular-values (2:2)
-
-InvalidReact: Hooks may not be referenced as normal values, they must be called. See https://react.dev/reference/rules/react-calls-components-and-hooks#never-pass-around-hooks-as-regular-values (2:2)
-
-InvalidReact: Hooks may not be referenced as normal values, they must be called. See https://react.dev/reference/rules/react-calls-components-and-hooks#never-pass-around-hooks-as-regular-values (2:2)
-
-InvalidReact: Hooks may not be referenced as normal values, they must be called. See https://react.dev/reference/rules/react-calls-components-and-hooks#never-pass-around-hooks-as-regular-values (3:3)
+ | ^^^^ Hooks may not be referenced as normal values, they must be called. See https://react.dev/reference/rules/react-calls-components-and-hooks#never-pass-around-hooks-as-regular-values
3 | return x();
4 | }
5 |
+
+
+InvalidReact: Hooks may not be referenced as normal values, they must be called. See https://react.dev/reference/rules/react-calls-components-and-hooks#never-pass-around-hooks-as-regular-values
+
+error.invalid-ternary-with-hook-values.ts:2:32
+ 1 | function Component(props) {
+> 2 | const x = props.cond ? useA : useB;
+ | ^^^^ Hooks may not be referenced as normal values, they must be called. See https://react.dev/reference/rules/react-calls-components-and-hooks#never-pass-around-hooks-as-regular-values
+ 3 | return x();
+ 4 | }
+ 5 |
+
+
+InvalidReact: Hooks may not be referenced as normal values, they must be called. See https://react.dev/reference/rules/react-calls-components-and-hooks#never-pass-around-hooks-as-regular-values
+
+error.invalid-ternary-with-hook-values.ts:2:12
+ 1 | function Component(props) {
+> 2 | const x = props.cond ? useA : useB;
+ | ^^^^^^^^^^^^^^^^^^^^^^^^ Hooks may not be referenced as normal values, they must be called. See https://react.dev/reference/rules/react-calls-components-and-hooks#never-pass-around-hooks-as-regular-values
+ 3 | return x();
+ 4 | }
+ 5 |
+
+
+InvalidReact: Hooks may not be referenced as normal values, they must be called. See https://react.dev/reference/rules/react-calls-components-and-hooks#never-pass-around-hooks-as-regular-values
+
+error.invalid-ternary-with-hook-values.ts:3:9
+ 1 | function Component(props) {
+ 2 | const x = props.cond ? useA : useB;
+> 3 | return x();
+ | ^ Hooks may not be referenced as normal values, they must be called. See https://react.dev/reference/rules/react-calls-components-and-hooks#never-pass-around-hooks-as-regular-values
+ 4 | }
+ 5 |
+
+
```
\ No newline at end of file
diff --git a/compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/error.invalid-type-provider-hook-name-not-typed-as-hook-namespace.expect.md b/compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/error.invalid-type-provider-hook-name-not-typed-as-hook-namespace.expect.md
index 5f352281b3..d009258251 100644
--- a/compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/error.invalid-type-provider-hook-name-not-typed-as-hook-namespace.expect.md
+++ b/compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/error.invalid-type-provider-hook-name-not-typed-as-hook-namespace.expect.md
@@ -14,12 +14,20 @@ function Component() {
## Error
```
+Found 1 errors:
+InvalidConfig: Invalid type configuration for module
+
+Expected type for object property 'useHookNotTypedAsHook' from module 'ReactCompilerTest' to be a hook based on the property name.
+
+error.invalid-type-provider-hook-name-not-typed-as-hook-namespace.ts:4:9
2 |
3 | function Component() {
> 4 | return ReactCompilerTest.useHookNotTypedAsHook();
- | ^^^^^^^^^^^^^^^^^ InvalidConfig: Invalid type configuration for module. Expected type for object property 'useHookNotTypedAsHook' from module 'ReactCompilerTest' to be a hook based on the property name (4:4)
+ | ^^^^^^^^^^^^^^^^^ Invalid type configuration for module
5 | }
6 |
+
+
```
\ No newline at end of file
diff --git a/compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/error.invalid-type-provider-hook-name-not-typed-as-hook.expect.md b/compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/error.invalid-type-provider-hook-name-not-typed-as-hook.expect.md
index 9d863ba0cb..328daef010 100644
--- a/compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/error.invalid-type-provider-hook-name-not-typed-as-hook.expect.md
+++ b/compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/error.invalid-type-provider-hook-name-not-typed-as-hook.expect.md
@@ -14,12 +14,20 @@ function Component() {
## Error
```
+Found 1 errors:
+InvalidConfig: Invalid type configuration for module
+
+Expected type for object property 'useHookNotTypedAsHook' from module 'ReactCompilerTest' to be a hook based on the property name.
+
+error.invalid-type-provider-hook-name-not-typed-as-hook.ts:4:9
2 |
3 | function Component() {
> 4 | return useHookNotTypedAsHook();
- | ^^^^^^^^^^^^^^^^^^^^^ InvalidConfig: Invalid type configuration for module. Expected type for object property 'useHookNotTypedAsHook' from module 'ReactCompilerTest' to be a hook based on the property name (4:4)
+ | ^^^^^^^^^^^^^^^^^^^^^ Invalid type configuration for module
5 | }
6 |
+
+
```
\ No newline at end of file
diff --git a/compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/error.invalid-type-provider-hooklike-module-default-not-hook.expect.md b/compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/error.invalid-type-provider-hooklike-module-default-not-hook.expect.md
index 99944b5813..c3db067222 100644
--- a/compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/error.invalid-type-provider-hooklike-module-default-not-hook.expect.md
+++ b/compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/error.invalid-type-provider-hooklike-module-default-not-hook.expect.md
@@ -14,12 +14,20 @@ function Component() {
## Error
```
+Found 1 errors:
+InvalidConfig: Invalid type configuration for module
+
+Expected type for `import ... from 'useDefaultExportNotTypedAsHook'` to be a hook based on the module name.
+
+error.invalid-type-provider-hooklike-module-default-not-hook.ts:4:15
2 |
3 | function Component() {
> 4 | return {foo()}
;
- | ^^^ InvalidConfig: Invalid type configuration for module. Expected type for `import ... from 'useDefaultExportNotTypedAsHook'` to be a hook based on the module name (4:4)
+ | ^^^ Invalid type configuration for module
5 | }
6 |
+
+
```
\ No newline at end of file
diff --git a/compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/error.invalid-type-provider-nonhook-name-typed-as-hook.expect.md b/compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/error.invalid-type-provider-nonhook-name-typed-as-hook.expect.md
index ff1f4373b4..86d08c8bc6 100644
--- a/compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/error.invalid-type-provider-nonhook-name-typed-as-hook.expect.md
+++ b/compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/error.invalid-type-provider-nonhook-name-typed-as-hook.expect.md
@@ -14,12 +14,20 @@ function Component() {
## Error
```
+Found 1 errors:
+InvalidConfig: Invalid type configuration for module
+
+Expected type for object property 'useHookNotTypedAsHook' from module 'ReactCompilerTest' to be a hook based on the property name.
+
+error.invalid-type-provider-nonhook-name-typed-as-hook.ts:4:15
2 |
3 | function Component() {
> 4 | return {notAhookTypedAsHook()}
;
- | ^^^^^^^^^^^^^^^^^^^ InvalidConfig: Invalid type configuration for module. Expected type for object property 'useHookNotTypedAsHook' from module 'ReactCompilerTest' to be a hook based on the property name (4:4)
+ | ^^^^^^^^^^^^^^^^^^^ Invalid type configuration for module
5 | }
6 |
+
+
```
\ No newline at end of file
diff --git a/compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/error.invalid-uncalled-function-capturing-mutable-values-memoizes-with-captures-values.expect.md b/compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/error.invalid-uncalled-function-capturing-mutable-values-memoizes-with-captures-values.expect.md
index 734ba6f172..fdbbae9d3c 100644
--- a/compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/error.invalid-uncalled-function-capturing-mutable-values-memoizes-with-captures-values.expect.md
+++ b/compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/error.invalid-uncalled-function-capturing-mutable-values-memoizes-with-captures-values.expect.md
@@ -47,6 +47,10 @@ hook useMemoMap(
## Error
```
+Found 2 errors:
+InvalidReact: This argument is a function which may reassign or mutate local variables after render, which can cause inconsistent behavior on subsequent renders. Consider using state instead
+
+undefined:21:9
19 | map: TInput => TOutput
20 | ): TInput => TOutput {
> 21 | return useMemo(() => {
@@ -82,11 +86,23 @@ hook useMemoMap(
> 36 | };
| ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^
> 37 | }, [map]);
- | ^^^^^^^^^^^^ InvalidReact: This argument is a function which may reassign or mutate local variables after render, which can cause inconsistent behavior on subsequent renders. Consider using state instead (21:37)
-
-InvalidReact: The function modifies a local variable here (33:33)
+ | ^^^^^^^^^^^^ This argument is a function which may reassign or mutate local variables after render, which can cause inconsistent behavior on subsequent renders. Consider using state instead
38 | }
39 |
+
+
+InvalidReact: The function modifies a local variable here
+
+undefined:33:8
+ 31 | if (output == null) {
+ 32 | output = map(input);
+> 33 | cache.set(input, output);
+ | ^^^^^ The function modifies a local variable here
+ 34 | }
+ 35 | return output;
+ 36 | };
+
+
```
\ No newline at end of file
diff --git a/compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/error.invalid-unclosed-eslint-suppression.expect.md b/compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/error.invalid-unclosed-eslint-suppression.expect.md
index 9f8e15592d..2e7591a387 100644
--- a/compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/error.invalid-unclosed-eslint-suppression.expect.md
+++ b/compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/error.invalid-unclosed-eslint-suppression.expect.md
@@ -36,12 +36,20 @@ function CrimesAgainstReact() {
## Error
```
+Found 1 errors:
+InvalidReact: React Compiler has skipped optimizing this component because one or more React ESLint rules were disabled. React Compiler only works when your components follow all the rules of React, disabling them may result in unexpected or incorrect behavior
+
+eslint-disable react-hooks/rules-of-hooks.
+
+error.invalid-unclosed-eslint-suppression.ts:2:0
1 | // Note: Everything below this is sketchy
> 2 | /* eslint-disable react-hooks/rules-of-hooks */
- | ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^ InvalidReact: React Compiler has skipped optimizing this component because one or more React ESLint rules were disabled. React Compiler only works when your components follow all the rules of React, disabling them may result in unexpected or incorrect behavior. eslint-disable react-hooks/rules-of-hooks (2:2)
+ | ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^ React Compiler has skipped optimizing this component because one or more React ESLint rules were disabled. React Compiler only works when your components follow all the rules of React, disabling them may result in unexpected or incorrect behavior
3 | function lowercasecomponent() {
4 | 'use forget';
5 | const x = [];
+
+
```
\ No newline at end of file
diff --git a/compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/error.invalid-unconditional-set-state-in-render.expect.md b/compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/error.invalid-unconditional-set-state-in-render.expect.md
index b2b25dbfa4..bd3dc12ae5 100644
--- a/compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/error.invalid-unconditional-set-state-in-render.expect.md
+++ b/compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/error.invalid-unconditional-set-state-in-render.expect.md
@@ -19,15 +19,31 @@ function Component(props) {
## Error
```
+Found 2 errors:
+InvalidReact: This is an unconditional set state during render, which will trigger an infinite loop. (https://react.dev/reference/react/useState)
+
+error.invalid-unconditional-set-state-in-render.ts:6:2
4 | const aliased = setX;
5 |
> 6 | setX(1);
- | ^^^^ InvalidReact: This is an unconditional set state during render, which will trigger an infinite loop. (https://react.dev/reference/react/useState) (6:6)
-
-InvalidReact: This is an unconditional set state during render, which will trigger an infinite loop. (https://react.dev/reference/react/useState) (7:7)
+ | ^^^^ This is an unconditional set state during render, which will trigger an infinite loop. (https://react.dev/reference/react/useState)
7 | aliased(2);
8 |
9 | return x;
+
+
+InvalidReact: This is an unconditional set state during render, which will trigger an infinite loop. (https://react.dev/reference/react/useState)
+
+error.invalid-unconditional-set-state-in-render.ts:7:2
+ 5 |
+ 6 | setX(1);
+> 7 | aliased(2);
+ | ^^^^^^^ This is an unconditional set state during render, which will trigger an infinite loop. (https://react.dev/reference/react/useState)
+ 8 |
+ 9 | return x;
+ 10 | }
+
+
```
\ No newline at end of file
diff --git a/compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/error.invalid-use-ref-added-to-dep-without-type-info.expect.md b/compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/error.invalid-use-ref-added-to-dep-without-type-info.expect.md
index f576bac764..231db88cc6 100644
--- a/compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/error.invalid-use-ref-added-to-dep-without-type-info.expect.md
+++ b/compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/error.invalid-use-ref-added-to-dep-without-type-info.expect.md
@@ -22,15 +22,31 @@ function Foo({a}) {
## Error
```
+Found 2 errors:
+InvalidReact: Ref values (the `current` property) may not be accessed during render. (https://react.dev/reference/react/useRef)
+
+error.invalid-use-ref-added-to-dep-without-type-info.ts:10:21
8 | // however, this is an instance of accessing a ref during render and is disallowed
9 | // under React's rules, so we reject this input
> 10 | const x = {a, val: val.ref.current};
- | ^^^^^^^^^^^^^^^ InvalidReact: Ref values (the `current` property) may not be accessed during render. (https://react.dev/reference/react/useRef) (10:10)
-
-InvalidReact: Ref values (the `current` property) may not be accessed during render. (https://react.dev/reference/react/useRef) (10:10)
+ | ^^^^^^^^^^^^^^^ Ref values (the `current` property) may not be accessed during render. (https://react.dev/reference/react/useRef)
11 |
12 | return {value}
;
6 | }
7 |
+
+
```
\ No newline at end of file
diff --git a/compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/error.modify-state-2.expect.md b/compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/error.modify-state-2.expect.md
index 89feadc915..5f10bac0da 100644
--- a/compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/error.modify-state-2.expect.md
+++ b/compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/error.modify-state-2.expect.md
@@ -17,13 +17,19 @@ function Foo() {
## Error
```
+Found 1 errors:
+InvalidReact: Mutating a value returned from 'useState()', which should not be mutated. Use the setter function to update instead
+
+error.modify-state-2.ts:6:2
4 | const [state, setState] = useState({foo: {bar: 3}});
5 | const foo = state.foo;
> 6 | foo.bar = 1;
- | ^^^ InvalidReact: Mutating a value returned from 'useState()', which should not be mutated. Use the setter function to update instead (6:6)
+ | ^^^ Mutating a value returned from 'useState()', which should not be mutated. Use the setter function to update instead
7 | return state;
8 | }
9 |
+
+
```
\ No newline at end of file
diff --git a/compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/error.modify-state.expect.md b/compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/error.modify-state.expect.md
index 81c644da30..5461002dea 100644
--- a/compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/error.modify-state.expect.md
+++ b/compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/error.modify-state.expect.md
@@ -16,13 +16,19 @@ function Foo() {
## Error
```
+Found 1 errors:
+InvalidReact: Mutating a value returned from 'useState()', which should not be mutated. Use the setter function to update instead
+
+error.modify-state.ts:5:2
3 | function Foo() {
4 | let [state, setState] = useState({});
> 5 | state.foo = 1;
- | ^^^^^ InvalidReact: Mutating a value returned from 'useState()', which should not be mutated. Use the setter function to update instead (5:5)
+ | ^^^^^ Mutating a value returned from 'useState()', which should not be mutated. Use the setter function to update instead
6 | return state;
7 | }
8 |
+
+
```
\ No newline at end of file
diff --git a/compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/error.modify-useReducer-state.expect.md b/compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/error.modify-useReducer-state.expect.md
index b2e4a16105..b99280f2f1 100644
--- a/compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/error.modify-useReducer-state.expect.md
+++ b/compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/error.modify-useReducer-state.expect.md
@@ -16,13 +16,19 @@ function Foo() {
## Error
```
+Found 1 errors:
+InvalidReact: Mutating a value returned from 'useReducer()', which should not be mutated. Use the dispatch function to update instead
+
+error.modify-useReducer-state.ts:5:2
3 | function Foo() {
4 | let [state, setState] = useReducer({foo: 1});
> 5 | state.foo = 1;
- | ^^^^^ InvalidReact: Mutating a value returned from 'useReducer()', which should not be mutated. Use the dispatch function to update instead (5:5)
+ | ^^^^^ Mutating a value returned from 'useReducer()', which should not be mutated. Use the dispatch function to update instead
6 | return state;
7 | }
8 |
+
+
```
\ No newline at end of file
diff --git a/compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/error.mutable-range-shared-inner-outer-function.expect.md b/compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/error.mutable-range-shared-inner-outer-function.expect.md
index a6f2a2719f..194c7a8769 100644
--- a/compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/error.mutable-range-shared-inner-outer-function.expect.md
+++ b/compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/error.mutable-range-shared-inner-outer-function.expect.md
@@ -32,13 +32,21 @@ export const FIXTURE_ENTRYPOINT = {
## Error
```
+Found 1 errors:
+InvalidReact: Reassigning a variable after render has completed can cause inconsistent behavior on subsequent renders. Consider using state instead
+
+Variable `a` cannot be reassigned after render.
+
+error.mutable-range-shared-inner-outer-function.ts:8:6
6 | const f = () => {
7 | if (cond) {
> 8 | a = {};
- | ^ InvalidReact: Reassigning a variable after render has completed can cause inconsistent behavior on subsequent renders. Consider using state instead. Variable `a` cannot be reassigned after render (8:8)
+ | ^ Reassigning a variable after render has completed can cause inconsistent behavior on subsequent renders. Consider using state instead
9 | b = [];
10 | } else {
11 | a = {};
+
+
```
\ No newline at end of file
diff --git a/compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/error.mutate-function-property.expect.md b/compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/error.mutate-function-property.expect.md
index 09abc35613..23b5137d84 100644
--- a/compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/error.mutate-function-property.expect.md
+++ b/compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/error.mutate-function-property.expect.md
@@ -15,13 +15,19 @@ export function ViewModeSelector(props) {
## Error
```
+Found 1 errors:
+InvalidReact: This mutates a variable that React considers immutable
+
+error.mutate-function-property.ts:3:2
1 | export function ViewModeSelector(props) {
2 | const renderIcon = () =>
;
6 | }
7 |
+
+
```
\ No newline at end of file
diff --git a/compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/error.mutate-hook-argument.expect.md b/compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/error.mutate-hook-argument.expect.md
index dd98f22530..6aebd1b8cd 100644
--- a/compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/error.mutate-hook-argument.expect.md
+++ b/compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/error.mutate-hook-argument.expect.md
@@ -13,14 +13,29 @@ function useHook(a, b) {
## Error
```
+Found 2 errors:
+InvalidReact: Mutating component props or hook arguments is not allowed. Consider using a local variable instead
+
+error.mutate-hook-argument.ts:2:2
1 | function useHook(a, b) {
> 2 | b.test = 1;
- | ^ InvalidReact: Mutating component props or hook arguments is not allowed. Consider using a local variable instead (2:2)
-
-InvalidReact: Mutating component props or hook arguments is not allowed. Consider using a local variable instead (3:3)
+ | ^ Mutating component props or hook arguments is not allowed. Consider using a local variable instead
3 | a.test = 2;
4 | }
5 |
+
+
+InvalidReact: Mutating component props or hook arguments is not allowed. Consider using a local variable instead
+
+error.mutate-hook-argument.ts:3:2
+ 1 | function useHook(a, b) {
+ 2 | b.test = 1;
+> 3 | a.test = 2;
+ | ^ Mutating component props or hook arguments is not allowed. Consider using a local variable instead
+ 4 | }
+ 5 |
+
+
```
\ No newline at end of file
diff --git a/compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/error.mutate-property-from-global.expect.md b/compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/error.mutate-property-from-global.expect.md
index 5e63453558..7815c05698 100644
--- a/compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/error.mutate-property-from-global.expect.md
+++ b/compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/error.mutate-property-from-global.expect.md
@@ -15,13 +15,19 @@ function Foo() {
## Error
```
+Found 1 errors:
+InvalidReact: Writing to a variable defined outside a component or hook is not allowed. Consider using an effect
+
+error.mutate-property-from-global.ts:4:9
2 |
3 | function Foo() {
> 4 | delete wat.foo;
- | ^^^ InvalidReact: Writing to a variable defined outside a component or hook is not allowed. Consider using an effect (4:4)
+ | ^^^ Writing to a variable defined outside a component or hook is not allowed. Consider using an effect
5 | return wat;
6 | }
7 |
+
+
```
\ No newline at end of file
diff --git a/compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/error.mutate-props.expect.md b/compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/error.mutate-props.expect.md
index 9cc7ebf898..4245c566f1 100644
--- a/compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/error.mutate-props.expect.md
+++ b/compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/error.mutate-props.expect.md
@@ -13,12 +13,18 @@ function Foo(props) {
## Error
```
+Found 1 errors:
+InvalidReact: Mutating component props or hook arguments is not allowed. Consider using a local variable instead
+
+error.mutate-props.ts:2:2
1 | function Foo(props) {
> 2 | props.test = 1;
- | ^^^^^ InvalidReact: Mutating component props or hook arguments is not allowed. Consider using a local variable instead (2:2)
+ | ^^^^^ Mutating component props or hook arguments is not allowed. Consider using a local variable instead
3 | return null;
4 | }
5 |
+
+
```
\ No newline at end of file
diff --git a/compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/error.nomemo-and-change-detect.expect.md b/compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/error.nomemo-and-change-detect.expect.md
index 73d664f593..09fd1555ba 100644
--- a/compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/error.nomemo-and-change-detect.expect.md
+++ b/compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/error.nomemo-and-change-detect.expect.md
@@ -11,6 +11,7 @@ function Component(props) {}
## Error
```
+Found 1 errors:
InvalidConfig: Invalid environment config: the 'disableMemoizationForDebugging' and 'enableChangeDetectionForDebugging' options cannot be used together
```
diff --git a/compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/error.not-useEffect-external-mutate.expect.md b/compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/error.not-useEffect-external-mutate.expect.md
index 8c08efee8d..821fffa18f 100644
--- a/compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/error.not-useEffect-external-mutate.expect.md
+++ b/compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/error.not-useEffect-external-mutate.expect.md
@@ -17,15 +17,31 @@ function Component(props) {
## Error
```
+Found 2 errors:
+InvalidReact: Writing to a variable defined outside a component or hook is not allowed. Consider using an effect
+
+error.not-useEffect-external-mutate.ts:5:4
3 | function Component(props) {
4 | foo(() => {
> 5 | x.a = 10;
- | ^ InvalidReact: Writing to a variable defined outside a component or hook is not allowed. Consider using an effect (5:5)
-
-InvalidReact: Writing to a variable defined outside a component or hook is not allowed. Consider using an effect (6:6)
+ | ^ Writing to a variable defined outside a component or hook is not allowed. Consider using an effect
6 | x.a = 20;
7 | });
8 | }
+
+
+InvalidReact: Writing to a variable defined outside a component or hook is not allowed. Consider using an effect
+
+error.not-useEffect-external-mutate.ts:6:4
+ 4 | foo(() => {
+ 5 | x.a = 10;
+> 6 | x.a = 20;
+ | ^ Writing to a variable defined outside a component or hook is not allowed. Consider using an effect
+ 7 | });
+ 8 | }
+ 9 |
+
+
```
\ No newline at end of file
diff --git a/compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/error.object-capture-global-mutation.expect.md b/compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/error.object-capture-global-mutation.expect.md
index 65292c65e9..4b90da7311 100644
--- a/compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/error.object-capture-global-mutation.expect.md
+++ b/compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/error.object-capture-global-mutation.expect.md
@@ -22,13 +22,19 @@ export const FIXTURE_ENTRYPOINT = {
## Error
```
+Found 1 errors:
+InvalidReact: Writing to a variable defined outside a component or hook is not allowed. Consider using an effect
+
+error.object-capture-global-mutation.ts:4:4
2 | function Foo() {
3 | const x = () => {
> 4 | window.href = 'foo';
- | ^^^^^^ InvalidReact: Writing to a variable defined outside a component or hook is not allowed. Consider using an effect (4:4)
+ | ^^^^^^ Writing to a variable defined outside a component or hook is not allowed. Consider using an effect
5 | };
6 | const y = {x};
7 | return {x}
;
+
+
```
\ No newline at end of file
diff --git a/compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/error.store-property-in-global.expect.md b/compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/error.store-property-in-global.expect.md
index 158101170c..6809bb338d 100644
--- a/compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/error.store-property-in-global.expect.md
+++ b/compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/error.store-property-in-global.expect.md
@@ -15,13 +15,19 @@ function Foo() {
## Error
```
+Found 1 errors:
+InvalidReact: Writing to a variable defined outside a component or hook is not allowed. Consider using an effect
+
+error.store-property-in-global.ts:4:2
2 |
3 | function Foo() {
> 4 | wat.test = 1;
- | ^^^ InvalidReact: Writing to a variable defined outside a component or hook is not allowed. Consider using an effect (4:4)
+ | ^^^ Writing to a variable defined outside a component or hook is not allowed. Consider using an effect
5 | return wat;
6 | }
7 |
+
+
```
\ No newline at end of file
diff --git a/compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/error.todo-for-await-loops.expect.md b/compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/error.todo-for-await-loops.expect.md
index ac4df88034..455d1c24fe 100644
--- a/compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/error.todo-for-await-loops.expect.md
+++ b/compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/error.todo-for-await-loops.expect.md
@@ -16,6 +16,10 @@ async function Component({items}) {
## Error
```
+Found 1 errors:
+Todo: (BuildHIR::lowerStatement) Handle for-await loops
+
+error.todo-for-await-loops.ts:3:2
1 | async function Component({items}) {
2 | const x = [];
> 3 | for await (const item of items) {
@@ -23,10 +27,12 @@ async function Component({items}) {
> 4 | x.push(item);
| ^^^^^^^^^^^^^^^^^
> 5 | }
- | ^^^^ Todo: (BuildHIR::lowerStatement) Handle for-await loops (3:5)
+ | ^^^^ (BuildHIR::lowerStatement) Handle for-await loops
6 | return x;
7 | }
8 |
+
+
```
\ No newline at end of file
diff --git a/compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/error.todo-for-in-loop-with-context-variable-iterator.expect.md b/compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/error.todo-for-in-loop-with-context-variable-iterator.expect.md
index bcba65d94a..04fed5b2f0 100644
--- a/compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/error.todo-for-in-loop-with-context-variable-iterator.expect.md
+++ b/compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/error.todo-for-in-loop-with-context-variable-iterator.expect.md
@@ -31,6 +31,10 @@ export const FIXTURE_ENTRYPOINT = {
## Error
```
+Found 1 errors:
+Todo: Support non-trivial for..in inits
+
+error.todo-for-in-loop-with-context-variable-iterator.ts:8:2
6 | // NOTE: `item` is a context variable because it's reassigned and also referenced
7 | // within a closure, the `onClick` handler of each item
> 8 | for (let key in props.data) {
@@ -48,10 +52,12 @@ export const FIXTURE_ENTRYPOINT = {
> 14 | );
| ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^
> 15 | }
- | ^^^^ Todo: Support non-trivial for..in inits (8:15)
+ | ^^^^ Support non-trivial for..in inits
16 | return {items}
;
17 | }
18 |
+
+
```
\ No newline at end of file
diff --git a/compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/error.todo-for-of-loop-with-context-variable-iterator.expect.md b/compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/error.todo-for-of-loop-with-context-variable-iterator.expect.md
index ba2908b3ae..5de48a6704 100644
--- a/compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/error.todo-for-of-loop-with-context-variable-iterator.expect.md
+++ b/compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/error.todo-for-of-loop-with-context-variable-iterator.expect.md
@@ -31,6 +31,10 @@ export const FIXTURE_ENTRYPOINT = {
## Error
```
+Found 1 errors:
+Todo: Support non-trivial for..of inits
+
+error.todo-for-of-loop-with-context-variable-iterator.ts:8:2
6 | // NOTE: `item` is a context variable because it's reassigned and also referenced
7 | // within a closure, the `onClick` handler of each item
> 8 | for (let item of props.data) {
@@ -48,10 +52,12 @@ export const FIXTURE_ENTRYPOINT = {
> 14 | );
| ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^
> 15 | }
- | ^^^^ Todo: Support non-trivial for..of inits (8:15)
+ | ^^^^ Support non-trivial for..of inits
16 | return {items}
;
17 | }
18 |
+
+
```
\ No newline at end of file
diff --git a/compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/error.todo-function-expression-references-later-variable-declaration.expect.md b/compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/error.todo-function-expression-references-later-variable-declaration.expect.md
index d53d6b9ea4..cbbe6126bf 100644
--- a/compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/error.todo-function-expression-references-later-variable-declaration.expect.md
+++ b/compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/error.todo-function-expression-references-later-variable-declaration.expect.md
@@ -17,13 +17,21 @@ function Component() {
## Error
```
+Found 1 errors:
+InvalidReact: Reassigning a variable after render has completed can cause inconsistent behavior on subsequent renders. Consider using state instead
+
+Variable `onClick` cannot be reassigned after render.
+
+error.todo-function-expression-references-later-variable-declaration.ts:3:4
1 | function Component() {
2 | let callback = () => {
> 3 | onClick = () => {};
- | ^^^^^^^ InvalidReact: Reassigning a variable after render has completed can cause inconsistent behavior on subsequent renders. Consider using state instead. Variable `onClick` cannot be reassigned after render (3:3)
+ | ^^^^^^^ Reassigning a variable after render has completed can cause inconsistent behavior on subsequent renders. Consider using state instead
4 | };
5 | let onClick;
6 |
+
+
```
\ No newline at end of file
diff --git a/compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/error.todo-functiondecl-hoisting.expect.md b/compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/error.todo-functiondecl-hoisting.expect.md
index 6e2310bd10..8b5535c2af 100644
--- a/compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/error.todo-functiondecl-hoisting.expect.md
+++ b/compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/error.todo-functiondecl-hoisting.expect.md
@@ -31,13 +31,19 @@ export const FIXTURE_ENTRYPOINT = {
## Error
```
+Found 1 errors:
+Todo: [PruneHoistedContexts] Rewrite hoisted function references
+
+error.todo-functiondecl-hoisting.ts:12:17
10 | */
11 | function Foo({value}) {
> 12 | const result = bar();
- | ^^^ Todo: [PruneHoistedContexts] Rewrite hoisted function references (12:12)
+ | ^^^ [PruneHoistedContexts] Rewrite hoisted function references
13 | function bar() {
14 | return {value};
15 | }
+
+
```
\ No newline at end of file
diff --git a/compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/error.todo-handle-update-context-identifiers.expect.md b/compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/error.todo-handle-update-context-identifiers.expect.md
index 7467601b22..1cdfd24df5 100644
--- a/compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/error.todo-handle-update-context-identifiers.expect.md
+++ b/compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/error.todo-handle-update-context-identifiers.expect.md
@@ -22,13 +22,19 @@ export const FIXTURE_ENTRYPOINT = {
## Error
```
+Found 1 errors:
+Todo: (BuildHIR::lowerExpression) Handle UpdateExpression to variables captured within lambdas.
+
+error.todo-handle-update-context-identifiers.ts:4:11
2 | let counter = 2;
3 | const fn = () => {
> 4 | return counter++;
- | ^^^^^^^^^ Todo: (BuildHIR::lowerExpression) Handle UpdateExpression to variables captured within lambdas. (4:4)
+ | ^^^^^^^^^ (BuildHIR::lowerExpression) Handle UpdateExpression to variables captured within lambdas.
5 | };
6 |
7 | return fn();
+
+
```
\ No newline at end of file
diff --git a/compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/error.todo-hoist-function-decls.expect.md b/compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/error.todo-hoist-function-decls.expect.md
index b3aa848f1c..1916a57bbf 100644
--- a/compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/error.todo-hoist-function-decls.expect.md
+++ b/compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/error.todo-hoist-function-decls.expect.md
@@ -15,6 +15,10 @@ function Component() {
## Error
```
+Found 1 errors:
+Todo: Support functions with unreachable code that may contain hoisted declarations
+
+error.todo-hoist-function-decls.ts:3:2
1 | function Component() {
2 | return get2();
> 3 | function get2() {
@@ -22,9 +26,11 @@ function Component() {
> 4 | return 2;
| ^^^^^^^^^^^^^
> 5 | }
- | ^^^^ Todo: Support functions with unreachable code that may contain hoisted declarations (3:5)
+ | ^^^^ Support functions with unreachable code that may contain hoisted declarations
6 | }
7 |
+
+
```
\ No newline at end of file
diff --git a/compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/error.todo-hoisted-function-in-unreachable-code.expect.md b/compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/error.todo-hoisted-function-in-unreachable-code.expect.md
index 2b9092213b..2e8e54b663 100644
--- a/compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/error.todo-hoisted-function-in-unreachable-code.expect.md
+++ b/compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/error.todo-hoisted-function-in-unreachable-code.expect.md
@@ -16,12 +16,18 @@ function Component() {
## Error
```
+Found 1 errors:
+Todo: Support functions with unreachable code that may contain hoisted declarations
+
+error.todo-hoisted-function-in-unreachable-code.ts:6:2
4 |
5 | // This is unreachable from a control-flow perspective, but it gets hoisted
> 6 | function Foo() {}
- | ^^^^^^^^^^^^^^^^^ Todo: Support functions with unreachable code that may contain hoisted declarations (6:6)
+ | ^^^^^^^^^^^^^^^^^ Support functions with unreachable code that may contain hoisted declarations
7 | }
8 |
+
+
```
\ No newline at end of file
diff --git a/compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/error.todo-hoisting-simple-var-declaration.expect.md b/compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/error.todo-hoisting-simple-var-declaration.expect.md
index 7c0f9eaf96..6eb4e683fe 100644
--- a/compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/error.todo-hoisting-simple-var-declaration.expect.md
+++ b/compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/error.todo-hoisting-simple-var-declaration.expect.md
@@ -25,13 +25,19 @@ export const FIXTURE_ENTRYPOINT = {
## Error
```
+Found 1 errors:
+Todo: (BuildHIR::lowerStatement) Handle var kinds in VariableDeclaration
+
+error.todo-hoisting-simple-var-declaration.ts:7:2
5 | }
6 | const result = addOne(2);
> 7 | var a = 1;
- | ^^^^^^^^^^ Todo: (BuildHIR::lowerStatement) Handle var kinds in VariableDeclaration (7:7)
+ | ^^^^^^^^^^ (BuildHIR::lowerStatement) Handle var kinds in VariableDeclaration
8 |
9 | return result; // OK: returns NaN. The code is semantically wrong but technically correct
10 | }
+
+
```
\ No newline at end of file
diff --git a/compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/error.todo-hook-call-spreads-mutable-iterator.expect.md b/compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/error.todo-hook-call-spreads-mutable-iterator.expect.md
index 5d0af122f2..aa0dd6cbaa 100644
--- a/compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/error.todo-hook-call-spreads-mutable-iterator.expect.md
+++ b/compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/error.todo-hook-call-spreads-mutable-iterator.expect.md
@@ -21,13 +21,19 @@ export const FIXTURE_ENTRYPOINT = {
## Error
```
+Found 1 errors:
+Todo: Support spread syntax for hook arguments
+
+error.todo-hook-call-spreads-mutable-iterator.ts:5:24
3 | function Component() {
4 | const items = makeArray(0, 1, 2, null, 4, false, 6);
> 5 | return useIdentity(...items.values());
- | ^^^^^^^^^^^^^^ Todo: Support spread syntax for hook arguments (5:5)
+ | ^^^^^^^^^^^^^^ Support spread syntax for hook arguments
6 | }
7 |
8 | export const FIXTURE_ENTRYPOINT = {
+
+
```
\ No newline at end of file
diff --git a/compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/error.todo-invalid-jsx-in-catch-in-outer-try-with-finally.expect.md b/compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/error.todo-invalid-jsx-in-catch-in-outer-try-with-finally.expect.md
index a7ea7b7739..7b3d4a5fc2 100644
--- a/compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/error.todo-invalid-jsx-in-catch-in-outer-try-with-finally.expect.md
+++ b/compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/error.todo-invalid-jsx-in-catch-in-outer-try-with-finally.expect.md
@@ -26,6 +26,10 @@ function Component(props) {
## Error
```
+Found 1 errors:
+Todo: (BuildHIR::lowerStatement) Handle TryStatement without a catch clause
+
+error.todo-invalid-jsx-in-catch-in-outer-try-with-finally.ts:6:2
4 | function Component(props) {
5 | let el;
> 6 | try {
@@ -47,10 +51,12 @@ function Component(props) {
> 14 | console.log(el);
| ^^^^^^^^^^^^^^
> 15 | }
- | ^^^^ Todo: (BuildHIR::lowerStatement) Handle TryStatement without a catch clause (6:15)
+ | ^^^^ (BuildHIR::lowerStatement) Handle TryStatement without a catch clause
16 | return el;
17 | }
18 |
+
+
```
\ No newline at end of file
diff --git a/compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/error.todo-invalid-jsx-in-try-with-finally.expect.md b/compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/error.todo-invalid-jsx-in-try-with-finally.expect.md
index a6a85d4519..150d82d578 100644
--- a/compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/error.todo-invalid-jsx-in-try-with-finally.expect.md
+++ b/compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/error.todo-invalid-jsx-in-try-with-finally.expect.md
@@ -19,6 +19,10 @@ function Component(props) {
## Error
```
+Found 1 errors:
+Todo: (BuildHIR::lowerStatement) Handle TryStatement without a catch clause
+
+error.todo-invalid-jsx-in-try-with-finally.ts:4:2
2 | function Component(props) {
3 | let el;
> 4 | try {
@@ -30,10 +34,12 @@ function Component(props) {
> 7 | console.log(el);
| ^^^^^^^^^^^^^^^^^
> 8 | }
- | ^^^^ Todo: (BuildHIR::lowerStatement) Handle TryStatement without a catch clause (4:8)
+ | ^^^^ (BuildHIR::lowerStatement) Handle TryStatement without a catch clause
9 | return el;
10 | }
11 |
+
+
```
\ No newline at end of file
diff --git a/compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/error.todo-kitchensink.expect.md b/compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/error.todo-kitchensink.expect.md
index 7da1b677bf..05f8372734 100644
--- a/compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/error.todo-kitchensink.expect.md
+++ b/compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/error.todo-kitchensink.expect.md
@@ -79,31 +79,159 @@ let moduleLocal = false;
## Error
```
+Found 10 errors:
+Todo: (BuildHIR::lowerStatement) Handle var kinds in VariableDeclaration
+
+error.todo-kitchensink.ts:3:2
1 | function foo([a, b], {c, d, e = 'e'}, f = 'f', ...args) {
2 | let i = 0;
> 3 | var x = [];
- | ^^^^^^^^^^^ Todo: (BuildHIR::lowerStatement) Handle var kinds in VariableDeclaration (3:3)
-
-UnsupportedJS: Inline `class` declarations are not supported. Move class declarations outside of components/hooks (5:10)
-
-Todo: (BuildHIR::lowerStatement) Handle non-variable initialization in ForStatement (20:22)
-
-Todo: (BuildHIR::lowerStatement) Handle non-variable initialization in ForStatement (23:25)
-
-Todo: (BuildHIR::lowerStatement) Handle non-variable initialization in ForStatement (26:28)
-
-Todo: (BuildHIR::lowerStatement) Handle empty test in ForStatement (26:28)
-
-Todo: (BuildHIR::lowerExpression) Handle tagged template with interpolations (30:32)
-
-Todo: (BuildHIR::lowerExpression) Handle tagged template where cooked value is different from raw value (34:34)
-
-Todo: (BuildHIR::node.lowerReorderableExpression) Expression type `MemberExpression` cannot be safely reordered (57:57)
-
-Todo: (BuildHIR::node.lowerReorderableExpression) Expression type `BinaryExpression` cannot be safely reordered (53:53)
+ | ^^^^^^^^^^^ (BuildHIR::lowerStatement) Handle var kinds in VariableDeclaration
4 |
5 | class Bar {
6 | #secretSauce = 42;
+
+
+UnsupportedJS: Inline `class` declarations are not supported
+
+Move class declarations outside of components/hooks.
+
+error.todo-kitchensink.ts:5:2
+ 3 | var x = [];
+ 4 |
+> 5 | class Bar {
+ | ^^^^^^^^^^^
+> 6 | #secretSauce = 42;
+ | ^^^^^^^^^^^^^^^^^^^^^^
+> 7 | constructor() {
+ | ^^^^^^^^^^^^^^^^^^^^^^
+> 8 | console.log(this.#secretSauce);
+ | ^^^^^^^^^^^^^^^^^^^^^^
+> 9 | }
+ | ^^^^^^^^^^^^^^^^^^^^^^
+> 10 | }
+ | ^^^^ Inline `class` declarations are not supported
+ 11 |
+ 12 | const g = {b() {}, c: () => {}};
+ 13 | const {z, aa = 'aa'} = useCustom();
+
+
+Todo: (BuildHIR::lowerStatement) Handle non-variable initialization in ForStatement
+
+error.todo-kitchensink.ts:20:2
+ 18 | const j = function bar([quz, qux], ...args) {};
+ 19 |
+> 20 | for (; i < 3; i += 1) {
+ | ^^^^^^^^^^^^^^^^^^^^^^^
+> 21 | x.push(i);
+ | ^^^^^^^^^^^^^^
+> 22 | }
+ | ^^^^ (BuildHIR::lowerStatement) Handle non-variable initialization in ForStatement
+ 23 | for (; i < 3; ) {
+ 24 | break;
+ 25 | }
+
+
+Todo: (BuildHIR::lowerStatement) Handle non-variable initialization in ForStatement
+
+error.todo-kitchensink.ts:23:2
+ 21 | x.push(i);
+ 22 | }
+> 23 | for (; i < 3; ) {
+ | ^^^^^^^^^^^^^^^^^
+> 24 | break;
+ | ^^^^^^^^^^
+> 25 | }
+ | ^^^^ (BuildHIR::lowerStatement) Handle non-variable initialization in ForStatement
+ 26 | for (;;) {
+ 27 | break;
+ 28 | }
+
+
+Todo: (BuildHIR::lowerStatement) Handle non-variable initialization in ForStatement
+
+error.todo-kitchensink.ts:26:2
+ 24 | break;
+ 25 | }
+> 26 | for (;;) {
+ | ^^^^^^^^^^
+> 27 | break;
+ | ^^^^^^^^^^
+> 28 | }
+ | ^^^^ (BuildHIR::lowerStatement) Handle non-variable initialization in ForStatement
+ 29 |
+ 30 | graphql`
+ 31 | ${g}
+
+
+Todo: (BuildHIR::lowerStatement) Handle empty test in ForStatement
+
+error.todo-kitchensink.ts:26:2
+ 24 | break;
+ 25 | }
+> 26 | for (;;) {
+ | ^^^^^^^^^^
+> 27 | break;
+ | ^^^^^^^^^^
+> 28 | }
+ | ^^^^ (BuildHIR::lowerStatement) Handle empty test in ForStatement
+ 29 |
+ 30 | graphql`
+ 31 | ${g}
+
+
+Todo: (BuildHIR::lowerExpression) Handle tagged template with interpolations
+
+error.todo-kitchensink.ts:30:2
+ 28 | }
+ 29 |
+> 30 | graphql`
+ | ^^^^^^^^
+> 31 | ${g}
+ | ^^^^^^^^
+> 32 | `;
+ | ^^^^ (BuildHIR::lowerExpression) Handle tagged template with interpolations
+ 33 |
+ 34 | graphql`\\t\n`;
+ 35 |
+
+
+Todo: (BuildHIR::lowerExpression) Handle tagged template where cooked value is different from raw value
+
+error.todo-kitchensink.ts:34:2
+ 32 | `;
+ 33 |
+> 34 | graphql`\\t\n`;
+ | ^^^^^^^^^^^^^^ (BuildHIR::lowerExpression) Handle tagged template where cooked value is different from raw value
+ 35 |
+ 36 | for (c of [1, 2]) {
+ 37 | }
+
+
+Todo: (BuildHIR::node.lowerReorderableExpression) Expression type `MemberExpression` cannot be safely reordered
+
+error.todo-kitchensink.ts:57:9
+ 55 | case foo(): {
+ 56 | }
+> 57 | case x.y: {
+ | ^^^ (BuildHIR::node.lowerReorderableExpression) Expression type `MemberExpression` cannot be safely reordered
+ 58 | }
+ 59 | default: {
+ 60 | }
+
+
+Todo: (BuildHIR::node.lowerReorderableExpression) Expression type `BinaryExpression` cannot be safely reordered
+
+error.todo-kitchensink.ts:53:9
+ 51 |
+ 52 | switch (i) {
+> 53 | case 1 + 1: {
+ | ^^^^^ (BuildHIR::node.lowerReorderableExpression) Expression type `BinaryExpression` cannot be safely reordered
+ 54 | }
+ 55 | case foo(): {
+ 56 | }
+
+
```
\ No newline at end of file
diff --git a/compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/error.todo-logical-expression-within-try-catch.expect.md b/compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/error.todo-logical-expression-within-try-catch.expect.md
index ba80982b3a..96b20c79ea 100644
--- a/compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/error.todo-logical-expression-within-try-catch.expect.md
+++ b/compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/error.todo-logical-expression-within-try-catch.expect.md
@@ -18,13 +18,19 @@ function Component(props) {
## Error
```
+Found 1 errors:
+Todo: Support value blocks (conditional, logical, optional chaining, etc) within a try/catch statement
+
+error.todo-logical-expression-within-try-catch.ts:4:13
2 | let result;
3 | try {
> 4 | result = props.cond && props.foo;
- | ^^^^^ Todo: Support value blocks (conditional, logical, optional chaining, etc) within a try/catch statement (4:4)
+ | ^^^^^ Support value blocks (conditional, logical, optional chaining, etc) within a try/catch statement
5 | } catch (e) {
6 | console.log(e);
7 | }
+
+
```
\ No newline at end of file
diff --git a/compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/error.todo-nested-method-calls-lower-property-load-into-temporary.expect.md b/compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/error.todo-nested-method-calls-lower-property-load-into-temporary.expect.md
index 56bf9e3d62..586f508b23 100644
--- a/compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/error.todo-nested-method-calls-lower-property-load-into-temporary.expect.md
+++ b/compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/error.todo-nested-method-calls-lower-property-load-into-temporary.expect.md
@@ -22,13 +22,19 @@ export const FIXTURE_ENTRYPOINT = {
## Error
```
+Found 1 errors:
+Invariant: [Codegen] Internal error: MethodCall::property must be an unpromoted + unmemoized MemberExpression. Got a `Identifier`
+
+error.todo-nested-method-calls-lower-property-load-into-temporary.ts:6:14
4 | function Component({}) {
5 | const items = makeArray(0, 1, 2, null, 4, false, 6);
> 6 | const max = Math.max(2, items.push(5), ...other);
- | ^^^^^^^^ Invariant: [Codegen] Internal error: MethodCall::property must be an unpromoted + unmemoized MemberExpression. Got a `Identifier` (6:6)
+ | ^^^^^^^^ [Codegen] Internal error: MethodCall::property must be an unpromoted + unmemoized MemberExpression. Got a `Identifier`
7 | return max;
8 | }
9 |
+
+
```
\ No newline at end of file
diff --git a/compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/error.todo-new-target-meta-property.expect.md b/compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/error.todo-new-target-meta-property.expect.md
index cc0aae41e5..7079cb6b21 100644
--- a/compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/error.todo-new-target-meta-property.expect.md
+++ b/compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/error.todo-new-target-meta-property.expect.md
@@ -15,13 +15,19 @@ function foo() {
## Error
```
+Found 1 errors:
+Todo: (BuildHIR::lowerExpression) Handle MetaProperty expressions other than import.meta
+
+error.todo-new-target-meta-property.ts:4:13
2 |
3 | function foo() {
> 4 | const nt = new.target;
- | ^^^^^^^^^^ Todo: (BuildHIR::lowerExpression) Handle MetaProperty expressions other than import.meta (4:4)
+ | ^^^^^^^^^^ (BuildHIR::lowerExpression) Handle MetaProperty expressions other than import.meta
5 | return {object.value}
;
8 | }
+
+
```
\ No newline at end of file
diff --git a/compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/error.todo-object-expression-member-expr-call.expect.md b/compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/error.todo-object-expression-member-expr-call.expect.md
index 82d9ca17ec..e2bc1f8094 100644
--- a/compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/error.todo-object-expression-member-expr-call.expect.md
+++ b/compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/error.todo-object-expression-member-expr-call.expect.md
@@ -25,13 +25,19 @@ export const FIXTURE_ENTRYPOINT = {
## Error
```
+Found 1 errors:
+Todo: (BuildHIR::lowerExpression) Expected Identifier, got CallExpression key in ObjectExpression
+
+error.todo-object-expression-member-expr-call.ts:7:5
5 | const key = {};
6 | const context = {
> 7 | [obj.mutateAndReturn(key)]: identity([props.value]),
- | ^^^^^^^^^^^^^^^^^^^^^^^^ Todo: (BuildHIR::lowerExpression) Expected Identifier, got CallExpression key in ObjectExpression (7:7)
+ | ^^^^^^^^^^^^^^^^^^^^^^^^ (BuildHIR::lowerExpression) Expected Identifier, got CallExpression key in ObjectExpression
8 | };
9 | mutate(key);
10 | return context;
+
+
```
\ No newline at end of file
diff --git a/compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/error.todo-object-expression-set-syntax.expect.md b/compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/error.todo-object-expression-set-syntax.expect.md
index b624fb8936..45d7b33afa 100644
--- a/compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/error.todo-object-expression-set-syntax.expect.md
+++ b/compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/error.todo-object-expression-set-syntax.expect.md
@@ -25,6 +25,10 @@ export const FIXTURE_ENTRYPOINT = {
## Error
```
+Found 1 errors:
+Todo: (BuildHIR::lowerExpression) Handle set functions in ObjectExpression
+
+error.todo-object-expression-set-syntax.ts:4:4
2 | let value;
3 | const object = {
> 4 | set value(v) {
@@ -32,10 +36,12 @@ export const FIXTURE_ENTRYPOINT = {
> 5 | value = v;
| ^^^^^^^^^^^^^^^^
> 6 | },
- | ^^^^^^ Todo: (BuildHIR::lowerExpression) Handle set functions in ObjectExpression (4:6)
+ | ^^^^^^ (BuildHIR::lowerExpression) Handle set functions in ObjectExpression
7 | };
8 | object.value = props.value;
9 | return {value}
;
+
+
```
\ No newline at end of file
diff --git a/compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/error.todo-optional-call-chain-in-logical-expr.expect.md b/compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/error.todo-optional-call-chain-in-logical-expr.expect.md
index 57231fae9f..03fa7a736f 100644
--- a/compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/error.todo-optional-call-chain-in-logical-expr.expect.md
+++ b/compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/error.todo-optional-call-chain-in-logical-expr.expect.md
@@ -20,13 +20,19 @@ export const FIXTURE_ENTRYPONT = {
## Error
```
+Found 1 errors:
+Todo: Unexpected terminal kind `optional` for logical test block
+
+error.todo-optional-call-chain-in-logical-expr.ts:5:30
3 | function useFoo(props: {value: {x: string; y: string} | null}) {
4 | const value = props.value;
> 5 | return useNoAlias(value?.x, value?.y) ?? {};
- | ^^^^^^^^ Todo: Unexpected terminal kind `optional` for logical test block (5:5)
+ | ^^^^^^^^ Unexpected terminal kind `optional` for logical test block
6 | }
7 |
8 | export const FIXTURE_ENTRYPONT = {
+
+
```
\ No newline at end of file
diff --git a/compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/error.todo-optional-call-chain-in-optional.expect.md b/compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/error.todo-optional-call-chain-in-optional.expect.md
index 8bf7f5bc71..aae5e307eb 100644
--- a/compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/error.todo-optional-call-chain-in-optional.expect.md
+++ b/compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/error.todo-optional-call-chain-in-optional.expect.md
@@ -22,13 +22,19 @@ export const FIXTURE_ENTRYPONT = {
## Error
```
+Found 1 errors:
+Todo: Unexpected terminal kind `optional` for optional fallthrough block
+
+error.todo-optional-call-chain-in-optional.ts:3:21
1 | function useFoo(props: {value: {x: string; y: string} | null}) {
2 | const value = props.value;
> 3 | return createArray(value?.x, value?.y)?.join(', ');
- | ^^^^^^^^ Todo: Unexpected terminal kind `optional` for optional fallthrough block (3:3)
+ | ^^^^^^^^ Unexpected terminal kind `optional` for optional fallthrough block
4 | }
5 |
6 | function createArray(...args: Array): Array {
+
+
```
\ No newline at end of file
diff --git a/compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/error.todo-optional-call-chain-in-ternary.expect.md b/compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/error.todo-optional-call-chain-in-ternary.expect.md
index d8cd4a917b..cf415e6528 100644
--- a/compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/error.todo-optional-call-chain-in-ternary.expect.md
+++ b/compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/error.todo-optional-call-chain-in-ternary.expect.md
@@ -20,13 +20,19 @@ export const FIXTURE_ENTRYPONT = {
## Error
```
+Found 1 errors:
+Todo: Unexpected terminal kind `optional` for ternary test block
+
+error.todo-optional-call-chain-in-ternary.ts:5:30
3 | function useFoo(props: {value: {x: string; y: string} | null}) {
4 | const value = props.value;
> 5 | return useNoAlias(value?.x, value?.y) ? {} : null;
- | ^^^^^^^^ Todo: Unexpected terminal kind `optional` for ternary test block (5:5)
+ | ^^^^^^^^ Unexpected terminal kind `optional` for ternary test block
6 | }
7 |
8 | export const FIXTURE_ENTRYPONT = {
+
+
```
\ No newline at end of file
diff --git a/compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/error.todo-reassign-const.expect.md b/compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/error.todo-reassign-const.expect.md
index e06d24d9e8..fd3eb2e705 100644
--- a/compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/error.todo-reassign-const.expect.md
+++ b/compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/error.todo-reassign-const.expect.md
@@ -21,13 +21,19 @@ function Component({foo}) {
## Error
```
+Found 1 errors:
+Todo: Support destructuring of context variables
+
+error.todo-reassign-const.ts:3:20
1 | import {Stringify} from 'shared-runtime';
2 |
> 3 | function Component({foo}) {
- | ^^^ Todo: Support destructuring of context variables (3:3)
+ | ^^^ Support destructuring of context variables
4 | let bar = foo.bar;
5 | return (
6 | 5 | for (let i = 0; i < 2; i++) {}
- | ^ Todo: Support value blocks (conditional, logical, optional chaining, etc) within a try/catch statement (5:5)
+ | ^ Support value blocks (conditional, logical, optional chaining, etc) within a try/catch statement
6 | } catch {}
7 | }
8 |
+
+
```
\ No newline at end of file
diff --git a/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 b/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
index 5205445751..785120cad1 100644
--- a/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
+++ b/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
@@ -42,13 +42,19 @@ component Component() {
## Error
```
+Found 1 errors:
+CannotPreserveMemoization: React Compiler has skipped optimizing this component because the existing manual memoization could not be preserved. This value was memoized in source but not in compilation output.
+
+undefined:18:20
16 | // We infer that getIsEnabled returns a mutable value, such that
17 | // isEnabled is mutable
> 18 | const isEnabled = useMemo(() => getIsEnabled(), [getIsEnabled]);
- | ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^ CannotPreserveMemoization: React Compiler has skipped optimizing this component because the existing manual memoization could not be preserved. This value was memoized in source but not in compilation output. (18:18)
+ | ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^ React Compiler has skipped optimizing this component because the existing manual memoization could not be preserved. This value was memoized in source but not in compilation output.
19 |
20 | // We then infer getLoggingData as capturing that mutable value,
21 | // so any calls to this function are then inferred as extending
+
+
```
\ No newline at end of file
diff --git a/compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/error.todo-repro-missed-memoization-from-inferred-mutation-in-logger.expect.md b/compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/error.todo-repro-missed-memoization-from-inferred-mutation-in-logger.expect.md
index 39e4c5f0c3..606b1b5033 100644
--- a/compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/error.todo-repro-missed-memoization-from-inferred-mutation-in-logger.expect.md
+++ b/compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/error.todo-repro-missed-memoization-from-inferred-mutation-in-logger.expect.md
@@ -52,6 +52,10 @@ component Component(id) {
## Error
```
+Found 3 errors:
+CannotPreserveMemoization: React Compiler has skipped optimizing this component because the existing manual memoization could not be preserved. This value was memoized in source but not in compilation output.
+
+undefined:11:18
9 | const [index, setIndex] = useState(0);
10 |
> 11 | const logData = useMemo(() => {
@@ -65,14 +69,52 @@ component Component(id) {
> 15 | };
| ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^
> 16 | }, [index, items]);
- | ^^^^^^^^^^^^^^^^^^^^^ CannotPreserveMemoization: React Compiler has skipped optimizing this component because the existing manual memoization could not be preserved. This value was memoized in source but not in compilation output. (11:16)
-
-CannotPreserveMemoization: React Compiler has skipped optimizing this component because the existing manual memoization could not be preserved. This dependency may be mutated later, which could cause the value to change unexpectedly (28:28)
-
-CannotPreserveMemoization: React Compiler has skipped optimizing this component because the existing manual memoization could not be preserved. This value was memoized in source but not in compilation output. (19:27)
+ | ^^^^^^^^^^^^^^^^^^^^^ React Compiler has skipped optimizing this component because the existing manual memoization could not be preserved. This value was memoized in source but not in compilation output.
17 |
18 | const setCurrentIndex = useCallback(
19 | (index: number) => {
+
+
+CannotPreserveMemoization: React Compiler has skipped optimizing this component because the existing manual memoization could not be preserved. This dependency may be mutated later, which could cause the value to change unexpectedly
+
+undefined:28:12
+ 26 | setIndex(index);
+ 27 | },
+> 28 | [index, logData, items]
+ | ^^^^^^^ React Compiler has skipped optimizing this component because the existing manual memoization could not be preserved. This dependency may be mutated later, which could cause the value to change unexpectedly
+ 29 | );
+ 30 |
+ 31 | if (prevId !== id) {
+
+
+CannotPreserveMemoization: React Compiler has skipped optimizing this component because the existing manual memoization could not be preserved. This value was memoized in source but not in compilation output.
+
+undefined:19:4
+ 17 |
+ 18 | const setCurrentIndex = useCallback(
+> 19 | (index: number) => {
+ | ^^^^^^^^^^^^^^^^^^^^
+> 20 | const object = {
+ | ^^^^^^^^^^^^^^^^^^^^^^
+> 21 | tracking: logData.key,
+ | ^^^^^^^^^^^^^^^^^^^^^^
+> 22 | };
+ | ^^^^^^^^^^^^^^^^^^^^^^
+> 23 | // We infer that this may mutate `object`, which in turn aliases
+ | ^^^^^^^^^^^^^^^^^^^^^^
+> 24 | // data from `logData`, such that `logData` may be mutated.
+ | ^^^^^^^^^^^^^^^^^^^^^^
+> 25 | LogEvent.log(() => object);
+ | ^^^^^^^^^^^^^^^^^^^^^^
+> 26 | setIndex(index);
+ | ^^^^^^^^^^^^^^^^^^^^^^
+> 27 | },
+ | ^^^^^^ React Compiler has skipped optimizing this component because the existing manual memoization could not be preserved. This value was memoized in source but not in compilation output.
+ 28 | [index, logData, items]
+ 29 | );
+ 30 |
+
+
```
\ No newline at end of file
diff --git a/compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/error.todo-repro-named-function-with-shadowed-local-same-name.expect.md b/compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/error.todo-repro-named-function-with-shadowed-local-same-name.expect.md
index 8dd58594ec..98d755980d 100644
--- a/compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/error.todo-repro-named-function-with-shadowed-local-same-name.expect.md
+++ b/compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/error.todo-repro-named-function-with-shadowed-local-same-name.expect.md
@@ -19,12 +19,20 @@ function Component(props) {
## Error
```
+Found 1 errors:
+Invariant: [InferMutationAliasingEffects] Expected value kind to be initialized
+
+ hasErrors_0$15:TFunction.
+
+error.todo-repro-named-function-with-shadowed-local-same-name.ts:9:9
7 | return hasErrors;
8 | }
> 9 | return hasErrors();
- | ^^^^^^^^^ Invariant: [InferMutationAliasingEffects] Expected value kind to be initialized. hasErrors_0$15:TFunction (9:9)
+ | ^^^^^^^^^ [InferMutationAliasingEffects] Expected value kind to be initialized
10 | }
11 |
+
+
```
\ No newline at end of file
diff --git a/compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/error.todo-repro-unmemoized-callback-captured-in-context-variable.expect.md b/compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/error.todo-repro-unmemoized-callback-captured-in-context-variable.expect.md
index 30eb3ee27e..c228c24bea 100644
--- a/compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/error.todo-repro-unmemoized-callback-captured-in-context-variable.expect.md
+++ b/compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/error.todo-repro-unmemoized-callback-captured-in-context-variable.expect.md
@@ -50,13 +50,19 @@ export const FIXTURE_ENTRYPOINT = {
## Error
```
+Found 1 errors:
+CannotPreserveMemoization: React Compiler has skipped optimizing this component because the existing manual memoization could not be preserved. This value was memoized in source but not in compilation output.
+
+error.todo-repro-unmemoized-callback-captured-in-context-variable.ts:11:12
9 | const a = useHook();
10 | // Because b is also part of that same mutable range, it can't be memoized either
> 11 | const b = useMemo(() => ({}), []);
- | ^^^^^^^^^^^^^^^^^^^^^^^ CannotPreserveMemoization: React Compiler has skipped optimizing this component because the existing manual memoization could not be preserved. This value was memoized in source but not in compilation output. (11:11)
+ | ^^^^^^^^^^^^^^^^^^^^^^^ React Compiler has skipped optimizing this component because the existing manual memoization could not be preserved. This value was memoized in source but not in compilation output.
12 |
13 | // Conditional assignment without a subsequent mutation normally doesn't create a mutable
14 | // range, but in this case we're reassigning a context variable
+
+
```
\ No newline at end of file
diff --git a/compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/error.todo-useCallback-set-ref-nested-property-ref-modified-later-preserve-memoization.expect.md b/compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/error.todo-useCallback-set-ref-nested-property-ref-modified-later-preserve-memoization.expect.md
index 7a8f271bd2..6cbd2ad514 100644
--- a/compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/error.todo-useCallback-set-ref-nested-property-ref-modified-later-preserve-memoization.expect.md
+++ b/compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/error.todo-useCallback-set-ref-nested-property-ref-modified-later-preserve-memoization.expect.md
@@ -31,13 +31,19 @@ export const FIXTURE_ENTRYPOINT = {
## Error
```
+Found 1 errors:
+InvalidReact: Ref values (the `current` property) may not be accessed during render. (https://react.dev/reference/react/useRef)
+
+error.todo-useCallback-set-ref-nested-property-ref-modified-later-preserve-memoization.ts:14:2
12 |
13 | // The ref is modified later, extending its range and preventing memoization of onChange
> 14 | ref.current.inner = null;
- | ^^^^^^^^^^^ InvalidReact: Ref values (the `current` property) may not be accessed during render. (https://react.dev/reference/react/useRef) (14:14)
+ | ^^^^^^^^^^^ Ref values (the `current` property) may not be accessed during render. (https://react.dev/reference/react/useRef)
15 |
16 | return {props.bar}
;
5 | }
6 |
+
+
```
\ No newline at end of file
diff --git a/compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/fbt/error.todo-fbt-as-local.expect.md b/compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/fbt/error.todo-fbt-as-local.expect.md
index c036fa0b69..c16eb057b0 100644
--- a/compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/fbt/error.todo-fbt-as-local.expect.md
+++ b/compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/fbt/error.todo-fbt-as-local.expect.md
@@ -50,10 +50,16 @@ export const FIXTURE_ENTRYPOINT = {
## Error
```
+Found 1 errors:
+Todo: Support local variables named `fbt`
+
+Local variables named `fbt` may conflict with the fbt plugin and are not yet supported
+
+error.todo-fbt-as-local.ts:18:19
16 |
17 | function Foo(props) {
> 18 | const getText1 = fbt =>
- | ^^^ Todo: Support local variables named "fbt" (18:18)
+ | ^^^ Rename to avoid conflict with fbt plugin
19 | fbt(
20 | `Hello, ${fbt.param('(key) name', identity(props.name))}!`,
21 | '(description) Greeting'
diff --git a/compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/fbt/error.todo-fbt-unknown-enum-value.expect.md b/compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/fbt/error.todo-fbt-unknown-enum-value.expect.md
index b6f9cc3bea..4d1320ed81 100644
--- a/compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/fbt/error.todo-fbt-unknown-enum-value.expect.md
+++ b/compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/fbt/error.todo-fbt-unknown-enum-value.expect.md
@@ -19,10 +19,25 @@ function Component({a, b}) {
## Error
```
+Found 1 errors:
+Todo: Support duplicate fbt tags
+
+Support `` tags with multiple `` values
+
+error.todo-fbt-unknown-enum-value.ts:6:7
+ 4 | return (
+ 5 |
+> 6 | ` tags found
+ 7 |
+ 9 | );
+
+error.todo-fbt-unknown-enum-value.ts:7:7
5 |
6 | tags with multiple values (7:7)
+ | ^^^^^^^^ Multiple `` tags found
8 |
9 | );
10 | }
diff --git a/compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/fbt/error.todo-locally-require-fbt.expect.md b/compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/fbt/error.todo-locally-require-fbt.expect.md
index 350c6873d0..76ed42add3 100644
--- a/compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/fbt/error.todo-locally-require-fbt.expect.md
+++ b/compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/fbt/error.todo-locally-require-fbt.expect.md
@@ -14,9 +14,15 @@ function Component(props) {
## Error
```
+Found 1 errors:
+Todo: Support local variables named `fbt`
+
+Local variables named `fbt` may conflict with the fbt plugin and are not yet supported
+
+error.todo-locally-require-fbt.ts:2:8
1 | function Component(props) {
> 2 | const fbt = require('fbt');
- | ^^^ Todo: Support local variables named "fbt" (2:2)
+ | ^^^ Rename to avoid conflict with fbt plugin
3 |
4 | return {'Text'} ;
5 | }
diff --git a/compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/fbt/error.todo-multiple-fbt-plural.expect.md b/compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/fbt/error.todo-multiple-fbt-plural.expect.md
index 4645ea67b7..f2c5a805b6 100644
--- a/compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/fbt/error.todo-multiple-fbt-plural.expect.md
+++ b/compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/fbt/error.todo-multiple-fbt-plural.expect.md
@@ -53,10 +53,25 @@ export const FIXTURE_ENTRYPOINT = {
## Error
```
+Found 1 errors:
+Todo: Support duplicate fbt tags
+
+Support `` tags with multiple `` values
+
+error.todo-multiple-fbt-plural.ts:29:7
+ 27 | return (
+ 28 |
+> 29 |
+ | ^^^^^^^^^^ Multiple `` tags found
+ 30 | rewrite
+ 31 |
+ 32 | to Rust ·
+
+error.todo-multiple-fbt-plural.ts:33:7
31 |
32 | to Rust ·
> 33 |
- | ^^^^^^^^^^ Todo: Support tags with multiple values (33:33)
+ | ^^^^^^^^^^ Multiple `` tags found
34 | month
35 |
36 | traveling
diff --git a/compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/gating/error.dynamic-gating-invalid-identifier-nopanic-required-feature.expect.md b/compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/gating/error.dynamic-gating-invalid-identifier-nopanic-required-feature.expect.md
index 7f9f608383..576a079841 100644
--- a/compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/gating/error.dynamic-gating-invalid-identifier-nopanic-required-feature.expect.md
+++ b/compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/gating/error.dynamic-gating-invalid-identifier-nopanic-required-feature.expect.md
@@ -23,10 +23,16 @@ export const FIXTURE_ENTRYPOINT = {
## Error
```
+Found 1 errors:
+InvalidReact: Cannot infer dependencies of this effect. This will break your build!
+
+To resolve, either pass a dependency array or fix reported compiler bailout diagnostics.
+
+error.dynamic-gating-invalid-identifier-nopanic-required-feature.ts:8:2
6 | 'use memo if(invalid identifier)';
7 | const arr = [propVal];
> 8 | useEffect(() => print(arr));
- | ^^^^^^^^^^^^^^^^^^^^^^^^^^^ InvalidReact: [InferEffectDependencies] React Compiler is unable to infer dependencies of this effect. This will break your build! To resolve, either pass your own dependency array or fix reported compiler bailout diagnostics. (8:8)
+ | ^^^^^^^^^^^^^^^^^^^^^^^^^^^ Cannot infer dependencies
9 | }
10 |
11 | export const FIXTURE_ENTRYPOINT = {
diff --git a/compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/gating/error.dynamic-gating-invalid-identifier.expect.md b/compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/gating/error.dynamic-gating-invalid-identifier.expect.md
index c824afd680..2ffebe1f7f 100644
--- a/compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/gating/error.dynamic-gating-invalid-identifier.expect.md
+++ b/compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/gating/error.dynamic-gating-invalid-identifier.expect.md
@@ -20,13 +20,21 @@ export const FIXTURE_ENTRYPOINT = {
## Error
```
+Found 1 errors:
+InvalidReact: Dynamic gating directive is not a valid JavaScript identifier
+
+Found 'use memo if(true)'.
+
+error.dynamic-gating-invalid-identifier.ts:4:2
2 |
3 | function Foo() {
> 4 | 'use memo if(true)';
- | ^^^^^^^^^^^^^^^^^^^^ InvalidReact: Dynamic gating directive is not a valid JavaScript identifier. Found 'use memo if(true)' (4:4)
+ | ^^^^^^^^^^^^^^^^^^^^ Dynamic gating directive is not a valid JavaScript identifier
5 | return hello world
;
6 | }
7 |
+
+
```
\ No newline at end of file
diff --git a/compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/infer-effect-dependencies/bailout-retry/error.callsite-in-non-react-fn-default-import.expect.md b/compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/infer-effect-dependencies/bailout-retry/error.callsite-in-non-react-fn-default-import.expect.md
index 8cbe8da62f..87283d2601 100644
--- a/compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/infer-effect-dependencies/bailout-retry/error.callsite-in-non-react-fn-default-import.expect.md
+++ b/compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/infer-effect-dependencies/bailout-retry/error.callsite-in-non-react-fn-default-import.expect.md
@@ -15,10 +15,16 @@ function nonReactFn(arg) {
## Error
```
+Found 1 errors:
+InvalidReact: Cannot infer dependencies of this effect. This will break your build!
+
+To resolve, either pass a dependency array or fix reported compiler bailout diagnostics.
+
+error.callsite-in-non-react-fn-default-import.ts:5:2
3 |
4 | function nonReactFn(arg) {
> 5 | useMyEffect(() => [1, 2, arg]);
- | ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^ InvalidReact: [InferEffectDependencies] React Compiler is unable to infer dependencies of this effect. This will break your build! To resolve, either pass your own dependency array or fix reported compiler bailout diagnostics. (5:5)
+ | ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^ Cannot infer dependencies
6 | }
7 |
```
diff --git a/compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/infer-effect-dependencies/bailout-retry/error.callsite-in-non-react-fn.expect.md b/compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/infer-effect-dependencies/bailout-retry/error.callsite-in-non-react-fn.expect.md
index 8feec25376..c2be894650 100644
--- a/compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/infer-effect-dependencies/bailout-retry/error.callsite-in-non-react-fn.expect.md
+++ b/compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/infer-effect-dependencies/bailout-retry/error.callsite-in-non-react-fn.expect.md
@@ -15,10 +15,16 @@ function nonReactFn(arg) {
## Error
```
+Found 1 errors:
+InvalidReact: Cannot infer dependencies of this effect. This will break your build!
+
+To resolve, either pass a dependency array or fix reported compiler bailout diagnostics.
+
+error.callsite-in-non-react-fn.ts:5:2
3 |
4 | function nonReactFn(arg) {
> 5 | useEffect(() => [1, 2, arg]);
- | ^^^^^^^^^^^^^^^^^^^^^^^^^^^^ InvalidReact: [InferEffectDependencies] React Compiler is unable to infer dependencies of this effect. This will break your build! To resolve, either pass your own dependency array or fix reported compiler bailout diagnostics. (5:5)
+ | ^^^^^^^^^^^^^^^^^^^^^^^^^^^^ Cannot infer dependencies
6 | }
7 |
```
diff --git a/compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/infer-effect-dependencies/bailout-retry/error.non-inlined-effect-fn.expect.md b/compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/infer-effect-dependencies/bailout-retry/error.non-inlined-effect-fn.expect.md
index eeec00995b..32269fefb3 100644
--- a/compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/infer-effect-dependencies/bailout-retry/error.non-inlined-effect-fn.expect.md
+++ b/compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/infer-effect-dependencies/bailout-retry/error.non-inlined-effect-fn.expect.md
@@ -30,10 +30,16 @@ function Component({foo}) {
## Error
```
+Found 1 errors:
+InvalidReact: Cannot infer dependencies of this effect. This will break your build!
+
+To resolve, either pass a dependency array or fix reported compiler bailout diagnostics.
+
+error.non-inlined-effect-fn.ts:20:2
18 |
19 | // No inferred dep array, the argument is not a lambda
> 20 | useEffect(f);
- | ^^^^^^^^^^^^ InvalidReact: [InferEffectDependencies] React Compiler is unable to infer dependencies of this effect. This will break your build! To resolve, either pass your own dependency array or fix reported compiler bailout diagnostics. (20:20)
+ | ^^^^^^^^^^^^ Cannot infer dependencies
21 | }
22 |
```
diff --git a/compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/infer-effect-dependencies/bailout-retry/error.todo-dynamic-gating.expect.md b/compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/infer-effect-dependencies/bailout-retry/error.todo-dynamic-gating.expect.md
index ec5ef238b7..0edabec5af 100644
--- a/compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/infer-effect-dependencies/bailout-retry/error.todo-dynamic-gating.expect.md
+++ b/compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/infer-effect-dependencies/bailout-retry/error.todo-dynamic-gating.expect.md
@@ -30,10 +30,16 @@ export const FIXTURE_ENTRYPOINT = {
## Error
```
+Found 1 errors:
+InvalidReact: Cannot infer dependencies of this effect. This will break your build!
+
+To resolve, either pass a dependency array or fix reported compiler bailout diagnostics.
+
+error.todo-dynamic-gating.ts:12:2
10 | 'use memo if(getTrue)';
11 | const arr = [];
> 12 | useEffectWrapper(() => arr.push(foo));
- | ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^ InvalidReact: [InferEffectDependencies] React Compiler is unable to infer dependencies of this effect. This will break your build! To resolve, either pass your own dependency array or fix reported compiler bailout diagnostics. (12:12)
+ | ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^ Cannot infer dependencies
13 | arr.push(2);
14 | return arr;
15 | }
diff --git a/compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/infer-effect-dependencies/bailout-retry/error.todo-gating.expect.md b/compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/infer-effect-dependencies/bailout-retry/error.todo-gating.expect.md
index e071e37cb9..d058168f4c 100644
--- a/compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/infer-effect-dependencies/bailout-retry/error.todo-gating.expect.md
+++ b/compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/infer-effect-dependencies/bailout-retry/error.todo-gating.expect.md
@@ -28,10 +28,16 @@ export const FIXTURE_ENTRYPOINT = {
## Error
```
+Found 1 errors:
+InvalidReact: Cannot infer dependencies of this effect. This will break your build!
+
+To resolve, either pass a dependency array or fix reported compiler bailout diagnostics.
+
+error.todo-gating.ts:10:2
8 | function Component({foo}) {
9 | const arr = [];
> 10 | useEffectWrapper(() => arr.push(foo));
- | ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^ InvalidReact: [InferEffectDependencies] React Compiler is unable to infer dependencies of this effect. This will break your build! To resolve, either pass your own dependency array or fix reported compiler bailout diagnostics. (10:10)
+ | ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^ Cannot infer dependencies
11 | arr.push(2);
12 | return arr;
13 | }
diff --git a/compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/infer-effect-dependencies/bailout-retry/error.todo-import-default-property-useEffect.expect.md b/compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/infer-effect-dependencies/bailout-retry/error.todo-import-default-property-useEffect.expect.md
index 416ede4556..baa2f3f438 100644
--- a/compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/infer-effect-dependencies/bailout-retry/error.todo-import-default-property-useEffect.expect.md
+++ b/compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/infer-effect-dependencies/bailout-retry/error.todo-import-default-property-useEffect.expect.md
@@ -16,10 +16,16 @@ function NonReactiveDepInEffect() {
## Error
```
+Found 1 errors:
+InvalidReact: Cannot infer dependencies of this effect. This will break your build!
+
+To resolve, either pass a dependency array or fix reported compiler bailout diagnostics.
+
+error.todo-import-default-property-useEffect.ts:6:2
4 | function NonReactiveDepInEffect() {
5 | const obj = makeObject_Primitives();
> 6 | React.useEffect(() => print(obj));
- | ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^ InvalidReact: [InferEffectDependencies] React Compiler is unable to infer dependencies of this effect. This will break your build! To resolve, either pass your own dependency array or fix reported compiler bailout diagnostics. (6:6)
+ | ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^ Cannot infer dependencies
7 | }
8 |
```
diff --git a/compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/infer-effect-dependencies/bailout-retry/error.todo-syntax.expect.md b/compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/infer-effect-dependencies/bailout-retry/error.todo-syntax.expect.md
index a396b9c3ca..c92d7989ed 100644
--- a/compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/infer-effect-dependencies/bailout-retry/error.todo-syntax.expect.md
+++ b/compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/infer-effect-dependencies/bailout-retry/error.todo-syntax.expect.md
@@ -27,6 +27,12 @@ function Component({prop1}) {
## Error
```
+Found 1 errors:
+InvalidReact: Cannot infer dependencies of this effect. This will break your build!
+
+To resolve, either pass a dependency array or fix reported compiler bailout diagnostics. Todo: (BuildHIR::lowerStatement) Handle TryStatement without a catch clause (11:4)
+
+error.todo-syntax.ts:10:2
8 | function Component({prop1}) {
9 | 'use memo';
> 10 | useSpecialEffect(() => {
@@ -42,7 +48,7 @@ function Component({prop1}) {
> 15 | }
| ^^^^^^^^^
> 16 | }, [prop1]);
- | ^^^^^^^^^^^^^^ InvalidReact: [InferEffectDependencies] React Compiler is unable to infer dependencies of this effect. This will break your build! To resolve, either pass your own dependency array or fix reported compiler bailout diagnostics.. (Bailout reason: Todo: (BuildHIR::lowerStatement) Handle TryStatement without a catch clause (11:15)) (10:16)
+ | ^^^^^^^^^^^^^^ Cannot infer dependencies
17 | return {prop1}
;
18 | }
19 |
diff --git a/compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/infer-effect-dependencies/bailout-retry/error.use-no-memo.expect.md b/compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/infer-effect-dependencies/bailout-retry/error.use-no-memo.expect.md
index c3413f9fd0..48387bf76e 100644
--- a/compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/infer-effect-dependencies/bailout-retry/error.use-no-memo.expect.md
+++ b/compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/infer-effect-dependencies/bailout-retry/error.use-no-memo.expect.md
@@ -16,10 +16,16 @@ function Component({propVal}) {
## Error
```
+Found 1 errors:
+InvalidReact: Cannot infer dependencies of this effect. This will break your build!
+
+To resolve, either pass a dependency array or fix reported compiler bailout diagnostics.
+
+error.use-no-memo.ts:6:2
4 | function Component({propVal}) {
5 | 'use no memo';
> 6 | useEffect(() => [propVal]);
- | ^^^^^^^^^^^^^^^^^^^^^^^^^^ InvalidReact: [InferEffectDependencies] React Compiler is unable to infer dependencies of this effect. This will break your build! To resolve, either pass your own dependency array or fix reported compiler bailout diagnostics. (6:6)
+ | ^^^^^^^^^^^^^^^^^^^^^^^^^^ Cannot infer dependencies
7 | }
8 |
```
diff --git a/compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/invalid-jsx-in-catch-in-outer-try-with-catch.expect.md b/compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/invalid-jsx-in-catch-in-outer-try-with-catch.expect.md
index 9f4d85de70..fe8af41171 100644
--- a/compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/invalid-jsx-in-catch-in-outer-try-with-catch.expect.md
+++ b/compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/invalid-jsx-in-catch-in-outer-try-with-catch.expect.md
@@ -65,7 +65,7 @@ function Component(props) {
## Logs
```
-{"kind":"CompileError","detail":{"options":{"reason":"Unexpected JSX element within a try statement. To catch errors in rendering a given component, wrap that component in an error boundary. (https://react.dev/reference/react/Component#catching-rendering-errors-with-an-error-boundary)","description":null,"severity":"InvalidReact","loc":{"start":{"line":11,"column":11,"index":222},"end":{"line":11,"column":32,"index":243},"filename":"invalid-jsx-in-catch-in-outer-try-with-catch.ts"}}},"fnLoc":null}
+{"kind":"CompileError","detail":{"reason":"Unexpected JSX element within a try statement. To catch errors in rendering a given component, wrap that component in an error boundary. (https://react.dev/reference/react/Component#catching-rendering-errors-with-an-error-boundary)","description":null,"severity":"InvalidReact","loc":{"start":{"line":11,"column":11,"index":222},"end":{"line":11,"column":32,"index":243},"filename":"invalid-jsx-in-catch-in-outer-try-with-catch.ts"}},"fnLoc":null}
{"kind":"CompileSuccess","fnLoc":{"start":{"line":4,"column":0,"index":91},"end":{"line":17,"column":1,"index":298},"filename":"invalid-jsx-in-catch-in-outer-try-with-catch.ts"},"fnName":"Component","memoSlots":4,"memoBlocks":2,"memoValues":2,"prunedMemoBlocks":0,"prunedMemoValues":0}
```
diff --git a/compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/invalid-jsx-in-try-with-catch.expect.md b/compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/invalid-jsx-in-try-with-catch.expect.md
index 9fe89f25ee..4ff84c019b 100644
--- a/compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/invalid-jsx-in-try-with-catch.expect.md
+++ b/compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/invalid-jsx-in-try-with-catch.expect.md
@@ -42,7 +42,7 @@ function Component(props) {
## Logs
```
-{"kind":"CompileError","detail":{"options":{"reason":"Unexpected JSX element within a try statement. To catch errors in rendering a given component, wrap that component in an error boundary. (https://react.dev/reference/react/Component#catching-rendering-errors-with-an-error-boundary)","description":null,"severity":"InvalidReact","loc":{"start":{"line":5,"column":9,"index":104},"end":{"line":5,"column":16,"index":111},"filename":"invalid-jsx-in-try-with-catch.ts"}}},"fnLoc":null}
+{"kind":"CompileError","detail":{"reason":"Unexpected JSX element within a try statement. To catch errors in rendering a given component, wrap that component in an error boundary. (https://react.dev/reference/react/Component#catching-rendering-errors-with-an-error-boundary)","description":null,"severity":"InvalidReact","loc":{"start":{"line":5,"column":9,"index":104},"end":{"line":5,"column":16,"index":111},"filename":"invalid-jsx-in-try-with-catch.ts"}},"fnLoc":null}
{"kind":"CompileSuccess","fnLoc":{"start":{"line":2,"column":0,"index":49},"end":{"line":10,"column":1,"index":160},"filename":"invalid-jsx-in-try-with-catch.ts"},"fnName":"Component","memoSlots":1,"memoBlocks":1,"memoValues":1,"prunedMemoBlocks":0,"prunedMemoValues":0}
```
diff --git a/compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/invalid-setState-in-useEffect-transitive.expect.md b/compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/invalid-setState-in-useEffect-transitive.expect.md
index e116fb4fd9..100596a048 100644
--- a/compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/invalid-setState-in-useEffect-transitive.expect.md
+++ b/compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/invalid-setState-in-useEffect-transitive.expect.md
@@ -65,7 +65,7 @@ function _temp(s) {
## Logs
```
-{"kind":"CompileError","detail":{"options":{"reason":"Calling setState directly within a useEffect causes cascading renders and is not recommended. Consider alternatives to useEffect. (https://react.dev/learn/you-might-not-need-an-effect)","description":null,"severity":"InvalidReact","suggestions":null,"loc":{"start":{"line":13,"column":4,"index":272},"end":{"line":13,"column":5,"index":273},"filename":"invalid-setState-in-useEffect-transitive.ts","identifierName":"g"}}},"fnLoc":null}
+{"kind":"CompileError","detail":{"reason":"Calling setState directly within a useEffect causes cascading renders and is not recommended. Consider alternatives to useEffect. (https://react.dev/learn/you-might-not-need-an-effect)","description":null,"severity":"InvalidReact","suggestions":null,"loc":{"start":{"line":13,"column":4,"index":272},"end":{"line":13,"column":5,"index":273},"filename":"invalid-setState-in-useEffect-transitive.ts","identifierName":"g"}},"fnLoc":null}
{"kind":"CompileSuccess","fnLoc":{"start":{"line":4,"column":0,"index":99},"end":{"line":16,"column":1,"index":300},"filename":"invalid-setState-in-useEffect-transitive.ts"},"fnName":"Component","memoSlots":2,"memoBlocks":2,"memoValues":2,"prunedMemoBlocks":0,"prunedMemoValues":0}
```
diff --git a/compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/invalid-setState-in-useEffect.expect.md b/compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/invalid-setState-in-useEffect.expect.md
index 202071455b..872b934d2c 100644
--- a/compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/invalid-setState-in-useEffect.expect.md
+++ b/compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/invalid-setState-in-useEffect.expect.md
@@ -45,7 +45,7 @@ function _temp(s) {
## Logs
```
-{"kind":"CompileError","detail":{"options":{"reason":"Calling setState directly within a useEffect causes cascading renders and is not recommended. Consider alternatives to useEffect. (https://react.dev/learn/you-might-not-need-an-effect)","description":null,"severity":"InvalidReact","suggestions":null,"loc":{"start":{"line":7,"column":4,"index":187},"end":{"line":7,"column":12,"index":195},"filename":"invalid-setState-in-useEffect.ts","identifierName":"setState"}}},"fnLoc":null}
+{"kind":"CompileError","detail":{"reason":"Calling setState directly within a useEffect causes cascading renders and is not recommended. Consider alternatives to useEffect. (https://react.dev/learn/you-might-not-need-an-effect)","description":null,"severity":"InvalidReact","suggestions":null,"loc":{"start":{"line":7,"column":4,"index":187},"end":{"line":7,"column":12,"index":195},"filename":"invalid-setState-in-useEffect.ts","identifierName":"setState"}},"fnLoc":null}
{"kind":"CompileSuccess","fnLoc":{"start":{"line":4,"column":0,"index":99},"end":{"line":10,"column":1,"index":232},"filename":"invalid-setState-in-useEffect.ts"},"fnName":"Component","memoSlots":1,"memoBlocks":1,"memoValues":1,"prunedMemoBlocks":0,"prunedMemoValues":0}
```
diff --git a/compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/new-mutability/error.invalid-impure-functions-in-render.expect.md b/compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/new-mutability/error.invalid-impure-functions-in-render.expect.md
index 73dd12670f..9bc8c401e7 100644
--- a/compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/new-mutability/error.invalid-impure-functions-in-render.expect.md
+++ b/compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/new-mutability/error.invalid-impure-functions-in-render.expect.md
@@ -17,17 +17,49 @@ function Component() {
## Error
```
+Found 3 errors:
+InvalidReact: Calling an impure function can produce unstable results. (https://react.dev/reference/rules/components-and-hooks-must-be-pure#components-and-hooks-must-be-idempotent)
+
+`Date.now` is an impure function whose results may change on every call.
+
+error.invalid-impure-functions-in-render.ts:4:15
2 |
3 | function Component() {
> 4 | const date = Date.now();
- | ^^^^^^^^^^ InvalidReact: Calling an impure function can produce unstable results. (https://react.dev/reference/rules/components-and-hooks-must-be-pure#components-and-hooks-must-be-idempotent). `Date.now` is an impure function whose results may change on every call (4:4)
-
-InvalidReact: Calling an impure function can produce unstable results. (https://react.dev/reference/rules/components-and-hooks-must-be-pure#components-and-hooks-must-be-idempotent). `performance.now` is an impure function whose results may change on every call (5:5)
-
-InvalidReact: Calling an impure function can produce unstable results. (https://react.dev/reference/rules/components-and-hooks-must-be-pure#components-and-hooks-must-be-idempotent). `Math.random` is an impure function whose results may change on every call (6:6)
+ | ^^^^^^^^^^ Calling an impure function can produce unstable results. (https://react.dev/reference/rules/components-and-hooks-must-be-pure#components-and-hooks-must-be-idempotent)
5 | const now = performance.now();
6 | const rand = Math.random();
7 | return error
;
7 | }
8 |
+
+
```
\ No newline at end of file
diff --git a/compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/new-mutability/error.mutate-hook-argument.expect.md b/compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/new-mutability/error.mutate-hook-argument.expect.md
index a26381d1d3..0560fbca62 100644
--- a/compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/new-mutability/error.mutate-hook-argument.expect.md
+++ b/compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/new-mutability/error.mutate-hook-argument.expect.md
@@ -14,15 +14,30 @@ function useHook(a, b) {
## Error
```
+Found 2 errors:
+InvalidReact: Mutating component props or hook arguments is not allowed. Consider using a local variable instead
+
+error.mutate-hook-argument.ts:3:2
1 | // @enableNewMutationAliasingModel
2 | function useHook(a, b) {
> 3 | b.test = 1;
- | ^ InvalidReact: Mutating component props or hook arguments is not allowed. Consider using a local variable instead (3:3)
-
-InvalidReact: Mutating component props or hook arguments is not allowed. Consider using a local variable instead (4:4)
+ | ^ Mutating component props or hook arguments is not allowed. Consider using a local variable instead
4 | a.test = 2;
5 | }
6 |
+
+
+InvalidReact: Mutating component props or hook arguments is not allowed. Consider using a local variable instead
+
+error.mutate-hook-argument.ts:4:2
+ 2 | function useHook(a, b) {
+ 3 | b.test = 1;
+> 4 | a.test = 2;
+ | ^ Mutating component props or hook arguments is not allowed. Consider using a local variable instead
+ 5 | }
+ 6 |
+
+
```
\ No newline at end of file
diff --git a/compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/new-mutability/error.not-useEffect-external-mutate.expect.md b/compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/new-mutability/error.not-useEffect-external-mutate.expect.md
index 6f7d6b2483..b2c32bfda6 100644
--- a/compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/new-mutability/error.not-useEffect-external-mutate.expect.md
+++ b/compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/new-mutability/error.not-useEffect-external-mutate.expect.md
@@ -18,15 +18,31 @@ function Component(props) {
## Error
```
+Found 2 errors:
+InvalidReact: Writing to a variable defined outside a component or hook is not allowed. Consider using an effect
+
+error.not-useEffect-external-mutate.ts:6:4
4 | function Component(props) {
5 | foo(() => {
> 6 | x.a = 10;
- | ^ InvalidReact: Writing to a variable defined outside a component or hook is not allowed. Consider using an effect (6:6)
-
-InvalidReact: Writing to a variable defined outside a component or hook is not allowed. Consider using an effect (7:7)
+ | ^ Writing to a variable defined outside a component or hook is not allowed. Consider using an effect
7 | x.a = 20;
8 | });
9 | }
+
+
+InvalidReact: Writing to a variable defined outside a component or hook is not allowed. Consider using an effect
+
+error.not-useEffect-external-mutate.ts:7:4
+ 5 | foo(() => {
+ 6 | x.a = 10;
+> 7 | x.a = 20;
+ | ^ Writing to a variable defined outside a component or hook is not allowed. Consider using an effect
+ 8 | });
+ 9 | }
+ 10 |
+
+
```
\ No newline at end of file
diff --git a/compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/new-mutability/error.reassignment-to-global-indirect.expect.md b/compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/new-mutability/error.reassignment-to-global-indirect.expect.md
index b6f01488fc..540bc31b10 100644
--- a/compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/new-mutability/error.reassignment-to-global-indirect.expect.md
+++ b/compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/new-mutability/error.reassignment-to-global-indirect.expect.md
@@ -18,15 +18,31 @@ function Component() {
## Error
```
+Found 2 errors:
+InvalidReact: Unexpected reassignment of a variable which was defined outside of the component. Components and hooks should be pure and side-effect free, but variable reassignment is a form of side-effect. If this variable is used in rendering, use useState instead. (https://react.dev/reference/rules/components-and-hooks-must-be-pure#side-effects-must-run-outside-of-render)
+
+error.reassignment-to-global-indirect.ts:5:4
3 | const foo = () => {
4 | // Cannot assign to globals
> 5 | someUnknownGlobal = true;
- | ^^^^^^^^^^^^^^^^^ InvalidReact: Unexpected reassignment of a variable which was defined outside of the component. Components and hooks should be pure and side-effect free, but variable reassignment is a form of side-effect. If this variable is used in rendering, use useState instead. (https://react.dev/reference/rules/components-and-hooks-must-be-pure#side-effects-must-run-outside-of-render) (5:5)
-
-InvalidReact: Unexpected reassignment of a variable which was defined outside of the component. Components and hooks should be pure and side-effect free, but variable reassignment is a form of side-effect. If this variable is used in rendering, use useState instead. (https://react.dev/reference/rules/components-and-hooks-must-be-pure#side-effects-must-run-outside-of-render) (6:6)
+ | ^^^^^^^^^^^^^^^^^ Unexpected reassignment of a variable which was defined outside of the component. Components and hooks should be pure and side-effect free, but variable reassignment is a form of side-effect. If this variable is used in rendering, use useState instead. (https://react.dev/reference/rules/components-and-hooks-must-be-pure#side-effects-must-run-outside-of-render)
6 | moduleLocal = true;
7 | };
8 | foo();
+
+
+InvalidReact: Unexpected reassignment of a variable which was defined outside of the component. Components and hooks should be pure and side-effect free, but variable reassignment is a form of side-effect. If this variable is used in rendering, use useState instead. (https://react.dev/reference/rules/components-and-hooks-must-be-pure#side-effects-must-run-outside-of-render)
+
+error.reassignment-to-global-indirect.ts:6:4
+ 4 | // Cannot assign to globals
+ 5 | someUnknownGlobal = true;
+> 6 | moduleLocal = true;
+ | ^^^^^^^^^^^ Unexpected reassignment of a variable which was defined outside of the component. Components and hooks should be pure and side-effect free, but variable reassignment is a form of side-effect. If this variable is used in rendering, use useState instead. (https://react.dev/reference/rules/components-and-hooks-must-be-pure#side-effects-must-run-outside-of-render)
+ 7 | };
+ 8 | foo();
+ 9 | }
+
+
```
\ No newline at end of file
diff --git a/compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/new-mutability/error.reassignment-to-global.expect.md b/compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/new-mutability/error.reassignment-to-global.expect.md
index a75aa397ec..294814e8ff 100644
--- a/compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/new-mutability/error.reassignment-to-global.expect.md
+++ b/compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/new-mutability/error.reassignment-to-global.expect.md
@@ -15,15 +15,30 @@ function Component() {
## Error
```
+Found 2 errors:
+InvalidReact: Unexpected reassignment of a variable which was defined outside of the component. Components and hooks should be pure and side-effect free, but variable reassignment is a form of side-effect. If this variable is used in rendering, use useState instead. (https://react.dev/reference/rules/components-and-hooks-must-be-pure#side-effects-must-run-outside-of-render)
+
+error.reassignment-to-global.ts:4:2
2 | function Component() {
3 | // Cannot assign to globals
> 4 | someUnknownGlobal = true;
- | ^^^^^^^^^^^^^^^^^ InvalidReact: Unexpected reassignment of a variable which was defined outside of the component. Components and hooks should be pure and side-effect free, but variable reassignment is a form of side-effect. If this variable is used in rendering, use useState instead. (https://react.dev/reference/rules/components-and-hooks-must-be-pure#side-effects-must-run-outside-of-render) (4:4)
-
-InvalidReact: Unexpected reassignment of a variable which was defined outside of the component. Components and hooks should be pure and side-effect free, but variable reassignment is a form of side-effect. If this variable is used in rendering, use useState instead. (https://react.dev/reference/rules/components-and-hooks-must-be-pure#side-effects-must-run-outside-of-render) (5:5)
+ | ^^^^^^^^^^^^^^^^^ Unexpected reassignment of a variable which was defined outside of the component. Components and hooks should be pure and side-effect free, but variable reassignment is a form of side-effect. If this variable is used in rendering, use useState instead. (https://react.dev/reference/rules/components-and-hooks-must-be-pure#side-effects-must-run-outside-of-render)
5 | moduleLocal = true;
6 | }
7 |
+
+
+InvalidReact: Unexpected reassignment of a variable which was defined outside of the component. Components and hooks should be pure and side-effect free, but variable reassignment is a form of side-effect. If this variable is used in rendering, use useState instead. (https://react.dev/reference/rules/components-and-hooks-must-be-pure#side-effects-must-run-outside-of-render)
+
+error.reassignment-to-global.ts:5:2
+ 3 | // Cannot assign to globals
+ 4 | someUnknownGlobal = true;
+> 5 | moduleLocal = true;
+ | ^^^^^^^^^^^ Unexpected reassignment of a variable which was defined outside of the component. Components and hooks should be pure and side-effect free, but variable reassignment is a form of side-effect. If this variable is used in rendering, use useState instead. (https://react.dev/reference/rules/components-and-hooks-must-be-pure#side-effects-must-run-outside-of-render)
+ 6 | }
+ 7 |
+
+
```
\ No newline at end of file
diff --git a/compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/new-mutability/error.todo-repro-named-function-with-shadowed-local-same-name.expect.md b/compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/new-mutability/error.todo-repro-named-function-with-shadowed-local-same-name.expect.md
index 3d9d0b5613..6e21d93eca 100644
--- a/compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/new-mutability/error.todo-repro-named-function-with-shadowed-local-same-name.expect.md
+++ b/compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/new-mutability/error.todo-repro-named-function-with-shadowed-local-same-name.expect.md
@@ -20,12 +20,20 @@ function Component(props) {
## Error
```
+Found 1 errors:
+Invariant: [InferMutationAliasingEffects] Expected value kind to be initialized
+
+ hasErrors_0$15:TFunction.
+
+error.todo-repro-named-function-with-shadowed-local-same-name.ts:10:9
8 | return hasErrors;
9 | }
> 10 | return hasErrors();
- | ^^^^^^^^^ Invariant: [InferMutationAliasingEffects] Expected value kind to be initialized. hasErrors_0$15:TFunction (10:10)
+ | ^^^^^^^^^ [InferMutationAliasingEffects] Expected value kind to be initialized
11 | }
12 |
+
+
```
\ No newline at end of file
diff --git a/compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/preserve-memo-validation/error.false-positive-useMemo-dropped-infer-always-invalidating.expect.md b/compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/preserve-memo-validation/error.false-positive-useMemo-dropped-infer-always-invalidating.expect.md
index 855058d25b..f9bd864224 100644
--- a/compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/preserve-memo-validation/error.false-positive-useMemo-dropped-infer-always-invalidating.expect.md
+++ b/compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/preserve-memo-validation/error.false-positive-useMemo-dropped-infer-always-invalidating.expect.md
@@ -30,13 +30,19 @@ export const FIXTURE_ENTRYPOINT = {
## Error
```
+Found 1 errors:
+CannotPreserveMemoization: React Compiler has skipped optimizing this component because the existing manual memoization could not be preserved. This value was memoized in source but not in compilation output.
+
+error.false-positive-useMemo-dropped-infer-always-invalidating.ts:15:9
13 | x.push(props);
14 |
> 15 | return useMemo(() => [x], [x]);
- | ^^^^^^^^^^^^^^^^^^^^^^^ CannotPreserveMemoization: React Compiler has skipped optimizing this component because the existing manual memoization could not be preserved. This value was memoized in source but not in compilation output. (15:15)
+ | ^^^^^^^^^^^^^^^^^^^^^^^ React Compiler has skipped optimizing this component because the existing manual memoization could not be preserved. This value was memoized in source but not in compilation output.
16 | }
17 |
18 | 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.false-positive-useMemo-infer-mutate-deps.expect.md b/compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/preserve-memo-validation/error.false-positive-useMemo-infer-mutate-deps.expect.md
index 564796f18d..f350bc4f67 100644
--- a/compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/preserve-memo-validation/error.false-positive-useMemo-infer-mutate-deps.expect.md
+++ b/compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/preserve-memo-validation/error.false-positive-useMemo-infer-mutate-deps.expect.md
@@ -29,13 +29,19 @@ export const FIXTURE_ENTRYPOINT = {
## Error
```
+Found 1 errors:
+CannotPreserveMemoization: React Compiler has skipped optimizing this component because the existing manual memoization could not be preserved. This dependency may be mutated later, which could cause the value to change unexpectedly
+
+error.false-positive-useMemo-infer-mutate-deps.ts:14:6
12 | return useMemo(() => {
13 | return identity(val);
> 14 | }, [val]);
- | ^^^ CannotPreserveMemoization: React Compiler has skipped optimizing this component because the existing manual memoization could not be preserved. This dependency may be mutated later, which could cause the value to change unexpectedly (14:14)
+ | ^^^ React Compiler has skipped optimizing this component because the existing manual memoization could not be preserved. This dependency may be mutated later, which could cause the value to change unexpectedly
15 | }
16 |
17 | 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.false-positive-useMemo-overlap-scopes.expect.md b/compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/preserve-memo-validation/error.false-positive-useMemo-overlap-scopes.expect.md
index f6b04f6259..895b364805 100644
--- a/compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/preserve-memo-validation/error.false-positive-useMemo-overlap-scopes.expect.md
+++ b/compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/preserve-memo-validation/error.false-positive-useMemo-overlap-scopes.expect.md
@@ -40,13 +40,19 @@ export const FIXTURE_ENTRYPOINT = {
## Error
```
+Found 1 errors:
+CannotPreserveMemoization: React Compiler has skipped optimizing this component because the existing manual memoization could not be preserved. This dependency may be mutated later, which could cause the value to change unexpectedly
+
+error.false-positive-useMemo-overlap-scopes.ts:23:9
21 | const result = useMemo(() => {
22 | return [Math.max(x[1], a)];
> 23 | }, [a, x]);
- | ^ CannotPreserveMemoization: React Compiler has skipped optimizing this component because the existing manual memoization could not be preserved. This dependency may be mutated later, which could cause the value to change unexpectedly (23:23)
+ | ^ React Compiler has skipped optimizing this component because the existing manual memoization could not be preserved. This dependency may be mutated later, which could cause the value to change unexpectedly
24 | arrayPush(y, 3);
25 | return {result, y};
26 | }
+
+
```
\ No newline at end of file
diff --git a/compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/preserve-memo-validation/error.hoist-useCallback-conditional-access-own-scope.expect.md b/compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/preserve-memo-validation/error.hoist-useCallback-conditional-access-own-scope.expect.md
index 3e6ab298c9..030743900b 100644
--- a/compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/preserve-memo-validation/error.hoist-useCallback-conditional-access-own-scope.expect.md
+++ b/compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/preserve-memo-validation/error.hoist-useCallback-conditional-access-own-scope.expect.md
@@ -26,6 +26,12 @@ export const FIXTURE_ENTRYPOINT = {
## Error
```
+Found 1 errors:
+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
+
+The inferred dependency was `propB`, but the source dependencies were [propA, propB.x.y]. Inferred less specific property than source.
+
+error.hoist-useCallback-conditional-access-own-scope.ts:5:21
3 |
4 | function Component({propA, propB}) {
> 5 | return useCallback(() => {
@@ -41,10 +47,12 @@ export const FIXTURE_ENTRYPOINT = {
> 10 | }
| ^^^^^^^^^^^^^^^^
> 11 | }, [propA, propB.x.y]);
- | ^^^^ 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. The inferred dependency was `propB`, but the source dependencies were [propA, propB.x.y]. Inferred less specific property than source (5:11)
+ | ^^^^ 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
12 | }
13 |
14 | 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.hoist-useCallback-infer-conditional-value-block.expect.md b/compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/preserve-memo-validation/error.hoist-useCallback-infer-conditional-value-block.expect.md
index d41831086b..88e75367e6 100644
--- a/compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/preserve-memo-validation/error.hoist-useCallback-infer-conditional-value-block.expect.md
+++ b/compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/preserve-memo-validation/error.hoist-useCallback-infer-conditional-value-block.expect.md
@@ -29,6 +29,12 @@ export const FIXTURE_ENTRYPOINT = {
## Error
```
+Found 2 errors:
+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
+
+The inferred dependency was `propA`, but the source dependencies were [propA.a, propB.x.y]. Inferred less specific property than source.
+
+error.hoist-useCallback-infer-conditional-value-block.ts:6:21
4 |
5 | function useHook(propA, propB) {
> 6 | return useCallback(() => {
@@ -48,12 +54,42 @@ export const FIXTURE_ENTRYPOINT = {
> 13 | }
| ^^^^^^^^^^^^^^^^^
> 14 | }, [propA.a, propB.x.y]);
- | ^^^^ 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. The inferred dependency was `propA`, but the source dependencies were [propA.a, propB.x.y]. Inferred less specific property than source (6:14)
-
-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. The inferred dependency was `propB`, but the source dependencies were [propA.a, propB.x.y]. Inferred less specific property than source (6:14)
+ | ^^^^ 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
15 | }
16 |
17 | export const FIXTURE_ENTRYPOINT = {
+
+
+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
+
+The inferred dependency was `propB`, but the source dependencies were [propA.a, propB.x.y]. Inferred less specific property than source.
+
+error.hoist-useCallback-infer-conditional-value-block.ts:6:21
+ 4 |
+ 5 | function useHook(propA, propB) {
+> 6 | return useCallback(() => {
+ | ^^^^^^^
+> 7 | const x = {};
+ | ^^^^^^^^^^^^^^^^^
+> 8 | if (identity(null) ?? propA.a) {
+ | ^^^^^^^^^^^^^^^^^
+> 9 | mutate(x);
+ | ^^^^^^^^^^^^^^^^^
+> 10 | return {
+ | ^^^^^^^^^^^^^^^^^
+> 11 | value: propB.x.y,
+ | ^^^^^^^^^^^^^^^^^
+> 12 | };
+ | ^^^^^^^^^^^^^^^^^
+> 13 | }
+ | ^^^^^^^^^^^^^^^^^
+> 14 | }, [propA.a, propB.x.y]);
+ | ^^^^ 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
+ 15 | }
+ 16 |
+ 17 | 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.invalid-useCallback-captures-reassigned-context.expect.md b/compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/preserve-memo-validation/error.invalid-useCallback-captures-reassigned-context.expect.md
index cfa2999835..71a540f26d 100644
--- a/compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/preserve-memo-validation/error.invalid-useCallback-captures-reassigned-context.expect.md
+++ b/compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/preserve-memo-validation/error.invalid-useCallback-captures-reassigned-context.expect.md
@@ -30,15 +30,31 @@ export const FIXTURE_ENTRYPOINT = {
## Error
```
+Found 2 errors:
+CannotPreserveMemoization: React Compiler has skipped optimizing this component because the existing manual memoization could not be preserved. This dependency may be mutated later, which could cause the value to change unexpectedly
+
+error.invalid-useCallback-captures-reassigned-context.ts:12:37
10 |
11 | // makeArray() is captured, but depsList contains [props]
> 12 | const cb = useCallback(() => [x], [x]);
- | ^ CannotPreserveMemoization: React Compiler has skipped optimizing this component because the existing manual memoization could not be preserved. This dependency may be mutated later, which could cause the value to change unexpectedly (12:12)
-
-CannotPreserveMemoization: React Compiler has skipped optimizing this component because the existing manual memoization could not be preserved. This value was memoized in source but not in compilation output. (12:12)
+ | ^ React Compiler has skipped optimizing this component because the existing manual memoization could not be preserved. This dependency may be mutated later, which could cause the value to change unexpectedly
13 |
14 | x = makeArray();
15 |
+
+
+CannotPreserveMemoization: React Compiler has skipped optimizing this component because the existing manual memoization could not be preserved. This value was memoized in source but not in compilation output.
+
+error.invalid-useCallback-captures-reassigned-context.ts:12:25
+ 10 |
+ 11 | // makeArray() is captured, but depsList contains [props]
+> 12 | const cb = useCallback(() => [x], [x]);
+ | ^^^^^^^^^ React Compiler has skipped optimizing this component because the existing manual memoization could not be preserved. This value was memoized in source but not in compilation output.
+ 13 |
+ 14 | x = makeArray();
+ 15 |
+
+
```
\ No newline at end of file
diff --git a/compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/preserve-memo-validation/error.maybe-invalid-useCallback-read-maybeRef.expect.md b/compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/preserve-memo-validation/error.maybe-invalid-useCallback-read-maybeRef.expect.md
index 2610f5470b..d6cd6e11ff 100644
--- a/compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/preserve-memo-validation/error.maybe-invalid-useCallback-read-maybeRef.expect.md
+++ b/compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/preserve-memo-validation/error.maybe-invalid-useCallback-read-maybeRef.expect.md
@@ -17,6 +17,12 @@ function useHook(maybeRef) {
## Error
```
+Found 1 errors:
+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
+
+The inferred dependency was `maybeRef.current`, but the source dependencies were [maybeRef]. Differences in ref.current access.
+
+error.maybe-invalid-useCallback-read-maybeRef.ts:5:21
3 |
4 | function useHook(maybeRef) {
> 5 | return useCallback(() => {
@@ -24,9 +30,11 @@ function useHook(maybeRef) {
> 6 | return [maybeRef.current];
| ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^
> 7 | }, [maybeRef]);
- | ^^^^ 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. The inferred dependency was `maybeRef.current`, but the source dependencies were [maybeRef]. Differences in ref.current access (5:7)
+ | ^^^^ 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
8 | }
9 |
+
+
```
\ No newline at end of file
diff --git a/compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/preserve-memo-validation/error.maybe-invalid-useMemo-read-maybeRef.expect.md b/compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/preserve-memo-validation/error.maybe-invalid-useMemo-read-maybeRef.expect.md
index 91e716fee1..432f9678f2 100644
--- a/compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/preserve-memo-validation/error.maybe-invalid-useMemo-read-maybeRef.expect.md
+++ b/compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/preserve-memo-validation/error.maybe-invalid-useMemo-read-maybeRef.expect.md
@@ -17,6 +17,12 @@ function useHook(maybeRef, shouldRead) {
## Error
```
+Found 1 errors:
+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
+
+The inferred dependency was `maybeRef.current`, but the source dependencies were [shouldRead, maybeRef]. Differences in ref.current access.
+
+error.maybe-invalid-useMemo-read-maybeRef.ts:5:17
3 |
4 | function useHook(maybeRef, shouldRead) {
> 5 | return useMemo(() => {
@@ -24,9 +30,11 @@ function useHook(maybeRef, shouldRead) {
> 6 | return () => [maybeRef.current];
| ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^
> 7 | }, [shouldRead, maybeRef]);
- | ^^^^ 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. The inferred dependency was `maybeRef.current`, but the source dependencies were [shouldRead, maybeRef]. Differences in ref.current access (5:7)
+ | ^^^^ 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
8 | }
9 |
+
+
```
\ No newline at end of file
diff --git a/compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/preserve-memo-validation/error.maybe-mutable-ref-not-preserved.expect.md b/compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/preserve-memo-validation/error.maybe-mutable-ref-not-preserved.expect.md
index 1ac3884f92..79336c26ff 100644
--- a/compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/preserve-memo-validation/error.maybe-mutable-ref-not-preserved.expect.md
+++ b/compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/preserve-memo-validation/error.maybe-mutable-ref-not-preserved.expect.md
@@ -23,13 +23,19 @@ export const FIXTURE_ENTRYPOINT = {
## Error
```
+Found 1 errors:
+InvalidReact: Ref values (the `current` property) may not be accessed during render. (https://react.dev/reference/react/useRef)
+
+error.maybe-mutable-ref-not-preserved.ts:8:33
6 | function useFoo() {
7 | const r = useRef();
> 8 | return useMemo(() => makeArray(r), []);
- | ^ InvalidReact: Ref values (the `current` property) may not be accessed during render. (https://react.dev/reference/react/useRef) (8:8)
+ | ^ Ref values (the `current` property) may not be accessed during render. (https://react.dev/reference/react/useRef)
9 | }
10 |
11 | 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.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
index cc5e20fd5c..c68c6771b1 100644
--- 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
@@ -28,6 +28,12 @@ export const FIXTURE_ENTRYPOINT = {
## Error
```
+Found 1 errors:
+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
+
+The inferred dependency was `ref`, but the source dependencies were []. Inferred dependency not present in source.
+
+error.preserve-use-memo-ref-missing-reactive.ts:9:21
7 | const ref = cond ? ref1 : ref2;
8 |
> 9 | return useCallback(() => {
@@ -39,10 +45,12 @@ export const FIXTURE_ENTRYPOINT = {
> 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. The inferred dependency was `ref`, but the source dependencies were []. Inferred dependency not present in source (9:13)
+ | ^^^^ 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
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.todo-useCallback-captures-invalidating-value.expect.md b/compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/preserve-memo-validation/error.todo-useCallback-captures-invalidating-value.expect.md
index 1f26e03b83..cdc562cde8 100644
--- a/compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/preserve-memo-validation/error.todo-useCallback-captures-invalidating-value.expect.md
+++ b/compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/preserve-memo-validation/error.todo-useCallback-captures-invalidating-value.expect.md
@@ -28,13 +28,19 @@ export const FIXTURE_ENTRYPOINT = {
## Error
```
+Found 1 errors:
+CannotPreserveMemoization: React Compiler has skipped optimizing this component because the existing manual memoization could not be preserved. This value was memoized in source but not in compilation output.
+
+error.todo-useCallback-captures-invalidating-value.ts:13:21
11 | x.push(props);
12 |
> 13 | return useCallback(() => [x], [x]);
- | ^^^^^^^^^ CannotPreserveMemoization: React Compiler has skipped optimizing this component because the existing manual memoization could not be preserved. This value was memoized in source but not in compilation output. (13:13)
+ | ^^^^^^^^^ React Compiler has skipped optimizing this component because the existing manual memoization could not be preserved. This value was memoized in source but not in compilation output.
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.useCallback-aliased-var.expect.md b/compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/preserve-memo-validation/error.useCallback-aliased-var.expect.md
index 4c0050a215..36cce63efb 100644
--- a/compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/preserve-memo-validation/error.useCallback-aliased-var.expect.md
+++ b/compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/preserve-memo-validation/error.useCallback-aliased-var.expect.md
@@ -19,12 +19,20 @@ function useHook(x) {
## Error
```
+Found 1 errors:
+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
+
+The inferred dependency was `aliasedX`, but the source dependencies were [x, aliasedProp]. Inferred different dependency than source.
+
+error.useCallback-aliased-var.ts:9:21
7 | const aliasedProp = x.y.z;
8 |
> 9 | return useCallback(() => [aliasedX, x.y.z], [x, aliasedProp]);
- | ^^^^^^^^^^^^^^^^^^^^^^^ 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. The inferred dependency was `aliasedX`, but the source dependencies were [x, aliasedProp]. Inferred different dependency than source (9:9)
+ | ^^^^^^^^^^^^^^^^^^^^^^^ 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
10 | }
11 |
+
+
```
\ No newline at end of file
diff --git a/compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/preserve-memo-validation/error.useCallback-conditional-access-noAlloc.expect.md b/compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/preserve-memo-validation/error.useCallback-conditional-access-noAlloc.expect.md
index f92820f16c..e60209fdc9 100644
--- a/compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/preserve-memo-validation/error.useCallback-conditional-access-noAlloc.expect.md
+++ b/compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/preserve-memo-validation/error.useCallback-conditional-access-noAlloc.expect.md
@@ -25,6 +25,12 @@ export const FIXTURE_ENTRYPOINT = {
## Error
```
+Found 1 errors:
+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
+
+The inferred dependency was `propB?.x.y`, but the source dependencies were [propA, propB.x.y]. Inferred different dependency than source.
+
+error.useCallback-conditional-access-noAlloc.ts:5:21
3 |
4 | function Component({propA, propB}) {
> 5 | return useCallback(() => {
@@ -38,10 +44,12 @@ export const FIXTURE_ENTRYPOINT = {
> 9 | };
| ^^^^^^^^^^^^
> 10 | }, [propA, propB.x.y]);
- | ^^^^ 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. The inferred dependency was `propB?.x.y`, but the source dependencies were [propA, propB.x.y]. Inferred different dependency than source (5:10)
+ | ^^^^ 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
11 | }
12 |
13 | 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.useCallback-infer-less-specific-conditional-access.expect.md b/compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/preserve-memo-validation/error.useCallback-infer-less-specific-conditional-access.expect.md
index a13954a716..ea1a12ccc1 100644
--- a/compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/preserve-memo-validation/error.useCallback-infer-less-specific-conditional-access.expect.md
+++ b/compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/preserve-memo-validation/error.useCallback-infer-less-specific-conditional-access.expect.md
@@ -24,6 +24,12 @@ function Component({propA, propB}) {
## Error
```
+Found 1 errors:
+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
+
+The inferred dependency was `propB`, but the source dependencies were [propA?.a, propB.x.y]. Inferred less specific property than source.
+
+error.useCallback-infer-less-specific-conditional-access.ts:6:21
4 |
5 | function Component({propA, propB}) {
> 6 | return useCallback(() => {
@@ -43,9 +49,11 @@ function Component({propA, propB}) {
> 13 | }
| ^^^^^^^^^^^^^^^^^
> 14 | }, [propA?.a, propB.x.y]);
- | ^^^^ 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. The inferred dependency was `propB`, but the source dependencies were [propA?.a, propB.x.y]. Inferred less specific property than source (6:14)
+ | ^^^^ 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
15 | }
16 |
+
+
```
\ No newline at end of file
diff --git a/compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/preserve-memo-validation/error.useCallback-property-call-dep.expect.md b/compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/preserve-memo-validation/error.useCallback-property-call-dep.expect.md
index 159472c970..60ca4fe6c9 100644
--- a/compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/preserve-memo-validation/error.useCallback-property-call-dep.expect.md
+++ b/compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/preserve-memo-validation/error.useCallback-property-call-dep.expect.md
@@ -17,6 +17,12 @@ function Component({propA}) {
## Error
```
+Found 1 errors:
+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
+
+The inferred dependency was `propA`, but the source dependencies were [propA.x]. Inferred less specific property than source.
+
+error.useCallback-property-call-dep.ts:5:21
3 |
4 | function Component({propA}) {
> 5 | return useCallback(() => {
@@ -24,9 +30,11 @@ function Component({propA}) {
> 6 | return propA.x();
| ^^^^^^^^^^^^^^^^^^^^^
> 7 | }, [propA.x]);
- | ^^^^ 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. The inferred dependency was `propA`, but the source dependencies were [propA.x]. Inferred less specific property than source (5:7)
+ | ^^^^ 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
8 | }
9 |
+
+
```
\ No newline at end of file
diff --git a/compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/preserve-memo-validation/error.useMemo-aliased-var.expect.md b/compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/preserve-memo-validation/error.useMemo-aliased-var.expect.md
index 87028870a5..2197fcaa09 100644
--- a/compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/preserve-memo-validation/error.useMemo-aliased-var.expect.md
+++ b/compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/preserve-memo-validation/error.useMemo-aliased-var.expect.md
@@ -19,12 +19,20 @@ function useHook(x) {
## Error
```
+Found 1 errors:
+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
+
+The inferred dependency was `x`, but the source dependencies were [aliasedX, aliasedProp]. Inferred different dependency than source.
+
+error.useMemo-aliased-var.ts:9:17
7 | const aliasedProp = x.y.z;
8 |
> 9 | return useMemo(() => [x, x.y.z], [aliasedX, aliasedProp]);
- | ^^^^^^^^^^^^^^^^ 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. The inferred dependency was `x`, but the source dependencies were [aliasedX, aliasedProp]. Inferred different dependency than source (9:9)
+ | ^^^^^^^^^^^^^^^^ 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
10 | }
11 |
+
+
```
\ No newline at end of file
diff --git a/compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/preserve-memo-validation/error.useMemo-infer-less-specific-conditional-access.expect.md b/compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/preserve-memo-validation/error.useMemo-infer-less-specific-conditional-access.expect.md
index 62f60a03bb..401930af40 100644
--- a/compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/preserve-memo-validation/error.useMemo-infer-less-specific-conditional-access.expect.md
+++ b/compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/preserve-memo-validation/error.useMemo-infer-less-specific-conditional-access.expect.md
@@ -24,6 +24,12 @@ function Component({propA, propB}) {
## Error
```
+Found 1 errors:
+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
+
+The inferred dependency was `propB`, but the source dependencies were [propA?.a, propB.x.y]. Inferred less specific property than source.
+
+error.useMemo-infer-less-specific-conditional-access.ts:6:17
4 |
5 | function Component({propA, propB}) {
> 6 | return useMemo(() => {
@@ -43,9 +49,11 @@ function Component({propA, propB}) {
> 13 | }
| ^^^^^^^^^^^^^^^^^
> 14 | }, [propA?.a, propB.x.y]);
- | ^^^^ 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. The inferred dependency was `propB`, but the source dependencies were [propA?.a, propB.x.y]. Inferred less specific property than source (6:14)
+ | ^^^^ 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
15 | }
16 |
+
+
```
\ No newline at end of file
diff --git a/compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/preserve-memo-validation/error.useMemo-infer-less-specific-conditional-value-block.expect.md b/compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/preserve-memo-validation/error.useMemo-infer-less-specific-conditional-value-block.expect.md
index a14a355eb2..67753e1810 100644
--- a/compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/preserve-memo-validation/error.useMemo-infer-less-specific-conditional-value-block.expect.md
+++ b/compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/preserve-memo-validation/error.useMemo-infer-less-specific-conditional-value-block.expect.md
@@ -24,6 +24,12 @@ function Component({propA, propB}) {
## Error
```
+Found 2 errors:
+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
+
+The inferred dependency was `propA`, but the source dependencies were [propA.a, propB.x.y]. Inferred less specific property than source.
+
+error.useMemo-infer-less-specific-conditional-value-block.ts:6:17
4 |
5 | function Component({propA, propB}) {
> 6 | return useMemo(() => {
@@ -43,11 +49,40 @@ function Component({propA, propB}) {
> 13 | }
| ^^^^^^^^^^^^^^^^^
> 14 | }, [propA.a, propB.x.y]);
- | ^^^^ 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. The inferred dependency was `propA`, but the source dependencies were [propA.a, propB.x.y]. Inferred less specific property than source (6:14)
-
-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. The inferred dependency was `propB`, but the source dependencies were [propA.a, propB.x.y]. Inferred less specific property than source (6:14)
+ | ^^^^ 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
15 | }
16 |
+
+
+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
+
+The inferred dependency was `propB`, but the source dependencies were [propA.a, propB.x.y]. Inferred less specific property than source.
+
+error.useMemo-infer-less-specific-conditional-value-block.ts:6:17
+ 4 |
+ 5 | function Component({propA, propB}) {
+> 6 | return useMemo(() => {
+ | ^^^^^^^
+> 7 | const x = {};
+ | ^^^^^^^^^^^^^^^^^
+> 8 | if (identity(null) ?? propA.a) {
+ | ^^^^^^^^^^^^^^^^^
+> 9 | mutate(x);
+ | ^^^^^^^^^^^^^^^^^
+> 10 | return {
+ | ^^^^^^^^^^^^^^^^^
+> 11 | value: propB.x.y,
+ | ^^^^^^^^^^^^^^^^^
+> 12 | };
+ | ^^^^^^^^^^^^^^^^^
+> 13 | }
+ | ^^^^^^^^^^^^^^^^^
+> 14 | }, [propA.a, propB.x.y]);
+ | ^^^^ 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
+ 15 | }
+ 16 |
+
+
```
\ No newline at end of file
diff --git a/compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/preserve-memo-validation/error.useMemo-property-call-chained-object.expect.md b/compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/preserve-memo-validation/error.useMemo-property-call-chained-object.expect.md
index 2c7e001d57..e202396dad 100644
--- a/compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/preserve-memo-validation/error.useMemo-property-call-chained-object.expect.md
+++ b/compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/preserve-memo-validation/error.useMemo-property-call-chained-object.expect.md
@@ -19,6 +19,12 @@ function Component({propA}) {
## Error
```
+Found 1 errors:
+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
+
+The inferred dependency was `propA`, but the source dependencies were [propA.x]. Inferred less specific property than source.
+
+error.useMemo-property-call-chained-object.ts:5:17
3 |
4 | function Component({propA}) {
> 5 | return useMemo(() => {
@@ -30,9 +36,11 @@ function Component({propA}) {
> 8 | };
| ^^^^^^^^^^^^
> 9 | }, [propA.x]);
- | ^^^^ 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. The inferred dependency was `propA`, but the source dependencies were [propA.x]. Inferred less specific property than source (5:9)
+ | ^^^^ 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
10 | }
11 |
+
+
```
\ No newline at end of file
diff --git a/compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/preserve-memo-validation/error.useMemo-property-call-dep.expect.md b/compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/preserve-memo-validation/error.useMemo-property-call-dep.expect.md
index 197a77e26f..bc2a6c39a4 100644
--- a/compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/preserve-memo-validation/error.useMemo-property-call-dep.expect.md
+++ b/compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/preserve-memo-validation/error.useMemo-property-call-dep.expect.md
@@ -17,6 +17,12 @@ function Component({propA}) {
## Error
```
+Found 1 errors:
+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
+
+The inferred dependency was `propA`, but the source dependencies were [propA.x]. Inferred less specific property than source.
+
+error.useMemo-property-call-dep.ts:5:17
3 |
4 | function Component({propA}) {
> 5 | return useMemo(() => {
@@ -24,9 +30,11 @@ function Component({propA}) {
> 6 | return propA.x();
| ^^^^^^^^^^^^^^^^^^^^^
> 7 | }, [propA.x]);
- | ^^^^ 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. The inferred dependency was `propA`, but the source dependencies were [propA.x]. Inferred less specific property than source (5:7)
+ | ^^^^ 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
8 | }
9 |
+
+
```
\ No newline at end of file
diff --git a/compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/preserve-memo-validation/error.useMemo-unrelated-mutation-in-depslist.expect.md b/compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/preserve-memo-validation/error.useMemo-unrelated-mutation-in-depslist.expect.md
index 7b09c62961..69ee66ba8d 100644
--- a/compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/preserve-memo-validation/error.useMemo-unrelated-mutation-in-depslist.expect.md
+++ b/compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/preserve-memo-validation/error.useMemo-unrelated-mutation-in-depslist.expect.md
@@ -30,6 +30,12 @@ function useFoo(input1) {
## Error
```
+Found 1 errors:
+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
+
+The inferred dependency was `input1`, but the source dependencies were [y]. Inferred different dependency than source.
+
+error.useMemo-unrelated-mutation-in-depslist.ts:16:27
14 | const x = {};
15 | const y = [input1];
> 16 | const memoized = useMemo(() => {
@@ -37,10 +43,12 @@ function useFoo(input1) {
> 17 | return [y];
| ^^^^^^^^^^^^^^^
> 18 | }, [(mutate(x), y)]);
- | ^^^^ 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. The inferred dependency was `input1`, but the source dependencies were [y]. Inferred different dependency than source (16:18)
+ | ^^^^ 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
19 |
20 | return [x, memoized];
21 | }
+
+
```
\ No newline at end of file
diff --git a/compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/preserve-memo-validation/error.useMemo-with-refs.flow.expect.md b/compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/preserve-memo-validation/error.useMemo-with-refs.flow.expect.md
index de37e0d3d4..be050a261e 100644
--- a/compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/preserve-memo-validation/error.useMemo-with-refs.flow.expect.md
+++ b/compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/preserve-memo-validation/error.useMemo-with-refs.flow.expect.md
@@ -19,13 +19,19 @@ component Component(disableLocalRef, ref) {
## Error
```
+Found 1 errors:
+InvalidReact: Ref values (the `current` property) may not be accessed during render. (https://react.dev/reference/react/useRef)
+
+undefined:7:44
5 | const localRef = useFooRef();
6 | const mergedRef = useMemo(() => {
> 7 | return disableLocalRef ? ref : identity(ref, localRef);
- | ^^^ InvalidReact: Ref values (the `current` property) may not be accessed during render. (https://react.dev/reference/react/useRef) (7:7)
+ | ^^^ Ref values (the `current` property) may not be accessed during render. (https://react.dev/reference/react/useRef)
8 | }, [disableLocalRef, ref, localRef]);
9 | return
;
10 | }
+
+
```
\ No newline at end of file
diff --git a/compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/preserve-memo-validation/error.validate-useMemo-named-function.expect.md b/compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/preserve-memo-validation/error.validate-useMemo-named-function.expect.md
index 4b1703cd7d..0517acdbd8 100644
--- a/compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/preserve-memo-validation/error.validate-useMemo-named-function.expect.md
+++ b/compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/preserve-memo-validation/error.validate-useMemo-named-function.expect.md
@@ -20,13 +20,19 @@ function Component(props) {
## Error
```
+Found 1 errors:
+InvalidReact: Expected the first argument to be an inline function expression
+
+error.validate-useMemo-named-function.ts:9:20
7 | // for now.
8 | function Component(props) {
> 9 | const x = useMemo(someHelper, []);
- | ^^^^^^^^^^ InvalidReact: Expected the first argument to be an inline function expression (9:9)
+ | ^^^^^^^^^^ Expected the first argument to be an inline function expression
10 | return x;
11 | }
12 |
+
+
```
\ No newline at end of file
diff --git a/compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/propagate-scope-deps-hir-fork/error.todo-optional-call-chain-in-optional.expect.md b/compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/propagate-scope-deps-hir-fork/error.todo-optional-call-chain-in-optional.expect.md
index e0196bdc19..1f872f2728 100644
--- a/compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/propagate-scope-deps-hir-fork/error.todo-optional-call-chain-in-optional.expect.md
+++ b/compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/propagate-scope-deps-hir-fork/error.todo-optional-call-chain-in-optional.expect.md
@@ -23,13 +23,19 @@ export const FIXTURE_ENTRYPONT = {
## Error
```
+Found 1 errors:
+Todo: Unexpected terminal kind `optional` for optional fallthrough block
+
+error.todo-optional-call-chain-in-optional.ts:4:21
2 | function useFoo(props: {value: {x: string; y: string} | null}) {
3 | const value = props.value;
> 4 | return createArray(value?.x, value?.y)?.join(', ');
- | ^^^^^^^^ Todo: Unexpected terminal kind `optional` for optional fallthrough block (4:4)
+ | ^^^^^^^^ Unexpected terminal kind `optional` for optional fallthrough block
5 | }
6 |
7 | function createArray(...args: Array): Array {
+
+
```
\ No newline at end of file
diff --git a/compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/propagate-scope-deps-hir-fork/error.todo-optional-member-expression-with-conditional-optional.expect.md b/compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/propagate-scope-deps-hir-fork/error.todo-optional-member-expression-with-conditional-optional.expect.md
index 2fc3e9d6b3..dc310d394c 100644
--- a/compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/propagate-scope-deps-hir-fork/error.todo-optional-member-expression-with-conditional-optional.expect.md
+++ b/compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/propagate-scope-deps-hir-fork/error.todo-optional-member-expression-with-conditional-optional.expect.md
@@ -24,6 +24,12 @@ function Component(props) {
## Error
```
+Found 1 errors:
+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
+
+The inferred dependency was `props.items`, but the source dependencies were [props?.items, props.cond]. Inferred different dependency than source.
+
+error.todo-optional-member-expression-with-conditional-optional.ts:4:23
2 | import {ValidateMemoization} from 'shared-runtime';
3 | function Component(props) {
> 4 | const data = useMemo(() => {
@@ -41,10 +47,12 @@ function Component(props) {
> 10 | return x;
| ^^^^^^^^^^^^^^^^^
> 11 | }, [props?.items, props.cond]);
- | ^^^^ 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. The inferred dependency was `props.items`, but the source dependencies were [props?.items, props.cond]. Inferred different dependency than source (4:11)
+ | ^^^^ 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
12 | return (
13 | {props.children} ;
11 | });
+
+
```
\ No newline at end of file
diff --git a/compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/rules-of-hooks/todo.error.invalid-rules-of-hooks-8566f9a360e2.expect.md b/compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/rules-of-hooks/todo.error.invalid-rules-of-hooks-8566f9a360e2.expect.md
index fabbf9b089..ceb2f92f1e 100644
--- a/compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/rules-of-hooks/todo.error.invalid-rules-of-hooks-8566f9a360e2.expect.md
+++ b/compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/rules-of-hooks/todo.error.invalid-rules-of-hooks-8566f9a360e2.expect.md
@@ -20,13 +20,19 @@ const MemoizedButton = memo(function (props) {
## Error
```
+Found 1 errors:
+InvalidReact: Hooks must always be called in a consistent order, and may not be called conditionally. See the Rules of Hooks (https://react.dev/warnings/invalid-hook-call-warning)
+
+todo.error.invalid-rules-of-hooks-8566f9a360e2.ts:8:4
6 | const MemoizedButton = memo(function (props) {
7 | if (props.fancy) {
> 8 | useCustomHook();
- | ^^^^^^^^^^^^^ InvalidReact: Hooks must always be called in a consistent order, and may not be called conditionally. See the Rules of Hooks (https://react.dev/warnings/invalid-hook-call-warning) (8:8)
+ | ^^^^^^^^^^^^^ Hooks must always be called in a consistent order, and may not be called conditionally. See the Rules of Hooks (https://react.dev/warnings/invalid-hook-call-warning)
9 | }
10 | return {props.children} ;
11 | });
+
+
```
\ No newline at end of file
diff --git a/compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/rules-of-hooks/todo.error.invalid-rules-of-hooks-a0058f0b446d.expect.md b/compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/rules-of-hooks/todo.error.invalid-rules-of-hooks-a0058f0b446d.expect.md
index b6e240e26c..67bf1282b3 100644
--- a/compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/rules-of-hooks/todo.error.invalid-rules-of-hooks-a0058f0b446d.expect.md
+++ b/compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/rules-of-hooks/todo.error.invalid-rules-of-hooks-a0058f0b446d.expect.md
@@ -19,13 +19,19 @@ function ComponentWithConditionalHook() {
## Error
```
+Found 1 errors:
+InvalidReact: Hooks must always be called in a consistent order, and may not be called conditionally. See the Rules of Hooks (https://react.dev/warnings/invalid-hook-call-warning)
+
+todo.error.invalid-rules-of-hooks-a0058f0b446d.ts:8:4
6 | function ComponentWithConditionalHook() {
7 | if (cond) {
> 8 | Namespace.useConditionalHook();
- | ^^^^^^^^^^^^^^^^^^^^^^^^^^^^ InvalidReact: Hooks must always be called in a consistent order, and may not be called conditionally. See the Rules of Hooks (https://react.dev/warnings/invalid-hook-call-warning) (8:8)
+ | ^^^^^^^^^^^^^^^^^^^^^^^^^^^^ Hooks must always be called in a consistent order, and may not be called conditionally. See the Rules of Hooks (https://react.dev/warnings/invalid-hook-call-warning)
9 | }
10 | }
11 |
+
+
```
\ No newline at end of file
diff --git a/compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/rules-of-hooks/todo.error.rules-of-hooks-27c18dc8dad2.expect.md b/compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/rules-of-hooks/todo.error.rules-of-hooks-27c18dc8dad2.expect.md
index 83e94b7616..ab5a827ef9 100644
--- a/compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/rules-of-hooks/todo.error.rules-of-hooks-27c18dc8dad2.expect.md
+++ b/compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/rules-of-hooks/todo.error.rules-of-hooks-27c18dc8dad2.expect.md
@@ -20,13 +20,19 @@ const FancyButton = React.forwardRef((props, ref) => {
## Error
```
+Found 1 errors:
+InvalidReact: Hooks must always be called in a consistent order, and may not be called conditionally. See the Rules of Hooks (https://react.dev/warnings/invalid-hook-call-warning)
+
+todo.error.rules-of-hooks-27c18dc8dad2.ts:8:4
6 | const FancyButton = React.forwardRef((props, ref) => {
7 | if (props.fancy) {
> 8 | useCustomHook();
- | ^^^^^^^^^^^^^ InvalidReact: Hooks must always be called in a consistent order, and may not be called conditionally. See the Rules of Hooks (https://react.dev/warnings/invalid-hook-call-warning) (8:8)
+ | ^^^^^^^^^^^^^ Hooks must always be called in a consistent order, and may not be called conditionally. See the Rules of Hooks (https://react.dev/warnings/invalid-hook-call-warning)
9 | }
10 | return {props.children} ;
11 | });
+
+
```
\ No newline at end of file
diff --git a/compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/rules-of-hooks/todo.error.rules-of-hooks-d0935abedc42.expect.md b/compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/rules-of-hooks/todo.error.rules-of-hooks-d0935abedc42.expect.md
index a96e8e0878..610928d09f 100644
--- a/compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/rules-of-hooks/todo.error.rules-of-hooks-d0935abedc42.expect.md
+++ b/compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/rules-of-hooks/todo.error.rules-of-hooks-d0935abedc42.expect.md
@@ -19,13 +19,19 @@ React.unknownFunction((foo, bar) => {
## Error
```
+Found 1 errors:
+InvalidReact: Hooks must always be called in a consistent order, and may not be called conditionally. See the Rules of Hooks (https://react.dev/warnings/invalid-hook-call-warning)
+
+todo.error.rules-of-hooks-d0935abedc42.ts:8:4
6 | React.unknownFunction((foo, bar) => {
7 | if (foo) {
> 8 | useNotAHook(bar);
- | ^^^^^^^^^^^ InvalidReact: Hooks must always be called in a consistent order, and may not be called conditionally. See the Rules of Hooks (https://react.dev/warnings/invalid-hook-call-warning) (8:8)
+ | ^^^^^^^^^^^ Hooks must always be called in a consistent order, and may not be called conditionally. See the Rules of Hooks (https://react.dev/warnings/invalid-hook-call-warning)
9 | }
10 | });
11 |
+
+
```
\ No newline at end of file
diff --git a/compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/rules-of-hooks/todo.error.rules-of-hooks-e29c874aa913.expect.md b/compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/rules-of-hooks/todo.error.rules-of-hooks-e29c874aa913.expect.md
index 6ce7fc2c8b..3565247c09 100644
--- a/compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/rules-of-hooks/todo.error.rules-of-hooks-e29c874aa913.expect.md
+++ b/compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/rules-of-hooks/todo.error.rules-of-hooks-e29c874aa913.expect.md
@@ -20,13 +20,19 @@ function useHook() {
## Error
```
+Found 1 errors:
+InvalidReact: Hooks must always be called in a consistent order, and may not be called conditionally. See the Rules of Hooks (https://react.dev/warnings/invalid-hook-call-warning)
+
+todo.error.rules-of-hooks-e29c874aa913.ts:9:4
7 | try {
8 | f();
> 9 | useState();
- | ^^^^^^^^ InvalidReact: Hooks must always be called in a consistent order, and may not be called conditionally. See the Rules of Hooks (https://react.dev/warnings/invalid-hook-call-warning) (9:9)
+ | ^^^^^^^^ Hooks must always be called in a consistent order, and may not be called conditionally. See the Rules of Hooks (https://react.dev/warnings/invalid-hook-call-warning)
10 | } catch {}
11 | }
12 |
+
+
```
\ No newline at end of file
diff --git a/compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/static-components/invalid-conditionally-assigned-dynamically-constructed-component-in-render.expect.md b/compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/static-components/invalid-conditionally-assigned-dynamically-constructed-component-in-render.expect.md
index af8103b7ae..264c6017c7 100644
--- a/compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/static-components/invalid-conditionally-assigned-dynamically-constructed-component-in-render.expect.md
+++ b/compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/static-components/invalid-conditionally-assigned-dynamically-constructed-component-in-render.expect.md
@@ -50,8 +50,8 @@ function Example(props) {
## Logs
```
-{"kind":"CompileError","detail":{"options":{"reason":"Components created during render will reset their state each time they are created. Declare components outside of render. ","description":null,"severity":"InvalidReact","suggestions":null,"loc":{"start":{"line":9,"column":10,"index":202},"end":{"line":9,"column":19,"index":211},"filename":"invalid-conditionally-assigned-dynamically-constructed-component-in-render.ts"}}},"fnLoc":null}
-{"kind":"CompileError","detail":{"options":{"reason":"The component may be created during render","description":null,"severity":"InvalidReact","suggestions":null,"loc":{"start":{"line":5,"column":16,"index":124},"end":{"line":5,"column":33,"index":141},"filename":"invalid-conditionally-assigned-dynamically-constructed-component-in-render.ts"}}},"fnLoc":null}
+{"kind":"CompileError","detail":{"reason":"Components created during render will reset their state each time they are created. Declare components outside of render. ","description":null,"severity":"InvalidReact","suggestions":null,"loc":{"start":{"line":9,"column":10,"index":202},"end":{"line":9,"column":19,"index":211},"filename":"invalid-conditionally-assigned-dynamically-constructed-component-in-render.ts"}},"fnLoc":null}
+{"kind":"CompileError","detail":{"reason":"The component may be created during render","description":null,"severity":"InvalidReact","suggestions":null,"loc":{"start":{"line":5,"column":16,"index":124},"end":{"line":5,"column":33,"index":141},"filename":"invalid-conditionally-assigned-dynamically-constructed-component-in-render.ts"}},"fnLoc":null}
{"kind":"CompileSuccess","fnLoc":{"start":{"line":2,"column":0,"index":45},"end":{"line":10,"column":1,"index":217},"filename":"invalid-conditionally-assigned-dynamically-constructed-component-in-render.ts"},"fnName":"Example","memoSlots":3,"memoBlocks":2,"memoValues":2,"prunedMemoBlocks":0,"prunedMemoValues":0}
```
diff --git a/compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/static-components/invalid-dynamically-construct-component-in-render.expect.md b/compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/static-components/invalid-dynamically-construct-component-in-render.expect.md
index 7720863da3..8819e46c6a 100644
--- a/compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/static-components/invalid-dynamically-construct-component-in-render.expect.md
+++ b/compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/static-components/invalid-dynamically-construct-component-in-render.expect.md
@@ -32,8 +32,8 @@ function Example(props) {
## Logs
```
-{"kind":"CompileError","detail":{"options":{"reason":"Components created during render will reset their state each time they are created. Declare components outside of render. ","description":null,"severity":"InvalidReact","suggestions":null,"loc":{"start":{"line":4,"column":10,"index":120},"end":{"line":4,"column":19,"index":129},"filename":"invalid-dynamically-construct-component-in-render.ts"}}},"fnLoc":null}
-{"kind":"CompileError","detail":{"options":{"reason":"The component may be created during render","description":null,"severity":"InvalidReact","suggestions":null,"loc":{"start":{"line":3,"column":20,"index":91},"end":{"line":3,"column":37,"index":108},"filename":"invalid-dynamically-construct-component-in-render.ts"}}},"fnLoc":null}
+{"kind":"CompileError","detail":{"reason":"Components created during render will reset their state each time they are created. Declare components outside of render. ","description":null,"severity":"InvalidReact","suggestions":null,"loc":{"start":{"line":4,"column":10,"index":120},"end":{"line":4,"column":19,"index":129},"filename":"invalid-dynamically-construct-component-in-render.ts"}},"fnLoc":null}
+{"kind":"CompileError","detail":{"reason":"The component may be created during render","description":null,"severity":"InvalidReact","suggestions":null,"loc":{"start":{"line":3,"column":20,"index":91},"end":{"line":3,"column":37,"index":108},"filename":"invalid-dynamically-construct-component-in-render.ts"}},"fnLoc":null}
{"kind":"CompileSuccess","fnLoc":{"start":{"line":2,"column":0,"index":45},"end":{"line":5,"column":1,"index":135},"filename":"invalid-dynamically-construct-component-in-render.ts"},"fnName":"Example","memoSlots":1,"memoBlocks":1,"memoValues":1,"prunedMemoBlocks":0,"prunedMemoValues":0}
```
diff --git a/compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/static-components/invalid-dynamically-constructed-component-function.expect.md b/compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/static-components/invalid-dynamically-constructed-component-function.expect.md
index 8d218bf24b..ffb733452a 100644
--- a/compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/static-components/invalid-dynamically-constructed-component-function.expect.md
+++ b/compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/static-components/invalid-dynamically-constructed-component-function.expect.md
@@ -37,8 +37,8 @@ function Example(props) {
## Logs
```
-{"kind":"CompileError","detail":{"options":{"reason":"Components created during render will reset their state each time they are created. Declare components outside of render. ","description":null,"severity":"InvalidReact","suggestions":null,"loc":{"start":{"line":6,"column":10,"index":130},"end":{"line":6,"column":19,"index":139},"filename":"invalid-dynamically-constructed-component-function.ts"}}},"fnLoc":null}
-{"kind":"CompileError","detail":{"options":{"reason":"The component may be created during render","description":null,"severity":"InvalidReact","suggestions":null,"loc":{"start":{"line":3,"column":2,"index":73},"end":{"line":5,"column":3,"index":119},"filename":"invalid-dynamically-constructed-component-function.ts"}}},"fnLoc":null}
+{"kind":"CompileError","detail":{"reason":"Components created during render will reset their state each time they are created. Declare components outside of render. ","description":null,"severity":"InvalidReact","suggestions":null,"loc":{"start":{"line":6,"column":10,"index":130},"end":{"line":6,"column":19,"index":139},"filename":"invalid-dynamically-constructed-component-function.ts"}},"fnLoc":null}
+{"kind":"CompileError","detail":{"reason":"The component may be created during render","description":null,"severity":"InvalidReact","suggestions":null,"loc":{"start":{"line":3,"column":2,"index":73},"end":{"line":5,"column":3,"index":119},"filename":"invalid-dynamically-constructed-component-function.ts"}},"fnLoc":null}
{"kind":"CompileSuccess","fnLoc":{"start":{"line":2,"column":0,"index":45},"end":{"line":7,"column":1,"index":145},"filename":"invalid-dynamically-constructed-component-function.ts"},"fnName":"Example","memoSlots":1,"memoBlocks":1,"memoValues":1,"prunedMemoBlocks":0,"prunedMemoValues":0}
```
diff --git a/compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/static-components/invalid-dynamically-constructed-component-method-call.expect.md b/compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/static-components/invalid-dynamically-constructed-component-method-call.expect.md
index e3bc7a5eb5..a7bc5f7569 100644
--- a/compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/static-components/invalid-dynamically-constructed-component-method-call.expect.md
+++ b/compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/static-components/invalid-dynamically-constructed-component-method-call.expect.md
@@ -41,8 +41,8 @@ function Example(props) {
## Logs
```
-{"kind":"CompileError","detail":{"options":{"reason":"Components created during render will reset their state each time they are created. Declare components outside of render. ","description":null,"severity":"InvalidReact","suggestions":null,"loc":{"start":{"line":4,"column":10,"index":118},"end":{"line":4,"column":19,"index":127},"filename":"invalid-dynamically-constructed-component-method-call.ts"}}},"fnLoc":null}
-{"kind":"CompileError","detail":{"options":{"reason":"The component may be created during render","description":null,"severity":"InvalidReact","suggestions":null,"loc":{"start":{"line":3,"column":20,"index":91},"end":{"line":3,"column":35,"index":106},"filename":"invalid-dynamically-constructed-component-method-call.ts"}}},"fnLoc":null}
+{"kind":"CompileError","detail":{"reason":"Components created during render will reset their state each time they are created. Declare components outside of render. ","description":null,"severity":"InvalidReact","suggestions":null,"loc":{"start":{"line":4,"column":10,"index":118},"end":{"line":4,"column":19,"index":127},"filename":"invalid-dynamically-constructed-component-method-call.ts"}},"fnLoc":null}
+{"kind":"CompileError","detail":{"reason":"The component may be created during render","description":null,"severity":"InvalidReact","suggestions":null,"loc":{"start":{"line":3,"column":20,"index":91},"end":{"line":3,"column":35,"index":106},"filename":"invalid-dynamically-constructed-component-method-call.ts"}},"fnLoc":null}
{"kind":"CompileSuccess","fnLoc":{"start":{"line":2,"column":0,"index":45},"end":{"line":5,"column":1,"index":133},"filename":"invalid-dynamically-constructed-component-method-call.ts"},"fnName":"Example","memoSlots":4,"memoBlocks":2,"memoValues":2,"prunedMemoBlocks":0,"prunedMemoValues":0}
```
diff --git a/compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/static-components/invalid-dynamically-constructed-component-new.expect.md b/compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/static-components/invalid-dynamically-constructed-component-new.expect.md
index 02e9f4f4a4..92aea43a31 100644
--- a/compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/static-components/invalid-dynamically-constructed-component-new.expect.md
+++ b/compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/static-components/invalid-dynamically-constructed-component-new.expect.md
@@ -32,8 +32,8 @@ function Example(props) {
## Logs
```
-{"kind":"CompileError","detail":{"options":{"reason":"Components created during render will reset their state each time they are created. Declare components outside of render. ","description":null,"severity":"InvalidReact","suggestions":null,"loc":{"start":{"line":4,"column":10,"index":125},"end":{"line":4,"column":19,"index":134},"filename":"invalid-dynamically-constructed-component-new.ts"}}},"fnLoc":null}
-{"kind":"CompileError","detail":{"options":{"reason":"The component may be created during render","description":null,"severity":"InvalidReact","suggestions":null,"loc":{"start":{"line":3,"column":20,"index":91},"end":{"line":3,"column":42,"index":113},"filename":"invalid-dynamically-constructed-component-new.ts"}}},"fnLoc":null}
+{"kind":"CompileError","detail":{"reason":"Components created during render will reset their state each time they are created. Declare components outside of render. ","description":null,"severity":"InvalidReact","suggestions":null,"loc":{"start":{"line":4,"column":10,"index":125},"end":{"line":4,"column":19,"index":134},"filename":"invalid-dynamically-constructed-component-new.ts"}},"fnLoc":null}
+{"kind":"CompileError","detail":{"reason":"The component may be created during render","description":null,"severity":"InvalidReact","suggestions":null,"loc":{"start":{"line":3,"column":20,"index":91},"end":{"line":3,"column":42,"index":113},"filename":"invalid-dynamically-constructed-component-new.ts"}},"fnLoc":null}
{"kind":"CompileSuccess","fnLoc":{"start":{"line":2,"column":0,"index":45},"end":{"line":5,"column":1,"index":140},"filename":"invalid-dynamically-constructed-component-new.ts"},"fnName":"Example","memoSlots":1,"memoBlocks":1,"memoValues":1,"prunedMemoBlocks":0,"prunedMemoValues":0}
```
diff --git a/compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/todo.error.object-pattern-computed-key.expect.md b/compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/todo.error.object-pattern-computed-key.expect.md
index 1856784ce0..3e8cd89671 100644
--- a/compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/todo.error.object-pattern-computed-key.expect.md
+++ b/compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/todo.error.object-pattern-computed-key.expect.md
@@ -21,13 +21,19 @@ export const FIXTURE_ENTRYPOINT = {
## Error
```
+Found 1 errors:
+Todo: (BuildHIR::lowerAssignment) Handle computed properties in ObjectPattern
+
+todo.error.object-pattern-computed-key.ts:5:9
3 | const SCALE = 2;
4 | function Component(props) {
> 5 | const {[props.name]: value} = props;
- | ^^^^^^^^^^^^^^^^^^^ Todo: (BuildHIR::lowerAssignment) Handle computed properties in ObjectPattern (5:5)
+ | ^^^^^^^^^^^^^^^^^^^ (BuildHIR::lowerAssignment) Handle computed properties in ObjectPattern
6 | return value;
7 | }
8 |
+
+
```
\ No newline at end of file
diff --git a/compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/transform-fire/bailout-retry/error.todo-syntax.expect.md b/compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/transform-fire/bailout-retry/error.todo-syntax.expect.md
index aa3d989296..cea67ae5c0 100644
--- a/compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/transform-fire/bailout-retry/error.todo-syntax.expect.md
+++ b/compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/transform-fire/bailout-retry/error.todo-syntax.expect.md
@@ -29,10 +29,16 @@ function Component({prop1}) {
## Error
```
+Found 1 errors:
+InvalidReact: [Fire] Untransformed reference to compiler-required feature.
+
+ Todo: (BuildHIR::lowerStatement) Handle TryStatement without a catch clause (11:4)
+
+error.todo-syntax.ts:18:4
16 | };
17 | useEffect(() => {
> 18 | fire(foo());
- | ^^^^ InvalidReact: [Fire] Untransformed reference to compiler-required feature. Either remove this `fire` call or ensure it is successfully transformed by the compiler. (Bailout reason: Todo: (BuildHIR::lowerStatement) Handle TryStatement without a catch clause (11:15)) (18:18)
+ | ^^^^ Untransformed `fire` call
19 | });
20 | }
21 |
diff --git a/compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/transform-fire/bailout-retry/error.untransformed-fire-reference.expect.md b/compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/transform-fire/bailout-retry/error.untransformed-fire-reference.expect.md
index 0141ffb8ad..5fbf91a627 100644
--- a/compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/transform-fire/bailout-retry/error.untransformed-fire-reference.expect.md
+++ b/compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/transform-fire/bailout-retry/error.untransformed-fire-reference.expect.md
@@ -13,10 +13,16 @@ console.log(fire == null);
## Error
```
+Found 1 errors:
+InvalidReact: [Fire] Untransformed reference to compiler-required feature.
+
+ null
+
+error.untransformed-fire-reference.ts:4:12
2 | import {fire} from 'react';
3 |
> 4 | console.log(fire == null);
- | ^^^^ InvalidReact: [Fire] Untransformed reference to compiler-required feature. Either remove this `fire` call or ensure it is successfully transformed by the compiler (4:4)
+ | ^^^^ Untransformed `fire` call
5 |
```
diff --git a/compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/transform-fire/bailout-retry/error.use-no-memo.expect.md b/compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/transform-fire/bailout-retry/error.use-no-memo.expect.md
index 275012351c..e565959fbf 100644
--- a/compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/transform-fire/bailout-retry/error.use-no-memo.expect.md
+++ b/compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/transform-fire/bailout-retry/error.use-no-memo.expect.md
@@ -30,10 +30,16 @@ function Component({props, bar}) {
## Error
```
+Found 1 errors:
+InvalidReact: [Fire] Untransformed reference to compiler-required feature.
+
+ null
+
+error.use-no-memo.ts:15:4
13 | };
14 | useEffect(() => {
> 15 | fire(foo(props));
- | ^^^^ InvalidReact: [Fire] Untransformed reference to compiler-required feature. Either remove this `fire` call or ensure it is successfully transformed by the compiler (15:15)
+ | ^^^^ Untransformed `fire` call
16 | fire(foo());
17 | fire(bar());
18 | });
diff --git a/compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/transform-fire/error.invalid-mix-fire-and-no-fire.expect.md b/compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/transform-fire/error.invalid-mix-fire-and-no-fire.expect.md
index e73451a896..fde1b106e3 100644
--- a/compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/transform-fire/error.invalid-mix-fire-and-no-fire.expect.md
+++ b/compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/transform-fire/error.invalid-mix-fire-and-no-fire.expect.md
@@ -27,13 +27,21 @@ function Component(props) {
## Error
```
+Found 1 errors:
+InvalidReact: Cannot compile `fire`
+
+All uses of foo must be either used with a fire() call in this effect or not used with a fire() call at all. foo was used with fire() on line 10:10 in this effect.
+
+error.invalid-mix-fire-and-no-fire.ts:11:6
9 | function nested() {
10 | fire(foo(props));
> 11 | foo(props);
- | ^^^ InvalidReact: Cannot compile `fire`. All uses of foo must be either used with a fire() call in this effect or not used with a fire() call at all. foo was used with fire() on line 10:10 in this effect (11:11)
+ | ^^^ Cannot compile `fire`
12 | }
13 |
14 | nested();
+
+
```
\ No newline at end of file
diff --git a/compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/transform-fire/error.invalid-multiple-args.expect.md b/compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/transform-fire/error.invalid-multiple-args.expect.md
index 8329717cb3..2acc9535c1 100644
--- a/compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/transform-fire/error.invalid-multiple-args.expect.md
+++ b/compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/transform-fire/error.invalid-multiple-args.expect.md
@@ -22,13 +22,21 @@ function Component({bar, baz}) {
## Error
```
+Found 1 errors:
+InvalidReact: Cannot compile `fire`
+
+fire() can only take in a single call expression as an argument but received multiple arguments.
+
+error.invalid-multiple-args.ts:9:4
7 | };
8 | useEffect(() => {
> 9 | fire(foo(bar), baz);
- | ^^^^^^^^^^^^^^^^^^^ InvalidReact: Cannot compile `fire`. fire() can only take in a single call expression as an argument but received multiple arguments (9:9)
+ | ^^^^^^^^^^^^^^^^^^^ Cannot compile `fire`
10 | });
11 |
12 | return null;
+
+
```
\ No newline at end of file
diff --git a/compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/transform-fire/error.invalid-nested-use-effect.expect.md b/compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/transform-fire/error.invalid-nested-use-effect.expect.md
index 1e1ff49b37..35135b74a0 100644
--- a/compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/transform-fire/error.invalid-nested-use-effect.expect.md
+++ b/compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/transform-fire/error.invalid-nested-use-effect.expect.md
@@ -28,13 +28,21 @@ function Component(props) {
## Error
```
+Found 1 errors:
+InvalidReact: Hooks must be called at the top level in the body of a function component or custom hook, and may not be called within function expressions. See the Rules of Hooks (https://react.dev/warnings/invalid-hook-call-warning)
+
+Cannot call useEffect within a function expression.
+
+error.invalid-nested-use-effect.ts:9:4
7 | };
8 | useEffect(() => {
> 9 | useEffect(() => {
- | ^^^^^^^^^ InvalidReact: Hooks must be called at the top level in the body of a function component or custom hook, and may not be called within function expressions. See the Rules of Hooks (https://react.dev/warnings/invalid-hook-call-warning). Cannot call useEffect within a function expression (9:9)
+ | ^^^^^^^^^ Hooks must be called at the top level in the body of a function component or custom hook, and may not be called within function expressions. See the Rules of Hooks (https://react.dev/warnings/invalid-hook-call-warning)
10 | function nested() {
11 | fire(foo(props));
12 | }
+
+
```
\ No newline at end of file
diff --git a/compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/transform-fire/error.invalid-not-call.expect.md b/compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/transform-fire/error.invalid-not-call.expect.md
index 855c7b7d70..d3ba668cad 100644
--- a/compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/transform-fire/error.invalid-not-call.expect.md
+++ b/compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/transform-fire/error.invalid-not-call.expect.md
@@ -22,13 +22,21 @@ function Component(props) {
## Error
```
+Found 1 errors:
+InvalidReact: Cannot compile `fire`
+
+`fire()` can only receive a function call such as `fire(fn(a,b)). Method calls and other expressions are not allowed.
+
+error.invalid-not-call.ts:9:4
7 | };
8 | useEffect(() => {
> 9 | fire(props);
- | ^^^^^^^^^^^ InvalidReact: Cannot compile `fire`. `fire()` can only receive a function call such as `fire(fn(a,b)). Method calls and other expressions are not allowed (9:9)
+ | ^^^^^^^^^^^ Cannot compile `fire`
10 | });
11 |
12 | return null;
+
+
```
\ No newline at end of file
diff --git a/compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/transform-fire/error.invalid-outside-effect.expect.md b/compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/transform-fire/error.invalid-outside-effect.expect.md
index 687a21f98c..3f752a4a44 100644
--- a/compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/transform-fire/error.invalid-outside-effect.expect.md
+++ b/compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/transform-fire/error.invalid-outside-effect.expect.md
@@ -24,15 +24,35 @@ function Component({props, bar}) {
## Error
```
+Found 2 errors:
+Invariant: Cannot compile `fire`
+
+Cannot use `fire` outside of a useEffect function.
+
+error.invalid-outside-effect.ts:8:2
6 | console.log(props);
7 | };
> 8 | fire(foo(props));
- | ^^^^ Invariant: Cannot compile `fire`. Cannot use `fire` outside of a useEffect function (8:8)
-
-Invariant: Cannot compile `fire`. Cannot use `fire` outside of a useEffect function (11:11)
+ | ^^^^ Cannot compile `fire`
9 |
10 | useCallback(() => {
11 | fire(foo(props));
+
+
+Invariant: Cannot compile `fire`
+
+Cannot use `fire` outside of a useEffect function.
+
+error.invalid-outside-effect.ts:11:4
+ 9 |
+ 10 | useCallback(() => {
+> 11 | fire(foo(props));
+ | ^^^^ Cannot compile `fire`
+ 12 | }, [foo, props]);
+ 13 |
+ 14 | return null;
+
+
```
\ No newline at end of file
diff --git a/compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/transform-fire/error.invalid-rewrite-deps-no-array-literal.expect.md b/compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/transform-fire/error.invalid-rewrite-deps-no-array-literal.expect.md
index dcd9312bb2..514639a1f9 100644
--- a/compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/transform-fire/error.invalid-rewrite-deps-no-array-literal.expect.md
+++ b/compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/transform-fire/error.invalid-rewrite-deps-no-array-literal.expect.md
@@ -25,13 +25,21 @@ function Component(props) {
## Error
```
+Found 1 errors:
+Invariant: Cannot compile `fire`
+
+You must use an array literal for an effect dependency array when that effect uses `fire()`.
+
+error.invalid-rewrite-deps-no-array-literal.ts:13:5
11 | useEffect(() => {
12 | fire(foo(props));
> 13 | }, deps);
- | ^^^^ Invariant: Cannot compile `fire`. You must use an array literal for an effect dependency array when that effect uses `fire()` (13:13)
+ | ^^^^ Cannot compile `fire`
14 |
15 | return null;
16 | }
+
+
```
\ No newline at end of file
diff --git a/compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/transform-fire/error.invalid-rewrite-deps-spread.expect.md b/compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/transform-fire/error.invalid-rewrite-deps-spread.expect.md
index 91c5523564..d1dadad0f5 100644
--- a/compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/transform-fire/error.invalid-rewrite-deps-spread.expect.md
+++ b/compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/transform-fire/error.invalid-rewrite-deps-spread.expect.md
@@ -28,13 +28,21 @@ function Component(props) {
## Error
```
+Found 1 errors:
+Invariant: Cannot compile `fire`
+
+You must use an array literal for an effect dependency array when that effect uses `fire()`.
+
+error.invalid-rewrite-deps-spread.ts:15:7
13 | fire(foo(props));
14 | },
> 15 | ...deps
- | ^^^^ Invariant: Cannot compile `fire`. You must use an array literal for an effect dependency array when that effect uses `fire()` (15:15)
+ | ^^^^ Cannot compile `fire`
16 | );
17 |
18 | return null;
+
+
```
\ No newline at end of file
diff --git a/compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/transform-fire/error.invalid-spread.expect.md b/compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/transform-fire/error.invalid-spread.expect.md
index c0b797fc14..07bb8778a8 100644
--- a/compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/transform-fire/error.invalid-spread.expect.md
+++ b/compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/transform-fire/error.invalid-spread.expect.md
@@ -22,13 +22,21 @@ function Component(props) {
## Error
```
+Found 1 errors:
+InvalidReact: Cannot compile `fire`
+
+fire() can only take in a single call expression as an argument but received a spread argument.
+
+error.invalid-spread.ts:9:4
7 | };
8 | useEffect(() => {
> 9 | fire(...foo);
- | ^^^^^^^^^^^^ InvalidReact: Cannot compile `fire`. fire() can only take in a single call expression as an argument but received a spread argument (9:9)
+ | ^^^^^^^^^^^^ Cannot compile `fire`
10 | });
11 |
12 | return null;
+
+
```
\ No newline at end of file
diff --git a/compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/transform-fire/error.todo-method.expect.md b/compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/transform-fire/error.todo-method.expect.md
index 3f237cfc6f..8d2534109e 100644
--- a/compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/transform-fire/error.todo-method.expect.md
+++ b/compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/transform-fire/error.todo-method.expect.md
@@ -22,13 +22,21 @@ function Component(props) {
## Error
```
+Found 1 errors:
+InvalidReact: Cannot compile `fire`
+
+`fire()` can only receive a function call such as `fire(fn(a,b)). Method calls and other expressions are not allowed.
+
+error.todo-method.ts:9:4
7 | };
8 | useEffect(() => {
> 9 | fire(props.foo());
- | ^^^^^^^^^^^^^^^^^ InvalidReact: Cannot compile `fire`. `fire()` can only receive a function call such as `fire(fn(a,b)). Method calls and other expressions are not allowed (9:9)
+ | ^^^^^^^^^^^^^^^^^ Cannot compile `fire`
10 | });
11 |
12 | return null;
+
+
```
\ No newline at end of file
diff --git a/compiler/packages/snap/src/runner-worker.ts b/compiler/packages/snap/src/runner-worker.ts
index fd4763b203..76550242ce 100644
--- a/compiler/packages/snap/src/runner-worker.ts
+++ b/compiler/packages/snap/src/runner-worker.ts
@@ -145,27 +145,12 @@ async function compile(
console.error(e.stack);
}
error = e.message.replace(/\u001b[^m]*m/g, '');
- const loc = e.details?.[0]?.loc;
- if (loc != null) {
+
+ if (typeof e.printErrorMessage === 'function') {
try {
- error = codeFrameColumns(
- input,
- {
- start: {
- line: loc.start.line,
- column: loc.start.column + 1,
- },
- end: {
- line: loc.end.line,
- column: loc.end.column + 1,
- },
- },
- {
- message: e.message,
- },
- );
+ error = e.printErrorMessage(input);
} catch {
- // In case the location data isn't valid, skip printing a code frame.
+ // no-op
}
}
}
From 20a38b818d317e10772e974ab0bf7932a50a21ce Mon Sep 17 00:00:00 2001
From: Joe Savona
Date: Wed, 9 Jul 2025 22:22:08 -0700
Subject: [PATCH 5/6] [compiler] Enable additional lints by default
Enable more validations to help catch bad patterns, but only in the linter. These rules are already enabled by default in the compiler _if_ violations could produce unsafe output.
---
.../src/rules/ReactCompilerRule.ts | 6 ++++++
.../eslint-plugin-react-hooks/src/rules/ReactCompiler.ts | 6 ++++++
2 files changed, 12 insertions(+)
diff --git a/compiler/packages/eslint-plugin-react-compiler/src/rules/ReactCompilerRule.ts b/compiler/packages/eslint-plugin-react-compiler/src/rules/ReactCompilerRule.ts
index e9eee26bda..213883c215 100644
--- a/compiler/packages/eslint-plugin-react-compiler/src/rules/ReactCompilerRule.ts
+++ b/compiler/packages/eslint-plugin-react-compiler/src/rules/ReactCompilerRule.ts
@@ -107,6 +107,12 @@ const COMPILER_OPTIONS: Partial = {
flowSuppressions: false,
environment: validateEnvironmentConfig({
validateRefAccessDuringRender: false,
+ validateNoSetStateInRender: true,
+ validateNoSetStateInPassiveEffects: true,
+ validateNoJSXInTryStatements: true,
+ validateNoImpureFunctionsInRender: true,
+ validateStaticComponents: true,
+ validateNoFreezingKnownMutableFunctions: true,
}),
};
diff --git a/packages/eslint-plugin-react-hooks/src/rules/ReactCompiler.ts b/packages/eslint-plugin-react-hooks/src/rules/ReactCompiler.ts
index 67d5745a1c..4771ec5d82 100644
--- a/packages/eslint-plugin-react-hooks/src/rules/ReactCompiler.ts
+++ b/packages/eslint-plugin-react-hooks/src/rules/ReactCompiler.ts
@@ -109,6 +109,12 @@ const COMPILER_OPTIONS: Partial = {
flowSuppressions: false,
environment: validateEnvironmentConfig({
validateRefAccessDuringRender: false,
+ validateNoSetStateInRender: true,
+ validateNoSetStateInPassiveEffects: true,
+ validateNoJSXInTryStatements: true,
+ validateNoImpureFunctionsInRender: true,
+ validateStaticComponents: true,
+ validateNoFreezingKnownMutableFunctions: true,
}),
};
From e5412298f5845b26ca0cadda2b140e9726b7642f Mon Sep 17 00:00:00 2001
From: Joe Savona
Date: Wed, 9 Jul 2025 22:22:08 -0700
Subject: [PATCH 6/6] [compiler] Validate against setState in all effect types
---
.../Validation/ValidateNoSetStateInPassiveEffects.ts | 10 ++++++++--
1 file changed, 8 insertions(+), 2 deletions(-)
diff --git a/compiler/packages/babel-plugin-react-compiler/src/Validation/ValidateNoSetStateInPassiveEffects.ts b/compiler/packages/babel-plugin-react-compiler/src/Validation/ValidateNoSetStateInPassiveEffects.ts
index a36c347faa..fa2861c2be 100644
--- a/compiler/packages/babel-plugin-react-compiler/src/Validation/ValidateNoSetStateInPassiveEffects.ts
+++ b/compiler/packages/babel-plugin-react-compiler/src/Validation/ValidateNoSetStateInPassiveEffects.ts
@@ -11,13 +11,15 @@ import {
IdentifierId,
isSetStateType,
isUseEffectHookType,
+ isUseInsertionEffectHookType,
+ isUseLayoutEffectHookType,
Place,
} from '../HIR';
import {eachInstructionValueOperand} from '../HIR/visitors';
import {Result} from '../Utils/Result';
/**
- * Validates against calling setState in the body of a *passive* effect (useEffect),
+ * Validates against calling setState in the body of an effect (useEffect and friends),
* while allowing calling setState in callbacks scheduled by the effect.
*
* Calling setState during execution of a useEffect triggers a re-render, which is
@@ -79,7 +81,11 @@ export function validateNoSetStateInPassiveEffects(
instr.value.kind === 'MethodCall'
? instr.value.receiver
: instr.value.callee;
- if (isUseEffectHookType(callee.identifier)) {
+ if (
+ isUseEffectHookType(callee.identifier) ||
+ isUseLayoutEffectHookType(callee.identifier) ||
+ isUseInsertionEffectHookType(callee.identifier)
+ ) {
const arg = instr.value.args[0];
if (arg !== undefined && arg.kind === 'Identifier') {
const setState = setStateFunctions.get(arg.identifier.id);