@samitouri / QOS-React-2 / commits / 7f510554ad

[compiler] Cleanup diagnostic messages (#33765)

Minor sytlistic cleanup --- [//]: # (BEGIN SAPLING FOOTER) Stack created with [Sapling](https://sapling-scm.com). Best reviewed with [ReviewStack](https://reviewstack.dev/facebook/react/pull/33765). * #33981 * #33777 * #33767 * __->__ #33765

Joseph Savona committed Jul 24, 2025 at 15:45 UTC 7f510554adce7312c51139e26aa381f08ad886a2
317 files changed +640 -684
compiler/packages/babel-plugin-react-compiler/src/Babel/BabelPlugin.ts
+3 -1
@@ -84,7 +84,9 @@ export default function BabelPluginReactCompiler(
84 }
85 } catch (e) {
86 if (e instanceof CompilerError) {
87 - throw new Error(e.printErrorMessage(pass.file.code));
87 + throw new Error(
88 + e.printErrorMessage(pass.file.code, {eslint: false}),
89 + );
90 }
91 throw e;
92 }
compiler/packages/babel-plugin-react-compiler/src/CompilerError.ts
+58 -43
@@ -5,6 +5,7 @@
5 * LICENSE file in the root directory of this source tree.
6 */
7
8 +import * as t from '@babel/types';
9 import {codeFrameColumns} from '@babel/code-frame';
10 import type {SourceLocation} from './HIR';
11 import {Err, Ok, Result} from './Utils/Result';
@@ -93,6 +94,14 @@ export type CompilerErrorDetailOptions = {
94 suggestions?: Array<CompilerSuggestion> | null | undefined;
95 };
96
97 +export type PrintErrorMessageOptions = {
98 + /**
99 + * ESLint uses 1-indexed columns and prints one error at a time
100 + * So it doesn't require the "Found # error(s)" text
101 + */
102 + eslint: boolean;
103 +};
104 +
105 export class CompilerDiagnostic {
106 options: CompilerDiagnosticOptions;
107
@@ -128,7 +137,7 @@ export class CompilerDiagnostic {
137 return this.options.details.filter(d => d.kind === 'error')[0]?.loc ?? null;
138 }
139
131 - printErrorMessage(source: string): string {
140 + printErrorMessage(source: string, options: PrintErrorMessageOptions): string {
141 const buffer = [
142 printErrorSummary(this.severity, this.category),
143 '\n\n',
@@ -143,28 +152,18 @@ export class CompilerDiagnostic {
152 }
153 let codeFrame: string;
154 try {
146 - codeFrame = codeFrameColumns(
147 - source,
148 - {
149 - start: {
150 - line: loc.start.line,
151 - column: loc.start.column + 1,
152 - },
153 - end: {
154 - line: loc.end.line,
155 - column: loc.end.column + 1,
156 - },
157 - },
158 - {
159 - message: detail.message,
160 - },
161 - );
155 + codeFrame = printCodeFrame(source, loc, detail.message);
156 } catch (e) {
157 codeFrame = detail.message;
158 }
165 - buffer.push(
166 - `\n\n${loc.filename}:${loc.start.line}:${loc.start.column}\n`,
167 - );
159 + buffer.push('\n\n');
160 + if (loc.filename != null) {
161 + const line = loc.start.line;
162 + const column = options.eslint
163 + ? loc.start.column + 1
164 + : loc.start.column;
165 + buffer.push(`${loc.filename}:${line}:${column}\n`);
166 + }
167 buffer.push(codeFrame);
168 break;
169 }
@@ -223,7 +222,7 @@ export class CompilerErrorDetail {
222 return this.loc;
223 }
224
226 - printErrorMessage(source: string): string {
225 + printErrorMessage(source: string, options: PrintErrorMessageOptions): string {
226 const buffer = [printErrorSummary(this.severity, this.reason)];
227 if (this.description != null) {
228 buffer.push(`\n\n${this.description}.`);
@@ -232,28 +231,16 @@ export class CompilerErrorDetail {
231 if (loc != null && typeof loc !== 'symbol') {
232 let codeFrame: string;
233 try {
235 - codeFrame = codeFrameColumns(
236 - source,
237 - {
238 - start: {
239 - line: loc.start.line,
240 - column: loc.start.column + 1,
241 - },
242 - end: {
243 - line: loc.end.line,
244 - column: loc.end.column + 1,
245 - },
246 - },
247 - {
248 - message: this.reason,
249 - },
250 - );
234 + codeFrame = printCodeFrame(source, loc, this.reason);
235 } catch (e) {
236 codeFrame = '';
237 }
254 - buffer.push(
255 - `\n\n${loc.filename}:${loc.start.line}:${loc.start.column}\n`,
256 - );
238 + buffer.push(`\n\n`);
239 + if (loc.filename != null) {
240 + const line = loc.start.line;
241 + const column = options.eslint ? loc.start.column + 1 : loc.start.column;
242 + buffer.push(`${loc.filename}:${line}:${column}\n`);
243 + }
244 buffer.push(codeFrame);
245 buffer.push('\n\n');
246 }
@@ -372,10 +359,15 @@ export class CompilerError extends Error {
359 return this.name;
360 }
361
375 - printErrorMessage(source: string): string {
362 + printErrorMessage(source: string, options: PrintErrorMessageOptions): string {
363 + if (options.eslint && this.details.length === 1) {
364 + return this.details[0].printErrorMessage(source, options);
365 + }
366 return (
377 - `Found ${this.details.length} error${this.details.length === 1 ? '' : 's'}:\n` +
378 - this.details.map(detail => detail.printErrorMessage(source)).join('\n')
367 + `Found ${this.details.length} error${this.details.length === 1 ? '' : 's'}:\n\n` +
368 + this.details
369 + .map(detail => detail.printErrorMessage(source, options).trim())
370 + .join('\n\n')
371 );
372 }
373
@@ -438,6 +430,29 @@ export class CompilerError extends Error {
430 }
431 }
432
433 +function printCodeFrame(
434 + source: string,
435 + loc: t.SourceLocation,
436 + message: string,
437 +): string {
438 + return codeFrameColumns(
439 + source,
440 + {
441 + start: {
442 + line: loc.start.line,
443 + column: loc.start.column + 1,
444 + },
445 + end: {
446 + line: loc.end.line,
447 + column: loc.end.column + 1,
448 + },
449 + },
450 + {
451 + message,
452 + },
453 + );
454 +}
455 +
456 function printErrorSummary(severity: ErrorSeverity, message: string): string {
457 let severityCategory: string;
458 switch (severity) {
compiler/packages/babel-plugin-react-compiler/src/HIR/BuildHIR.ts
+5 -8
@@ -107,10 +107,9 @@ export function lower(
107 if (binding.kind !== 'Identifier') {
108 builder.errors.pushDiagnostic(
109 CompilerDiagnostic.create({
110 - category: 'Could not find binding',
111 - description: `[BuildHIR] Could not find binding for param \`${param.node.name}\``,
110 severity: ErrorSeverity.Invariant,
113 - suggestions: null,
111 + category: 'Could not find binding',
112 + description: `[BuildHIR] Could not find binding for param \`${param.node.name}\`.`,
113 }).withDetail({
114 kind: 'error',
115 loc: param.node.loc ?? null,
@@ -172,10 +171,9 @@ export function lower(
171 } else {
172 builder.errors.pushDiagnostic(
173 CompilerDiagnostic.create({
175 - category: `Handle ${param.node.type} parameters`,
176 - description: `[BuildHIR] Add support for ${param.node.type} parameters`,
174 severity: ErrorSeverity.Todo,
178 - suggestions: null,
175 + category: `Handle ${param.node.type} parameters`,
176 + description: `[BuildHIR] Add support for ${param.node.type} parameters.`,
177 }).withDetail({
178 kind: 'error',
179 loc: param.node.loc ?? null,
@@ -205,8 +203,7 @@ export function lower(
203 CompilerDiagnostic.create({
204 severity: ErrorSeverity.InvalidJS,
205 category: `Unexpected function body kind`,
208 - description: `Expected function body to be an expression or a block statement, got \`${body.type}\``,
209 - suggestions: null,
206 + description: `Expected function body to be an expression or a block statement, got \`${body.type}\`.`,
207 }).withDetail({
208 kind: 'error',
209 loc: body.node.loc ?? null,
compiler/packages/babel-plugin-react-compiler/src/Inference/InferMutationAliasingEffects.ts
+19 -22
@@ -447,23 +447,22 @@ function applySignature(
447 reason: value.reason,
448 context: new Set(),
449 });
450 - const message =
450 + const variable =
451 effect.value.identifier.name !== null &&
452 effect.value.identifier.name.kind === 'named'
453 - ? `\`${effect.value.identifier.name.value}\` cannot be modified`
454 - : 'This value cannot be modified';
453 + ? `\`${effect.value.identifier.name.value}\``
454 + : 'value';
455 effects.push({
456 kind: 'MutateFrozen',
457 place: effect.value,
458 error: CompilerDiagnostic.create({
459 severity: ErrorSeverity.InvalidReact,
460 category: 'This value cannot be modified',
461 - description: reason,
462 - suggestions: null,
461 + description: `${reason}.`,
462 }).withDetail({
463 kind: 'error',
464 loc: effect.value.loc,
466 - message,
465 + message: `${variable} cannot be modified`,
466 }),
467 });
468 }
@@ -1018,30 +1017,30 @@ function applyEffect(
1017 effect.value.identifier.declarationId,
1018 )
1019 ) {
1021 - const description =
1020 + const variable =
1021 effect.value.identifier.name !== null &&
1022 effect.value.identifier.name.kind === 'named'
1024 - ? `Variable \`${effect.value.identifier.name.value}\``
1025 - : 'This variable';
1023 + ? `\`${effect.value.identifier.name.value}\``
1024 + : null;
1025 const hoistedAccess = context.hoistedContextDeclarations.get(
1026 effect.value.identifier.declarationId,
1027 );
1028 const diagnostic = CompilerDiagnostic.create({
1029 severity: ErrorSeverity.InvalidReact,
1030 category: 'Cannot access variable before it is declared',
1032 - description: `${description} is accessed before it is declared, which prevents the earlier access from updating when this value changes over time`,
1031 + description: `${variable ?? 'This variable'} is accessed before it is declared, which prevents the earlier access from updating when this value changes over time.`,
1032 });
1033 if (hoistedAccess != null && hoistedAccess.loc != effect.value.loc) {
1034 diagnostic.withDetail({
1035 kind: 'error',
1036 loc: hoistedAccess.loc,
1038 - message: 'Variable accessed before it is declared',
1037 + message: `${variable ?? 'variable'} accessed before it is declared`,
1038 });
1039 }
1040 diagnostic.withDetail({
1041 kind: 'error',
1042 loc: effect.value.loc,
1044 - message: 'The variable is declared here',
1043 + message: `${variable ?? 'variable'} is declared here`,
1044 });
1045
1046 applyEffect(
@@ -1061,11 +1060,11 @@ function applyEffect(
1060 reason: value.reason,
1061 context: new Set(),
1062 });
1064 - const message =
1063 + const variable =
1064 effect.value.identifier.name !== null &&
1065 effect.value.identifier.name.kind === 'named'
1067 - ? `\`${effect.value.identifier.name.value}\` cannot be modified`
1068 - : 'This value cannot be modified';
1066 + ? `\`${effect.value.identifier.name.value}\``
1067 + : 'value';
1068 applyEffect(
1069 context,
1070 state,
@@ -1078,11 +1077,11 @@ function applyEffect(
1077 error: CompilerDiagnostic.create({
1078 severity: ErrorSeverity.InvalidReact,
1079 category: 'This value cannot be modified',
1081 - description: reason,
1080 + description: `${reason}.`,
1081 }).withDetail({
1082 kind: 'error',
1083 loc: effect.value.loc,
1085 - message,
1084 + message: `${variable} cannot be modified`,
1085 }),
1086 },
1087 initialized,
@@ -2002,6 +2001,7 @@ function computeSignatureForInstruction(
2001 break;
2002 }
2003 case 'StoreGlobal': {
2004 + const variable = `\`${value.name}\``;
2005 effects.push({
2006 kind: 'MutateGlobal',
2007 place: value.value,
@@ -2009,13 +2009,11 @@ function computeSignatureForInstruction(
2009 severity: ErrorSeverity.InvalidReact,
2010 category:
2011 'Cannot reassign variables declared outside of the component/hook',
2012 - description:
2013 - 'Reassigning a variable declared outside of the component/hook is a form of side effect, which can cause unpredictable behavior depending on when the component happens to re-render. If this variable is used in rendering, use useState instead. Otherwise, consider updating it in an effect (https://react.dev/reference/rules/components-and-hooks-must-be-pure#side-effects-must-run-outside-of-render)',
2014 - suggestions: null,
2012 + description: `Variable ${variable} is declared outside of the component/hook. Reassigning this value during render is a form of side effect, which can cause unpredictable behavior depending on when the component happens to re-render. If this variable is used in rendering, use useState instead. Otherwise, consider updating it in an effect. (https://react.dev/reference/rules/components-and-hooks-must-be-pure#side-effects-must-run-outside-of-render)`,
2013 }).withDetail({
2014 kind: 'error',
2015 loc: instr.loc,
2018 - message: 'Cannot reassign variable',
2016 + message: `${variable} cannot be reassigned`,
2017 }),
2018 });
2019 effects.push({kind: 'Assign', from: value.value, into: lvalue});
@@ -2114,7 +2112,6 @@ function computeEffectsForLegacySignature(
2112 ? `\`${signature.canonicalName}\` is an impure function. `
2113 : '') +
2114 'Calling an impure function can produce unstable results that update unpredictably when the component happens to re-render. (https://react.dev/reference/rules/components-and-hooks-must-be-pure#components-and-hooks-must-be-idempotent)',
2117 - suggestions: null,
2115 }).withDetail({
2116 kind: 'error',
2117 loc,
compiler/packages/babel-plugin-react-compiler/src/Validation/ValidateLocalsNotReassignedAfterRender.ts
+27 -13
@@ -29,15 +29,20 @@ export function validateLocalsNotReassignedAfterRender(fn: HIRFunction): void {
29 );
30 if (reassignment !== null) {
31 const errors = new CompilerError();
32 + const variable =
33 + reassignment.identifier.name != null &&
34 + reassignment.identifier.name.kind === 'named'
35 + ? `\`${reassignment.identifier.name.value}\``
36 + : 'variable';
37 errors.pushDiagnostic(
38 CompilerDiagnostic.create({
39 severity: ErrorSeverity.InvalidReact,
35 - category: 'Cannot reassign a variable after render completes',
36 - description: `Reassigning ${reassignment.identifier.name != null && reassignment.identifier.name.kind === 'named' ? `variable \`${reassignment.identifier.name.value}\`` : 'a variable'} after render has completed can cause inconsistent behavior on subsequent renders. Consider using state instead`,
40 + category: 'Cannot reassign variable after render completes',
41 + description: `Reassigning ${variable} after render has completed can cause inconsistent behavior on subsequent renders. Consider using state instead.`,
42 }).withDetail({
43 kind: 'error',
44 loc: reassignment.loc,
40 - message: 'Cannot reassign variable after render completes',
45 + message: `Cannot reassign ${variable} after render completes`,
46 }),
47 );
48 throw errors;
@@ -78,16 +83,25 @@ function getContextReassignment(
83 // if the function or its depends reassign, propagate that fact on the lvalue
84 if (reassignment !== null) {
85 if (isAsync || value.loweredFunc.func.async) {
81 - CompilerError.throwInvalidReact({
82 - reason:
83 - 'Reassigning a variable in an async function can cause inconsistent behavior on subsequent renders. Consider using state instead',
84 - description:
85 - reassignment.identifier.name !== null &&
86 - reassignment.identifier.name.kind === 'named'
87 - ? `Variable \`${reassignment.identifier.name.value}\` cannot be reassigned after render`
88 - : '',
89 - loc: reassignment.loc,
90 - });
86 + const errors = new CompilerError();
87 + const variable =
88 + reassignment.identifier.name !== null &&
89 + reassignment.identifier.name.kind === 'named'
90 + ? `\`${reassignment.identifier.name.value}\``
91 + : 'variable';
92 + errors.pushDiagnostic(
93 + CompilerDiagnostic.create({
94 + severity: ErrorSeverity.InvalidReact,
95 + category: 'Cannot reassign variable in async function',
96 + description:
97 + 'Reassigning a variable in an async function can cause inconsistent behavior on subsequent renders. Consider using state instead',
98 + }).withDetail({
99 + kind: 'error',
100 + loc: reassignment.loc,
101 + message: `Cannot reassign ${variable}`,
102 + }),
103 + );
104 + throw errors;
105 }
106 reassigningFunctions.set(lvalue.identifier.id, reassignment);
107 }
compiler/packages/babel-plugin-react-compiler/src/Validation/ValidateNoFreezingKnownMutableFunctions.ts
+10 -4
@@ -57,22 +57,28 @@ export function validateNoFreezingKnownMutableFunctions(
57 if (operand.effect === Effect.Freeze) {
58 const effect = contextMutationEffects.get(operand.identifier.id);
59 if (effect != null) {
60 + const place = [...effect.places][0];
61 + const variable =
62 + place != null &&
63 + place.identifier.name != null &&
64 + place.identifier.name.kind === 'named'
65 + ? `\`${place.identifier.name.value}\``
66 + : 'a local variable';
67 errors.pushDiagnostic(
68 CompilerDiagnostic.create({
69 severity: ErrorSeverity.InvalidReact,
70 category: 'Cannot modify local variables after render completes',
64 - description: `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`,
71 + description: `This argument is a function which may reassign or mutate ${variable} after render, which can cause inconsistent behavior on subsequent renders. Consider using state instead.`,
72 })
73 .withDetail({
74 kind: 'error',
75 loc: operand.loc,
69 - message:
70 - 'This function may (indirectly) reassign or modify local variables after render',
76 + message: `This function may (indirectly) reassign or modify ${variable} after render`,
77 })
78 .withDetail({
79 kind: 'error',
80 loc: effect.loc,
75 - message: 'This modifies a local variable',
81 + message: `This modifies ${variable}`,
82 }),
83 );
84 }
compiler/packages/babel-plugin-react-compiler/src/Validation/ValidateStaticComponents.ts
+22 -15
@@ -5,7 +5,11 @@
5 * LICENSE file in the root directory of this source tree.
6 */
7
8 -import {CompilerError, ErrorSeverity} from '../CompilerError';
8 +import {
9 + CompilerDiagnostic,
10 + CompilerError,
11 + ErrorSeverity,
12 +} from '../CompilerError';
13 import {HIRFunction, IdentifierId, SourceLocation} from '../HIR';
14 import {Result} from '../Utils/Result';
15
@@ -59,20 +63,23 @@ export function validateStaticComponents(
63 value.tag.identifier.id,
64 );
65 if (location != null) {
62 - error.push({
63 - reason: `Components created during render will reset their state each time they are created. Declare components outside of render. `,
64 - severity: ErrorSeverity.InvalidReact,
65 - loc: value.tag.loc,
66 - description: null,
67 - suggestions: null,
68 - });
69 - error.push({
70 - reason: `The component may be created during render`,
71 - severity: ErrorSeverity.InvalidReact,
72 - loc: location,
73 - description: null,
74 - suggestions: null,
75 - });
66 + error.pushDiagnostic(
67 + CompilerDiagnostic.create({
68 + severity: ErrorSeverity.InvalidReact,
69 + category: 'Cannot create components during render',
70 + description: `Components created during render will reset their state each time they are created. Declare components outside of render. `,
71 + })
72 + .withDetail({
73 + kind: 'error',
74 + loc: value.tag.loc,
75 + message: 'This component is created during render',
76 + })
77 + .withDetail({
78 + kind: 'error',
79 + loc: location,
80 + message: 'The component is created during render here',
81 + }),
82 + );
83 }
84 }
85 }
compiler/packages/babel-plugin-react-compiler/src/Validation/ValidateUseMemo.ts
+3 -3
@@ -82,7 +82,7 @@ export function validateUseMemo(fn: HIRFunction): Result<void, CompilerError> {
82 }).withDetail({
83 kind: 'error',
84 loc,
85 - message: '',
85 + message: 'Callbacks with parameters are not supported',
86 }),
87 );
88 }
@@ -92,9 +92,9 @@ export function validateUseMemo(fn: HIRFunction): Result<void, CompilerError> {
92 CompilerDiagnostic.create({
93 severity: ErrorSeverity.InvalidReact,
94 category:
95 - 'useMemo callbacks may not be async or generator functions',
95 + 'useMemo() callbacks may not be async or generator functions',
96 description:
97 - 'useMemo() callbacks are called once and must synchronously return a value',
97 + 'useMemo() callbacks are called once and must synchronously return a value.',
98 suggestions: null,
99 }).withDetail({
100 kind: 'error',
compiler/packages/babel-plugin-react-compiler/src/__tests__/Logger-test.ts
+2 -1
@@ -58,7 +58,8 @@ it('logs failed compilation', () => {
58
59 expect(event.detail.severity).toEqual('InvalidReact');
60 //@ts-ignore
61 - const {start, end, identifierName} = event.detail.loc as t.SourceLocation;
61 + const {start, end, identifierName} =
62 + event.detail.primaryLocation() as t.SourceLocation;
63 expect(start).toEqual({column: 28, index: 28, line: 1});
64 expect(end).toEqual({column: 33, index: 33, line: 1});
65 expect(identifierName).toEqual('props');
compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/error._todo.computed-lval-in-destructure.expect.md
+1 -2
@@ -16,6 +16,7 @@ function Component(props) {
16
17 ```
18 Found 1 error:
19 +
20 Todo: (BuildHIR::lowerAssignment) Handle computed properties in ObjectPattern
21
22 error._todo.computed-lval-in-destructure.ts:3:9
@@ -26,8 +27,6 @@ error._todo.computed-lval-in-destructure.ts:3:9
27 4 |
28 5 | return x;
29 6 | }
29 -
30 -
30 ```
31
32
\ No newline at end of file
compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/error.assign-global-in-component-tag-function.expect.md
+3 -2
@@ -16,15 +16,16 @@ function Component() {
16
17 ```
18 Found 1 error:
19 +
20 Error: Cannot reassign variables declared outside of the component/hook
21
21 -Reassigning a variable declared outside of the component/hook is a form of side effect, which can cause unpredictable behavior depending on when the component happens to re-render. If this variable is used in rendering, use useState instead. Otherwise, consider updating it in an effect (https://react.dev/reference/rules/components-and-hooks-must-be-pure#side-effects-must-run-outside-of-render)
22 +Variable `someGlobal` is declared outside of the component/hook. Reassigning this value during render is a form of side effect, which can cause unpredictable behavior depending on when the component happens to re-render. If this variable is used in rendering, use useState instead. Otherwise, consider updating it in an effect. (https://react.dev/reference/rules/components-and-hooks-must-be-pure#side-effects-must-run-outside-of-render)
23
24 error.assign-global-in-component-tag-function.ts:3:4
25 1 | function Component() {
26 2 | const Foo = () => {
27 > 3 | someGlobal = true;
27 - | ^^^^^^^^^^ Cannot reassign variable
28 + | ^^^^^^^^^^ `someGlobal` cannot be reassigned
29 4 | };
30 5 | return <Foo />;
31 6 | }
compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/error.assign-global-in-jsx-children.expect.md
+3 -2
@@ -19,15 +19,16 @@ function Component() {
19
20 ```
21 Found 1 error:
22 +
23 Error: Cannot reassign variables declared outside of the component/hook
24
24 -Reassigning a variable declared outside of the component/hook is a form of side effect, which can cause unpredictable behavior depending on when the component happens to re-render. If this variable is used in rendering, use useState instead. Otherwise, consider updating it in an effect (https://react.dev/reference/rules/components-and-hooks-must-be-pure#side-effects-must-run-outside-of-render)
25 +Variable `someGlobal` is declared outside of the component/hook. Reassigning this value during render is a form of side effect, which can cause unpredictable behavior depending on when the component happens to re-render. If this variable is used in rendering, use useState instead. Otherwise, consider updating it in an effect. (https://react.dev/reference/rules/components-and-hooks-must-be-pure#side-effects-must-run-outside-of-render)
26
27 error.assign-global-in-jsx-children.ts:3:4
28 1 | function Component() {
29 2 | const foo = () => {
30 > 3 | someGlobal = true;
30 - | ^^^^^^^^^^ Cannot reassign variable
31 + | ^^^^^^^^^^ `someGlobal` cannot be reassigned
32 4 | };
33 5 | // Children are generally access/called during render, so
34 6 | // modifying a global in a children function is almost
compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/error.assign-global-in-jsx-spread-attribute.expect.md
+1 -2
@@ -17,6 +17,7 @@ function Component() {
17
18 ```
19 Found 1 error:
20 +
21 Error: 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)
22
23 error.assign-global-in-jsx-spread-attribute.ts:4:4
@@ -27,8 +28,6 @@ error.assign-global-in-jsx-spread-attribute.ts:4:4
28 5 | };
29 6 | return <div {...foo} />;
30 7 | }
30 -
31 -
31 ```
32
33
\ No newline at end of file
compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/error.bailout-on-flow-suppression.expect.md
+1 -2
@@ -17,6 +17,7 @@ function Foo(props) {
17
18 ```
19 Found 1 error:
20 +
21 Error: 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
22
23 $FlowFixMe[react-rule-hook].
@@ -29,8 +30,6 @@ error.bailout-on-flow-suppression.ts:4:2
30 5 | useX();
31 6 | return null;
32 7 | }
32 -
33 -
33 ```
34
35
\ No newline at end of file
compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/error.bailout-on-suppression-of-custom-rule.expect.md
+1 -3
@@ -20,6 +20,7 @@ function lowercasecomponent() {
20
21 ```
22 Found 2 errors:
23 +
24 Error: 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
25
26 eslint-disable my-app/react-rule.
@@ -33,7 +34,6 @@ error.bailout-on-suppression-of-custom-rule.ts:3:0
34 5 | 'use forget';
35 6 | const x = [];
36
36 -
37 Error: 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
38
39 eslint-disable-next-line my-app/react-rule.
@@ -46,8 +46,6 @@ error.bailout-on-suppression-of-custom-rule.ts:7:2
46 8 | return <div>{x}</div>;
47 9 | }
48 10 | /* eslint-enable my-app/react-rule */
49 -
50 -
49 ```
50
51
\ No newline at end of file
compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/error.bug-old-inference-false-positive-ref-validation-in-use-effect.expect.md
+3 -2
@@ -37,9 +37,10 @@ function Component() {
37
38 ```
39 Found 1 error:
40 +
41 Error: Cannot modify local variables after render completes
42
42 -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
43 +This argument is a function which may reassign or mutate a local variable after render, which can cause inconsistent behavior on subsequent renders. Consider using state instead.
44
45 error.bug-old-inference-false-positive-ref-validation-in-use-effect.ts:20:12
46 18 | );
@@ -53,7 +54,7 @@ error.bug-old-inference-false-positive-ref-validation-in-use-effect.ts:20:12
54 > 23 | }
55 | ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^
56 > 24 | }, [update]);
56 - | ^^^^ This function may (indirectly) reassign or modify local variables after render
57 + | ^^^^ This function may (indirectly) reassign or modify a local variable after render
58 25 |
59 26 | return 'ok';
60 27 | }
compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/error.call-args-destructuring-asignment-complex.expect.md
+1 -2
@@ -15,6 +15,7 @@ function Component(props) {
15
16 ```
17 Found 1 error:
18 +
19 Invariant: Const declaration cannot be referenced as an expression
20
21 error.call-args-destructuring-asignment-complex.ts:3:9
@@ -25,8 +26,6 @@ error.call-args-destructuring-asignment-complex.ts:3:9
26 4 | return x;
27 5 | }
28 6 |
28 -
29 -
29 ```
30
31
\ No newline at end of file
compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/error.capitalized-function-call-aliased.expect.md
+1 -2
@@ -15,6 +15,7 @@ function Foo() {
15
16 ```
17 Found 1 error:
18 +
19 Error: 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
20
21 Bar may be a component..
@@ -26,8 +27,6 @@ error.capitalized-function-call-aliased.ts:4:2
27 | ^^^ 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
28 5 | }
29 6 |
29 -
30 -
30 ```
31
32
\ No newline at end of file
compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/error.capitalized-function-call.expect.md
+1 -2
@@ -16,6 +16,7 @@ function Component() {
16
17 ```
18 Found 1 error:
19 +
20 Error: 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
21
22 SomeFunc may be a component..
@@ -28,8 +29,6 @@ error.capitalized-function-call.ts:3:12
29 4 |
30 5 | return x;
31 6 | }
31 -
32 -
32 ```
33
34
\ No newline at end of file
compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/error.capitalized-method-call.expect.md
+1 -2
@@ -16,6 +16,7 @@ function Component() {
16
17 ```
18 Found 1 error:
19 +
20 Error: 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
21
22 SomeFunc may be a component..
@@ -28,8 +29,6 @@ error.capitalized-method-call.ts:3:12
29 4 |
30 5 | return x;
31 6 | }
31 -
32 -
32 ```
33
34
\ No newline at end of file
compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/error.capture-ref-for-mutation.expect.md
+1 -5
@@ -33,6 +33,7 @@ export const FIXTURE_ENTRYPOINT = {
33
34 ```
35 Found 4 errors:
36 +
37 Error: This function accesses a ref value (the `current` property), which may not be accessed during render. (https://react.dev/reference/react/useRef)
38
39 error.capture-ref-for-mutation.ts:12:13
@@ -44,7 +45,6 @@ error.capture-ref-for-mutation.ts:12:13
45 14 | const moveRight = {
46 15 | handler: handleKey('right')(),
47
47 -
48 Error: Ref values (the `current` property) may not be accessed during render. (https://react.dev/reference/react/useRef)
49
50 error.capture-ref-for-mutation.ts:12:13
@@ -56,7 +56,6 @@ error.capture-ref-for-mutation.ts:12:13
56 14 | const moveRight = {
57 15 | handler: handleKey('right')(),
58
59 -
59 Error: This function accesses a ref value (the `current` property), which may not be accessed during render. (https://react.dev/reference/react/useRef)
60
61 error.capture-ref-for-mutation.ts:15:13
@@ -68,7 +67,6 @@ error.capture-ref-for-mutation.ts:15:13
67 17 | return [moveLeft, moveRight];
68 18 | }
69
71 -
70 Error: Ref values (the `current` property) may not be accessed during render. (https://react.dev/reference/react/useRef)
71
72 error.capture-ref-for-mutation.ts:15:13
@@ -79,8 +77,6 @@ error.capture-ref-for-mutation.ts:15:13
77 16 | };
78 17 | return [moveLeft, moveRight];
79 18 | }
82 -
83 -
80 ```
81
82
\ No newline at end of file
compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/error.conditional-hook-unknown-hook-react-namespace.expect.md
+1 -2
@@ -17,6 +17,7 @@ function Component(props) {
17
18 ```
19 Found 1 error:
20 +
21 Error: 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)
22
23 error.conditional-hook-unknown-hook-react-namespace.ts:4:8
@@ -27,8 +28,6 @@ error.conditional-hook-unknown-hook-react-namespace.ts:4:8
28 5 | }
29 6 | return x;
30 7 | }
30 -
31 -
31 ```
32
33
\ No newline at end of file
compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/error.conditional-hooks-as-method-call.expect.md
+1 -2
@@ -17,6 +17,7 @@ function Component(props) {
17
18 ```
19 Found 1 error:
20 +
21 Error: 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)
22
23 error.conditional-hooks-as-method-call.ts:4:8
@@ -27,8 +28,6 @@ error.conditional-hooks-as-method-call.ts:4:8
28 5 | }
29 6 | return x;
30 7 | }
30 -
31 -
31 ```
32
33
\ No newline at end of file
compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/error.context-variable-only-chained-assign.expect.md
+4 -3
@@ -29,15 +29,16 @@ export const FIXTURE_ENTRYPOINT = {
29
30 ```
31 Found 1 error:
32 -Error: Cannot reassign a variable after render completes
32
34 -Reassigning variable `x` after render has completed can cause inconsistent behavior on subsequent renders. Consider using state instead
33 +Error: Cannot reassign variable after render completes
34 +
35 +Reassigning `x` after render has completed can cause inconsistent behavior on subsequent renders. Consider using state instead.
36
37 error.context-variable-only-chained-assign.ts:10:19
38 8 | };
39 9 | const fn2 = () => {
40 > 10 | const copy2 = (x = 4);
40 - | ^ Cannot reassign variable after render completes
41 + | ^ Cannot reassign `x` after render completes
42 11 | return [invoke(fn1), copy2, identity(copy2)];
43 12 | };
44 13 | return invoke(fn2);
compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/error.declare-reassign-variable-in-function-declaration.expect.md
+4 -3
@@ -18,15 +18,16 @@ function Component() {
18
19 ```
20 Found 1 error:
21 -Error: Cannot reassign a variable after render completes
21
23 -Reassigning variable `x` after render has completed can cause inconsistent behavior on subsequent renders. Consider using state instead
22 +Error: Cannot reassign variable after render completes
23 +
24 +Reassigning `x` after render has completed can cause inconsistent behavior on subsequent renders. Consider using state instead.
25
26 error.declare-reassign-variable-in-function-declaration.ts:4:4
27 2 | let x = null;
28 3 | function foo() {
29 > 4 | x = 9;
29 - | ^ Cannot reassign variable after render completes
30 + | ^ Cannot reassign `x` after render completes
31 5 | }
32 6 | const y = bar(foo);
33 7 | return <Child y={y} />;
compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/error.default-param-accesses-local.expect.md
+1 -2
@@ -23,6 +23,7 @@ export const FIXTURE_ENTRYPOINT = {
23
24 ```
25 Found 1 error:
26 +
27 Todo: (BuildHIR::node.lowerReorderableExpression) Expression type `ArrowFunctionExpression` cannot be safely reordered
28
29 error.default-param-accesses-local.ts:3:6
@@ -37,8 +38,6 @@ error.default-param-accesses-local.ts:3:6
38 6 | ) {
39 7 | return y();
40 8 | }
40 -
41 -
41 ```
42
43
\ No newline at end of file
compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/error.dont-hoist-inline-reference.expect.md
+1 -2
@@ -20,6 +20,7 @@ export const FIXTURE_ENTRYPOINT = {
20
21 ```
22 Found 1 error:
23 +
24 Todo: [hoisting] EnterSSA: Expected identifier to be defined before being used
25
26 Identifier x$1 is undefined.
@@ -32,8 +33,6 @@ error.dont-hoist-inline-reference.ts:3:2
33 4 | return x;
34 5 | }
35 6 |
35 -
36 -
36 ```
37
38
\ No newline at end of file
compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/error.emit-freeze-conflicting-global.expect.md
+1 -2
@@ -16,6 +16,7 @@ function useFoo(props) {
16
17 ```
18 Found 1 error:
19 +
20 Todo: Encountered conflicting global in generated program
21
22 Conflict from local binding __DEV__.
@@ -28,8 +29,6 @@ error.emit-freeze-conflicting-global.ts:3:8
29 4 | console.log(__DEV__);
30 5 | return foo(props.x);
31 6 | }
31 -
32 -
32 ```
33
34
\ No newline at end of file
compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/error.function-expression-references-variable-its-assigned-to.expect.md
+4 -3
@@ -16,15 +16,16 @@ function Component() {
16
17 ```
18 Found 1 error:
19 -Error: Cannot reassign a variable after render completes
19
21 -Reassigning variable `callback` after render has completed can cause inconsistent behavior on subsequent renders. Consider using state instead
20 +Error: Cannot reassign variable after render completes
21 +
22 +Reassigning `callback` after render has completed can cause inconsistent behavior on subsequent renders. Consider using state instead.
23
24 error.function-expression-references-variable-its-assigned-to.ts:3:4
25 1 | function Component() {
26 2 | let callback = () => {
27 > 3 | callback = null;
27 - | ^^^^^^^^ Cannot reassign variable after render completes
28 + | ^^^^^^^^ Cannot reassign `callback` after render completes
29 4 | };
30 5 | return <div onClick={callback} />;
31 6 | }
compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/error.hoist-optional-member-expression-with-conditional-optional.expect.md
+1
@@ -25,6 +25,7 @@ function Component(props) {
25
26 ```
27 Found 1 error:
28 +
29 Memoization: Compilation skipped because existing memoization could not be preserved
30
31 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.
compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/error.hoist-optional-member-expression-with-conditional.expect.md
+1
@@ -25,6 +25,7 @@ function Component(props) {
25
26 ```
27 Found 1 error:
28 +
29 Memoization: Compilation skipped because existing memoization could not be preserved
30
31 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.
compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/error.hoisting-simple-function-declaration.expect.md
+1 -2
@@ -25,6 +25,7 @@ export const FIXTURE_ENTRYPOINT = {
25
26 ```
27 Found 1 error:
28 +
29 Todo: Support functions with unreachable code that may contain hoisted declarations
30
31 error.hoisting-simple-function-declaration.ts:6:2
@@ -39,8 +40,6 @@ error.hoisting-simple-function-declaration.ts:6:2
40 9 | }
41 10 |
42 11 | export const FIXTURE_ENTRYPOINT = {
42 -
43 -
43 ```
44
45
\ No newline at end of file
compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/error.hook-call-freezes-captured-identifier.expect.md
+3 -2
@@ -30,15 +30,16 @@ export const FIXTURE_ENTRYPOINT = {
30
31 ```
32 Found 1 error:
33 +
34 Error: This value cannot be modified
35
35 -Modifying a value previously passed as an argument to a hook is not allowed. Consider moving the modification before calling the hook
36 +Modifying a value previously passed as an argument to a hook is not allowed. Consider moving the modification before calling the hook.
37
38 error.hook-call-freezes-captured-identifier.ts:13:2
39 11 | });
40 12 |
41 > 13 | x.value += count;
41 - | ^ This value cannot be modified
42 + | ^ value cannot be modified
43 14 | return <Stringify x={x} cb={cb} />;
44 15 | }
45 16 |
compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/error.hook-call-freezes-captured-memberexpr.expect.md
+3 -2
@@ -30,15 +30,16 @@ export const FIXTURE_ENTRYPOINT = {
30
31 ```
32 Found 1 error:
33 +
34 Error: This value cannot be modified
35
35 -Modifying a value previously passed as an argument to a hook is not allowed. Consider moving the modification before calling the hook
36 +Modifying a value previously passed as an argument to a hook is not allowed. Consider moving the modification before calling the hook.
37
38 error.hook-call-freezes-captured-memberexpr.ts:13:2
39 11 | });
40 12 |
41 > 13 | x.value += count;
41 - | ^ This value cannot be modified
42 + | ^ value cannot be modified
43 14 | return <Stringify x={x} cb={cb} />;
44 15 | }
45 16 |
compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/error.hook-property-load-local-hook.expect.md
+1 -3
@@ -24,6 +24,7 @@ export const FIXTURE_ENTRYPOINT = {
24
25 ```
26 Found 2 errors:
27 +
28 Error: 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
29
30 error.hook-property-load-local-hook.ts:7:12
@@ -35,7 +36,6 @@ error.hook-property-load-local-hook.ts:7:12
36 9 | }
37 10 |
38
38 -
39 Error: 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
40
41 error.hook-property-load-local-hook.ts:8:9
@@ -46,8 +46,6 @@ error.hook-property-load-local-hook.ts:8:9
46 9 | }
47 10 |
48 11 | export const FIXTURE_ENTRYPOINT = {
49 -
50 -
49 ```
50
51
\ No newline at end of file
compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/error.hook-ref-value.expect.md
+1 -3
@@ -21,6 +21,7 @@ export const FIXTURE_ENTRYPOINT = {
21
22 ```
23 Found 2 errors:
24 +
25 Error: Ref values (the `current` property) may not be accessed during render. (https://react.dev/reference/react/useRef)
26
27 error.hook-ref-value.ts:5:23
@@ -32,7 +33,6 @@ error.hook-ref-value.ts:5:23
33 7 |
34 8 | export const FIXTURE_ENTRYPOINT = {
35
35 -
36 Error: Ref values (the `current` property) may not be accessed during render. (https://react.dev/reference/react/useRef)
37
38 error.hook-ref-value.ts:5:23
@@ -43,8 +43,6 @@ error.hook-ref-value.ts:5:23
43 6 | }
44 7 |
45 8 | export const FIXTURE_ENTRYPOINT = {
46 -
47 -
46 ```
47
48
\ No newline at end of file
compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/error.invalid-ReactUseMemo-async-callback.expect.md
+3 -2
@@ -16,9 +16,10 @@ function component(a, b) {
16
17 ```
18 Found 1 error:
19 -Error: useMemo callbacks may not be async or generator functions
19
21 -useMemo() callbacks are called once and must synchronously return a value
20 +Error: useMemo() callbacks may not be async or generator functions
21 +
22 +useMemo() callbacks are called once and must synchronously return a value.
23
24 error.invalid-ReactUseMemo-async-callback.ts:2:24
25 1 | function component(a, b) {
compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/error.invalid-access-ref-during-render.expect.md
+1 -2
@@ -16,6 +16,7 @@ function Component(props) {
16
17 ```
18 Found 1 error:
19 +
20 Error: Ref values (the `current` property) may not be accessed during render. (https://react.dev/reference/react/useRef)
21
22 error.invalid-access-ref-during-render.ts:4:16
@@ -26,8 +27,6 @@ error.invalid-access-ref-during-render.ts:4:16
27 5 | return value;
28 6 | }
29 7 |
29 -
30 -
30 ```
31
32
\ No newline at end of file
compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/error.invalid-aliased-ref-in-callback-invoked-during-render-.expect.md
+1 -2
@@ -20,6 +20,7 @@ function Component(props) {
20
21 ```
22 Found 1 error:
23 +
24 Error: Ref values (the `current` property) may not be accessed during render. (https://react.dev/reference/react/useRef)
25
26 error.invalid-aliased-ref-in-callback-invoked-during-render-.ts:9:33
@@ -29,8 +30,6 @@ error.invalid-aliased-ref-in-callback-invoked-during-render-.ts:9:33
30 | ^^^^^^^^^^^^^^^^^^^^^^^^ Ref values (the `current` property) may not be accessed during render. (https://react.dev/reference/react/useRef)
31 10 | }
32 11 |
32 -
33 -
33 ```
34
35
\ No newline at end of file
compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/error.invalid-array-push-frozen.expect.md
+3 -2
@@ -16,15 +16,16 @@ function Component(props) {
16
17 ```
18 Found 1 error:
19 +
20 Error: This value cannot be modified
21
21 -Modifying a value used previously in JSX is not allowed. Consider moving the modification before the JSX
22 +Modifying a value used previously in JSX is not allowed. Consider moving the modification before the JSX.
23
24 error.invalid-array-push-frozen.ts:4:2
25 2 | const x = [];
26 3 | <div>{x}</div>;
27 > 4 | x.push(props.value);
27 - | ^ This value cannot be modified
28 + | ^ value cannot be modified
29 5 | return x;
30 6 | }
31 7 |
compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/error.invalid-assign-hook-to-local.expect.md
+1 -2
@@ -15,6 +15,7 @@ function Component(props) {
15
16 ```
17 Found 1 error:
18 +
19 Error: 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
20
21 error.invalid-assign-hook-to-local.ts:2:12
@@ -24,8 +25,6 @@ error.invalid-assign-hook-to-local.ts:2:12
25 3 | const state = x(null);
26 4 | return state[0];
27 5 | }
27 -
28 -
28 ```
29
30
\ No newline at end of file
compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/error.invalid-computed-store-to-frozen-value.expect.md
+3 -2
@@ -17,15 +17,16 @@ function Component(props) {
17
18 ```
19 Found 1 error:
20 +
21 Error: This value cannot be modified
22
22 -Modifying a value used previously in JSX is not allowed. Consider moving the modification before the JSX
23 +Modifying a value used previously in JSX is not allowed. Consider moving the modification before the JSX.
24
25 error.invalid-computed-store-to-frozen-value.ts:5:2
26 3 | // freeze
27 4 | <div>{x}</div>;
28 > 5 | x[0] = true;
28 - | ^ This value cannot be modified
29 + | ^ value cannot be modified
30 6 | return x;
31 7 | }
32 8 |
compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/error.invalid-conditional-call-aliased-hook-import.expect.md
+1 -2
@@ -19,6 +19,7 @@ function Component(props) {
19
20 ```
21 Found 1 error:
22 +
23 Error: 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)
24
25 error.invalid-conditional-call-aliased-hook-import.ts:6:11
@@ -29,8 +30,6 @@ error.invalid-conditional-call-aliased-hook-import.ts:6:11
30 7 | }
31 8 | return data;
32 9 | }
32 -
33 -
33 ```
34
35
\ No newline at end of file
compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/error.invalid-conditional-call-aliased-react-hook.expect.md
+1 -2
@@ -19,6 +19,7 @@ function Component(props) {
19
20 ```
21 Found 1 error:
22 +
23 Error: 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)
24
25 error.invalid-conditional-call-aliased-react-hook.ts:6:10
@@ -29,8 +30,6 @@ error.invalid-conditional-call-aliased-react-hook.ts:6:10
30 7 | }
31 8 | return s;
32 9 | }
32 -
33 -
33 ```
34
35
\ No newline at end of file
compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/error.invalid-conditional-call-non-hook-imported-as-hook.expect.md
+1 -2
@@ -19,6 +19,7 @@ function Component(props) {
19
20 ```
21 Found 1 error:
22 +
23 Error: 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)
24
25 error.invalid-conditional-call-non-hook-imported-as-hook.ts:6:11
@@ -29,8 +30,6 @@ error.invalid-conditional-call-non-hook-imported-as-hook.ts:6:11
30 7 | }
31 8 | return data;
32 9 | }
32 -
33 -
33 ```
34
35
\ No newline at end of file
compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/error.invalid-conditional-setState-in-useMemo.expect.md
+2
@@ -23,6 +23,7 @@ function Component({item, cond}) {
23
24 ```
25 Found 2 errors:
26 +
27 Error: Calling setState from useMemo may trigger an infinite loop
28
29 Each time the memo callback is evaluated it will change state. This can cause a memoization dependency to change, running the memo function again and causing an infinite loop. Instead of setting state in useMemo(), prefer deriving the value during render. (https://react.dev/reference/react/useState)
@@ -35,6 +36,7 @@ error.invalid-conditional-setState-in-useMemo.ts:7:6
36 8 | setState(0);
37 9 | }
38 10 | }, [cond, key, init]);
39 +
40 Error: Calling setState from useMemo may trigger an infinite loop
41
42 Each time the memo callback is evaluated it will change state. This can cause a memoization dependency to change, running the memo function again and causing an infinite loop. Instead of setting state in useMemo(), prefer deriving the value during render. (https://react.dev/reference/react/useState)
compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/error.invalid-delete-computed-property-of-frozen-value.expect.md
+3 -2
@@ -17,15 +17,16 @@ function Component(props) {
17
18 ```
19 Found 1 error:
20 +
21 Error: This value cannot be modified
22
22 -Modifying a value used previously in JSX is not allowed. Consider moving the modification before the JSX
23 +Modifying a value used previously in JSX is not allowed. Consider moving the modification before the JSX.
24
25 error.invalid-delete-computed-property-of-frozen-value.ts:5:9
26 3 | // freeze
27 4 | <div>{x}</div>;
28 > 5 | delete x[y];
28 - | ^ This value cannot be modified
29 + | ^ value cannot be modified
30 6 | return x;
31 7 | }
32 8 |
compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/error.invalid-delete-property-of-frozen-value.expect.md
+3 -2
@@ -17,15 +17,16 @@ function Component(props) {
17
18 ```
19 Found 1 error:
20 +
21 Error: This value cannot be modified
22
22 -Modifying a value used previously in JSX is not allowed. Consider moving the modification before the JSX
23 +Modifying a value used previously in JSX is not allowed. Consider moving the modification before the JSX.
24
25 error.invalid-delete-property-of-frozen-value.ts:5:9
26 3 | // freeze
27 4 | <div>{x}</div>;
28 > 5 | delete x.y;
28 - | ^ This value cannot be modified
29 + | ^ value cannot be modified
30 6 | return x;
31 7 | }
32 8 |
compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/error.invalid-destructure-assignment-to-global.expect.md
+3 -2
@@ -14,14 +14,15 @@ function useFoo(props) {
14
15 ```
16 Found 1 error:
17 +
18 Error: Cannot reassign variables declared outside of the component/hook
19
19 -Reassigning a variable declared outside of the component/hook is a form of side effect, which can cause unpredictable behavior depending on when the component happens to re-render. If this variable is used in rendering, use useState instead. Otherwise, consider updating it in an effect (https://react.dev/reference/rules/components-and-hooks-must-be-pure#side-effects-must-run-outside-of-render)
20 +Variable `x` is declared outside of the component/hook. Reassigning this value during render is a form of side effect, which can cause unpredictable behavior depending on when the component happens to re-render. If this variable is used in rendering, use useState instead. Otherwise, consider updating it in an effect. (https://react.dev/reference/rules/components-and-hooks-must-be-pure#side-effects-must-run-outside-of-render)
21
22 error.invalid-destructure-assignment-to-global.ts:2:3
23 1 | function useFoo(props) {
24 > 2 | [x] = props;
24 - | ^ Cannot reassign variable
25 + | ^ `x` cannot be reassigned
26 3 | return {x};
27 4 | }
28 5 |
compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/error.invalid-destructure-to-local-global-variables.expect.md
+3 -2
@@ -16,15 +16,16 @@ function Component(props) {
16
17 ```
18 Found 1 error:
19 +
20 Error: Cannot reassign variables declared outside of the component/hook
21
21 -Reassigning a variable declared outside of the component/hook is a form of side effect, which can cause unpredictable behavior depending on when the component happens to re-render. If this variable is used in rendering, use useState instead. Otherwise, consider updating it in an effect (https://react.dev/reference/rules/components-and-hooks-must-be-pure#side-effects-must-run-outside-of-render)
22 +Variable `b` is declared outside of the component/hook. Reassigning this value during render is a form of side effect, which can cause unpredictable behavior depending on when the component happens to re-render. If this variable is used in rendering, use useState instead. Otherwise, consider updating it in an effect. (https://react.dev/reference/rules/components-and-hooks-must-be-pure#side-effects-must-run-outside-of-render)
23
24 error.invalid-destructure-to-local-global-variables.ts:3:6
25 1 | function Component(props) {
26 2 | let a;
27 > 3 | [a, b] = props.value;
27 - | ^ Cannot reassign variable
28 + | ^ `b` cannot be reassigned
29 4 |
30 5 | return [a, b];
31 6 | }
compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/error.invalid-disallow-mutating-ref-in-render.expect.md
+1 -2
@@ -17,6 +17,7 @@ function Component() {
17
18 ```
19 Found 1 error:
20 +
21 Error: Ref values (the `current` property) may not be accessed during render. (https://react.dev/reference/react/useRef)
22
23 error.invalid-disallow-mutating-ref-in-render.ts:4:2
@@ -27,8 +28,6 @@ error.invalid-disallow-mutating-ref-in-render.ts:4:2
28 5 |
29 6 | return <button ref={ref} />;
30 7 | }
30 -
31 -
31 ```
32
33
\ No newline at end of file
compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/error.invalid-disallow-mutating-refs-in-render-transitive.expect.md
+1 -3
@@ -22,6 +22,7 @@ function Component() {
22
23 ```
24 Found 2 errors:
25 +
26 Error: This function accesses a ref value (the `current` property), which may not be accessed during render. (https://react.dev/reference/react/useRef)
27
28 error.invalid-disallow-mutating-refs-in-render-transitive.ts:9:2
@@ -33,7 +34,6 @@ error.invalid-disallow-mutating-refs-in-render-transitive.ts:9:2
34 11 | return <button ref={ref} />;
35 12 | }
36
36 -
37 Error: Ref values (the `current` property) may not be accessed during render. (https://react.dev/reference/react/useRef)
38
39 error.invalid-disallow-mutating-refs-in-render-transitive.ts:9:2
@@ -44,8 +44,6 @@ error.invalid-disallow-mutating-refs-in-render-transitive.ts:9:2
44 10 |
45 11 | return <button ref={ref} />;
46 12 | }
47 -
48 -
47 ```
48
49
\ No newline at end of file
compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/error.invalid-eval-unsupported.expect.md
+1 -2
@@ -14,6 +14,7 @@ function Component(props) {
14
15 ```
16 Found 1 error:
17 +
18 Error: The 'eval' function is not supported
19
20 Eval is an anti-pattern in JavaScript, and the code executed cannot be evaluated by React Compiler.
@@ -25,8 +26,6 @@ error.invalid-eval-unsupported.ts:2:2
26 3 | return <div />;
27 4 | }
28 5 |
28 -
29 -
29 ```
30
31
\ No newline at end of file
compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/error.invalid-function-expression-mutates-immutable-value.expect.md
+2 -1
@@ -19,9 +19,10 @@ function Component(props) {
19
20 ```
21 Found 1 error:
22 +
23 Error: This value cannot be modified
24
24 -Modifying a value returned from 'useState()', which should not be modified directly. Use the setter function to update instead
25 +Modifying a value returned from 'useState()', which should not be modified directly. Use the setter function to update instead.
26
27 error.invalid-function-expression-mutates-immutable-value.ts:5:4
28 3 | const onChange = e => {
compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/error.invalid-global-reassignment-indirect.expect.md
+3 -2
@@ -36,15 +36,16 @@ export const FIXTURE_ENTRYPOINT = {
36
37 ```
38 Found 1 error:
39 +
40 Error: Cannot reassign variables declared outside of the component/hook
41
41 -Reassigning a variable declared outside of the component/hook is a form of side effect, which can cause unpredictable behavior depending on when the component happens to re-render. If this variable is used in rendering, use useState instead. Otherwise, consider updating it in an effect (https://react.dev/reference/rules/components-and-hooks-must-be-pure#side-effects-must-run-outside-of-render)
42 +Variable `someGlobal` is declared outside of the component/hook. Reassigning this value during render is a form of side effect, which can cause unpredictable behavior depending on when the component happens to re-render. If this variable is used in rendering, use useState instead. Otherwise, consider updating it in an effect. (https://react.dev/reference/rules/components-and-hooks-must-be-pure#side-effects-must-run-outside-of-render)
43
44 error.invalid-global-reassignment-indirect.ts:9:4
45 7 |
46 8 | const setGlobal = () => {
47 > 9 | someGlobal = true;
47 - | ^^^^^^^^^^ Cannot reassign variable
48 + | ^^^^^^^^^^ `someGlobal` cannot be reassigned
49 10 | };
50 11 | const indirectSetGlobal = () => {
51 12 | setGlobal();
compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/error.invalid-hoisting-setstate.expect.md
+4 -3
@@ -39,15 +39,16 @@ export const FIXTURE_ENTRYPOINT = {
39
40 ```
41 Found 1 error:
42 +
43 Error: Cannot access variable before it is declared
44
44 -Variable `setState` is accessed before it is declared, which prevents the earlier access from updating when this value changes over time
45 +`setState` is accessed before it is declared, which prevents the earlier access from updating when this value changes over time.
46
47 error.invalid-hoisting-setstate.ts:19:18
48 17 | * $2 = Function context=setState
49 18 | */
50 > 19 | useEffect(() => setState(2), []);
50 - | ^^^^^^^^ Variable accessed before it is declared
51 + | ^^^^^^^^ `setState` accessed before it is declared
52 20 |
53 21 | const [state, setState] = useState(0);
54 22 | return <Stringify state={state} />;
@@ -56,7 +57,7 @@ error.invalid-hoisting-setstate.ts:21:16
57 19 | useEffect(() => setState(2), []);
58 20 |
59 > 21 | const [state, setState] = useState(0);
59 - | ^^^^^^^^ The variable is declared here
60 + | ^^^^^^^^ `setState` is declared here
61 22 | return <Stringify state={state} />;
62 23 | }
63 24 |
compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/error.invalid-hook-function-argument-mutates-local-variable.expect.md
+4 -3
@@ -18,9 +18,10 @@ function useFoo() {
18
19 ```
20 Found 1 error:
21 +
22 Error: Cannot modify local variables after render completes
23
23 -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
24 +This argument is a function which may reassign or mutate `cache` after render, which can cause inconsistent behavior on subsequent renders. Consider using state instead.
25
26 error.invalid-hook-function-argument-mutates-local-variable.ts:5:10
27 3 | function useFoo() {
@@ -30,7 +31,7 @@ error.invalid-hook-function-argument-mutates-local-variable.ts:5:10
31 > 6 | cache.set('key', 'value');
32 | ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^
33 > 7 | });
33 - | ^^^^ This function may (indirectly) reassign or modify local variables after render
34 + | ^^^^ This function may (indirectly) reassign or modify `cache` after render
35 8 | }
36 9 |
37
@@ -38,7 +39,7 @@ error.invalid-hook-function-argument-mutates-local-variable.ts:6:4
39 4 | const cache = new Map();
40 5 | useHook(() => {
41 > 6 | cache.set('key', 'value');
41 - | ^^^^^ This modifies a local variable
42 + | ^^^^^ This modifies `cache`
43 7 | });
44 8 | }
45 9 |
compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/error.invalid-impure-functions-in-render.expect.md
+3
@@ -18,6 +18,7 @@ function Component() {
18
19 ```
20 Found 3 errors:
21 +
22 Error: Cannot call impure function during render
23
24 `Date.now` is an impure function. Calling an impure function can produce unstable results that update unpredictably when the component happens to re-render. (https://react.dev/reference/rules/components-and-hooks-must-be-pure#components-and-hooks-must-be-idempotent)
@@ -30,6 +31,7 @@ error.invalid-impure-functions-in-render.ts:4:15
31 5 | const now = performance.now();
32 6 | const rand = Math.random();
33 7 | return <Foo date={date} now={now} rand={rand} />;
34 +
35 Error: Cannot call impure function during render
36
37 `performance.now` is an impure function. Calling an impure function can produce unstable results that update unpredictably when the component happens to re-render. (https://react.dev/reference/rules/components-and-hooks-must-be-pure#components-and-hooks-must-be-idempotent)
@@ -42,6 +44,7 @@ error.invalid-impure-functions-in-render.ts:5:14
44 6 | const rand = Math.random();
45 7 | return <Foo date={date} now={now} rand={rand} />;
46 8 | }
47 +
48 Error: Cannot call impure function during render
49
50 `Math.random` is an impure function. Calling an impure function can produce unstable results that update unpredictably when the component happens to re-render. (https://react.dev/reference/rules/components-and-hooks-must-be-pure#components-and-hooks-must-be-idempotent)
compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/error.invalid-jsx-captures-context-variable.expect.md
+2 -1
@@ -51,9 +51,10 @@ export const FIXTURE_ENTRYPOINT = {
51
52 ```
53 Found 1 error:
54 +
55 Error: This value cannot be modified
56
56 -Modifying a value used previously in JSX is not allowed. Consider moving the modification before the JSX
57 +Modifying a value used previously in JSX is not allowed. Consider moving the modification before the JSX.
58
59 error.invalid-jsx-captures-context-variable.ts:22:2
60 20 | />
compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/error.invalid-mutate-after-aliased-freeze.expect.md
+3 -2
@@ -26,15 +26,16 @@ function Component(props) {
26
27 ```
28 Found 1 error:
29 +
30 Error: This value cannot be modified
31
31 -Modifying a value used previously in JSX is not allowed. Consider moving the modification before the JSX
32 +Modifying a value used previously in JSX is not allowed. Consider moving the modification before the JSX.
33
34 error.invalid-mutate-after-aliased-freeze.ts:13:2
35 11 | // y is MaybeFrozen at this point, since it may alias to x
36 12 | // (which is the above line freezes)
37 > 13 | y.push(props.p2);
37 - | ^ This value cannot be modified
38 + | ^ value cannot be modified
39 14 |
40 15 | return <Component x={x} y={y} />;
41 16 | }
compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/error.invalid-mutate-after-freeze.expect.md
+3 -2
@@ -20,15 +20,16 @@ function Component(props) {
20
21 ```
22 Found 1 error:
23 +
24 Error: This value cannot be modified
25
25 -Modifying a value used previously in JSX is not allowed. Consider moving the modification before the JSX
26 +Modifying a value used previously in JSX is not allowed. Consider moving the modification before the JSX.
27
28 error.invalid-mutate-after-freeze.ts:7:2
29 5 |
30 6 | // x is Frozen at this point
31 > 7 | x.push(props.p2);
31 - | ^ This value cannot be modified
32 + | ^ value cannot be modified
33 8 |
34 9 | return <div>{_}</div>;
35 10 | }
compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/error.invalid-mutate-context-in-callback.expect.md
+2 -1
@@ -25,9 +25,10 @@ function Component(props) {
25
26 ```
27 Found 1 error:
28 +
29 Error: This value cannot be modified
30
30 -Modifying a value returned from 'useContext()' is not allowed.
31 +Modifying a value returned from 'useContext()' is not allowed..
32
33 error.invalid-mutate-context-in-callback.ts:12:4
34 10 | // independently
compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/error.invalid-mutate-context.expect.md
+3 -2
@@ -15,15 +15,16 @@ function Component(props) {
15
16 ```
17 Found 1 error:
18 +
19 Error: This value cannot be modified
20
20 -Modifying a value returned from 'useContext()' is not allowed.
21 +Modifying a value returned from 'useContext()' is not allowed..
22
23 error.invalid-mutate-context.ts:3:2
24 1 | function Component(props) {
25 2 | const context = useContext(FooContext);
26 > 3 | context.value = props.value;
26 - | ^^^^^^^ This value cannot be modified
27 + | ^^^^^^^ value cannot be modified
28 4 | return context.value;
29 5 | }
30 6 |
compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/error.invalid-mutate-props-in-effect-fixpoint.expect.md
+2 -1
@@ -26,9 +26,10 @@ function Component(props) {
26
27 ```
28 Found 1 error:
29 +
30 Error: This value cannot be modified
31
31 -Modifying component props or hook arguments is not allowed. Consider using a local variable instead
32 +Modifying component props or hook arguments is not allowed. Consider using a local variable instead.
33
34 error.invalid-mutate-props-in-effect-fixpoint.ts:10:4
35 8 | let y = x;
compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/error.invalid-mutate-props-via-for-of-iterator.expect.md
+3 -2
@@ -18,15 +18,16 @@ function Component(props) {
18
19 ```
20 Found 1 error:
21 +
22 Error: This value cannot be modified
23
23 -Modifying component props or hook arguments is not allowed. Consider using a local variable instead
24 +Modifying component props or hook arguments is not allowed. Consider using a local variable instead.
25
26 error.invalid-mutate-props-via-for-of-iterator.ts:4:4
27 2 | const items = [];
28 3 | for (const x of props.items) {
29 > 4 | x.modified = true;
29 - | ^ This value cannot be modified
30 + | ^ value cannot be modified
31 5 | items.push(x);
32 6 | }
33 7 | return items;
compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/error.invalid-mutation-in-closure.expect.md
+2 -1
@@ -17,9 +17,10 @@ function useInvalidMutation(options) {
17
18 ```
19 Found 1 error:
20 +
21 Error: This value cannot be modified
22
22 -Modifying component props or hook arguments is not allowed. Consider using a local variable instead
23 +Modifying component props or hook arguments is not allowed. Consider using a local variable instead.
24
25 error.invalid-mutation-in-closure.ts:4:4
26 2 | function test() {
compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/error.invalid-mutation-of-possible-props-phi-indirect.expect.md
+2 -1
@@ -20,9 +20,10 @@ function Component(props) {
20
21 ```
22 Found 1 error:
23 +
24 Error: This value cannot be modified
25
25 -Modifying a variable defined outside a component or hook is not allowed. Consider using an effect
26 +Modifying a variable defined outside a component or hook is not allowed. Consider using an effect.
27
28 error.invalid-mutation-of-possible-props-phi-indirect.ts:4:4
29 2 | let x = cond ? someGlobal : props.foo;
compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/error.invalid-nested-function-reassign-local-variable-in-effect.expect.md
+4 -3
@@ -47,15 +47,16 @@ function Component() {
47
48 ```
49 Found 1 error:
50 -Error: Cannot reassign a variable after render completes
50
52 -Reassigning variable `local` after render has completed can cause inconsistent behavior on subsequent renders. Consider using state instead
51 +Error: Cannot reassign variable after render completes
52 +
53 +Reassigning `local` after render has completed can cause inconsistent behavior on subsequent renders. Consider using state instead.
54
55 error.invalid-nested-function-reassign-local-variable-in-effect.ts:7:6
56 5 | // Create the reassignment function inside another function, then return it
57 6 | const reassignLocal = newValue => {
58 > 7 | local = newValue;
58 - | ^^^^^ Cannot reassign variable after render completes
59 + | ^^^^^ Cannot reassign `local` after render completes
60 8 | };
61 9 | return reassignLocal;
62 10 | };
compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/error.invalid-non-imported-reanimated-shared-value-writes.expect.md
+2 -1
@@ -25,9 +25,10 @@ function SomeComponent() {
25
26 ```
27 Found 1 error:
28 +
29 Error: This value cannot be modified
30
30 -Modifying a value returned from a hook is not allowed. Consider moving the modification into the hook where the value is constructed
31 +Modifying a value returned from a hook is not allowed. Consider moving the modification into the hook where the value is constructed.
32
33 error.invalid-non-imported-reanimated-shared-value-writes.ts:11:22
34 9 | return (
compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/error.invalid-optional-member-expression-as-memo-dep-non-optional-in-body.expect.md
+1
@@ -19,6 +19,7 @@ function Component(props) {
19
20 ```
21 Found 1 error:
22 +
23 Memoization: Compilation skipped because existing memoization could not be preserved
24
25 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.
compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/error.invalid-pass-hook-as-call-arg.expect.md
+1 -2
@@ -13,6 +13,7 @@ function Component(props) {
13
14 ```
15 Found 1 error:
16 +
17 Error: 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
18
19 error.invalid-pass-hook-as-call-arg.ts:2:13
@@ -21,8 +22,6 @@ error.invalid-pass-hook-as-call-arg.ts:2:13
22 | ^^^^^^ 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
23 3 | }
24 4 |
24 -
25 -
25 ```
26
27
\ No newline at end of file
compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/error.invalid-pass-hook-as-prop.expect.md
+1 -2
@@ -13,6 +13,7 @@ function Component(props) {
13
14 ```
15 Found 1 error:
16 +
17 Error: 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
18
19 error.invalid-pass-hook-as-prop.ts:2:21
@@ -21,8 +22,6 @@ error.invalid-pass-hook-as-prop.ts:2:21
22 | ^^^^^^ 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
23 3 | }
24 4 |
24 -
25 -
25 ```
26
27
\ No newline at end of file
compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/error.invalid-pass-mutable-function-as-prop.expect.md
+4 -3
@@ -18,15 +18,16 @@ function Component() {
18
19 ```
20 Found 1 error:
21 +
22 Error: Cannot modify local variables after render completes
23
23 -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
24 +This argument is a function which may reassign or mutate `cache` after render, which can cause inconsistent behavior on subsequent renders. Consider using state instead.
25
26 error.invalid-pass-mutable-function-as-prop.ts:7:18
27 5 | cache.set('key', 'value');
28 6 | };
29 > 7 | return <Foo fn={fn} />;
29 - | ^^ This function may (indirectly) reassign or modify local variables after render
30 + | ^^ This function may (indirectly) reassign or modify `cache` after render
31 8 | }
32 9 |
33
@@ -34,7 +35,7 @@ error.invalid-pass-mutable-function-as-prop.ts:5:4
35 3 | const cache = new Map();
36 4 | const fn = () => {
37 > 5 | cache.set('key', 'value');
37 - | ^^^^^ This modifies a local variable
38 + | ^^^^^ This modifies `cache`
39 6 | };
40 7 | return <Foo fn={fn} />;
41 8 | }
compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/error.invalid-pass-ref-to-function.expect.md
+1 -2
@@ -16,6 +16,7 @@ function Component(props) {
16
17 ```
18 Found 1 error:
19 +
20 Error: Ref values (the `current` property) may not be accessed during render. (https://react.dev/reference/react/useRef)
21
22 error.invalid-pass-ref-to-function.ts:4:16
@@ -26,8 +27,6 @@ error.invalid-pass-ref-to-function.ts:4:16
27 5 | return x.current;
28 6 | }
29 7 |
29 -
30 -
30 ```
31
32
\ No newline at end of file
compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/error.invalid-prop-mutation-indirect.expect.md
+2 -1
@@ -19,9 +19,10 @@ function Component(props) {
19
20 ```
21 Found 1 error:
22 +
23 Error: This value cannot be modified
24
24 -Modifying component props or hook arguments is not allowed. Consider using a local variable instead
25 +Modifying component props or hook arguments is not allowed. Consider using a local variable instead.
26
27 error.invalid-prop-mutation-indirect.ts:3:4
28 1 | function Component(props) {
compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/error.invalid-property-store-to-frozen-value.expect.md
+3 -2
@@ -17,15 +17,16 @@ function Component(props) {
17
18 ```
19 Found 1 error:
20 +
21 Error: This value cannot be modified
22
22 -Modifying a value used previously in JSX is not allowed. Consider moving the modification before the JSX
23 +Modifying a value used previously in JSX is not allowed. Consider moving the modification before the JSX.
24
25 error.invalid-property-store-to-frozen-value.ts:5:2
26 3 | // freeze
27 4 | <div>{x}</div>;
28 > 5 | x.y = true;
28 - | ^ This value cannot be modified
29 + | ^ value cannot be modified
30 6 | return x;
31 7 | }
32 8 |
compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/error.invalid-props-mutation-in-effect-indirect.expect.md
+2 -1
@@ -19,9 +19,10 @@ function Component(props) {
19
20 ```
21 Found 1 error:
22 +
23 Error: This value cannot be modified
24
24 -Modifying component props or hook arguments is not allowed. Consider using a local variable instead
25 +Modifying component props or hook arguments is not allowed. Consider using a local variable instead.
26
27 error.invalid-props-mutation-in-effect-indirect.ts:3:4
28 1 | function Component(props) {
compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/error.invalid-read-ref-prop-in-render-destructure.expect.md
+1 -2
@@ -15,6 +15,7 @@ function Component({ref}) {
15
16 ```
17 Found 1 error:
18 +
19 Error: Ref values (the `current` property) may not be accessed during render. (https://react.dev/reference/react/useRef)
20
21 error.invalid-read-ref-prop-in-render-destructure.ts:3:16
@@ -25,8 +26,6 @@ error.invalid-read-ref-prop-in-render-destructure.ts:3:16
26 4 | return <div>{value}</div>;
27 5 | }
28 6 |
28 -
29 -
29 ```
30
31
\ No newline at end of file
compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/error.invalid-read-ref-prop-in-render-property-load.expect.md
+1 -2
@@ -15,6 +15,7 @@ function Component(props) {
15
16 ```
17 Found 1 error:
18 +
19 Error: Ref values (the `current` property) may not be accessed during render. (https://react.dev/reference/react/useRef)
20
21 error.invalid-read-ref-prop-in-render-property-load.ts:3:16
@@ -25,8 +26,6 @@ error.invalid-read-ref-prop-in-render-property-load.ts:3:16
26 4 | return <div>{value}</div>;
27 5 | }
28 6 |
28 -
29 -
29 ```
30
31
\ No newline at end of file
compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/error.invalid-reassign-const.expect.md
+1 -2
@@ -14,6 +14,7 @@ function Component() {
14
15 ```
16 Found 1 error:
17 +
18 Error: Cannot reassign a `const` variable
19
20 `x` is declared as const.
@@ -25,8 +26,6 @@ error.invalid-reassign-const.ts:3:2
26 | ^ Cannot reassign a `const` variable
27 4 | }
28 5 |
28 -
29 -
29 ```
30
31
\ No newline at end of file
compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/error.invalid-reassign-local-in-hook-return-value.expect.md
+4 -3
@@ -16,15 +16,16 @@ function useFoo() {
16
17 ```
18 Found 1 error:
19 -Error: Cannot reassign a variable after render completes
19
21 -Reassigning variable `x` after render has completed can cause inconsistent behavior on subsequent renders. Consider using state instead
20 +Error: Cannot reassign variable after render completes
21 +
22 +Reassigning `x` after render has completed can cause inconsistent behavior on subsequent renders. Consider using state instead.
23
24 error.invalid-reassign-local-in-hook-return-value.ts:4:4
25 2 | let x = 0;
26 3 | return value => {
27 > 4 | x = value;
27 - | ^ Cannot reassign variable after render completes
28 + | ^ Cannot reassign `x` after render completes
29 5 | };
30 6 | }
31 7 |
compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/error.invalid-reassign-local-variable-in-async-callback.expect.md
+4 -5
@@ -26,20 +26,19 @@ function Component() {
26
27 ```
28 Found 1 error:
29 -Error: Reassigning a variable in an async function can cause inconsistent behavior on subsequent renders. Consider using state instead
29
31 -Variable `value` cannot be reassigned after render.
30 +Error: Cannot reassign variable in async function
31 +
32 +Reassigning a variable in an async function can cause inconsistent behavior on subsequent renders. Consider using state instead
33
34 error.invalid-reassign-local-variable-in-async-callback.ts:8:6
35 6 | // after render, so this should error regardless of where this ends up
36 7 | // getting called
37 > 8 | value = result;
37 - | ^^^^^ Reassigning a variable in an async function can cause inconsistent behavior on subsequent renders. Consider using state instead
38 + | ^^^^^ Cannot reassign `value`
39 9 | });
40 10 | };
41 11 |
41 -
42 -
42 ```
43
44
\ No newline at end of file
compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/error.invalid-reassign-local-variable-in-effect.expect.md
+4 -3
@@ -48,15 +48,16 @@ function Component() {
48
49 ```
50 Found 1 error:
51 -Error: Cannot reassign a variable after render completes
51
53 -Reassigning variable `local` after render has completed can cause inconsistent behavior on subsequent renders. Consider using state instead
52 +Error: Cannot reassign variable after render completes
53 +
54 +Reassigning `local` after render has completed can cause inconsistent behavior on subsequent renders. Consider using state instead.
55
56 error.invalid-reassign-local-variable-in-effect.ts:7:4
57 5 |
58 6 | const reassignLocal = newValue => {
59 > 7 | local = newValue;
59 - | ^^^^^ Cannot reassign variable after render completes
60 + | ^^^^^ Cannot reassign `local` after render completes
61 8 | };
62 9 |
63 10 | const onMount = newValue => {
compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/error.invalid-reassign-local-variable-in-hook-argument.expect.md
+4 -3
@@ -49,15 +49,16 @@ function Component() {
49
50 ```
51 Found 1 error:
52 -Error: Cannot reassign a variable after render completes
52
54 -Reassigning variable `local` after render has completed can cause inconsistent behavior on subsequent renders. Consider using state instead
53 +Error: Cannot reassign variable after render completes
54 +
55 +Reassigning `local` after render has completed can cause inconsistent behavior on subsequent renders. Consider using state instead.
56
57 error.invalid-reassign-local-variable-in-hook-argument.ts:8:4
58 6 |
59 7 | const reassignLocal = newValue => {
60 > 8 | local = newValue;
60 - | ^^^^^ Cannot reassign variable after render completes
61 + | ^^^^^ Cannot reassign `local` after render completes
62 9 | };
63 10 |
64 11 | const callback = newValue => {
compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/error.invalid-reassign-local-variable-in-jsx-callback.expect.md
+4 -3
@@ -42,15 +42,16 @@ function Component() {
42
43 ```
44 Found 1 error:
45 -Error: Cannot reassign a variable after render completes
45
47 -Reassigning variable `local` after render has completed can cause inconsistent behavior on subsequent renders. Consider using state instead
46 +Error: Cannot reassign variable after render completes
47 +
48 +Reassigning `local` after render has completed can cause inconsistent behavior on subsequent renders. Consider using state instead.
49
50 error.invalid-reassign-local-variable-in-jsx-callback.ts:5:4
51 3 |
52 4 | const reassignLocal = newValue => {
53 > 5 | local = newValue;
53 - | ^^^^^ Cannot reassign variable after render completes
54 + | ^^^^^ Cannot reassign `local` after render completes
55 6 | };
56 7 |
57 8 | const onClick = newValue => {
compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/error.invalid-ref-in-callback-invoked-during-render.expect.md
+1 -2
@@ -19,6 +19,7 @@ function Component(props) {
19
20 ```
21 Found 1 error:
22 +
23 Error: Ref values (the `current` property) may not be accessed during render. (https://react.dev/reference/react/useRef)
24
25 error.invalid-ref-in-callback-invoked-during-render.ts:8:33
@@ -28,8 +29,6 @@ error.invalid-ref-in-callback-invoked-during-render.ts:8:33
29 | ^^^^^^^^^^^^^^^^^^^^^^^^ Ref values (the `current` property) may not be accessed during render. (https://react.dev/reference/react/useRef)
30 9 | }
31 10 |
31 -
32 -
32 ```
33
34
\ No newline at end of file
compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/error.invalid-ref-value-as-props.expect.md
+1 -2
@@ -15,6 +15,7 @@ function Component(props) {
15
16 ```
17 Found 1 error:
18 +
19 Error: Ref values (the `current` property) may not be accessed during render. (https://react.dev/reference/react/useRef)
20
21 error.invalid-ref-value-as-props.ts:4:19
@@ -24,8 +25,6 @@ error.invalid-ref-value-as-props.ts:4:19
25 | ^^^^^^^^^^^ Ref values (the `current` property) may not be accessed during render. (https://react.dev/reference/react/useRef)
26 5 | }
27 6 |
27 -
28 -
28 ```
29
30
\ No newline at end of file
compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/error.invalid-return-mutable-function-from-hook.expect.md
+4 -3
@@ -20,9 +20,10 @@ function useFoo() {
20
21 ```
22 Found 1 error:
23 +
24 Error: Cannot modify local variables after render completes
25
25 -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
26 +This argument is a function which may reassign or mutate `cache` after render, which can cause inconsistent behavior on subsequent renders. Consider using state instead.
27
28 error.invalid-return-mutable-function-from-hook.ts:7:9
29 5 | useHook(); // for inference to kick in
@@ -32,7 +33,7 @@ error.invalid-return-mutable-function-from-hook.ts:7:9
33 > 8 | cache.set('key', 'value');
34 | ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^
35 > 9 | };
35 - | ^^^^ This function may (indirectly) reassign or modify local variables after render
36 + | ^^^^ This function may (indirectly) reassign or modify `cache` after render
37 10 | }
38 11 |
39
@@ -40,7 +41,7 @@ error.invalid-return-mutable-function-from-hook.ts:8:4
41 6 | const cache = new Map();
42 7 | return () => {
43 > 8 | cache.set('key', 'value');
43 - | ^^^^^ This modifies a local variable
44 + | ^^^^^ This modifies `cache`
45 9 | };
46 10 | }
47 11 |
compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/error.invalid-set-and-read-ref-during-render.expect.md
+1 -3
@@ -16,6 +16,7 @@ function Component(props) {
16
17 ```
18 Found 2 errors:
19 +
20 Error: Ref values (the `current` property) may not be accessed during render. (https://react.dev/reference/react/useRef)
21
22 error.invalid-set-and-read-ref-during-render.ts:4:2
@@ -27,7 +28,6 @@ error.invalid-set-and-read-ref-during-render.ts:4:2
28 6 | }
29 7 |
30
30 -
31 Error: Ref values (the `current` property) may not be accessed during render. (https://react.dev/reference/react/useRef)
32
33 error.invalid-set-and-read-ref-during-render.ts:5:9
@@ -37,8 +37,6 @@ error.invalid-set-and-read-ref-during-render.ts:5:9
37 | ^^^^^^^^^^^ Ref values (the `current` property) may not be accessed during render. (https://react.dev/reference/react/useRef)
38 6 | }
39 7 |
40 -
41 -
40 ```
41
42
\ No newline at end of file
compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/error.invalid-set-and-read-ref-nested-property-during-render.expect.md
+1 -3
@@ -16,6 +16,7 @@ function Component(props) {
16
17 ```
18 Found 2 errors:
19 +
20 Error: Ref values (the `current` property) may not be accessed during render. (https://react.dev/reference/react/useRef)
21
22 error.invalid-set-and-read-ref-nested-property-during-render.ts:4:2
@@ -27,7 +28,6 @@ error.invalid-set-and-read-ref-nested-property-during-render.ts:4:2
28 6 | }
29 7 |
30
30 -
31 Error: Ref values (the `current` property) may not be accessed during render. (https://react.dev/reference/react/useRef)
32
33 error.invalid-set-and-read-ref-nested-property-during-render.ts:5:9
@@ -37,8 +37,6 @@ error.invalid-set-and-read-ref-nested-property-during-render.ts:5:9
37 | ^^^^^^^^^^^^^^^^^ Ref values (the `current` property) may not be accessed during render. (https://react.dev/reference/react/useRef)
38 6 | }
39 7 |
40 -
41 -
40 ```
41
42
\ No newline at end of file
compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/error.invalid-setState-in-useMemo-indirect-useCallback.expect.md
+1
@@ -27,6 +27,7 @@ function useKeyedState({key, init}) {
27
28 ```
29 Found 1 error:
30 +
31 Error: Calling setState from useMemo may trigger an infinite loop
32
33 Each time the memo callback is evaluated it will change state. This can cause a memoization dependency to change, running the memo function again and causing an infinite loop. Instead of setting state in useMemo(), prefer deriving the value during render. (https://react.dev/reference/react/useState)
compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/error.invalid-setState-in-useMemo.expect.md
+2
@@ -21,6 +21,7 @@ function useKeyedState({key, init}) {
21
22 ```
23 Found 2 errors:
24 +
25 Error: Calling setState from useMemo may trigger an infinite loop
26
27 Each time the memo callback is evaluated it will change state. This can cause a memoization dependency to change, running the memo function again and causing an infinite loop. Instead of setting state in useMemo(), prefer deriving the value during render. (https://react.dev/reference/react/useState)
@@ -33,6 +34,7 @@ error.invalid-setState-in-useMemo.ts:6:4
34 7 | setState(init);
35 8 | }, [key, init]);
36 9 |
37 +
38 Error: Calling setState from useMemo may trigger an infinite loop
39
40 Each time the memo callback is evaluated it will change state. This can cause a memoization dependency to change, running the memo function again and causing an infinite loop. Instead of setting state in useMemo(), prefer deriving the value during render. (https://react.dev/reference/react/useState)
compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/error.invalid-sketchy-code-use-forget.expect.md
+1 -3
@@ -18,6 +18,7 @@ function lowercasecomponent() {
18
19 ```
20 Found 2 errors:
21 +
22 Error: 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
23
24 eslint-disable react-hooks/rules-of-hooks.
@@ -29,7 +30,6 @@ error.invalid-sketchy-code-use-forget.ts:1:0
30 3 | 'use forget';
31 4 | const x = [];
32
32 -
33 Error: 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
34
35 eslint-disable-next-line react-hooks/rules-of-hooks.
@@ -42,8 +42,6 @@ error.invalid-sketchy-code-use-forget.ts:5:2
42 6 | return <div>{x}</div>;
43 7 | }
44 8 | /* eslint-enable react-hooks/rules-of-hooks */
45 -
46 -
45 ```
46
47
\ No newline at end of file
compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/error.invalid-ternary-with-hook-values.expect.md
+1 -5
@@ -14,6 +14,7 @@ function Component(props) {
14
15 ```
16 Found 4 errors:
17 +
18 Error: 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
19
20 error.invalid-ternary-with-hook-values.ts:2:25
@@ -24,7 +25,6 @@ error.invalid-ternary-with-hook-values.ts:2:25
25 4 | }
26 5 |
27
27 -
28 Error: 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
29
30 error.invalid-ternary-with-hook-values.ts:2:32
@@ -35,7 +35,6 @@ error.invalid-ternary-with-hook-values.ts:2:32
35 4 | }
36 5 |
37
38 -
38 Error: 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
39
40 error.invalid-ternary-with-hook-values.ts:2:12
@@ -46,7 +45,6 @@ error.invalid-ternary-with-hook-values.ts:2:12
45 4 | }
46 5 |
47
49 -
48 Error: 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
49
50 error.invalid-ternary-with-hook-values.ts:3:9
@@ -56,8 +54,6 @@ error.invalid-ternary-with-hook-values.ts:3:9
54 | ^ 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
55 4 | }
56 5 |
59 -
60 -
57 ```
58
59
\ No newline at end of file
compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/error.invalid-type-provider-hook-name-not-typed-as-hook-namespace.expect.md
+1 -2
@@ -15,6 +15,7 @@ function Component() {
15
16 ```
17 Found 1 error:
18 +
19 Error: Invalid type configuration for module
20
21 Expected type for object property 'useHookNotTypedAsHook' from module 'ReactCompilerTest' to be a hook based on the property name.
@@ -26,8 +27,6 @@ error.invalid-type-provider-hook-name-not-typed-as-hook-namespace.ts:4:9
27 | ^^^^^^^^^^^^^^^^^ Invalid type configuration for module
28 5 | }
29 6 |
29 -
30 -
30 ```
31
32
\ No newline at end of file
compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/error.invalid-type-provider-hook-name-not-typed-as-hook.expect.md
+1 -2
@@ -15,6 +15,7 @@ function Component() {
15
16 ```
17 Found 1 error:
18 +
19 Error: Invalid type configuration for module
20
21 Expected type for object property 'useHookNotTypedAsHook' from module 'ReactCompilerTest' to be a hook based on the property name.
@@ -26,8 +27,6 @@ error.invalid-type-provider-hook-name-not-typed-as-hook.ts:4:9
27 | ^^^^^^^^^^^^^^^^^^^^^ Invalid type configuration for module
28 5 | }
29 6 |
29 -
30 -
30 ```
31
32
\ No newline at end of file
compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/error.invalid-type-provider-hooklike-module-default-not-hook.expect.md
+1 -2
@@ -15,6 +15,7 @@ function Component() {
15
16 ```
17 Found 1 error:
18 +
19 Error: Invalid type configuration for module
20
21 Expected type for `import ... from 'useDefaultExportNotTypedAsHook'` to be a hook based on the module name.
@@ -26,8 +27,6 @@ error.invalid-type-provider-hooklike-module-default-not-hook.ts:4:15
27 | ^^^ Invalid type configuration for module
28 5 | }
29 6 |
29 -
30 -
30 ```
31
32
\ No newline at end of file
compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/error.invalid-type-provider-nonhook-name-typed-as-hook.expect.md
+1 -2
@@ -15,6 +15,7 @@ function Component() {
15
16 ```
17 Found 1 error:
18 +
19 Error: Invalid type configuration for module
20
21 Expected type for object property 'useHookNotTypedAsHook' from module 'ReactCompilerTest' to be a hook based on the property name.
@@ -26,8 +27,6 @@ error.invalid-type-provider-nonhook-name-typed-as-hook.ts:4:15
27 | ^^^^^^^^^^^^^^^^^^^ Invalid type configuration for module
28 5 | }
29 6 |
29 -
30 -
30 ```
31
32
\ No newline at end of file
compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/error.invalid-uncalled-function-capturing-mutable-values-memoizes-with-captures-values.expect.md
+4 -5
@@ -48,11 +48,11 @@ hook useMemoMap<TInput: interface {}, TOutput>(
48
49 ```
50 Found 1 error:
51 +
52 Error: Cannot modify local variables after render completes
53
53 -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
54 +This argument is a function which may reassign or mutate `cache` after render, which can cause inconsistent behavior on subsequent renders. Consider using state instead.
55
55 -undefined:21:9
56 19 | map: TInput => TOutput
57 20 | ): TInput => TOutput {
58 > 21 | return useMemo(() => {
@@ -88,15 +88,14 @@ undefined:21:9
88 > 36 | };
89 | ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^
90 > 37 | }, [map]);
91 - | ^^^^^^^^^^^^ This function may (indirectly) reassign or modify local variables after render
91 + | ^^^^^^^^^^^^ This function may (indirectly) reassign or modify `cache` after render
92 38 | }
93 39 |
94
95 -undefined:33:8
95 31 | if (output == null) {
96 32 | output = map(input);
97 > 33 | cache.set(input, output);
99 - | ^^^^^ This modifies a local variable
98 + | ^^^^^ This modifies `cache`
99 34 | }
100 35 | return output;
101 36 | };
compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/error.invalid-unclosed-eslint-suppression.expect.md
+1 -2
@@ -37,6 +37,7 @@ function CrimesAgainstReact() {
37
38 ```
39 Found 1 error:
40 +
41 Error: 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
42
43 eslint-disable react-hooks/rules-of-hooks.
@@ -48,8 +49,6 @@ error.invalid-unclosed-eslint-suppression.ts:2:0
49 3 | function lowercasecomponent() {
50 4 | 'use forget';
51 5 | const x = [];
51 -
52 -
52 ```
53
54
\ No newline at end of file
compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/error.invalid-unconditional-set-state-in-render.expect.md
+2
@@ -20,6 +20,7 @@ function Component(props) {
20
21 ```
22 Found 2 errors:
23 +
24 Error: Calling setState during render may trigger an infinite loop
25
26 Calling setState during render will trigger another render, and can lead to infinite loops. (https://react.dev/reference/react/useState)
@@ -32,6 +33,7 @@ error.invalid-unconditional-set-state-in-render.ts:6:2
33 7 | aliased(2);
34 8 |
35 9 | return x;
36 +
37 Error: Calling setState during render may trigger an infinite loop
38
39 Calling setState during render will trigger another render, and can lead to infinite loops. (https://react.dev/reference/react/useState)
compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/error.invalid-use-ref-added-to-dep-without-type-info.expect.md
+1 -3
@@ -23,6 +23,7 @@ function Foo({a}) {
23
24 ```
25 Found 2 errors:
26 +
27 Error: Ref values (the `current` property) may not be accessed during render. (https://react.dev/reference/react/useRef)
28
29 error.invalid-use-ref-added-to-dep-without-type-info.ts:10:21
@@ -34,7 +35,6 @@ error.invalid-use-ref-added-to-dep-without-type-info.ts:10:21
35 12 | return <VideoList videos={x} />;
36 13 | }
37
37 -
38 Error: Ref values (the `current` property) may not be accessed during render. (https://react.dev/reference/react/useRef)
39
40 error.invalid-use-ref-added-to-dep-without-type-info.ts:10:21
@@ -45,8 +45,6 @@ error.invalid-use-ref-added-to-dep-without-type-info.ts:10:21
45 11 |
46 12 | return <VideoList videos={x} />;
47 13 | }
48 -
49 -
48 ```
49
50
\ No newline at end of file
compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/error.invalid-useEffect-dep-not-memoized-bc-range-overlaps-hook.expect.md
+1 -2
@@ -24,6 +24,7 @@ function Component(props) {
24
25 ```
26 Found 1 error:
27 +
28 Memoization: React Compiler has skipped optimizing this component because the effect dependencies could not be memoized. Unmemoized effect dependencies can trigger an infinite loop or other unexpected behavior
29
30 error.invalid-useEffect-dep-not-memoized-bc-range-overlaps-hook.ts:9:2
@@ -38,8 +39,6 @@ error.invalid-useEffect-dep-not-memoized-bc-range-overlaps-hook.ts:9:2
39 12 |
40 13 | return [items, state];
41 14 | }
41 -
42 -
42 ```
43
44
\ No newline at end of file
compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/error.invalid-useEffect-dep-not-memoized.expect.md
+1 -2
@@ -21,6 +21,7 @@ function Component(props) {
21
22 ```
23 Found 1 error:
24 +
25 Memoization: React Compiler has skipped optimizing this component because the effect dependencies could not be memoized. Unmemoized effect dependencies can trigger an infinite loop or other unexpected behavior
26
27 error.invalid-useEffect-dep-not-memoized.ts:6:2
@@ -35,8 +36,6 @@ error.invalid-useEffect-dep-not-memoized.ts:6:2
36 9 | mutate(data);
37 10 | return data;
38 11 | }
38 -
39 -
39 ```
40
41
\ No newline at end of file
compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/error.invalid-useInsertionEffect-dep-not-memoized.expect.md
+1 -2
@@ -21,6 +21,7 @@ function Component(props) {
21
22 ```
23 Found 1 error:
24 +
25 Memoization: React Compiler has skipped optimizing this component because the effect dependencies could not be memoized. Unmemoized effect dependencies can trigger an infinite loop or other unexpected behavior
26
27 error.invalid-useInsertionEffect-dep-not-memoized.ts:6:2
@@ -35,8 +36,6 @@ error.invalid-useInsertionEffect-dep-not-memoized.ts:6:2
36 9 | mutate(data);
37 10 | return data;
38 11 | }
38 -
39 -
39 ```
40
41
\ No newline at end of file
compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/error.invalid-useLayoutEffect-dep-not-memoized.expect.md
+1 -2
@@ -21,6 +21,7 @@ function Component(props) {
21
22 ```
23 Found 1 error:
24 +
25 Memoization: React Compiler has skipped optimizing this component because the effect dependencies could not be memoized. Unmemoized effect dependencies can trigger an infinite loop or other unexpected behavior
26
27 error.invalid-useLayoutEffect-dep-not-memoized.ts:6:2
@@ -35,8 +36,6 @@ error.invalid-useLayoutEffect-dep-not-memoized.ts:6:2
36 9 | mutate(data);
37 10 | return data;
38 11 | }
38 -
39 -
39 ```
40
41
\ No newline at end of file
compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/error.invalid-useMemo-async-callback.expect.md
+3 -2
@@ -16,9 +16,10 @@ function component(a, b) {
16
17 ```
18 Found 1 error:
19 -Error: useMemo callbacks may not be async or generator functions
19
21 -useMemo() callbacks are called once and must synchronously return a value
20 +Error: useMemo() callbacks may not be async or generator functions
21 +
22 +useMemo() callbacks are called once and must synchronously return a value.
23
24 error.invalid-useMemo-async-callback.ts:2:18
25 1 | function component(a, b) {
compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/error.invalid-useMemo-callback-args.expect.md
+2 -1
@@ -14,6 +14,7 @@ function component(a, b) {
14
15 ```
16 Found 1 error:
17 +
18 Error: useMemo() callbacks may not accept parameters
19
20 useMemo() callbacks are called by React to cache calculations across re-renders. They should not take parameters. Instead, directly reference the props, state, or local variables needed for the computation.
@@ -21,7 +22,7 @@ useMemo() callbacks are called by React to cache calculations across re-renders.
22 error.invalid-useMemo-callback-args.ts:2:18
23 1 | function component(a, b) {
24 > 2 | let x = useMemo(c => a, []);
24 - | ^
25 + | ^ Callbacks with parameters are not supported
26 3 | return x;
27 4 | }
28 5 |
compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/error.invalid-write-but-dont-read-ref-in-render.expect.md
+1 -2
@@ -18,6 +18,7 @@ function useHook({value}) {
18
19 ```
20 Found 1 error:
21 +
22 Error: Ref values (the `current` property) may not be accessed during render. (https://react.dev/reference/react/useRef)
23
24 error.invalid-write-but-dont-read-ref-in-render.ts:5:2
@@ -28,8 +29,6 @@ error.invalid-write-but-dont-read-ref-in-render.ts:5:2
29 6 | // returning a ref is allowed, so this alone doesn't trigger an error:
30 7 | return ref;
31 8 | }
31 -
32 -
32 ```
33
34
\ No newline at end of file
compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/error.invalid-write-ref-prop-in-render.expect.md
+1 -2
@@ -16,6 +16,7 @@ function Component(props) {
16
17 ```
18 Found 1 error:
19 +
20 Error: Ref values (the `current` property) may not be accessed during render. (https://react.dev/reference/react/useRef)
21
22 error.invalid-write-ref-prop-in-render.ts:4:2
@@ -26,8 +27,6 @@ error.invalid-write-ref-prop-in-render.ts:4:2
27 5 | return <div>{value}</div>;
28 6 | }
29 7 |
29 -
30 -
30 ```
31
32
\ No newline at end of file
compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/error.modify-state-2.expect.md
+3 -2
@@ -18,15 +18,16 @@ function Foo() {
18
19 ```
20 Found 1 error:
21 +
22 Error: This value cannot be modified
23
23 -Modifying a value returned from 'useState()', which should not be modified directly. Use the setter function to update instead
24 +Modifying a value returned from 'useState()', which should not be modified directly. Use the setter function to update instead.
25
26 error.modify-state-2.ts:6:2
27 4 | const [state, setState] = useState({foo: {bar: 3}});
28 5 | const foo = state.foo;
29 > 6 | foo.bar = 1;
29 - | ^^^ This value cannot be modified
30 + | ^^^ value cannot be modified
31 7 | return state;
32 8 | }
33 9 |
compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/error.modify-state.expect.md
+3 -2
@@ -17,15 +17,16 @@ function Foo() {
17
18 ```
19 Found 1 error:
20 +
21 Error: This value cannot be modified
22
22 -Modifying a value returned from 'useState()', which should not be modified directly. Use the setter function to update instead
23 +Modifying a value returned from 'useState()', which should not be modified directly. Use the setter function to update instead.
24
25 error.modify-state.ts:5:2
26 3 | function Foo() {
27 4 | let [state, setState] = useState({});
28 > 5 | state.foo = 1;
28 - | ^^^^^ This value cannot be modified
29 + | ^^^^^ value cannot be modified
30 6 | return state;
31 7 | }
32 8 |
compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/error.modify-useReducer-state.expect.md
+3 -2
@@ -17,15 +17,16 @@ function Foo() {
17
18 ```
19 Found 1 error:
20 +
21 Error: This value cannot be modified
22
22 -Modifying a value returned from 'useReducer()', which should not be modified directly. Use the dispatch function to update instead
23 +Modifying a value returned from 'useReducer()', which should not be modified directly. Use the dispatch function to update instead.
24
25 error.modify-useReducer-state.ts:5:2
26 3 | function Foo() {
27 4 | let [state, setState] = useReducer({foo: 1});
28 > 5 | state.foo = 1;
28 - | ^^^^^ This value cannot be modified
29 + | ^^^^^ value cannot be modified
30 6 | return state;
31 7 | }
32 8 |
compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/error.mutable-range-shared-inner-outer-function.expect.md
+4 -3
@@ -33,15 +33,16 @@ export const FIXTURE_ENTRYPOINT = {
33
34 ```
35 Found 1 error:
36 -Error: Cannot reassign a variable after render completes
36
38 -Reassigning variable `a` after render has completed can cause inconsistent behavior on subsequent renders. Consider using state instead
37 +Error: Cannot reassign variable after render completes
38 +
39 +Reassigning `a` after render has completed can cause inconsistent behavior on subsequent renders. Consider using state instead.
40
41 error.mutable-range-shared-inner-outer-function.ts:8:6
42 6 | const f = () => {
43 7 | if (cond) {
44 > 8 | a = {};
44 - | ^ Cannot reassign variable after render completes
45 + | ^ Cannot reassign `a` after render completes
46 9 | b = [];
47 10 | } else {
48 11 | a = {};
compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/error.mutate-function-property.expect.md
+3 -2
@@ -16,15 +16,16 @@ export function ViewModeSelector(props) {
16
17 ```
18 Found 1 error:
19 +
20 Error: This value cannot be modified
21
21 -This modifies a variable that React considers immutable
22 +This modifies a variable that React considers immutable.
23
24 error.mutate-function-property.ts:3:2
25 1 | export function ViewModeSelector(props) {
26 2 | const renderIcon = () => <AcceptIcon />;
27 > 3 | renderIcon.displayName = 'AcceptIcon';
27 - | ^^^^^^^^^^ This value cannot be modified
28 + | ^^^^^^^^^^ value cannot be modified
29 4 |
30 5 | return <Dropdown checkableIndicator={{children: renderIcon}} />;
31 6 | }
compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/error.mutate-global-increment-op-invalid-react.expect.md
+1 -2
@@ -16,6 +16,7 @@ function NoHooks() {
16
17 ```
18 Found 1 error:
19 +
20 Todo: (BuildHIR::lowerExpression) Support UpdateExpression where argument is a global
21
22 error.mutate-global-increment-op-invalid-react.ts:4:2
@@ -26,8 +27,6 @@ error.mutate-global-increment-op-invalid-react.ts:4:2
27 5 | return <div />;
28 6 | }
29 7 |
29 -
30 -
30 ```
31
32
\ No newline at end of file
compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/error.mutate-hook-argument.expect.md
+6 -4
@@ -14,26 +14,28 @@ function useHook(a, b) {
14
15 ```
16 Found 2 errors:
17 +
18 Error: This value cannot be modified
19
19 -Modifying component props or hook arguments is not allowed. Consider using a local variable instead
20 +Modifying component props or hook arguments is not allowed. Consider using a local variable instead.
21
22 error.mutate-hook-argument.ts:2:2
23 1 | function useHook(a, b) {
24 > 2 | b.test = 1;
24 - | ^ This value cannot be modified
25 + | ^ value cannot be modified
26 3 | a.test = 2;
27 4 | }
28 5 |
29 +
30 Error: This value cannot be modified
31
30 -Modifying component props or hook arguments is not allowed. Consider using a local variable instead
32 +Modifying component props or hook arguments is not allowed. Consider using a local variable instead.
33
34 error.mutate-hook-argument.ts:3:2
35 1 | function useHook(a, b) {
36 2 | b.test = 1;
37 > 3 | a.test = 2;
36 - | ^ This value cannot be modified
38 + | ^ value cannot be modified
39 4 | }
40 5 |
41 ```
compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/error.mutate-property-from-global.expect.md
+3 -2
@@ -16,15 +16,16 @@ function Foo() {
16
17 ```
18 Found 1 error:
19 +
20 Error: This value cannot be modified
21
21 -Modifying a variable defined outside a component or hook is not allowed. Consider using an effect
22 +Modifying a variable defined outside a component or hook is not allowed. Consider using an effect.
23
24 error.mutate-property-from-global.ts:4:9
25 2 |
26 3 | function Foo() {
27 > 4 | delete wat.foo;
27 - | ^^^ This value cannot be modified
28 + | ^^^ value cannot be modified
29 5 | return wat;
30 6 | }
31 7 |
compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/error.mutate-props.expect.md
+3 -2
@@ -14,14 +14,15 @@ function Foo(props) {
14
15 ```
16 Found 1 error:
17 +
18 Error: This value cannot be modified
19
19 -Modifying component props or hook arguments is not allowed. Consider using a local variable instead
20 +Modifying component props or hook arguments is not allowed. Consider using a local variable instead.
21
22 error.mutate-props.ts:2:2
23 1 | function Foo(props) {
24 > 2 | props.test = 1;
24 - | ^^^^^ This value cannot be modified
25 + | ^^^^^ value cannot be modified
26 3 | return null;
27 4 | }
28 5 |
compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/error.nomemo-and-change-detect.expect.md
+1
@@ -12,6 +12,7 @@ function Component(props) {}
12
13 ```
14 Found 1 error:
15 +
16 Error: Invalid environment config: the 'disableMemoizationForDebugging' and 'enableChangeDetectionForDebugging' options cannot be used together
17 ```
18
compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/error.not-useEffect-external-mutate.expect.md
+6 -4
@@ -18,27 +18,29 @@ function Component(props) {
18
19 ```
20 Found 2 errors:
21 +
22 Error: This value cannot be modified
23
23 -Modifying a variable defined outside a component or hook is not allowed. Consider using an effect
24 +Modifying a variable defined outside a component or hook is not allowed. Consider using an effect.
25
26 error.not-useEffect-external-mutate.ts:5:4
27 3 | function Component(props) {
28 4 | foo(() => {
29 > 5 | x.a = 10;
29 - | ^ This value cannot be modified
30 + | ^ value cannot be modified
31 6 | x.a = 20;
32 7 | });
33 8 | }
34 +
35 Error: This value cannot be modified
36
35 -Modifying a variable defined outside a component or hook is not allowed. Consider using an effect
37 +Modifying a variable defined outside a component or hook is not allowed. Consider using an effect.
38
39 error.not-useEffect-external-mutate.ts:6:4
40 4 | foo(() => {
41 5 | x.a = 10;
42 > 6 | x.a = 20;
41 - | ^ This value cannot be modified
43 + | ^ value cannot be modified
44 7 | });
45 8 | }
46 9 |
compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/error.object-capture-global-mutation.expect.md
+1 -2
@@ -23,6 +23,7 @@ export const FIXTURE_ENTRYPOINT = {
23
24 ```
25 Found 1 error:
26 +
27 Error: Modifying a variable defined outside a component or hook is not allowed. Consider using an effect
28
29 error.object-capture-global-mutation.ts:4:4
@@ -33,8 +34,6 @@ error.object-capture-global-mutation.ts:4:4
34 5 | };
35 6 | const y = {x};
36 7 | return <Bar y={y} />;
36 -
37 -
37 ```
38
39
\ No newline at end of file
compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/error.propertyload-hook.expect.md
+1 -3
@@ -14,6 +14,7 @@ function Component() {
14
15 ```
16 Found 2 errors:
17 +
18 Error: 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
19
20 error.propertyload-hook.ts:2:12
@@ -24,7 +25,6 @@ error.propertyload-hook.ts:2:12
25 4 | }
26 5 |
27
27 -
28 Error: 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
29
30 error.propertyload-hook.ts:3:9
@@ -34,8 +34,6 @@ error.propertyload-hook.ts:3:9
34 | ^ 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
35 4 | }
36 5 |
37 -
38 -
37 ```
38
39
\ No newline at end of file
compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/error.reassign-global-fn-arg.expect.md
+3 -2
@@ -25,15 +25,16 @@ export const FIXTURE_ENTRYPOINT = {
25
26 ```
27 Found 1 error:
28 +
29 Error: Cannot reassign variables declared outside of the component/hook
30
30 -Reassigning a variable declared outside of the component/hook is a form of side effect, which can cause unpredictable behavior depending on when the component happens to re-render. If this variable is used in rendering, use useState instead. Otherwise, consider updating it in an effect (https://react.dev/reference/rules/components-and-hooks-must-be-pure#side-effects-must-run-outside-of-render)
31 +Variable `b` is declared outside of the component/hook. Reassigning this value during render is a form of side effect, which can cause unpredictable behavior depending on when the component happens to re-render. If this variable is used in rendering, use useState instead. Otherwise, consider updating it in an effect. (https://react.dev/reference/rules/components-and-hooks-must-be-pure#side-effects-must-run-outside-of-render)
32
33 error.reassign-global-fn-arg.ts:5:4
34 3 | export default function MyApp() {
35 4 | const fn = () => {
36 > 5 | b = 2;
36 - | ^ Cannot reassign variable
37 + | ^ `b` cannot be reassigned
38 6 | };
39 7 | return foo(fn);
40 8 | }
compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/error.reassignment-to-global-indirect.expect.md
+6 -4
@@ -18,27 +18,29 @@ function Component() {
18
19 ```
20 Found 2 errors:
21 +
22 Error: Cannot reassign variables declared outside of the component/hook
23
23 -Reassigning a variable declared outside of the component/hook is a form of side effect, which can cause unpredictable behavior depending on when the component happens to re-render. If this variable is used in rendering, use useState instead. Otherwise, consider updating it in an effect (https://react.dev/reference/rules/components-and-hooks-must-be-pure#side-effects-must-run-outside-of-render)
24 +Variable `someUnknownGlobal` is declared outside of the component/hook. Reassigning this value during render is a form of side effect, which can cause unpredictable behavior depending on when the component happens to re-render. If this variable is used in rendering, use useState instead. Otherwise, consider updating it in an effect. (https://react.dev/reference/rules/components-and-hooks-must-be-pure#side-effects-must-run-outside-of-render)
25
26 error.reassignment-to-global-indirect.ts:4:4
27 2 | const foo = () => {
28 3 | // Cannot assign to globals
29 > 4 | someUnknownGlobal = true;
29 - | ^^^^^^^^^^^^^^^^^ Cannot reassign variable
30 + | ^^^^^^^^^^^^^^^^^ `someUnknownGlobal` cannot be reassigned
31 5 | moduleLocal = true;
32 6 | };
33 7 | foo();
34 +
35 Error: Cannot reassign variables declared outside of the component/hook
36
35 -Reassigning a variable declared outside of the component/hook is a form of side effect, which can cause unpredictable behavior depending on when the component happens to re-render. If this variable is used in rendering, use useState instead. Otherwise, consider updating it in an effect (https://react.dev/reference/rules/components-and-hooks-must-be-pure#side-effects-must-run-outside-of-render)
37 +Variable `moduleLocal` is declared outside of the component/hook. Reassigning this value during render is a form of side effect, which can cause unpredictable behavior depending on when the component happens to re-render. If this variable is used in rendering, use useState instead. Otherwise, consider updating it in an effect. (https://react.dev/reference/rules/components-and-hooks-must-be-pure#side-effects-must-run-outside-of-render)
38
39 error.reassignment-to-global-indirect.ts:5:4
40 3 | // Cannot assign to globals
41 4 | someUnknownGlobal = true;
42 > 5 | moduleLocal = true;
41 - | ^^^^^^^^^^^ Cannot reassign variable
43 + | ^^^^^^^^^^^ `moduleLocal` cannot be reassigned
44 6 | };
45 7 | foo();
46 8 | }
compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/error.reassignment-to-global.expect.md
+6 -4
@@ -15,27 +15,29 @@ function Component() {
15
16 ```
17 Found 2 errors:
18 +
19 Error: Cannot reassign variables declared outside of the component/hook
20
20 -Reassigning a variable declared outside of the component/hook is a form of side effect, which can cause unpredictable behavior depending on when the component happens to re-render. If this variable is used in rendering, use useState instead. Otherwise, consider updating it in an effect (https://react.dev/reference/rules/components-and-hooks-must-be-pure#side-effects-must-run-outside-of-render)
21 +Variable `someUnknownGlobal` is declared outside of the component/hook. Reassigning this value during render is a form of side effect, which can cause unpredictable behavior depending on when the component happens to re-render. If this variable is used in rendering, use useState instead. Otherwise, consider updating it in an effect. (https://react.dev/reference/rules/components-and-hooks-must-be-pure#side-effects-must-run-outside-of-render)
22
23 error.reassignment-to-global.ts:3:2
24 1 | function Component() {
25 2 | // Cannot assign to globals
26 > 3 | someUnknownGlobal = true;
26 - | ^^^^^^^^^^^^^^^^^ Cannot reassign variable
27 + | ^^^^^^^^^^^^^^^^^ `someUnknownGlobal` cannot be reassigned
28 4 | moduleLocal = true;
29 5 | }
30 6 |
31 +
32 Error: Cannot reassign variables declared outside of the component/hook
33
32 -Reassigning a variable declared outside of the component/hook is a form of side effect, which can cause unpredictable behavior depending on when the component happens to re-render. If this variable is used in rendering, use useState instead. Otherwise, consider updating it in an effect (https://react.dev/reference/rules/components-and-hooks-must-be-pure#side-effects-must-run-outside-of-render)
34 +Variable `moduleLocal` is declared outside of the component/hook. Reassigning this value during render is a form of side effect, which can cause unpredictable behavior depending on when the component happens to re-render. If this variable is used in rendering, use useState instead. Otherwise, consider updating it in an effect. (https://react.dev/reference/rules/components-and-hooks-must-be-pure#side-effects-must-run-outside-of-render)
35
36 error.reassignment-to-global.ts:4:2
37 2 | // Cannot assign to globals
38 3 | someUnknownGlobal = true;
39 > 4 | moduleLocal = true;
38 - | ^^^^^^^^^^^ Cannot reassign variable
40 + | ^^^^^^^^^^^ `moduleLocal` cannot be reassigned
41 5 | }
42 6 |
43 ```
compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/error.ref-initialization-arbitrary.expect.md
+1 -5
@@ -26,9 +26,9 @@ export const FIXTURE_ENTRYPOINT = {
26
27 ```
28 Found 2 errors:
29 +
30 Error: Ref values (the `current` property) may not be accessed during render. (https://react.dev/reference/react/useRef)
31
31 -undefined:8:6
32 6 | component C() {
33 7 | const r = useRef(DEFAULT_VALUE);
34 > 8 | if (r.current == DEFAULT_VALUE) {
@@ -37,10 +37,8 @@ undefined:8:6
37 10 | }
38 11 | }
39
40 -
40 Error: Ref values (the `current` property) may not be accessed during render. (https://react.dev/reference/react/useRef)
41
43 -undefined:9:4
42 7 | const r = useRef(DEFAULT_VALUE);
43 8 | if (r.current == DEFAULT_VALUE) {
44 > 9 | r.current = 1;
@@ -48,8 +46,6 @@ undefined:9:4
46 10 | }
47 11 | }
48 12 |
51 -
52 -
49 ```
50
51
\ No newline at end of file
compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/error.ref-initialization-call-2.expect.md
+1 -3
@@ -24,9 +24,9 @@ export const FIXTURE_ENTRYPOINT = {
24
25 ```
26 Found 1 error:
27 +
28 Error: Ref values (the `current` property) may not be accessed during render. (https://react.dev/reference/react/useRef)
29
29 -undefined:7:6
30 5 | const r = useRef(null);
31 6 | if (r.current == null) {
32 > 7 | f(r);
@@ -34,8 +34,6 @@ undefined:7:6
34 8 | }
35 9 | }
36 10 |
37 -
38 -
37 ```
38
39
\ No newline at end of file
compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/error.ref-initialization-call.expect.md
+1 -3
@@ -24,9 +24,9 @@ export const FIXTURE_ENTRYPOINT = {
24
25 ```
26 Found 1 error:
27 +
28 Error: Ref values (the `current` property) may not be accessed during render. (https://react.dev/reference/react/useRef)
29
29 -undefined:7:6
30 5 | const r = useRef(null);
31 6 | if (r.current == null) {
32 > 7 | f(r.current);
@@ -34,8 +34,6 @@ undefined:7:6
34 8 | }
35 9 | }
36 10 |
37 -
38 -
37 ```
38
39
\ No newline at end of file
compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/error.ref-initialization-linear.expect.md
+1 -3
@@ -25,9 +25,9 @@ export const FIXTURE_ENTRYPOINT = {
25
26 ```
27 Found 1 error:
28 +
29 Error: Ref values (the `current` property) may not be accessed during render. (https://react.dev/reference/react/useRef)
30
30 -undefined:8:4
31 6 | if (r.current == null) {
32 7 | r.current = 42;
33 > 8 | r.current = 42;
@@ -35,8 +35,6 @@ undefined:8:4
35 9 | }
36 10 | }
37 11 |
38 -
39 -
38 ```
39
40
\ No newline at end of file
compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/error.ref-initialization-nonif.expect.md
+1 -5
@@ -25,9 +25,9 @@ export const FIXTURE_ENTRYPOINT = {
25
26 ```
27 Found 2 errors:
28 +
29 Error: Ref values (the `current` property) may not be accessed during render. (https://react.dev/reference/react/useRef)
30
30 -undefined:6:16
31 4 | component C() {
32 5 | const r = useRef(null);
33 > 6 | const guard = r.current == null;
@@ -36,12 +36,10 @@ undefined:6:16
36 8 | r.current = 1;
37 9 | }
38
39 -
39 Error: Ref values (the `current` property) may not be accessed during render. (https://react.dev/reference/react/useRef)
40
41 Cannot access ref value `guard`.
42
44 -undefined:7:6
43 5 | const r = useRef(null);
44 6 | const guard = r.current == null;
45 > 7 | if (guard) {
@@ -49,8 +47,6 @@ undefined:7:6
47 8 | r.current = 1;
48 9 | }
49 10 | }
52 -
53 -
50 ```
51
52
\ No newline at end of file
compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/error.ref-initialization-other.expect.md
+1 -3
@@ -25,9 +25,9 @@ export const FIXTURE_ENTRYPOINT = {
25
26 ```
27 Found 1 error:
28 +
29 Error: Ref values (the `current` property) may not be accessed during render. (https://react.dev/reference/react/useRef)
30
30 -undefined:8:4
31 6 | const r2 = useRef(null);
32 7 | if (r.current == null) {
33 > 8 | r2.current = 1;
@@ -35,8 +35,6 @@ undefined:8:4
35 9 | }
36 10 | }
37 11 |
38 -
39 -
38 ```
39
40
\ No newline at end of file
compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/error.ref-initialization-post-access-2.expect.md
+1 -3
@@ -25,9 +25,9 @@ export const FIXTURE_ENTRYPOINT = {
25
26 ```
27 Found 1 error:
28 +
29 Error: Ref values (the `current` property) may not be accessed during render. (https://react.dev/reference/react/useRef)
30
30 -undefined:9:4
31 7 | r.current = 1;
32 8 | }
33 > 9 | f(r.current);
@@ -35,8 +35,6 @@ undefined:9:4
35 10 | }
36 11 |
37 12 | export const FIXTURE_ENTRYPOINT = {
38 -
39 -
38 ```
39
40
\ No newline at end of file
compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/error.ref-initialization-post-access.expect.md
+1 -3
@@ -25,9 +25,9 @@ export const FIXTURE_ENTRYPOINT = {
25
26 ```
27 Found 1 error:
28 +
29 Error: Ref values (the `current` property) may not be accessed during render. (https://react.dev/reference/react/useRef)
30
30 -undefined:9:2
31 7 | r.current = 1;
32 8 | }
33 > 9 | r.current = 1;
@@ -35,8 +35,6 @@ undefined:9:2
35 10 | }
36 11 |
37 12 | export const FIXTURE_ENTRYPOINT = {
38 -
39 -
38 ```
39
40
\ No newline at end of file
compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/error.ref-like-name-not-Ref.expect.md
+1
@@ -32,6 +32,7 @@ export const FIXTURE_ENTRYPOINT = {
32
33 ```
34 Found 1 error:
35 +
36 Memoization: Compilation skipped because existing memoization could not be preserved
37
38 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.current`, but the source dependencies were []. Inferred dependency not present in source.
compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/error.ref-like-name-not-a-ref.expect.md
+1
@@ -32,6 +32,7 @@ export const FIXTURE_ENTRYPOINT = {
32
33 ```
34 Found 1 error:
35 +
36 Memoization: Compilation skipped because existing memoization could not be preserved
37
38 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 `notaref.current`, but the source dependencies were []. Inferred dependency not present in source.
compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/error.ref-optional.expect.md
+1 -2
@@ -21,6 +21,7 @@ export const FIXTURE_ENTRYPOINT = {
21
22 ```
23 Found 1 error:
24 +
25 Error: Ref values (the `current` property) may not be accessed during render. (https://react.dev/reference/react/useRef)
26
27 error.ref-optional.ts:5:9
@@ -31,8 +32,6 @@ error.ref-optional.ts:5:9
32 6 | }
33 7 |
34 8 | export const FIXTURE_ENTRYPOINT = {
34 -
35 -
35 ```
36
37
\ No newline at end of file
compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/error.repro-ref-mutable-range.expect.md
+1 -2
@@ -29,6 +29,7 @@ export const FIXTURE_ENTRYPOINT = {
29
30 ```
31 Found 1 error:
32 +
33 Error: Ref values (the `current` property) may not be accessed during render. (https://react.dev/reference/react/useRef)
34
35 error.repro-ref-mutable-range.ts:11:36
@@ -39,8 +40,6 @@ error.repro-ref-mutable-range.ts:11:36
40 12 | }
41 13 | return value;
42 14 | }
42 -
43 -
43 ```
44
45
\ No newline at end of file
compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/error.sketchy-code-exhaustive-deps.expect.md
+1 -2
@@ -21,6 +21,7 @@ function Component() {
21
22 ```
23 Found 1 error:
24 +
25 Error: 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
26
27 eslint-disable-next-line react-hooks/exhaustive-deps.
@@ -33,8 +34,6 @@ error.sketchy-code-exhaustive-deps.ts:6:7
34 7 | []
35 8 | );
36 9 |
36 -
37 -
37 ```
38
39
\ No newline at end of file
compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/error.sketchy-code-rules-of-hooks.expect.md
+1 -2
@@ -22,6 +22,7 @@ export const FIXTURE_ENTRYPOINT = {
22
23 ```
24 Found 1 error:
25 +
26 Error: 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
27
28 eslint-disable react-hooks/rules-of-hooks.
@@ -32,8 +33,6 @@ error.sketchy-code-rules-of-hooks.ts:1:0
33 2 | function lowercasecomponent() {
34 3 | const x = [];
35 4 | return <div>{x}</div>;
35 -
36 -
36 ```
37
38
\ No newline at end of file
compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/error.store-property-in-global.expect.md
+3 -2
@@ -16,15 +16,16 @@ function Foo() {
16
17 ```
18 Found 1 error:
19 +
20 Error: This value cannot be modified
21
21 -Modifying a variable defined outside a component or hook is not allowed. Consider using an effect
22 +Modifying a variable defined outside a component or hook is not allowed. Consider using an effect.
23
24 error.store-property-in-global.ts:4:2
25 2 |
26 3 | function Foo() {
27 > 4 | wat.test = 1;
27 - | ^^^ This value cannot be modified
28 + | ^^^ value cannot be modified
29 5 | return wat;
30 6 | }
31 7 |
compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/error.todo-for-await-loops.expect.md
+1 -2
@@ -17,6 +17,7 @@ async function Component({items}) {
17
18 ```
19 Found 1 error:
20 +
21 Todo: (BuildHIR::lowerStatement) Handle for-await loops
22
23 error.todo-for-await-loops.ts:3:2
@@ -31,8 +32,6 @@ error.todo-for-await-loops.ts:3:2
32 6 | return x;
33 7 | }
34 8 |
34 -
35 -
35 ```
36
37
\ No newline at end of file
compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/error.todo-for-in-loop-with-context-variable-iterator.expect.md
+1 -2
@@ -32,6 +32,7 @@ export const FIXTURE_ENTRYPOINT = {
32
33 ```
34 Found 1 error:
35 +
36 Todo: Support non-trivial for..in inits
37
38 error.todo-for-in-loop-with-context-variable-iterator.ts:8:2
@@ -56,8 +57,6 @@ error.todo-for-in-loop-with-context-variable-iterator.ts:8:2
57 16 | return <div>{items}</div>;
58 17 | }
59 18 |
59 -
60 -
60 ```
61
62
\ No newline at end of file
compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/error.todo-for-of-loop-with-context-variable-iterator.expect.md
+1 -2
@@ -32,6 +32,7 @@ export const FIXTURE_ENTRYPOINT = {
32
33 ```
34 Found 1 error:
35 +
36 Todo: Support non-trivial for..of inits
37
38 error.todo-for-of-loop-with-context-variable-iterator.ts:8:2
@@ -56,8 +57,6 @@ error.todo-for-of-loop-with-context-variable-iterator.ts:8:2
57 16 | return <div>{items}</div>;
58 17 | }
59 18 |
59 -
60 -
60 ```
61
62
\ No newline at end of file
compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/error.todo-function-expression-references-later-variable-declaration.expect.md
+4 -3
@@ -18,15 +18,16 @@ function Component() {
18
19 ```
20 Found 1 error:
21 -Error: Cannot reassign a variable after render completes
21
23 -Reassigning variable `onClick` after render has completed can cause inconsistent behavior on subsequent renders. Consider using state instead
22 +Error: Cannot reassign variable after render completes
23 +
24 +Reassigning `onClick` after render has completed can cause inconsistent behavior on subsequent renders. Consider using state instead.
25
26 error.todo-function-expression-references-later-variable-declaration.ts:3:4
27 1 | function Component() {
28 2 | let callback = () => {
29 > 3 | onClick = () => {};
29 - | ^^^^^^^ Cannot reassign variable after render completes
30 + | ^^^^^^^ Cannot reassign `onClick` after render completes
31 4 | };
32 5 | let onClick;
33 6 |
compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/error.todo-functiondecl-hoisting.expect.md
+1 -2
@@ -32,6 +32,7 @@ export const FIXTURE_ENTRYPOINT = {
32
33 ```
34 Found 1 error:
35 +
36 Todo: [PruneHoistedContexts] Rewrite hoisted function references
37
38 error.todo-functiondecl-hoisting.ts:12:17
@@ -42,8 +43,6 @@ error.todo-functiondecl-hoisting.ts:12:17
43 13 | function bar() {
44 14 | return {value};
45 15 | }
45 -
46 -
46 ```
47
48
\ No newline at end of file
compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/error.todo-handle-update-context-identifiers.expect.md
+1 -2
@@ -23,6 +23,7 @@ export const FIXTURE_ENTRYPOINT = {
23
24 ```
25 Found 1 error:
26 +
27 Todo: (BuildHIR::lowerExpression) Handle UpdateExpression to variables captured within lambdas.
28
29 error.todo-handle-update-context-identifiers.ts:4:11
@@ -33,8 +34,6 @@ error.todo-handle-update-context-identifiers.ts:4:11
34 5 | };
35 6 |
36 7 | return fn();
36 -
37 -
37 ```
38
39
\ No newline at end of file
compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/error.todo-hoist-function-decls.expect.md
+1 -2
@@ -16,6 +16,7 @@ function Component() {
16
17 ```
18 Found 1 error:
19 +
20 Todo: Support functions with unreachable code that may contain hoisted declarations
21
22 error.todo-hoist-function-decls.ts:3:2
@@ -29,8 +30,6 @@ error.todo-hoist-function-decls.ts:3:2
30 | ^^^^ Support functions with unreachable code that may contain hoisted declarations
31 6 | }
32 7 |
32 -
33 -
33 ```
34
35
\ No newline at end of file
compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/error.todo-hoisted-function-in-unreachable-code.expect.md
+1 -2
@@ -17,6 +17,7 @@ function Component() {
17
18 ```
19 Found 1 error:
20 +
21 Todo: Support functions with unreachable code that may contain hoisted declarations
22
23 error.todo-hoisted-function-in-unreachable-code.ts:6:2
@@ -26,8 +27,6 @@ error.todo-hoisted-function-in-unreachable-code.ts:6:2
27 | ^^^^^^^^^^^^^^^^^ Support functions with unreachable code that may contain hoisted declarations
28 7 | }
29 8 |
29 -
30 -
30 ```
31
32
\ No newline at end of file
compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/error.todo-hoisting-simple-var-declaration.expect.md
+1 -2
@@ -26,6 +26,7 @@ export const FIXTURE_ENTRYPOINT = {
26
27 ```
28 Found 1 error:
29 +
30 Todo: (BuildHIR::lowerStatement) Handle var kinds in VariableDeclaration
31
32 error.todo-hoisting-simple-var-declaration.ts:7:2
@@ -36,8 +37,6 @@ error.todo-hoisting-simple-var-declaration.ts:7:2
37 8 |
38 9 | return result; // OK: returns NaN. The code is semantically wrong but technically correct
39 10 | }
39 -
40 -
40 ```
41
42
\ No newline at end of file
compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/error.todo-hook-call-spreads-mutable-iterator.expect.md
+1 -2
@@ -22,6 +22,7 @@ export const FIXTURE_ENTRYPOINT = {
22
23 ```
24 Found 1 error:
25 +
26 Todo: Support spread syntax for hook arguments
27
28 error.todo-hook-call-spreads-mutable-iterator.ts:5:24
@@ -32,8 +33,6 @@ error.todo-hook-call-spreads-mutable-iterator.ts:5:24
33 6 | }
34 7 |
35 8 | export const FIXTURE_ENTRYPOINT = {
35 -
36 -
36 ```
37
38
\ No newline at end of file
compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/error.todo-invalid-jsx-in-catch-in-outer-try-with-finally.expect.md
+1 -2
@@ -27,6 +27,7 @@ function Component(props) {
27
28 ```
29 Found 1 error:
30 +
31 Todo: (BuildHIR::lowerStatement) Handle TryStatement without a catch clause
32
33 error.todo-invalid-jsx-in-catch-in-outer-try-with-finally.ts:6:2
@@ -55,8 +56,6 @@ error.todo-invalid-jsx-in-catch-in-outer-try-with-finally.ts:6:2
56 16 | return el;
57 17 | }
58 18 |
58 -
59 -
59 ```
60
61
\ No newline at end of file
compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/error.todo-invalid-jsx-in-try-with-finally.expect.md
+1 -2
@@ -20,6 +20,7 @@ function Component(props) {
20
21 ```
22 Found 1 error:
23 +
24 Todo: (BuildHIR::lowerStatement) Handle TryStatement without a catch clause
25
26 error.todo-invalid-jsx-in-try-with-finally.ts:4:2
@@ -38,8 +39,6 @@ error.todo-invalid-jsx-in-try-with-finally.ts:4:2
39 9 | return el;
40 10 | }
41 11 |
41 -
42 -
42 ```
43
44
\ No newline at end of file
compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/error.todo-kitchensink.expect.md
+1 -11
@@ -80,6 +80,7 @@ let moduleLocal = false;
80
81 ```
82 Found 10 errors:
83 +
84 Todo: (BuildHIR::lowerStatement) Handle var kinds in VariableDeclaration
85
86 error.todo-kitchensink.ts:3:2
@@ -91,7 +92,6 @@ error.todo-kitchensink.ts:3:2
92 5 | class Bar {
93 6 | #secretSauce = 42;
94
94 -
95 Error: Inline `class` declarations are not supported
96
97 Move class declarations outside of components/hooks.
@@ -115,7 +115,6 @@ error.todo-kitchensink.ts:5:2
115 12 | const g = {b() {}, c: () => {}};
116 13 | const {z, aa = 'aa'} = useCustom();
117
118 -
118 Todo: (BuildHIR::lowerStatement) Handle non-variable initialization in ForStatement
119
120 error.todo-kitchensink.ts:20:2
@@ -131,7 +130,6 @@ error.todo-kitchensink.ts:20:2
130 24 | break;
131 25 | }
132
134 -
133 Todo: (BuildHIR::lowerStatement) Handle non-variable initialization in ForStatement
134
135 error.todo-kitchensink.ts:23:2
@@ -147,7 +145,6 @@ error.todo-kitchensink.ts:23:2
145 27 | break;
146 28 | }
147
150 -
148 Todo: (BuildHIR::lowerStatement) Handle non-variable initialization in ForStatement
149
150 error.todo-kitchensink.ts:26:2
@@ -163,7 +160,6 @@ error.todo-kitchensink.ts:26:2
160 30 | graphql`
161 31 | ${g}
162
166 -
163 Todo: (BuildHIR::lowerStatement) Handle empty test in ForStatement
164
165 error.todo-kitchensink.ts:26:2
@@ -179,7 +175,6 @@ error.todo-kitchensink.ts:26:2
175 30 | graphql`
176 31 | ${g}
177
182 -
178 Todo: (BuildHIR::lowerExpression) Handle tagged template with interpolations
179
180 error.todo-kitchensink.ts:30:2
@@ -195,7 +190,6 @@ error.todo-kitchensink.ts:30:2
190 34 | graphql`\\t\n`;
191 35 |
192
198 -
193 Todo: (BuildHIR::lowerExpression) Handle tagged template where cooked value is different from raw value
194
195 error.todo-kitchensink.ts:34:2
@@ -207,7 +201,6 @@ error.todo-kitchensink.ts:34:2
201 36 | for (c of [1, 2]) {
202 37 | }
203
210 -
204 Todo: (BuildHIR::node.lowerReorderableExpression) Expression type `MemberExpression` cannot be safely reordered
205
206 error.todo-kitchensink.ts:57:9
@@ -219,7 +212,6 @@ error.todo-kitchensink.ts:57:9
212 59 | default: {
213 60 | }
214
222 -
215 Todo: (BuildHIR::node.lowerReorderableExpression) Expression type `BinaryExpression` cannot be safely reordered
216
217 error.todo-kitchensink.ts:53:9
@@ -230,8 +222,6 @@ error.todo-kitchensink.ts:53:9
222 54 | }
223 55 | case foo(): {
224 56 | }
233 -
234 -
225 ```
226
227
\ No newline at end of file
compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/error.todo-logical-expression-within-try-catch.expect.md
+1 -2
@@ -19,6 +19,7 @@ function Component(props) {
19
20 ```
21 Found 1 error:
22 +
23 Todo: Support value blocks (conditional, logical, optional chaining, etc) within a try/catch statement
24
25 error.todo-logical-expression-within-try-catch.ts:4:13
@@ -29,8 +30,6 @@ error.todo-logical-expression-within-try-catch.ts:4:13
30 5 | } catch (e) {
31 6 | console.log(e);
32 7 | }
32 -
33 -
33 ```
34
35
\ No newline at end of file
compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/error.todo-nested-method-calls-lower-property-load-into-temporary.expect.md
+1 -2
@@ -23,6 +23,7 @@ export const FIXTURE_ENTRYPOINT = {
23
24 ```
25 Found 1 error:
26 +
27 Invariant: [Codegen] Internal error: MethodCall::property must be an unpromoted + unmemoized MemberExpression. Got a `Identifier`
28
29 error.todo-nested-method-calls-lower-property-load-into-temporary.ts:6:14
@@ -33,8 +34,6 @@ error.todo-nested-method-calls-lower-property-load-into-temporary.ts:6:14
34 7 | return max;
35 8 | }
36 9 |
36 -
37 -
37 ```
38
39
\ No newline at end of file
compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/error.todo-new-target-meta-property.expect.md
+1 -2
@@ -16,6 +16,7 @@ function foo() {
16
17 ```
18 Found 1 error:
19 +
20 Todo: (BuildHIR::lowerExpression) Handle MetaProperty expressions other than import.meta
21
22 error.todo-new-target-meta-property.ts:4:13
@@ -26,8 +27,6 @@ error.todo-new-target-meta-property.ts:4:13
27 5 | return <Stringify value={nt} />;
28 6 | }
29 7 |
29 -
30 -
30 ```
31
32
\ No newline at end of file
compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/error.todo-object-expression-computed-key-modified-during-after-construction-sequence-expr.expect.md
+1 -2
@@ -25,6 +25,7 @@ export const FIXTURE_ENTRYPOINT = {
25
26 ```
27 Found 1 error:
28 +
29 Todo: (BuildHIR::lowerExpression) Expected Identifier, got SequenceExpression key in ObjectExpression
30
31 error.todo-object-expression-computed-key-modified-during-after-construction-sequence-expr.ts:6:6
@@ -35,8 +36,6 @@ error.todo-object-expression-computed-key-modified-during-after-construction-seq
36 7 | };
37 8 | mutate(key);
38 9 | return context;
38 -
39 -
39 ```
40
41
\ No newline at end of file
compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/error.todo-object-expression-computed-key-modified-during-after-construction.expect.md
+1 -2
@@ -25,6 +25,7 @@ export const FIXTURE_ENTRYPOINT = {
25
26 ```
27 Found 1 error:
28 +
29 Todo: (BuildHIR::lowerExpression) Expected Identifier, got CallExpression key in ObjectExpression
30
31 error.todo-object-expression-computed-key-modified-during-after-construction.ts:6:5
@@ -35,8 +36,6 @@ error.todo-object-expression-computed-key-modified-during-after-construction.ts:
36 7 | };
37 8 | mutate(key);
38 9 | return context;
38 -
39 -
39 ```
40
41
\ No newline at end of file
compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/error.todo-object-expression-computed-key-mutate-key-while-constructing-object.expect.md
+1 -2
@@ -24,6 +24,7 @@ export const FIXTURE_ENTRYPOINT = {
24
25 ```
26 Found 1 error:
27 +
28 Todo: (BuildHIR::lowerExpression) Expected Identifier, got CallExpression key in ObjectExpression
29
30 error.todo-object-expression-computed-key-mutate-key-while-constructing-object.ts:6:5
@@ -34,8 +35,6 @@ error.todo-object-expression-computed-key-mutate-key-while-constructing-object.t
35 7 | };
36 8 | return context;
37 9 | }
37 -
38 -
38 ```
39
40
\ No newline at end of file
compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/error.todo-object-expression-get-syntax.expect.md
+1 -2
@@ -24,6 +24,7 @@ export const FIXTURE_ENTRYPOINT = {
24
25 ```
26 Found 1 error:
27 +
28 Todo: (BuildHIR::lowerExpression) Handle get functions in ObjectExpression
29
30 error.todo-object-expression-get-syntax.ts:3:4
@@ -38,8 +39,6 @@ error.todo-object-expression-get-syntax.ts:3:4
39 6 | };
40 7 | return <div>{object.value}</div>;
41 8 | }
41 -
42 -
42 ```
43
44
\ No newline at end of file
compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/error.todo-object-expression-member-expr-call.expect.md
+1 -2
@@ -26,6 +26,7 @@ export const FIXTURE_ENTRYPOINT = {
26
27 ```
28 Found 1 error:
29 +
30 Todo: (BuildHIR::lowerExpression) Expected Identifier, got CallExpression key in ObjectExpression
31
32 error.todo-object-expression-member-expr-call.ts:7:5
@@ -36,8 +37,6 @@ error.todo-object-expression-member-expr-call.ts:7:5
37 8 | };
38 9 | mutate(key);
39 10 | return context;
39 -
40 -
40 ```
41
42
\ No newline at end of file
compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/error.todo-object-expression-set-syntax.expect.md
+1 -2
@@ -26,6 +26,7 @@ export const FIXTURE_ENTRYPOINT = {
26
27 ```
28 Found 1 error:
29 +
30 Todo: (BuildHIR::lowerExpression) Handle set functions in ObjectExpression
31
32 error.todo-object-expression-set-syntax.ts:4:4
@@ -40,8 +41,6 @@ error.todo-object-expression-set-syntax.ts:4:4
41 7 | };
42 8 | object.value = props.value;
43 9 | return <div>{value}</div>;
43 -
44 -
44 ```
45
46
\ No newline at end of file
compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/error.todo-optional-call-chain-in-logical-expr.expect.md
+1 -2
@@ -21,6 +21,7 @@ export const FIXTURE_ENTRYPONT = {
21
22 ```
23 Found 1 error:
24 +
25 Todo: Unexpected terminal kind `optional` for logical test block
26
27 error.todo-optional-call-chain-in-logical-expr.ts:5:30
@@ -31,8 +32,6 @@ error.todo-optional-call-chain-in-logical-expr.ts:5:30
32 6 | }
33 7 |
34 8 | export const FIXTURE_ENTRYPONT = {
34 -
35 -
35 ```
36
37
\ No newline at end of file
compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/error.todo-optional-call-chain-in-optional.expect.md
+1 -2
@@ -23,6 +23,7 @@ export const FIXTURE_ENTRYPONT = {
23
24 ```
25 Found 1 error:
26 +
27 Todo: Unexpected terminal kind `optional` for optional fallthrough block
28
29 error.todo-optional-call-chain-in-optional.ts:3:21
@@ -33,8 +34,6 @@ error.todo-optional-call-chain-in-optional.ts:3:21
34 4 | }
35 5 |
36 6 | function createArray<T>(...args: Array<T>): Array<T> {
36 -
37 -
37 ```
38
39
\ No newline at end of file
compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/error.todo-optional-call-chain-in-ternary.expect.md
+1 -2
@@ -21,6 +21,7 @@ export const FIXTURE_ENTRYPONT = {
21
22 ```
23 Found 1 error:
24 +
25 Todo: Unexpected terminal kind `optional` for ternary test block
26
27 error.todo-optional-call-chain-in-ternary.ts:5:30
@@ -31,8 +32,6 @@ error.todo-optional-call-chain-in-ternary.ts:5:30
32 6 | }
33 7 |
34 8 | export const FIXTURE_ENTRYPONT = {
34 -
35 -
35 ```
36
37
\ No newline at end of file
compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/error.todo-reassign-const.expect.md
+1 -2
@@ -22,6 +22,7 @@ function Component({foo}) {
22
23 ```
24 Found 1 error:
25 +
26 Todo: Support destructuring of context variables
27
28 error.todo-reassign-const.ts:3:20
@@ -32,8 +33,6 @@ error.todo-reassign-const.ts:3:20
33 4 | let bar = foo.bar;
34 5 | return (
35 6 | <Stringify
35 -
36 -
36 ```
37
38
\ No newline at end of file
compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/error.todo-repro-declaration-for-all-identifiers.expect.md
+1 -2
@@ -17,6 +17,7 @@ function Foo() {
17
18 ```
19 Found 1 error:
20 +
21 Todo: Support value blocks (conditional, logical, optional chaining, etc) within a try/catch statement
22
23 error.todo-repro-declaration-for-all-identifiers.ts:5:20
@@ -27,8 +28,6 @@ error.todo-repro-declaration-for-all-identifiers.ts:5:20
28 6 | } catch {}
29 7 | }
30 8 |
30 -
31 -
31 ```
32
33
\ No newline at end of file
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
+1 -1
@@ -43,11 +43,11 @@ component Component() {
43
44 ```
45 Found 1 error:
46 +
47 Memoization: Compilation skipped because existing memoization could not be preserved
48
49 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.
50
50 -undefined:18:20
51 16 | // We infer that getIsEnabled returns a mutable value, such that
52 17 | // isEnabled is mutable
53 > 18 | const isEnabled = useMemo(() => getIsEnabled(), [getIsEnabled]);
compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/error.todo-repro-missed-memoization-from-inferred-mutation-in-logger.expect.md
+3 -3
@@ -53,11 +53,11 @@ component Component(id) {
53
54 ```
55 Found 3 errors:
56 +
57 Memoization: Compilation skipped because existing memoization could not be preserved
58
59 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.
60
60 -undefined:11:18
61 9 | const [index, setIndex] = useState(0);
62 10 |
63 > 11 | const logData = useMemo(() => {
@@ -75,11 +75,11 @@ undefined:11:18
75 17 |
76 18 | const setCurrentIndex = useCallback(
77 19 | (index: number) => {
78 +
79 Memoization: Compilation skipped because existing memoization could not be preserved
80
81 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.
82
82 -undefined:28:12
83 26 | setIndex(index);
84 27 | },
85 > 28 | [index, logData, items]
@@ -87,11 +87,11 @@ undefined:28:12
87 29 | );
88 30 |
89 31 | if (prevId !== id) {
90 +
91 Memoization: Compilation skipped because existing memoization could not be preserved
92
93 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.
94
94 -undefined:19:4
95 17 |
96 18 | const setCurrentIndex = useCallback(
97 > 19 | (index: number) => {
compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/error.todo-repro-named-function-with-shadowed-local-same-name.expect.md
+1 -2
@@ -20,6 +20,7 @@ function Component(props) {
20
21 ```
22 Found 1 error:
23 +
24 Invariant: [InferMutationAliasingEffects] Expected value kind to be initialized
25
26 <unknown> hasErrors_0$15:TFunction.
@@ -31,8 +32,6 @@ error.todo-repro-named-function-with-shadowed-local-same-name.ts:9:9
32 | ^^^^^^^^^ [InferMutationAliasingEffects] Expected value kind to be initialized
33 10 | }
34 11 |
34 -
35 -
35 ```
36
37
\ No newline at end of file
compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/error.todo-repro-unmemoized-callback-captured-in-context-variable.expect.md
+1
@@ -51,6 +51,7 @@ export const FIXTURE_ENTRYPOINT = {
51
52 ```
53 Found 1 error:
54 +
55 Memoization: Compilation skipped because existing memoization could not be preserved
56
57 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.
compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/error.todo-useCallback-set-ref-nested-property-ref-modified-later-preserve-memoization.expect.md
+1 -2
@@ -32,6 +32,7 @@ export const FIXTURE_ENTRYPOINT = {
32
33 ```
34 Found 1 error:
35 +
36 Error: Ref values (the `current` property) may not be accessed during render. (https://react.dev/reference/react/useRef)
37
38 error.todo-useCallback-set-ref-nested-property-ref-modified-later-preserve-memoization.ts:14:2
@@ -42,8 +43,6 @@ error.todo-useCallback-set-ref-nested-property-ref-modified-later-preserve-memoi
43 15 |
44 16 | return <input onChange={onChange} />;
45 17 | }
45 -
46 -
46 ```
47
48
\ No newline at end of file
compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/error.todo-valid-functiondecl-hoisting.expect.md
+1 -2
@@ -35,6 +35,7 @@ export const FIXTURE_ENTRYPOINT = {
35
36 ```
37 Found 1 error:
38 +
39 Todo: [PruneHoistedContexts] Rewrite hoisted function references
40
41 error.todo-valid-functiondecl-hoisting.ts:13:11
@@ -45,8 +46,6 @@ error.todo-valid-functiondecl-hoisting.ts:13:11
46 14 | }
47 15 | function bar() {
48 16 | return 42;
48 -
49 -
49 ```
50
51
\ No newline at end of file
compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/error.todo.try-catch-with-throw.expect.md
+1 -2
@@ -19,6 +19,7 @@ function Component(props) {
19
20 ```
21 Found 1 error:
22 +
23 Todo: (BuildHIR::lowerStatement) Support ThrowStatement inside of try/catch
24
25 error.todo.try-catch-with-throw.ts:4:4
@@ -29,8 +30,6 @@ error.todo.try-catch-with-throw.ts:4:4
30 5 | } catch (e) {
31 6 | x.push(e);
32 7 | }
32 -
33 -
33 ```
34
35
\ No newline at end of file
compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/error.unconditional-set-state-in-render-after-loop-break.expect.md
+1
@@ -23,6 +23,7 @@ function Component(props) {
23
24 ```
25 Found 1 error:
26 +
27 Error: Calling setState during render may trigger an infinite loop
28
29 Calling setState during render will trigger another render, and can lead to infinite loops. (https://react.dev/reference/react/useState)
compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/error.unconditional-set-state-in-render-after-loop.expect.md
+1
@@ -18,6 +18,7 @@ function Component(props) {
18
19 ```
20 Found 1 error:
21 +
22 Error: Calling setState during render may trigger an infinite loop
23
24 Calling setState during render will trigger another render, and can lead to infinite loops. (https://react.dev/reference/react/useState)
compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/error.unconditional-set-state-in-render-with-loop-throw.expect.md
+1
@@ -23,6 +23,7 @@ function Component(props) {
23
24 ```
25 Found 1 error:
26 +
27 Error: Calling setState during render may trigger an infinite loop
28
29 Calling setState during render will trigger another render, and can lead to infinite loops. (https://react.dev/reference/react/useState)
compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/error.unconditional-set-state-lambda.expect.md
+1
@@ -21,6 +21,7 @@ function Component(props) {
21
22 ```
23 Found 1 error:
24 +
25 Error: Calling setState during render may trigger an infinite loop
26
27 Calling setState during render will trigger another render, and can lead to infinite loops. (https://react.dev/reference/react/useState)
compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/error.unconditional-set-state-nested-function-expressions.expect.md
+1
@@ -29,6 +29,7 @@ function Component(props) {
29
30 ```
31 Found 1 error:
32 +
33 Error: Calling setState during render may trigger an infinite loop
34
35 Calling setState during render will trigger another render, and can lead to infinite loops. (https://react.dev/reference/react/useState)
compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/error.update-global-should-bailout.expect.md
+3 -2
@@ -20,15 +20,16 @@ export const FIXTURE_ENTRYPOINT = {
20
21 ```
22 Found 1 error:
23 +
24 Error: Cannot reassign variables declared outside of the component/hook
25
25 -Reassigning a variable declared outside of the component/hook is a form of side effect, which can cause unpredictable behavior depending on when the component happens to re-render. If this variable is used in rendering, use useState instead. Otherwise, consider updating it in an effect (https://react.dev/reference/rules/components-and-hooks-must-be-pure#side-effects-must-run-outside-of-render)
26 +Variable `renderCount` is declared outside of the component/hook. Reassigning this value during render is a form of side effect, which can cause unpredictable behavior depending on when the component happens to re-render. If this variable is used in rendering, use useState instead. Otherwise, consider updating it in an effect. (https://react.dev/reference/rules/components-and-hooks-must-be-pure#side-effects-must-run-outside-of-render)
27
28 error.update-global-should-bailout.ts:3:2
29 1 | let renderCount = 0;
30 2 | function useFoo() {
31 > 3 | renderCount += 1;
31 - | ^^^^^^^^^^^^^^^^ Cannot reassign variable
32 + | ^^^^^^^^^^^^^^^^ `renderCount` cannot be reassigned
33 4 | return renderCount;
34 5 | }
35 6 |
compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/error.useCallback-accesses-ref-mutated-later-via-function-preserve-memoization.expect.md
+1 -3
@@ -35,6 +35,7 @@ export const FIXTURE_ENTRYPOINT = {
35
36 ```
37 Found 2 errors:
38 +
39 Error: This function accesses a ref value (the `current` property), which may not be accessed during render. (https://react.dev/reference/react/useRef)
40
41 error.useCallback-accesses-ref-mutated-later-via-function-preserve-memoization.ts:17:2
@@ -46,7 +47,6 @@ error.useCallback-accesses-ref-mutated-later-via-function-preserve-memoization.t
47 19 | return <input onChange={onChange} />;
48 20 | }
49
49 -
50 Error: Ref values (the `current` property) may not be accessed during render. (https://react.dev/reference/react/useRef)
51
52 error.useCallback-accesses-ref-mutated-later-via-function-preserve-memoization.ts:17:2
@@ -57,8 +57,6 @@ error.useCallback-accesses-ref-mutated-later-via-function-preserve-memoization.t
57 18 |
58 19 | return <input onChange={onChange} />;
59 20 | }
60 -
61 -
60 ```
61
62
\ No newline at end of file
compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/error.useCallback-set-ref-nested-property-dont-preserve-memoization.expect.md
+1 -2
@@ -31,6 +31,7 @@ export const FIXTURE_ENTRYPOINT = {
31
32 ```
33 Found 1 error:
34 +
35 Error: Ref values (the `current` property) may not be accessed during render. (https://react.dev/reference/react/useRef)
36
37 error.useCallback-set-ref-nested-property-dont-preserve-memoization.ts:13:2
@@ -41,8 +42,6 @@ error.useCallback-set-ref-nested-property-dont-preserve-memoization.ts:13:2
42 14 |
43 15 | return <input onChange={onChange} />;
44 16 | }
44 -
45 -
45 ```
46
47
\ No newline at end of file
compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/error.useMemo-callback-generator.expect.md
+1 -2
@@ -19,6 +19,7 @@ function component(a, b) {
19
20 ```
21 Found 1 error:
22 +
23 Todo: (BuildHIR::lowerExpression) Handle YieldExpression expressions
24
25 error.useMemo-callback-generator.ts:6:4
@@ -29,8 +30,6 @@ error.useMemo-callback-generator.ts:6:4
30 7 | }, []);
31 8 | return x;
32 9 | }
32 -
33 -
33 ```
34
35
\ No newline at end of file
compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/error.useMemo-non-literal-depslist.expect.md
+1 -2
@@ -29,6 +29,7 @@ export const FIXTURE_ENTRYPOINT = {
29
30 ```
31 Found 1 error:
32 +
33 Error: Expected the dependency list for useMemo to be an array literal
34
35 error.useMemo-non-literal-depslist.ts:10:4
@@ -39,8 +40,6 @@ error.useMemo-non-literal-depslist.ts:10:4
40 11 | );
41 12 | return resolvedText;
42 13 | }
42 -
43 -
43 ```
44
45
\ No newline at end of file
compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/error.validate-blocklisted-imports.expect.md
+1 -2
@@ -18,6 +18,7 @@ function useHook() {
18
19 ```
20 Found 1 error:
21 +
22 Todo: Bailing out due to blocklisted import
23
24 Import from module DangerousImport.
@@ -29,8 +30,6 @@ error.validate-blocklisted-imports.ts:2:0
30 3 | import {useIdentity} from 'shared-runtime';
31 4 |
32 5 | function useHook() {
32 -
33 -
33 ```
34
35
\ No newline at end of file
compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/error.validate-memoized-effect-deps-invalidated-dep-value.expect.md
+1 -2
@@ -29,6 +29,7 @@ export const FIXTURE_ENTRYPOINT = {
29
30 ```
31 Found 1 error:
32 +
33 Memoization: React Compiler has skipped optimizing this component because the effect dependencies could not be memoized. Unmemoized effect dependencies can trigger an infinite loop or other unexpected behavior
34
35 error.validate-memoized-effect-deps-invalidated-dep-value.ts:11:2
@@ -43,8 +44,6 @@ error.validate-memoized-effect-deps-invalidated-dep-value.ts:11:2
44 14 | }
45 15 |
46 16 | export const FIXTURE_ENTRYPOINT = {
46 -
47 -
47 ```
48
49
\ No newline at end of file
compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/error.validate-mutate-ref-arg-in-render.expect.md
+1 -2
@@ -21,6 +21,7 @@ export const FIXTURE_ENTRYPOINT = {
21
22 ```
23 Found 1 error:
24 +
25 Error: Ref values (the `current` property) may not be accessed during render. (https://react.dev/reference/react/useRef)
26
27 error.validate-mutate-ref-arg-in-render.ts:3:14
@@ -31,8 +32,6 @@ error.validate-mutate-ref-arg-in-render.ts:3:14
32 4 | return <div>{props.bar}</div>;
33 5 | }
34 6 |
34 -
35 -
35 ```
36
37
\ No newline at end of file
compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/fbt/error.todo-fbt-as-local.expect.md
+1
@@ -51,6 +51,7 @@ export const FIXTURE_ENTRYPOINT = {
51
52 ```
53 Found 1 error:
54 +
55 Todo: Support local variables named `fbt`
56
57 Local variables named `fbt` may conflict with the fbt plugin and are not yet supported
compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/fbt/error.todo-fbt-unknown-enum-value.expect.md
+1
@@ -20,6 +20,7 @@ function Component({a, b}) {
20
21 ```
22 Found 1 error:
23 +
24 Todo: Support duplicate fbt tags
25
26 Support `<fbt>` tags with multiple `<fbt:enum>` values
compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/fbt/error.todo-locally-require-fbt.expect.md
+1
@@ -15,6 +15,7 @@ function Component(props) {
15
16 ```
17 Found 1 error:
18 +
19 Todo: Support local variables named `fbt`
20
21 Local variables named `fbt` may conflict with the fbt plugin and are not yet supported
compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/fbt/error.todo-multiple-fbt-plural.expect.md
+1
@@ -54,6 +54,7 @@ export const FIXTURE_ENTRYPOINT = {
54
55 ```
56 Found 1 error:
57 +
58 Todo: Support duplicate fbt tags
59
60 Support `<fbt>` tags with multiple `<fbt:plural>` values
compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/gating/error.dynamic-gating-invalid-identifier-nopanic-required-feature.expect.md
+1
@@ -24,6 +24,7 @@ export const FIXTURE_ENTRYPOINT = {
24
25 ```
26 Found 1 error:
27 +
28 Error: Cannot infer dependencies of this effect. This will break your build!
29
30 To resolve, either pass a dependency array or fix reported compiler bailout diagnostics.
compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/gating/error.dynamic-gating-invalid-identifier.expect.md
+1 -2
@@ -21,6 +21,7 @@ export const FIXTURE_ENTRYPOINT = {
21
22 ```
23 Found 1 error:
24 +
25 Error: Dynamic gating directive is not a valid JavaScript identifier
26
27 Found 'use memo if(true)'.
@@ -33,8 +34,6 @@ error.dynamic-gating-invalid-identifier.ts:4:2
34 5 | return <div>hello world</div>;
35 6 | }
36 7 |
36 -
37 -
37 ```
38
39
\ No newline at end of file
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
+1
@@ -17,6 +17,7 @@ function nonReactFn(arg) {
17
18 ```
19 Found 1 error:
20 +
21 Error: Cannot infer dependencies of this effect. This will break your build!
22
23 To resolve, either pass a dependency array or fix reported compiler bailout diagnostics.
compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/infer-effect-dependencies/bailout-retry/error.callsite-in-non-react-fn.expect.md
+1
@@ -16,6 +16,7 @@ function nonReactFn(arg) {
16
17 ```
18 Found 1 error:
19 +
20 Error: Cannot infer dependencies of this effect. This will break your build!
21
22 To resolve, either pass a dependency array or fix reported compiler bailout diagnostics.
compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/infer-effect-dependencies/bailout-retry/error.non-inlined-effect-fn.expect.md
+1
@@ -31,6 +31,7 @@ function Component({foo}) {
31
32 ```
33 Found 1 error:
34 +
35 Error: Cannot infer dependencies of this effect. This will break your build!
36
37 To resolve, either pass a dependency array or fix reported compiler bailout diagnostics.
compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/infer-effect-dependencies/bailout-retry/error.todo-dynamic-gating.expect.md
+1
@@ -32,6 +32,7 @@ export const FIXTURE_ENTRYPOINT = {
32
33 ```
34 Found 1 error:
35 +
36 Error: Cannot infer dependencies of this effect. This will break your build!
37
38 To resolve, either pass a dependency array or fix reported compiler bailout diagnostics.
compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/infer-effect-dependencies/bailout-retry/error.todo-gating.expect.md
+1
@@ -30,6 +30,7 @@ export const FIXTURE_ENTRYPOINT = {
30
31 ```
32 Found 1 error:
33 +
34 Error: Cannot infer dependencies of this effect. This will break your build!
35
36 To resolve, either pass a dependency array or fix reported compiler bailout diagnostics.
compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/infer-effect-dependencies/bailout-retry/error.todo-import-default-property-useEffect.expect.md
+1
@@ -17,6 +17,7 @@ function NonReactiveDepInEffect() {
17
18 ```
19 Found 1 error:
20 +
21 Error: Cannot infer dependencies of this effect. This will break your build!
22
23 To resolve, either pass a dependency array or fix reported compiler bailout diagnostics.
compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/infer-effect-dependencies/bailout-retry/error.todo-syntax.expect.md
+1
@@ -33,6 +33,7 @@ function Component({prop1}) {
33
34 ```
35 Found 1 error:
36 +
37 Error: Cannot infer dependencies of this effect. This will break your build!
38
39 To resolve, either pass a dependency array or fix reported compiler bailout diagnostics. Todo: (BuildHIR::lowerStatement) Handle TryStatement without a catch clause (13:6)
compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/infer-effect-dependencies/bailout-retry/error.use-no-memo.expect.md
+1
@@ -17,6 +17,7 @@ function Component({propVal}) {
17
18 ```
19 Found 1 error:
20 +
21 Error: Cannot infer dependencies of this effect. This will break your build!
22
23 To resolve, either pass a dependency array or fix reported compiler bailout diagnostics.
compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/infer-effect-dependencies/bailout-retry/mutate-after-useeffect-optional-chain.expect.md
+1 -1
@@ -48,7 +48,7 @@ export const FIXTURE_ENTRYPOINT = {
48 ## Logs
49
50 ```
51 -{"kind":"CompileError","fnLoc":{"start":{"line":5,"column":0,"index":149},"end":{"line":12,"column":1,"index":404},"filename":"mutate-after-useeffect-optional-chain.ts"},"detail":{"options":{"severity":"InvalidReact","category":"This value cannot be modified","description":"Modifying a value used previously in an effect function or as an effect dependency is not allowed. Consider moving the modification before calling useEffect()","details":[{"kind":"error","loc":{"start":{"line":10,"column":2,"index":365},"end":{"line":10,"column":5,"index":368},"filename":"mutate-after-useeffect-optional-chain.ts","identifierName":"arr"},"message":"This value cannot be modified"}]}}}
51 +{"kind":"CompileError","fnLoc":{"start":{"line":5,"column":0,"index":149},"end":{"line":12,"column":1,"index":404},"filename":"mutate-after-useeffect-optional-chain.ts"},"detail":{"options":{"severity":"InvalidReact","category":"This value cannot be modified","description":"Modifying a value used previously in an effect function or as an effect dependency is not allowed. Consider moving the modification before calling useEffect().","details":[{"kind":"error","loc":{"start":{"line":10,"column":2,"index":365},"end":{"line":10,"column":5,"index":368},"filename":"mutate-after-useeffect-optional-chain.ts","identifierName":"arr"},"message":"value cannot be modified"}]}}}
52 {"kind":"AutoDepsDecorations","fnLoc":{"start":{"line":9,"column":2,"index":314},"end":{"line":9,"column":49,"index":361},"filename":"mutate-after-useeffect-optional-chain.ts"},"decorations":[{"start":{"line":9,"column":24,"index":336},"end":{"line":9,"column":27,"index":339},"filename":"mutate-after-useeffect-optional-chain.ts","identifierName":"arr"}]}
53 {"kind":"CompileSuccess","fnLoc":{"start":{"line":5,"column":0,"index":149},"end":{"line":12,"column":1,"index":404},"filename":"mutate-after-useeffect-optional-chain.ts"},"fnName":"Component","memoSlots":0,"memoBlocks":0,"memoValues":0,"prunedMemoBlocks":0,"prunedMemoValues":0}
54 ```
compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/infer-effect-dependencies/bailout-retry/mutate-after-useeffect-ref-access.expect.md
+1 -1
@@ -47,7 +47,7 @@ export const FIXTURE_ENTRYPOINT = {
47 ## Logs
48
49 ```
50 -{"kind":"CompileError","fnLoc":{"start":{"line":6,"column":0,"index":158},"end":{"line":11,"column":1,"index":331},"filename":"mutate-after-useeffect-ref-access.ts"},"detail":{"options":{"severity":"InvalidReact","category":"This value cannot be modified","description":"Modifying component props or hook arguments is not allowed. Consider using a local variable instead","details":[{"kind":"error","loc":{"start":{"line":9,"column":2,"index":289},"end":{"line":9,"column":16,"index":303},"filename":"mutate-after-useeffect-ref-access.ts"},"message":"This value cannot be modified"}]}}}
50 +{"kind":"CompileError","fnLoc":{"start":{"line":6,"column":0,"index":158},"end":{"line":11,"column":1,"index":331},"filename":"mutate-after-useeffect-ref-access.ts"},"detail":{"options":{"severity":"InvalidReact","category":"This value cannot be modified","description":"Modifying component props or hook arguments is not allowed. Consider using a local variable instead.","details":[{"kind":"error","loc":{"start":{"line":9,"column":2,"index":289},"end":{"line":9,"column":16,"index":303},"filename":"mutate-after-useeffect-ref-access.ts"},"message":"value cannot be modified"}]}}}
51 {"kind":"AutoDepsDecorations","fnLoc":{"start":{"line":8,"column":2,"index":237},"end":{"line":8,"column":50,"index":285},"filename":"mutate-after-useeffect-ref-access.ts"},"decorations":[{"start":{"line":8,"column":24,"index":259},"end":{"line":8,"column":30,"index":265},"filename":"mutate-after-useeffect-ref-access.ts","identifierName":"arrRef"}]}
52 {"kind":"CompileSuccess","fnLoc":{"start":{"line":6,"column":0,"index":158},"end":{"line":11,"column":1,"index":331},"filename":"mutate-after-useeffect-ref-access.ts"},"fnName":"Component","memoSlots":0,"memoBlocks":0,"memoValues":0,"prunedMemoBlocks":0,"prunedMemoValues":0}
53 ```
compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/infer-effect-dependencies/bailout-retry/mutate-after-useeffect.expect.md
+1 -1
@@ -47,7 +47,7 @@ export const FIXTURE_ENTRYPOINT = {
47 ## Logs
48
49 ```
50 -{"kind":"CompileError","fnLoc":{"start":{"line":4,"column":0,"index":111},"end":{"line":11,"column":1,"index":242},"filename":"mutate-after-useeffect.ts"},"detail":{"options":{"severity":"InvalidReact","category":"This value cannot be modified","description":"Modifying a value used previously in an effect function or as an effect dependency is not allowed. Consider moving the modification before calling useEffect()","details":[{"kind":"error","loc":{"start":{"line":9,"column":2,"index":214},"end":{"line":9,"column":5,"index":217},"filename":"mutate-after-useeffect.ts","identifierName":"arr"},"message":"This value cannot be modified"}]}}}
50 +{"kind":"CompileError","fnLoc":{"start":{"line":4,"column":0,"index":111},"end":{"line":11,"column":1,"index":242},"filename":"mutate-after-useeffect.ts"},"detail":{"options":{"severity":"InvalidReact","category":"This value cannot be modified","description":"Modifying a value used previously in an effect function or as an effect dependency is not allowed. Consider moving the modification before calling useEffect().","details":[{"kind":"error","loc":{"start":{"line":9,"column":2,"index":214},"end":{"line":9,"column":5,"index":217},"filename":"mutate-after-useeffect.ts","identifierName":"arr"},"message":"value cannot be modified"}]}}}
51 {"kind":"AutoDepsDecorations","fnLoc":{"start":{"line":6,"column":2,"index":159},"end":{"line":8,"column":14,"index":210},"filename":"mutate-after-useeffect.ts"},"decorations":[{"start":{"line":7,"column":4,"index":181},"end":{"line":7,"column":7,"index":184},"filename":"mutate-after-useeffect.ts","identifierName":"arr"},{"start":{"line":7,"column":4,"index":181},"end":{"line":7,"column":7,"index":184},"filename":"mutate-after-useeffect.ts","identifierName":"arr"},{"start":{"line":7,"column":13,"index":190},"end":{"line":7,"column":16,"index":193},"filename":"mutate-after-useeffect.ts","identifierName":"foo"}]}
52 {"kind":"CompileSuccess","fnLoc":{"start":{"line":4,"column":0,"index":111},"end":{"line":11,"column":1,"index":242},"filename":"mutate-after-useeffect.ts"},"fnName":"Component","memoSlots":0,"memoBlocks":0,"memoValues":0,"prunedMemoBlocks":0,"prunedMemoValues":0}
53 ```
compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/infer-effect-dependencies/no-emit/retry-no-emit.expect.md
+1 -1
@@ -54,7 +54,7 @@ export const FIXTURE_ENTRYPOINT = {
54 ## Logs
55
56 ```
57 -{"kind":"CompileError","fnLoc":{"start":{"line":6,"column":0,"index":195},"end":{"line":14,"column":1,"index":409},"filename":"retry-no-emit.ts"},"detail":{"options":{"severity":"InvalidReact","category":"This value cannot be modified","description":"Modifying a value previously passed as an argument to a hook is not allowed. Consider moving the modification before calling the hook","details":[{"kind":"error","loc":{"start":{"line":12,"column":2,"index":372},"end":{"line":12,"column":6,"index":376},"filename":"retry-no-emit.ts","identifierName":"arr2"},"message":"This value cannot be modified"}]}}}
57 +{"kind":"CompileError","fnLoc":{"start":{"line":6,"column":0,"index":195},"end":{"line":14,"column":1,"index":409},"filename":"retry-no-emit.ts"},"detail":{"options":{"severity":"InvalidReact","category":"This value cannot be modified","description":"Modifying a value previously passed as an argument to a hook is not allowed. Consider moving the modification before calling the hook.","details":[{"kind":"error","loc":{"start":{"line":12,"column":2,"index":372},"end":{"line":12,"column":6,"index":376},"filename":"retry-no-emit.ts","identifierName":"arr2"},"message":"value cannot be modified"}]}}}
58 {"kind":"AutoDepsDecorations","fnLoc":{"start":{"line":8,"column":2,"index":248},"end":{"line":8,"column":46,"index":292},"filename":"retry-no-emit.ts"},"decorations":[{"start":{"line":8,"column":31,"index":277},"end":{"line":8,"column":34,"index":280},"filename":"retry-no-emit.ts","identifierName":"arr"}]}
59 {"kind":"AutoDepsDecorations","fnLoc":{"start":{"line":11,"column":2,"index":316},"end":{"line":11,"column":54,"index":368},"filename":"retry-no-emit.ts"},"decorations":[{"start":{"line":11,"column":25,"index":339},"end":{"line":11,"column":29,"index":343},"filename":"retry-no-emit.ts","identifierName":"arr2"},{"start":{"line":11,"column":25,"index":339},"end":{"line":11,"column":29,"index":343},"filename":"retry-no-emit.ts","identifierName":"arr2"},{"start":{"line":11,"column":35,"index":349},"end":{"line":11,"column":42,"index":356},"filename":"retry-no-emit.ts","identifierName":"propVal"}]}
60 {"kind":"CompileSuccess","fnLoc":{"start":{"line":6,"column":0,"index":195},"end":{"line":14,"column":1,"index":409},"filename":"retry-no-emit.ts"},"fnName":"Foo","memoSlots":0,"memoBlocks":0,"memoValues":0,"prunedMemoBlocks":0,"prunedMemoValues":0}
compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/new-mutability/error.invalid-impure-functions-in-render.expect.md
+3
@@ -18,6 +18,7 @@ function Component() {
18
19 ```
20 Found 3 errors:
21 +
22 Error: Cannot call impure function during render
23
24 `Date.now` is an impure function. Calling an impure function can produce unstable results that update unpredictably when the component happens to re-render. (https://react.dev/reference/rules/components-and-hooks-must-be-pure#components-and-hooks-must-be-idempotent)
@@ -30,6 +31,7 @@ error.invalid-impure-functions-in-render.ts:4:15
31 5 | const now = performance.now();
32 6 | const rand = Math.random();
33 7 | return <Foo date={date} now={now} rand={rand} />;
34 +
35 Error: Cannot call impure function during render
36
37 `performance.now` is an impure function. Calling an impure function can produce unstable results that update unpredictably when the component happens to re-render. (https://react.dev/reference/rules/components-and-hooks-must-be-pure#components-and-hooks-must-be-idempotent)
@@ -42,6 +44,7 @@ error.invalid-impure-functions-in-render.ts:5:14
44 6 | const rand = Math.random();
45 7 | return <Foo date={date} now={now} rand={rand} />;
46 8 | }
47 +
48 Error: Cannot call impure function during render
49
50 `Math.random` is an impure function. Calling an impure function can produce unstable results that update unpredictably when the component happens to re-render. (https://react.dev/reference/rules/components-and-hooks-must-be-pure#components-and-hooks-must-be-idempotent)
compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/new-mutability/error.invalid-reassign-local-variable-in-jsx-callback.expect.md
+4 -3
@@ -43,15 +43,16 @@ function Component() {
43
44 ```
45 Found 1 error:
46 -Error: Cannot reassign a variable after render completes
46
48 -Reassigning variable `local` after render has completed can cause inconsistent behavior on subsequent renders. Consider using state instead
47 +Error: Cannot reassign variable after render completes
48 +
49 +Reassigning `local` after render has completed can cause inconsistent behavior on subsequent renders. Consider using state instead.
50
51 error.invalid-reassign-local-variable-in-jsx-callback.ts:6:4
52 4 |
53 5 | const reassignLocal = newValue => {
54 > 6 | local = newValue;
54 - | ^^^^^ Cannot reassign variable after render completes
55 + | ^^^^^ Cannot reassign `local` after render completes
56 7 | };
57 8 |
58 9 | const onClick = newValue => {
compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/new-mutability/error.invalid-referencing-frozen-hoisted-storecontext-const.expect.md
+4 -5
@@ -32,24 +32,23 @@ function Component({content, refetch}) {
32
33 ```
34 Found 1 error:
35 +
36 Error: Cannot access variable before it is declared
37
37 -Variable `data` is accessed before it is declared, which prevents the earlier access from updating when this value changes over time
38 +`data` is accessed before it is declared, which prevents the earlier access from updating when this value changes over time.
39
39 -undefined:11:12
40 9 | // TDZ violation!
41 10 | const onRefetch = useCallback(() => {
42 > 11 | refetch(data);
43 - | ^^^^ Variable accessed before it is declared
43 + | ^^^^ `data` accessed before it is declared
44 12 | }, [refetch]);
45 13 |
46 14 | // The context variable gets frozen here since it's passed to a hook
47
48 -undefined:19:9
48 17 | // This has to error: onRefetch needs to memoize with `content` as a
49 18 | // dependency, but the dependency comes later
50 > 19 | const {data = null} = content;
52 - | ^^^^^^^^^^^ The variable is declared here
51 + | ^^^^^^^^^^^ `data` is declared here
52 20 |
53 21 | return <Foo data={data} onSubmit={onSubmit} />;
54 22 | }
compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/new-mutability/error.invalid-useCallback-captures-reassigned-context.expect.md
+2
@@ -30,6 +30,7 @@ export const FIXTURE_ENTRYPOINT = {
30
31 ```
32 Found 2 errors:
33 +
34 Memoization: Compilation skipped because existing memoization could not be preserved
35
36 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.
@@ -42,6 +43,7 @@ error.invalid-useCallback-captures-reassigned-context.ts:11:37
43 12 |
44 13 | x = makeArray();
45 14 |
46 +
47 Memoization: Compilation skipped because existing memoization could not be preserved
48
49 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.
compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/new-mutability/error.mutate-frozen-value.expect.md
+3 -2
@@ -17,15 +17,16 @@ function Component({a, b}) {
17
18 ```
19 Found 1 error:
20 +
21 Error: This value cannot be modified
22
22 -Modifying a value previously passed as an argument to a hook is not allowed. Consider moving the modification before calling the hook
23 +Modifying a value previously passed as an argument to a hook is not allowed. Consider moving the modification before calling the hook.
24
25 error.mutate-frozen-value.ts:5:2
26 3 | const x = {a};
27 4 | useFreeze(x);
28 > 5 | x.y = true;
28 - | ^ This value cannot be modified
29 + | ^ value cannot be modified
30 6 | return <div>error</div>;
31 7 | }
32 8 |
compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/new-mutability/error.mutate-hook-argument.expect.md
+6 -4
@@ -15,27 +15,29 @@ function useHook(a, b) {
15
16 ```
17 Found 2 errors:
18 +
19 Error: This value cannot be modified
20
20 -Modifying component props or hook arguments is not allowed. Consider using a local variable instead
21 +Modifying component props or hook arguments is not allowed. Consider using a local variable instead.
22
23 error.mutate-hook-argument.ts:3:2
24 1 | // @enableNewMutationAliasingModel
25 2 | function useHook(a, b) {
26 > 3 | b.test = 1;
26 - | ^ This value cannot be modified
27 + | ^ value cannot be modified
28 4 | a.test = 2;
29 5 | }
30 6 |
31 +
32 Error: This value cannot be modified
33
32 -Modifying component props or hook arguments is not allowed. Consider using a local variable instead
34 +Modifying component props or hook arguments is not allowed. Consider using a local variable instead.
35
36 error.mutate-hook-argument.ts:4:2
37 2 | function useHook(a, b) {
38 3 | b.test = 1;
39 > 4 | a.test = 2;
38 - | ^ This value cannot be modified
40 + | ^ value cannot be modified
41 5 | }
42 6 |
43 ```
compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/new-mutability/error.not-useEffect-external-mutate.expect.md
+6 -4
@@ -19,27 +19,29 @@ function Component(props) {
19
20 ```
21 Found 2 errors:
22 +
23 Error: This value cannot be modified
24
24 -Modifying a variable defined outside a component or hook is not allowed. Consider using an effect
25 +Modifying a variable defined outside a component or hook is not allowed. Consider using an effect.
26
27 error.not-useEffect-external-mutate.ts:6:4
28 4 | function Component(props) {
29 5 | foo(() => {
30 > 6 | x.a = 10;
30 - | ^ This value cannot be modified
31 + | ^ value cannot be modified
32 7 | x.a = 20;
33 8 | });
34 9 | }
35 +
36 Error: This value cannot be modified
37
36 -Modifying a variable defined outside a component or hook is not allowed. Consider using an effect
38 +Modifying a variable defined outside a component or hook is not allowed. Consider using an effect.
39
40 error.not-useEffect-external-mutate.ts:7:4
41 5 | foo(() => {
42 6 | x.a = 10;
43 > 7 | x.a = 20;
42 - | ^ This value cannot be modified
44 + | ^ value cannot be modified
45 8 | });
46 9 | }
47 10 |
compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/new-mutability/error.reassignment-to-global-indirect.expect.md
+6 -4
@@ -19,27 +19,29 @@ function Component() {
19
20 ```
21 Found 2 errors:
22 +
23 Error: Cannot reassign variables declared outside of the component/hook
24
24 -Reassigning a variable declared outside of the component/hook is a form of side effect, which can cause unpredictable behavior depending on when the component happens to re-render. If this variable is used in rendering, use useState instead. Otherwise, consider updating it in an effect (https://react.dev/reference/rules/components-and-hooks-must-be-pure#side-effects-must-run-outside-of-render)
25 +Variable `someUnknownGlobal` is declared outside of the component/hook. Reassigning this value during render is a form of side effect, which can cause unpredictable behavior depending on when the component happens to re-render. If this variable is used in rendering, use useState instead. Otherwise, consider updating it in an effect. (https://react.dev/reference/rules/components-and-hooks-must-be-pure#side-effects-must-run-outside-of-render)
26
27 error.reassignment-to-global-indirect.ts:5:4
28 3 | const foo = () => {
29 4 | // Cannot assign to globals
30 > 5 | someUnknownGlobal = true;
30 - | ^^^^^^^^^^^^^^^^^ Cannot reassign variable
31 + | ^^^^^^^^^^^^^^^^^ `someUnknownGlobal` cannot be reassigned
32 6 | moduleLocal = true;
33 7 | };
34 8 | foo();
35 +
36 Error: Cannot reassign variables declared outside of the component/hook
37
36 -Reassigning a variable declared outside of the component/hook is a form of side effect, which can cause unpredictable behavior depending on when the component happens to re-render. If this variable is used in rendering, use useState instead. Otherwise, consider updating it in an effect (https://react.dev/reference/rules/components-and-hooks-must-be-pure#side-effects-must-run-outside-of-render)
38 +Variable `moduleLocal` is declared outside of the component/hook. Reassigning this value during render is a form of side effect, which can cause unpredictable behavior depending on when the component happens to re-render. If this variable is used in rendering, use useState instead. Otherwise, consider updating it in an effect. (https://react.dev/reference/rules/components-and-hooks-must-be-pure#side-effects-must-run-outside-of-render)
39
40 error.reassignment-to-global-indirect.ts:6:4
41 4 | // Cannot assign to globals
42 5 | someUnknownGlobal = true;
43 > 6 | moduleLocal = true;
42 - | ^^^^^^^^^^^ Cannot reassign variable
44 + | ^^^^^^^^^^^ `moduleLocal` cannot be reassigned
45 7 | };
46 8 | foo();
47 9 | }
compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/new-mutability/error.reassignment-to-global.expect.md
+6 -4
@@ -16,27 +16,29 @@ function Component() {
16
17 ```
18 Found 2 errors:
19 +
20 Error: Cannot reassign variables declared outside of the component/hook
21
21 -Reassigning a variable declared outside of the component/hook is a form of side effect, which can cause unpredictable behavior depending on when the component happens to re-render. If this variable is used in rendering, use useState instead. Otherwise, consider updating it in an effect (https://react.dev/reference/rules/components-and-hooks-must-be-pure#side-effects-must-run-outside-of-render)
22 +Variable `someUnknownGlobal` is declared outside of the component/hook. Reassigning this value during render is a form of side effect, which can cause unpredictable behavior depending on when the component happens to re-render. If this variable is used in rendering, use useState instead. Otherwise, consider updating it in an effect. (https://react.dev/reference/rules/components-and-hooks-must-be-pure#side-effects-must-run-outside-of-render)
23
24 error.reassignment-to-global.ts:4:2
25 2 | function Component() {
26 3 | // Cannot assign to globals
27 > 4 | someUnknownGlobal = true;
27 - | ^^^^^^^^^^^^^^^^^ Cannot reassign variable
28 + | ^^^^^^^^^^^^^^^^^ `someUnknownGlobal` cannot be reassigned
29 5 | moduleLocal = true;
30 6 | }
31 7 |
32 +
33 Error: Cannot reassign variables declared outside of the component/hook
34
33 -Reassigning a variable declared outside of the component/hook is a form of side effect, which can cause unpredictable behavior depending on when the component happens to re-render. If this variable is used in rendering, use useState instead. Otherwise, consider updating it in an effect (https://react.dev/reference/rules/components-and-hooks-must-be-pure#side-effects-must-run-outside-of-render)
35 +Variable `moduleLocal` is declared outside of the component/hook. Reassigning this value during render is a form of side effect, which can cause unpredictable behavior depending on when the component happens to re-render. If this variable is used in rendering, use useState instead. Otherwise, consider updating it in an effect. (https://react.dev/reference/rules/components-and-hooks-must-be-pure#side-effects-must-run-outside-of-render)
36
37 error.reassignment-to-global.ts:5:2
38 3 | // Cannot assign to globals
39 4 | someUnknownGlobal = true;
40 > 5 | moduleLocal = true;
39 - | ^^^^^^^^^^^ Cannot reassign variable
41 + | ^^^^^^^^^^^ `moduleLocal` cannot be reassigned
42 6 | }
43 7 |
44 ```
compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/new-mutability/error.todo-repro-named-function-with-shadowed-local-same-name.expect.md
+1 -2
@@ -21,6 +21,7 @@ function Component(props) {
21
22 ```
23 Found 1 error:
24 +
25 Invariant: [InferMutationAliasingEffects] Expected value kind to be initialized
26
27 <unknown> hasErrors_0$15:TFunction.
@@ -32,8 +33,6 @@ error.todo-repro-named-function-with-shadowed-local-same-name.ts:10:9
33 | ^^^^^^^^^ [InferMutationAliasingEffects] Expected value kind to be initialized
34 11 | }
35 12 |
35 -
36 -
36 ```
37
38
\ No newline at end of file
compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/new-mutability/mutate-after-useeffect-optional-chain.expect.md
+1 -1
@@ -48,7 +48,7 @@ export const FIXTURE_ENTRYPOINT = {
48 ## Logs
49
50 ```
51 -{"kind":"CompileError","fnLoc":{"start":{"line":5,"column":0,"index":181},"end":{"line":12,"column":1,"index":436},"filename":"mutate-after-useeffect-optional-chain.ts"},"detail":{"options":{"severity":"InvalidReact","category":"This value cannot be modified","description":"Modifying a value used previously in an effect function or as an effect dependency is not allowed. Consider moving the modification before calling useEffect()","details":[{"kind":"error","loc":{"start":{"line":10,"column":2,"index":397},"end":{"line":10,"column":5,"index":400},"filename":"mutate-after-useeffect-optional-chain.ts","identifierName":"arr"},"message":"This value cannot be modified"}]}}}
51 +{"kind":"CompileError","fnLoc":{"start":{"line":5,"column":0,"index":181},"end":{"line":12,"column":1,"index":436},"filename":"mutate-after-useeffect-optional-chain.ts"},"detail":{"options":{"severity":"InvalidReact","category":"This value cannot be modified","description":"Modifying a value used previously in an effect function or as an effect dependency is not allowed. Consider moving the modification before calling useEffect().","details":[{"kind":"error","loc":{"start":{"line":10,"column":2,"index":397},"end":{"line":10,"column":5,"index":400},"filename":"mutate-after-useeffect-optional-chain.ts","identifierName":"arr"},"message":"value cannot be modified"}]}}}
52 {"kind":"AutoDepsDecorations","fnLoc":{"start":{"line":9,"column":2,"index":346},"end":{"line":9,"column":49,"index":393},"filename":"mutate-after-useeffect-optional-chain.ts"},"decorations":[{"start":{"line":9,"column":24,"index":368},"end":{"line":9,"column":27,"index":371},"filename":"mutate-after-useeffect-optional-chain.ts","identifierName":"arr"}]}
53 {"kind":"CompileSuccess","fnLoc":{"start":{"line":5,"column":0,"index":181},"end":{"line":12,"column":1,"index":436},"filename":"mutate-after-useeffect-optional-chain.ts"},"fnName":"Component","memoSlots":0,"memoBlocks":0,"memoValues":0,"prunedMemoBlocks":0,"prunedMemoValues":0}
54 ```
compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/new-mutability/mutate-after-useeffect-ref-access.expect.md
+1 -1
@@ -47,7 +47,7 @@ export const FIXTURE_ENTRYPOINT = {
47 ## Logs
48
49 ```
50 -{"kind":"CompileError","fnLoc":{"start":{"line":6,"column":0,"index":190},"end":{"line":11,"column":1,"index":363},"filename":"mutate-after-useeffect-ref-access.ts"},"detail":{"options":{"severity":"InvalidReact","category":"This value cannot be modified","description":"Modifying component props or hook arguments is not allowed. Consider using a local variable instead","details":[{"kind":"error","loc":{"start":{"line":9,"column":2,"index":321},"end":{"line":9,"column":16,"index":335},"filename":"mutate-after-useeffect-ref-access.ts"},"message":"This value cannot be modified"}]}}}
50 +{"kind":"CompileError","fnLoc":{"start":{"line":6,"column":0,"index":190},"end":{"line":11,"column":1,"index":363},"filename":"mutate-after-useeffect-ref-access.ts"},"detail":{"options":{"severity":"InvalidReact","category":"This value cannot be modified","description":"Modifying component props or hook arguments is not allowed. Consider using a local variable instead.","details":[{"kind":"error","loc":{"start":{"line":9,"column":2,"index":321},"end":{"line":9,"column":16,"index":335},"filename":"mutate-after-useeffect-ref-access.ts"},"message":"value cannot be modified"}]}}}
51 {"kind":"AutoDepsDecorations","fnLoc":{"start":{"line":8,"column":2,"index":269},"end":{"line":8,"column":50,"index":317},"filename":"mutate-after-useeffect-ref-access.ts"},"decorations":[{"start":{"line":8,"column":24,"index":291},"end":{"line":8,"column":30,"index":297},"filename":"mutate-after-useeffect-ref-access.ts","identifierName":"arrRef"}]}
52 {"kind":"CompileSuccess","fnLoc":{"start":{"line":6,"column":0,"index":190},"end":{"line":11,"column":1,"index":363},"filename":"mutate-after-useeffect-ref-access.ts"},"fnName":"Component","memoSlots":0,"memoBlocks":0,"memoValues":0,"prunedMemoBlocks":0,"prunedMemoValues":0}
53 ```
compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/new-mutability/mutate-after-useeffect.expect.md
+1 -1
@@ -47,7 +47,7 @@ export const FIXTURE_ENTRYPOINT = {
47 ## Logs
48
49 ```
50 -{"kind":"CompileError","fnLoc":{"start":{"line":4,"column":0,"index":143},"end":{"line":11,"column":1,"index":274},"filename":"mutate-after-useeffect.ts"},"detail":{"options":{"severity":"InvalidReact","category":"This value cannot be modified","description":"Modifying a value used previously in an effect function or as an effect dependency is not allowed. Consider moving the modification before calling useEffect()","details":[{"kind":"error","loc":{"start":{"line":9,"column":2,"index":246},"end":{"line":9,"column":5,"index":249},"filename":"mutate-after-useeffect.ts","identifierName":"arr"},"message":"This value cannot be modified"}]}}}
50 +{"kind":"CompileError","fnLoc":{"start":{"line":4,"column":0,"index":143},"end":{"line":11,"column":1,"index":274},"filename":"mutate-after-useeffect.ts"},"detail":{"options":{"severity":"InvalidReact","category":"This value cannot be modified","description":"Modifying a value used previously in an effect function or as an effect dependency is not allowed. Consider moving the modification before calling useEffect().","details":[{"kind":"error","loc":{"start":{"line":9,"column":2,"index":246},"end":{"line":9,"column":5,"index":249},"filename":"mutate-after-useeffect.ts","identifierName":"arr"},"message":"value cannot be modified"}]}}}
51 {"kind":"AutoDepsDecorations","fnLoc":{"start":{"line":6,"column":2,"index":191},"end":{"line":8,"column":14,"index":242},"filename":"mutate-after-useeffect.ts"},"decorations":[{"start":{"line":7,"column":4,"index":213},"end":{"line":7,"column":7,"index":216},"filename":"mutate-after-useeffect.ts","identifierName":"arr"},{"start":{"line":7,"column":4,"index":213},"end":{"line":7,"column":7,"index":216},"filename":"mutate-after-useeffect.ts","identifierName":"arr"},{"start":{"line":7,"column":13,"index":222},"end":{"line":7,"column":16,"index":225},"filename":"mutate-after-useeffect.ts","identifierName":"foo"}]}
52 {"kind":"CompileSuccess","fnLoc":{"start":{"line":4,"column":0,"index":143},"end":{"line":11,"column":1,"index":274},"filename":"mutate-after-useeffect.ts"},"fnName":"Component","memoSlots":0,"memoBlocks":0,"memoValues":0,"prunedMemoBlocks":0,"prunedMemoValues":0}
53 ```
compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/new-mutability/retry-no-emit.expect.md
+1 -1
@@ -54,7 +54,7 @@ export const FIXTURE_ENTRYPOINT = {
54 ## Logs
55
56 ```
57 -{"kind":"CompileError","fnLoc":{"start":{"line":6,"column":0,"index":227},"end":{"line":14,"column":1,"index":441},"filename":"retry-no-emit.ts"},"detail":{"options":{"severity":"InvalidReact","category":"This value cannot be modified","description":"Modifying a value previously passed as an argument to a hook is not allowed. Consider moving the modification before calling the hook","details":[{"kind":"error","loc":{"start":{"line":12,"column":2,"index":404},"end":{"line":12,"column":6,"index":408},"filename":"retry-no-emit.ts","identifierName":"arr2"},"message":"This value cannot be modified"}]}}}
57 +{"kind":"CompileError","fnLoc":{"start":{"line":6,"column":0,"index":227},"end":{"line":14,"column":1,"index":441},"filename":"retry-no-emit.ts"},"detail":{"options":{"severity":"InvalidReact","category":"This value cannot be modified","description":"Modifying a value previously passed as an argument to a hook is not allowed. Consider moving the modification before calling the hook.","details":[{"kind":"error","loc":{"start":{"line":12,"column":2,"index":404},"end":{"line":12,"column":6,"index":408},"filename":"retry-no-emit.ts","identifierName":"arr2"},"message":"value cannot be modified"}]}}}
58 {"kind":"AutoDepsDecorations","fnLoc":{"start":{"line":8,"column":2,"index":280},"end":{"line":8,"column":46,"index":324},"filename":"retry-no-emit.ts"},"decorations":[{"start":{"line":8,"column":31,"index":309},"end":{"line":8,"column":34,"index":312},"filename":"retry-no-emit.ts","identifierName":"arr"}]}
59 {"kind":"AutoDepsDecorations","fnLoc":{"start":{"line":11,"column":2,"index":348},"end":{"line":11,"column":54,"index":400},"filename":"retry-no-emit.ts"},"decorations":[{"start":{"line":11,"column":25,"index":371},"end":{"line":11,"column":29,"index":375},"filename":"retry-no-emit.ts","identifierName":"arr2"},{"start":{"line":11,"column":25,"index":371},"end":{"line":11,"column":29,"index":375},"filename":"retry-no-emit.ts","identifierName":"arr2"},{"start":{"line":11,"column":35,"index":381},"end":{"line":11,"column":42,"index":388},"filename":"retry-no-emit.ts","identifierName":"propVal"}]}
60 {"kind":"CompileSuccess","fnLoc":{"start":{"line":6,"column":0,"index":227},"end":{"line":14,"column":1,"index":441},"filename":"retry-no-emit.ts"},"fnName":"Foo","memoSlots":0,"memoBlocks":0,"memoValues":0,"prunedMemoBlocks":0,"prunedMemoValues":0}
compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/preserve-memo-validation/error.false-positive-useMemo-dropped-infer-always-invalidating.expect.md
+1
@@ -31,6 +31,7 @@ export const FIXTURE_ENTRYPOINT = {
31
32 ```
33 Found 1 error:
34 +
35 Memoization: Compilation skipped because existing memoization could not be preserved
36
37 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.
compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/preserve-memo-validation/error.false-positive-useMemo-infer-mutate-deps.expect.md
+1
@@ -30,6 +30,7 @@ export const FIXTURE_ENTRYPOINT = {
30
31 ```
32 Found 1 error:
33 +
34 Memoization: Compilation skipped because existing memoization could not be preserved
35
36 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.
compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/preserve-memo-validation/error.false-positive-useMemo-overlap-scopes.expect.md
+1
@@ -41,6 +41,7 @@ export const FIXTURE_ENTRYPOINT = {
41
42 ```
43 Found 1 error:
44 +
45 Memoization: Compilation skipped because existing memoization could not be preserved
46
47 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.
compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/preserve-memo-validation/error.hoist-useCallback-conditional-access-own-scope.expect.md
+1
@@ -27,6 +27,7 @@ export const FIXTURE_ENTRYPOINT = {
27
28 ```
29 Found 1 error:
30 +
31 Memoization: Compilation skipped because existing memoization could not be preserved
32
33 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.
compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/preserve-memo-validation/error.hoist-useCallback-infer-conditional-value-block.expect.md
+2
@@ -30,6 +30,7 @@ export const FIXTURE_ENTRYPOINT = {
30
31 ```
32 Found 2 errors:
33 +
34 Memoization: Compilation skipped because existing memoization could not be preserved
35
36 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.
@@ -58,6 +59,7 @@ error.hoist-useCallback-infer-conditional-value-block.ts:6:21
59 15 | }
60 16 |
61 17 | export const FIXTURE_ENTRYPOINT = {
62 +
63 Memoization: Compilation skipped because existing memoization could not be preserved
64
65 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.
compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/preserve-memo-validation/error.invalid-useCallback-captures-reassigned-context.expect.md
+2
@@ -31,6 +31,7 @@ export const FIXTURE_ENTRYPOINT = {
31
32 ```
33 Found 2 errors:
34 +
35 Memoization: Compilation skipped because existing memoization could not be preserved
36
37 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.
@@ -43,6 +44,7 @@ error.invalid-useCallback-captures-reassigned-context.ts:12:37
44 13 |
45 14 | x = makeArray();
46 15 |
47 +
48 Memoization: Compilation skipped because existing memoization could not be preserved
49
50 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.
compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/preserve-memo-validation/error.maybe-invalid-useCallback-read-maybeRef.expect.md
+1
@@ -18,6 +18,7 @@ function useHook(maybeRef) {
18
19 ```
20 Found 1 error:
21 +
22 Memoization: Compilation skipped because existing memoization could not be preserved
23
24 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.
compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/preserve-memo-validation/error.maybe-invalid-useMemo-read-maybeRef.expect.md
+1
@@ -18,6 +18,7 @@ function useHook(maybeRef, shouldRead) {
18
19 ```
20 Found 1 error:
21 +
22 Memoization: Compilation skipped because existing memoization could not be preserved
23
24 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.
compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/preserve-memo-validation/error.maybe-mutable-ref-not-preserved.expect.md
+1 -2
@@ -24,6 +24,7 @@ export const FIXTURE_ENTRYPOINT = {
24
25 ```
26 Found 1 error:
27 +
28 Error: Ref values (the `current` property) may not be accessed during render. (https://react.dev/reference/react/useRef)
29
30 error.maybe-mutable-ref-not-preserved.ts:8:33
@@ -34,8 +35,6 @@ error.maybe-mutable-ref-not-preserved.ts:8:33
35 9 | }
36 10 |
37 11 | export const FIXTURE_ENTRYPOINT = {
37 -
38 -
38 ```
39
40
\ No newline at end of file
compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/preserve-memo-validation/error.preserve-use-memo-ref-missing-reactive.expect.md
+1
@@ -29,6 +29,7 @@ export const FIXTURE_ENTRYPOINT = {
29
30 ```
31 Found 1 error:
32 +
33 Memoization: Compilation skipped because existing memoization could not be preserved
34
35 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.
compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/preserve-memo-validation/error.todo-useCallback-captures-invalidating-value.expect.md
+1
@@ -29,6 +29,7 @@ export const FIXTURE_ENTRYPOINT = {
29
30 ```
31 Found 1 error:
32 +
33 Memoization: Compilation skipped because existing memoization could not be preserved
34
35 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.
compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/preserve-memo-validation/error.useCallback-aliased-var.expect.md
+1
@@ -20,6 +20,7 @@ function useHook(x) {
20
21 ```
22 Found 1 error:
23 +
24 Memoization: Compilation skipped because existing memoization could not be preserved
25
26 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.
compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/preserve-memo-validation/error.useCallback-conditional-access-noAlloc.expect.md
+1
@@ -26,6 +26,7 @@ export const FIXTURE_ENTRYPOINT = {
26
27 ```
28 Found 1 error:
29 +
30 Memoization: Compilation skipped because existing memoization could not be preserved
31
32 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.
compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/preserve-memo-validation/error.useCallback-infer-less-specific-conditional-access.expect.md
+1
@@ -25,6 +25,7 @@ function Component({propA, propB}) {
25
26 ```
27 Found 1 error:
28 +
29 Memoization: Compilation skipped because existing memoization could not be preserved
30
31 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.
compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/preserve-memo-validation/error.useCallback-property-call-dep.expect.md
+1
@@ -18,6 +18,7 @@ function Component({propA}) {
18
19 ```
20 Found 1 error:
21 +
22 Memoization: Compilation skipped because existing memoization could not be preserved
23
24 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.
compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/preserve-memo-validation/error.useMemo-aliased-var.expect.md
+1
@@ -20,6 +20,7 @@ function useHook(x) {
20
21 ```
22 Found 1 error:
23 +
24 Memoization: Compilation skipped because existing memoization could not be preserved
25
26 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.
compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/preserve-memo-validation/error.useMemo-infer-less-specific-conditional-access.expect.md
+1
@@ -25,6 +25,7 @@ function Component({propA, propB}) {
25
26 ```
27 Found 1 error:
28 +
29 Memoization: Compilation skipped because existing memoization could not be preserved
30
31 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.
compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/preserve-memo-validation/error.useMemo-infer-less-specific-conditional-value-block.expect.md
+2
@@ -25,6 +25,7 @@ function Component({propA, propB}) {
25
26 ```
27 Found 2 errors:
28 +
29 Memoization: Compilation skipped because existing memoization could not be preserved
30
31 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.
@@ -52,6 +53,7 @@ error.useMemo-infer-less-specific-conditional-value-block.ts:6:17
53 | ^^^^ Could not preserve existing manual memoization
54 15 | }
55 16 |
56 +
57 Memoization: Compilation skipped because existing memoization could not be preserved
58
59 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.
compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/preserve-memo-validation/error.useMemo-property-call-chained-object.expect.md
+1
@@ -20,6 +20,7 @@ function Component({propA}) {
20
21 ```
22 Found 1 error:
23 +
24 Memoization: Compilation skipped because existing memoization could not be preserved
25
26 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.
compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/preserve-memo-validation/error.useMemo-property-call-dep.expect.md
+1
@@ -18,6 +18,7 @@ function Component({propA}) {
18
19 ```
20 Found 1 error:
21 +
22 Memoization: Compilation skipped because existing memoization could not be preserved
23
24 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.
compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/preserve-memo-validation/error.useMemo-unrelated-mutation-in-depslist.expect.md
+1
@@ -31,6 +31,7 @@ function useFoo(input1) {
31
32 ```
33 Found 1 error:
34 +
35 Memoization: Compilation skipped because existing memoization could not be preserved
36
37 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.
compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/preserve-memo-validation/error.useMemo-with-refs.flow.expect.md
+1 -3
@@ -20,9 +20,9 @@ component Component(disableLocalRef, ref) {
20
21 ```
22 Found 1 error:
23 +
24 Error: Ref values (the `current` property) may not be accessed during render. (https://react.dev/reference/react/useRef)
25
25 -undefined:7:44
26 5 | const localRef = useFooRef();
27 6 | const mergedRef = useMemo(() => {
28 > 7 | return disableLocalRef ? ref : identity(ref, localRef);
@@ -30,8 +30,6 @@ undefined:7:44
30 8 | }, [disableLocalRef, ref, localRef]);
31 9 | return <div ref={mergedRef} />;
32 10 | }
33 -
34 -
33 ```
34
35
\ No newline at end of file
compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/preserve-memo-validation/error.validate-useMemo-named-function.expect.md
+1 -2
@@ -21,6 +21,7 @@ function Component(props) {
21
22 ```
23 Found 1 error:
24 +
25 Error: Expected the first argument to be an inline function expression
26
27 error.validate-useMemo-named-function.ts:9:20
@@ -31,8 +32,6 @@ error.validate-useMemo-named-function.ts:9:20
32 10 | return x;
33 11 | }
34 12 |
34 -
35 -
35 ```
36
37
\ No newline at end of file
compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/propagate-scope-deps-hir-fork/error.todo-optional-call-chain-in-optional.expect.md
+1 -2
@@ -24,6 +24,7 @@ export const FIXTURE_ENTRYPONT = {
24
25 ```
26 Found 1 error:
27 +
28 Todo: Unexpected terminal kind `optional` for optional fallthrough block
29
30 error.todo-optional-call-chain-in-optional.ts:4:21
@@ -34,8 +35,6 @@ error.todo-optional-call-chain-in-optional.ts:4:21
35 5 | }
36 6 |
37 7 | function createArray<T>(...args: Array<T>): Array<T> {
37 -
38 -
38 ```
39
40
\ No newline at end of file
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
+1
@@ -25,6 +25,7 @@ function Component(props) {
25
26 ```
27 Found 1 error:
28 +
29 Memoization: Compilation skipped because existing memoization could not be preserved
30
31 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.
compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/propagate-scope-deps-hir-fork/error.todo-optional-member-expression-with-conditional.expect.md
+1
@@ -25,6 +25,7 @@ function Component(props) {
25
26 ```
27 Found 1 error:
28 +
29 Memoization: Compilation skipped because existing memoization could not be preserved
30
31 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.
compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/rules-of-hooks/error.bail.rules-of-hooks-3d692676194b.expect.md
+1 -2
@@ -21,6 +21,7 @@ const ComponentWithHookInsideCallback = React.forwardRef((props, ref) => {
21
22 ```
23 Found 1 error:
24 +
25 Error: 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)
26
27 Cannot call hook within a function expression.
@@ -33,8 +34,6 @@ error.bail.rules-of-hooks-3d692676194b.ts:8:4
34 9 | });
35 10 | return <button {...props} ref={ref} />;
36 11 | });
36 -
37 -
37 ```
38
39
\ No newline at end of file
compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/rules-of-hooks/error.bail.rules-of-hooks-8503ca76d6f8.expect.md
+1 -2
@@ -21,6 +21,7 @@ const ComponentWithHookInsideCallback = React.memo(props => {
21
22 ```
23 Found 1 error:
24 +
25 Error: 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)
26
27 Cannot call hook within a function expression.
@@ -33,8 +34,6 @@ error.bail.rules-of-hooks-8503ca76d6f8.ts:8:4
34 9 | });
35 10 | return <button {...props} />;
36 11 | });
36 -
37 -
37 ```
38
39
\ No newline at end of file
compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/rules-of-hooks/error.invalid-call-phi-possibly-hook.expect.md
+1 -4
@@ -19,6 +19,7 @@ function Component(props) {
19
20 ```
21 Found 3 errors:
22 +
23 Error: 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
24
25 error.invalid-call-phi-possibly-hook.ts:3:31
@@ -30,7 +31,6 @@ error.invalid-call-phi-possibly-hook.ts:3:31
31 5 | // Ideally we would report a "conditional hook call" error here.
32 6 | // It's an unconditional call, but the value may or may not be a hook.
33
33 -
34 Error: 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
35
36 error.invalid-call-phi-possibly-hook.ts:3:18
@@ -42,7 +42,6 @@ error.invalid-call-phi-possibly-hook.ts:3:18
42 5 | // Ideally we would report a "conditional hook call" error here.
43 6 | // It's an unconditional call, but the value may or may not be a hook.
44
45 -
45 Error: 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
46
47 error.invalid-call-phi-possibly-hook.ts:8:9
@@ -52,8 +51,6 @@ error.invalid-call-phi-possibly-hook.ts:8:9
51 | ^^^^^^^ 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
52 9 | }
53 10 |
55 -
56 -
54 ```
55
56
\ No newline at end of file
compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/rules-of-hooks/error.invalid-conditionally-call-local-named-like-hook.expect.md
+1 -2
@@ -18,6 +18,7 @@ function Component(props) {
18
19 ```
20 Found 1 error:
21 +
22 Error: 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)
23
24 error.invalid-conditionally-call-local-named-like-hook.ts:6:4
@@ -28,8 +29,6 @@ error.invalid-conditionally-call-local-named-like-hook.ts:6:4
29 7 | }
30 8 | }
31 9 |
31 -
32 -
32 ```
33
34
\ No newline at end of file
compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/rules-of-hooks/error.invalid-conditionally-call-prop-named-like-hook.expect.md
+1 -2
@@ -15,6 +15,7 @@ function Component({cond, useFoo}) {
15
16 ```
17 Found 1 error:
18 +
19 Error: 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)
20
21 error.invalid-conditionally-call-prop-named-like-hook.ts:3:4
@@ -25,8 +26,6 @@ error.invalid-conditionally-call-prop-named-like-hook.ts:3:4
26 4 | }
27 5 | }
28 6 |
28 -
29 -
29 ```
30
31
\ No newline at end of file
compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/rules-of-hooks/error.invalid-conditionally-methodcall-hooklike-property-of-local.expect.md
+1 -2
@@ -18,6 +18,7 @@ function Component(props) {
18
19 ```
20 Found 1 error:
21 +
22 Error: 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)
23
24 error.invalid-conditionally-methodcall-hooklike-property-of-local.ts:6:4
@@ -28,8 +29,6 @@ error.invalid-conditionally-methodcall-hooklike-property-of-local.ts:6:4
29 7 | }
30 8 | }
31 9 |
31 -
32 -
32 ```
33
34
\ No newline at end of file
compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/rules-of-hooks/error.invalid-condtionally-call-hooklike-property-of-local.expect.md
+1 -2
@@ -19,6 +19,7 @@ function Component(props) {
19
20 ```
21 Found 1 error:
22 +
23 Error: 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)
24
25 error.invalid-condtionally-call-hooklike-property-of-local.ts:7:4
@@ -29,8 +30,6 @@ error.invalid-condtionally-call-hooklike-property-of-local.ts:7:4
30 8 | }
31 9 | }
32 10 |
32 -
33 -
33 ```
34
35
\ No newline at end of file
compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/rules-of-hooks/error.invalid-dynamic-hook-via-hooklike-local.expect.md
+1 -2
@@ -15,6 +15,7 @@ function Component() {
15
16 ```
17 Found 1 error:
18 +
19 Error: Hooks must be the same function on every render, but this value may change over time to a different function. See https://react.dev/reference/rules/react-calls-components-and-hooks#dont-dynamically-use-hooks
20
21 error.invalid-dynamic-hook-via-hooklike-local.ts:4:2
@@ -24,8 +25,6 @@ error.invalid-dynamic-hook-via-hooklike-local.ts:4:2
25 | ^^^^^^^^^^^^^^^^^^^^^^^^^ Hooks must be the same function on every render, but this value may change over time to a different function. See https://react.dev/reference/rules/react-calls-components-and-hooks#dont-dynamically-use-hooks
26 5 | }
27 6 |
27 -
28 -
28 ```
29
30
\ No newline at end of file
compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/rules-of-hooks/error.invalid-hook-after-early-return.expect.md
+1 -2
@@ -16,6 +16,7 @@ function Component(props) {
16
17 ```
18 Found 1 error:
19 +
20 Error: 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)
21
22 error.invalid-hook-after-early-return.ts:5:9
@@ -25,8 +26,6 @@ error.invalid-hook-after-early-return.ts:5:9
26 | ^^^^^^^ 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)
27 6 | }
28 7 |
28 -
29 -
29 ```
30
31
\ No newline at end of file
compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/rules-of-hooks/error.invalid-hook-as-conditional-test.expect.md
+1 -2
@@ -14,6 +14,7 @@ function Component(props) {
14
15 ```
16 Found 1 error:
17 +
18 Error: 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
19
20 error.invalid-hook-as-conditional-test.ts:2:26
@@ -23,8 +24,6 @@ error.invalid-hook-as-conditional-test.ts:2:26
24 3 | return x;
25 4 | }
26 5 |
26 -
27 -
27 ```
28
29
\ No newline at end of file
compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/rules-of-hooks/error.invalid-hook-as-prop.expect.md
+1 -2
@@ -13,6 +13,7 @@ function Component({useFoo}) {
13
14 ```
15 Found 1 error:
16 +
17 Error: Hooks must be the same function on every render, but this value may change over time to a different function. See https://react.dev/reference/rules/react-calls-components-and-hooks#dont-dynamically-use-hooks
18
19 error.invalid-hook-as-prop.ts:2:2
@@ -21,8 +22,6 @@ error.invalid-hook-as-prop.ts:2:2
22 | ^^^^^^ Hooks must be the same function on every render, but this value may change over time to a different function. See https://react.dev/reference/rules/react-calls-components-and-hooks#dont-dynamically-use-hooks
23 3 | }
24 4 |
24 -
25 -
25 ```
26
27
\ No newline at end of file
compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/rules-of-hooks/error.invalid-hook-for.expect.md
+1 -3
@@ -17,6 +17,7 @@ function Component(props) {
17
18 ```
19 Found 2 errors:
20 +
21 Error: 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)
22
23 error.invalid-hook-for.ts:4:9
@@ -28,7 +29,6 @@ error.invalid-hook-for.ts:4:9
29 6 | return i;
30 7 | }
31
31 -
32 Error: 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)
33
34 error.invalid-hook-for.ts:3:35
@@ -39,8 +39,6 @@ error.invalid-hook-for.ts:3:35
39 4 | i += useHook(x);
40 5 | }
41 6 | return i;
42 -
43 -
42 ```
43
44
\ No newline at end of file
compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/rules-of-hooks/error.invalid-hook-from-hook-return.expect.md
+1 -2
@@ -15,6 +15,7 @@ function useFoo({data}) {
15
16 ```
17 Found 1 error:
18 +
19 Error: Hooks must be the same function on every render, but this value may change over time to a different function. See https://react.dev/reference/rules/react-calls-components-and-hooks#dont-dynamically-use-hooks
20
21 error.invalid-hook-from-hook-return.ts:3:14
@@ -25,8 +26,6 @@ error.invalid-hook-from-hook-return.ts:3:14
26 4 | return foo;
27 5 | }
28 6 |
28 -
29 -
29 ```
30
31
\ No newline at end of file
compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/rules-of-hooks/error.invalid-hook-from-property-of-other-hook.expect.md
+1 -2
@@ -15,6 +15,7 @@ function useFoo({data}) {
15
16 ```
17 Found 1 error:
18 +
19 Error: Hooks must be the same function on every render, but this value may change over time to a different function. See https://react.dev/reference/rules/react-calls-components-and-hooks#dont-dynamically-use-hooks
20
21 error.invalid-hook-from-property-of-other-hook.ts:3:14
@@ -25,8 +26,6 @@ error.invalid-hook-from-property-of-other-hook.ts:3:14
26 4 | return foo;
27 5 | }
28 6 |
28 -
29 -
29 ```
30
31
\ No newline at end of file
compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/rules-of-hooks/error.invalid-hook-if-alternate.expect.md
+1 -2
@@ -18,6 +18,7 @@ function Component(props) {
18
19 ```
20 Found 1 error:
21 +
22 Error: 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)
23
24 error.invalid-hook-if-alternate.ts:5:8
@@ -28,8 +29,6 @@ error.invalid-hook-if-alternate.ts:5:8
29 6 | }
30 7 | return x;
31 8 | }
31 -
32 -
32 ```
33
34
\ No newline at end of file
compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/rules-of-hooks/error.invalid-hook-if-consequent.expect.md
+1 -2
@@ -17,6 +17,7 @@ function Component(props) {
17
18 ```
19 Found 1 error:
20 +
21 Error: 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)
22
23 error.invalid-hook-if-consequent.ts:4:8
@@ -27,8 +28,6 @@ error.invalid-hook-if-consequent.ts:4:8
28 5 | }
29 6 | return x;
30 7 | }
30 -
31 -
31 ```
32
33
\ No newline at end of file
compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/rules-of-hooks/error.invalid-hook-in-nested-function-expression-object-expression.expect.md
+1 -2
@@ -29,6 +29,7 @@ function Component() {
29
30 ```
31 Found 1 error:
32 +
33 Error: 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)
34
35 Cannot call hook within a function expression.
@@ -41,8 +42,6 @@ error.invalid-hook-in-nested-function-expression-object-expression.ts:10:21
42 11 | },
43 12 | };
44 13 | return y;
44 -
45 -
45 ```
46
47
\ No newline at end of file
compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/rules-of-hooks/error.invalid-hook-in-nested-object-method.expect.md
+1 -2
@@ -25,6 +25,7 @@ function Component() {
25
26 ```
27 Found 1 error:
28 +
29 Error: 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)
30
31 Cannot call hook within a function expression.
@@ -37,8 +38,6 @@ error.invalid-hook-in-nested-object-method.ts:8:17
38 9 | },
39 10 | };
40 11 | return y;
40 -
41 -
41 ```
42
43
\ No newline at end of file
compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/rules-of-hooks/error.invalid-hook-optional-methodcall.expect.md
+1 -2
@@ -14,6 +14,7 @@ function Component() {
14
15 ```
16 Found 1 error:
17 +
18 Error: 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)
19
20 error.invalid-hook-optional-methodcall.ts:2:19
@@ -23,8 +24,6 @@ error.invalid-hook-optional-methodcall.ts:2:19
24 3 | return result;
25 4 | }
26 5 |
26 -
27 -
27 ```
28
29
\ No newline at end of file
compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/rules-of-hooks/error.invalid-hook-optional-property.expect.md
+1 -2
@@ -14,6 +14,7 @@ function Component() {
14
15 ```
16 Found 1 error:
17 +
18 Error: 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)
19
20 error.invalid-hook-optional-property.ts:2:19
@@ -23,8 +24,6 @@ error.invalid-hook-optional-property.ts:2:19
24 3 | return result;
25 4 | }
26 5 |
26 -
27 -
27 ```
28
29
\ No newline at end of file
compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/rules-of-hooks/error.invalid-hook-optionalcall.expect.md
+1 -2
@@ -14,6 +14,7 @@ function Component() {
14
15 ```
16 Found 1 error:
17 +
18 Error: 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)
19
20 error.invalid-hook-optionalcall.ts:2:19
@@ -23,8 +24,6 @@ error.invalid-hook-optionalcall.ts:2:19
24 3 | return result;
25 4 | }
26 5 |
26 -
27 -
27 ```
28
29
\ No newline at end of file
compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/rules-of-hooks/error.invalid-hook-reassigned-in-conditional.expect.md
+1 -4
@@ -15,6 +15,7 @@ function Component(props) {
15
16 ```
17 Found 3 errors:
18 +
19 Error: 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
20
21 error.invalid-hook-reassigned-in-conditional.ts:3:20
@@ -26,7 +27,6 @@ error.invalid-hook-reassigned-in-conditional.ts:3:20
27 5 | }
28 6 |
29
29 -
30 Error: 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
31
32 error.invalid-hook-reassigned-in-conditional.ts:3:16
@@ -38,7 +38,6 @@ error.invalid-hook-reassigned-in-conditional.ts:3:16
38 5 | }
39 6 |
40
41 -
41 Error: 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
42
43 error.invalid-hook-reassigned-in-conditional.ts:4:9
@@ -48,8 +47,6 @@ error.invalid-hook-reassigned-in-conditional.ts:4:9
47 | ^ 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
48 5 | }
49 6 |
51 -
52 -
50 ```
51
52
\ No newline at end of file
compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/rules-of-hooks/error.invalid-rules-of-hooks-1b9527f967f3.expect.md
+1 -5
@@ -26,6 +26,7 @@ function useHookInLoops() {
26
27 ```
28 Found 4 errors:
29 +
30 Error: 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)
31
32 error.invalid-rules-of-hooks-1b9527f967f3.ts:7:4
@@ -37,7 +38,6 @@ error.invalid-rules-of-hooks-1b9527f967f3.ts:7:4
38 9 | useHook2();
39 10 | }
40
40 -
41 Error: 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)
42
43 error.invalid-rules-of-hooks-1b9527f967f3.ts:9:4
@@ -49,7 +49,6 @@ error.invalid-rules-of-hooks-1b9527f967f3.ts:9:4
49 11 | while (c) {
50 12 | useHook3();
51
52 -
52 Error: 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)
53
54 error.invalid-rules-of-hooks-1b9527f967f3.ts:12:4
@@ -61,7 +60,6 @@ error.invalid-rules-of-hooks-1b9527f967f3.ts:12:4
60 14 | useHook4();
61 15 | }
62
64 -
63 Error: 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)
64
65 error.invalid-rules-of-hooks-1b9527f967f3.ts:14:4
@@ -72,8 +70,6 @@ error.invalid-rules-of-hooks-1b9527f967f3.ts:14:4
70 15 | }
71 16 | }
72 17 |
75 -
76 -
73 ```
74
75
\ No newline at end of file
compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/rules-of-hooks/error.invalid-rules-of-hooks-2aabd222fc6a.expect.md
+1 -2
@@ -19,6 +19,7 @@ function ComponentWithConditionalHook() {
19
20 ```
21 Found 1 error:
22 +
23 Error: 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)
24
25 error.invalid-rules-of-hooks-2aabd222fc6a.ts:7:4
@@ -29,8 +30,6 @@ error.invalid-rules-of-hooks-2aabd222fc6a.ts:7:4
30 8 | }
31 9 | }
32 10 |
32 -
33 -
33 ```
34
35
\ No newline at end of file
compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/rules-of-hooks/error.invalid-rules-of-hooks-49d341e5d68f.expect.md
+1 -2
@@ -20,6 +20,7 @@ function useLabeledBlock() {
20
21 ```
22 Found 1 error:
23 +
24 Error: 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)
25
26 error.invalid-rules-of-hooks-49d341e5d68f.ts:8:4
@@ -30,8 +31,6 @@ error.invalid-rules-of-hooks-49d341e5d68f.ts:8:4
31 9 | }
32 10 | }
33 11 |
33 -
34 -
34 ```
35
36
\ No newline at end of file
compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/rules-of-hooks/error.invalid-rules-of-hooks-79128a755612.expect.md
+1 -2
@@ -19,6 +19,7 @@ function ComponentWithHookInsideLoop() {
19
20 ```
21 Found 1 error:
22 +
23 Error: 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)
24
25 error.invalid-rules-of-hooks-79128a755612.ts:7:4
@@ -29,8 +30,6 @@ error.invalid-rules-of-hooks-79128a755612.ts:7:4
30 8 | }
31 9 | }
32 10 |
32 -
33 -
33 ```
34
35
\ No newline at end of file
compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/rules-of-hooks/error.invalid-rules-of-hooks-9718e30b856c.expect.md
+1 -2
@@ -23,6 +23,7 @@ function useHook() {
23
24 ```
25 Found 1 error:
26 +
27 Error: 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)
28
29 error.invalid-rules-of-hooks-9718e30b856c.ts:12:2
@@ -32,8 +33,6 @@ error.invalid-rules-of-hooks-9718e30b856c.ts:12:2
33 | ^^^^^^^^ 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)
34 13 | }
35 14 |
35 -
36 -
36 ```
37
38
\ No newline at end of file
compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/rules-of-hooks/error.invalid-rules-of-hooks-9bf17c174134.expect.md
+1 -3
@@ -18,6 +18,7 @@ function useHook() {
18
19 ```
20 Found 2 errors:
21 +
22 Error: 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)
23
24 error.invalid-rules-of-hooks-9bf17c174134.ts:6:7
@@ -29,7 +30,6 @@ error.invalid-rules-of-hooks-9bf17c174134.ts:6:7
30 8 | }
31 9 |
32
32 -
33 Error: 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)
34
35 error.invalid-rules-of-hooks-9bf17c174134.ts:7:7
@@ -39,8 +39,6 @@ error.invalid-rules-of-hooks-9bf17c174134.ts:7:7
39 | ^^^^^^^^ 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)
40 8 | }
41 9 |
42 -
43 -
42 ```
43
44
\ No newline at end of file
compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/rules-of-hooks/error.invalid-rules-of-hooks-b4dcda3d60ed.expect.md
+1 -2
@@ -17,6 +17,7 @@ function ComponentWithTernaryHook() {
17
18 ```
19 Found 1 error:
20 +
21 Error: 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)
22
23 error.invalid-rules-of-hooks-b4dcda3d60ed.ts:6:9
@@ -26,8 +27,6 @@ error.invalid-rules-of-hooks-b4dcda3d60ed.ts:6:9
27 | ^^^^^^^^^^^^^^ 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)
28 7 | }
29 8 |
29 -
30 -
30 ```
31
32
\ No newline at end of file
compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/rules-of-hooks/error.invalid-rules-of-hooks-c906cace44e9.expect.md
+1 -2
@@ -18,6 +18,7 @@ function useHook() {
18
19 ```
20 Found 1 error:
21 +
22 Error: 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)
23
24 error.invalid-rules-of-hooks-c906cace44e9.ts:7:2
@@ -27,8 +28,6 @@ error.invalid-rules-of-hooks-c906cace44e9.ts:7:2
28 | ^^^^^^^^ 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)
29 8 | }
30 9 |
30 -
31 -
31 ```
32
33
\ No newline at end of file
compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/rules-of-hooks/error.invalid-rules-of-hooks-d740d54e9c21.expect.md
+1 -2
@@ -19,6 +19,7 @@ function normalFunctionWithConditionalHook() {
19
20 ```
21 Found 1 error:
22 +
23 Error: 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)
24
25 error.invalid-rules-of-hooks-d740d54e9c21.ts:7:4
@@ -29,8 +30,6 @@ error.invalid-rules-of-hooks-d740d54e9c21.ts:7:4
30 8 | }
31 9 | }
32 10 |
32 -
33 -
33 ```
34
35
\ No newline at end of file
compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/rules-of-hooks/error.invalid-rules-of-hooks-d85c144bdf40.expect.md
+1 -3
@@ -21,6 +21,7 @@ function useHookInLoops() {
21
22 ```
23 Found 2 errors:
24 +
25 Error: 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)
26
27 error.invalid-rules-of-hooks-d85c144bdf40.ts:7:4
@@ -32,7 +33,6 @@ error.invalid-rules-of-hooks-d85c144bdf40.ts:7:4
33 9 | useHook2();
34 10 | }
35
35 -
36 Error: 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)
37
38 error.invalid-rules-of-hooks-d85c144bdf40.ts:9:4
@@ -43,8 +43,6 @@ error.invalid-rules-of-hooks-d85c144bdf40.ts:9:4
43 10 | }
44 11 | }
45 12 |
46 -
47 -
46 ```
47
48
\ No newline at end of file
compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/rules-of-hooks/error.invalid-rules-of-hooks-ea7c2fb545a9.expect.md
+1 -2
@@ -19,6 +19,7 @@ function useHookWithConditionalHook() {
19
20 ```
21 Found 1 error:
22 +
23 Error: 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)
24
25 error.invalid-rules-of-hooks-ea7c2fb545a9.ts:7:4
@@ -29,8 +30,6 @@ error.invalid-rules-of-hooks-ea7c2fb545a9.ts:7:4
30 8 | }
31 9 | }
32 10 |
32 -
33 -
33 ```
34
35
\ No newline at end of file
compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/rules-of-hooks/error.invalid-rules-of-hooks-f3d6c5e9c83d.expect.md
+1 -2
@@ -23,6 +23,7 @@ function useHook() {
23
24 ```
25 Found 1 error:
26 +
27 Error: 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)
28
29 error.invalid-rules-of-hooks-f3d6c5e9c83d.ts:12:2
@@ -32,8 +33,6 @@ error.invalid-rules-of-hooks-f3d6c5e9c83d.ts:12:2
33 | ^^^^^^^^ 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)
34 13 | }
35 14 |
35 -
36 -
36 ```
37
38
\ No newline at end of file
compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/rules-of-hooks/error.invalid-rules-of-hooks-f69800950ff0.expect.md
+1 -4
@@ -19,6 +19,7 @@ function useHook({bar}) {
19
20 ```
21 Found 3 errors:
22 +
23 Error: 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)
24
25 error.invalid-rules-of-hooks-f69800950ff0.ts:6:20
@@ -30,7 +31,6 @@ error.invalid-rules-of-hooks-f69800950ff0.ts:6:20
31 8 | let foo3 = bar ?? useState();
32 9 | }
33
33 -
34 Error: 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)
35
36 error.invalid-rules-of-hooks-f69800950ff0.ts:7:20
@@ -42,7 +42,6 @@ error.invalid-rules-of-hooks-f69800950ff0.ts:7:20
42 9 | }
43 10 |
44
45 -
45 Error: 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)
46
47 error.invalid-rules-of-hooks-f69800950ff0.ts:8:20
@@ -52,8 +51,6 @@ error.invalid-rules-of-hooks-f69800950ff0.ts:8:20
51 | ^^^^^^^^ 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)
52 9 | }
53 10 |
55 -
56 -
54 ```
55
56
\ No newline at end of file
compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/rules-of-hooks/error.invalid.invalid-rules-of-hooks-0a1dbff27ba0.expect.md
+1 -2
@@ -19,6 +19,7 @@ function createHook() {
19
20 ```
21 Found 1 error:
22 +
23 Error: 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)
24
25 Cannot call hook within a function expression.
@@ -31,8 +32,6 @@ error.invalid.invalid-rules-of-hooks-0a1dbff27ba0.ts:6:6
32 7 | }
33 8 | };
34 9 | }
34 -
35 -
35 ```
36
37
\ No newline at end of file
compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/rules-of-hooks/error.invalid.invalid-rules-of-hooks-0de1224ce64b.expect.md
+1 -3
@@ -19,6 +19,7 @@ function createComponent() {
19
20 ```
21 Found 2 errors:
22 +
23 Error: 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)
24
25 Cannot call hook within a function expression.
@@ -32,7 +33,6 @@ error.invalid.invalid-rules-of-hooks-0de1224ce64b.ts:6:6
33 8 | };
34 9 | }
35
35 -
36 Error: 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)
37
38 Cannot call useEffect within a function expression.
@@ -45,8 +45,6 @@ error.invalid.invalid-rules-of-hooks-0de1224ce64b.ts:5:4
45 6 | useHookInsideCallback();
46 7 | });
47 8 | };
48 -
49 -
48 ```
49
50
\ No newline at end of file
compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/rules-of-hooks/error.invalid.invalid-rules-of-hooks-449a37146a83.expect.md
+1 -2
@@ -19,6 +19,7 @@ function createComponent() {
19
20 ```
21 Found 1 error:
22 +
23 Error: 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)
24
25 Cannot call useState within a function expression.
@@ -31,8 +32,6 @@ error.invalid.invalid-rules-of-hooks-449a37146a83.ts:6:6
32 7 | }
33 8 | };
34 9 | }
34 -
35 -
35 ```
36
37
\ No newline at end of file
compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/rules-of-hooks/error.invalid.invalid-rules-of-hooks-76a74b4666e9.expect.md
+1 -2
@@ -17,6 +17,7 @@ function ComponentWithHookInsideCallback() {
17
18 ```
19 Found 1 error:
20 +
21 Error: 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)
22
23 Cannot call useState within a function expression.
@@ -29,8 +30,6 @@ error.invalid.invalid-rules-of-hooks-76a74b4666e9.ts:5:4
30 6 | }
31 7 | }
32 8 |
32 -
33 -
33 ```
34
35
\ No newline at end of file
compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/rules-of-hooks/error.invalid.invalid-rules-of-hooks-d842d36db450.expect.md
+1 -2
@@ -19,6 +19,7 @@ function createComponent() {
19
20 ```
21 Found 1 error:
22 +
23 Error: 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)
24
25 Cannot call hook within a function expression.
@@ -31,8 +32,6 @@ error.invalid.invalid-rules-of-hooks-d842d36db450.ts:6:6
32 7 | }
33 8 | };
34 9 | }
34 -
35 -
35 ```
36
37
\ No newline at end of file
compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/rules-of-hooks/error.invalid.invalid-rules-of-hooks-d952b82c2597.expect.md
+1 -2
@@ -17,6 +17,7 @@ function ComponentWithHookInsideCallback() {
17
18 ```
19 Found 1 error:
20 +
21 Error: 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)
22
23 Cannot call hook within a function expression.
@@ -29,8 +30,6 @@ error.invalid.invalid-rules-of-hooks-d952b82c2597.ts:5:4
30 6 | });
31 7 | }
32 8 |
32 -
33 -
33 ```
34
35
\ No newline at end of file
compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/rules-of-hooks/todo.error.invalid-rules-of-hooks-368024110a58.expect.md
+1 -2
@@ -21,6 +21,7 @@ const FancyButton = forwardRef(function (props, ref) {
21
22 ```
23 Found 1 error:
24 +
25 Error: 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)
26
27 todo.error.invalid-rules-of-hooks-368024110a58.ts:8:4
@@ -31,8 +32,6 @@ todo.error.invalid-rules-of-hooks-368024110a58.ts:8:4
32 9 | }
33 10 | return <button ref={ref}>{props.children}</button>;
34 11 | });
34 -
35 -
35 ```
36
37
\ No newline at end of file
compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/rules-of-hooks/todo.error.invalid-rules-of-hooks-8566f9a360e2.expect.md
+1 -2
@@ -21,6 +21,7 @@ const MemoizedButton = memo(function (props) {
21
22 ```
23 Found 1 error:
24 +
25 Error: 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)
26
27 todo.error.invalid-rules-of-hooks-8566f9a360e2.ts:8:4
@@ -31,8 +32,6 @@ todo.error.invalid-rules-of-hooks-8566f9a360e2.ts:8:4
32 9 | }
33 10 | return <button>{props.children}</button>;
34 11 | });
34 -
35 -
35 ```
36
37
\ No newline at end of file
compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/rules-of-hooks/todo.error.invalid-rules-of-hooks-a0058f0b446d.expect.md
+1 -2
@@ -20,6 +20,7 @@ function ComponentWithConditionalHook() {
20
21 ```
22 Found 1 error:
23 +
24 Error: 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)
25
26 todo.error.invalid-rules-of-hooks-a0058f0b446d.ts:8:4
@@ -30,8 +31,6 @@ todo.error.invalid-rules-of-hooks-a0058f0b446d.ts:8:4
31 9 | }
32 10 | }
33 11 |
33 -
34 -
34 ```
35
36
\ No newline at end of file
compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/rules-of-hooks/todo.error.rules-of-hooks-27c18dc8dad2.expect.md
+1 -2
@@ -21,6 +21,7 @@ const FancyButton = React.forwardRef((props, ref) => {
21
22 ```
23 Found 1 error:
24 +
25 Error: 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)
26
27 todo.error.rules-of-hooks-27c18dc8dad2.ts:8:4
@@ -31,8 +32,6 @@ todo.error.rules-of-hooks-27c18dc8dad2.ts:8:4
32 9 | }
33 10 | return <button ref={ref}>{props.children}</button>;
34 11 | });
34 -
35 -
35 ```
36
37
\ No newline at end of file
compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/rules-of-hooks/todo.error.rules-of-hooks-d0935abedc42.expect.md
+1 -2
@@ -20,6 +20,7 @@ React.unknownFunction((foo, bar) => {
20
21 ```
22 Found 1 error:
23 +
24 Error: 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)
25
26 todo.error.rules-of-hooks-d0935abedc42.ts:8:4
@@ -30,8 +31,6 @@ todo.error.rules-of-hooks-d0935abedc42.ts:8:4
31 9 | }
32 10 | });
33 11 |
33 -
34 -
34 ```
35
36
\ No newline at end of file
compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/rules-of-hooks/todo.error.rules-of-hooks-e29c874aa913.expect.md
+1 -2
@@ -21,6 +21,7 @@ function useHook() {
21
22 ```
23 Found 1 error:
24 +
25 Error: 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)
26
27 todo.error.rules-of-hooks-e29c874aa913.ts:9:4
@@ -31,8 +32,6 @@ todo.error.rules-of-hooks-e29c874aa913.ts:9:4
32 10 | } catch {}
33 11 | }
34 12 |
34 -
35 -
35 ```
36
37
\ No newline at end of file
compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/static-components/invalid-conditionally-assigned-dynamically-constructed-component-in-render.expect.md
+1 -2
@@ -50,8 +50,7 @@ function Example(props) {
50 ## Logs
51
52 ```
53 -{"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}
54 -{"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}
53 +{"kind":"CompileError","detail":{"options":{"severity":"InvalidReact","category":"Cannot create components during render","description":"Components created during render will reset their state each time they are created. Declare components outside of render. ","details":[{"kind":"error","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"},"message":"This component is created during render"},{"kind":"error","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"},"message":"The component is created during render here"}]}},"fnLoc":null}
54 {"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}
55 ```
56
compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/static-components/invalid-dynamically-construct-component-in-render.expect.md
+1 -2
@@ -32,8 +32,7 @@ function Example(props) {
32 ## Logs
33
34 ```
35 -{"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}
36 -{"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}
35 +{"kind":"CompileError","detail":{"options":{"severity":"InvalidReact","category":"Cannot create components during render","description":"Components created during render will reset their state each time they are created. Declare components outside of render. ","details":[{"kind":"error","loc":{"start":{"line":4,"column":10,"index":120},"end":{"line":4,"column":19,"index":129},"filename":"invalid-dynamically-construct-component-in-render.ts"},"message":"This component is created during render"},{"kind":"error","loc":{"start":{"line":3,"column":20,"index":91},"end":{"line":3,"column":37,"index":108},"filename":"invalid-dynamically-construct-component-in-render.ts"},"message":"The component is created during render here"}]}},"fnLoc":null}
36 {"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}
37 ```
38
compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/static-components/invalid-dynamically-constructed-component-function.expect.md
+1 -2
@@ -37,8 +37,7 @@ function Example(props) {
37 ## Logs
38
39 ```
40 -{"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}
41 -{"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}
40 +{"kind":"CompileError","detail":{"options":{"severity":"InvalidReact","category":"Cannot create components during render","description":"Components created during render will reset their state each time they are created. Declare components outside of render. ","details":[{"kind":"error","loc":{"start":{"line":6,"column":10,"index":130},"end":{"line":6,"column":19,"index":139},"filename":"invalid-dynamically-constructed-component-function.ts"},"message":"This component is created during render"},{"kind":"error","loc":{"start":{"line":3,"column":2,"index":73},"end":{"line":5,"column":3,"index":119},"filename":"invalid-dynamically-constructed-component-function.ts"},"message":"The component is created during render here"}]}},"fnLoc":null}
41 {"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}
42 ```
43
compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/static-components/invalid-dynamically-constructed-component-method-call.expect.md
+1 -2
@@ -41,8 +41,7 @@ function Example(props) {
41 ## Logs
42
43 ```
44 -{"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}
45 -{"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}
44 +{"kind":"CompileError","detail":{"options":{"severity":"InvalidReact","category":"Cannot create components during render","description":"Components created during render will reset their state each time they are created. Declare components outside of render. ","details":[{"kind":"error","loc":{"start":{"line":4,"column":10,"index":118},"end":{"line":4,"column":19,"index":127},"filename":"invalid-dynamically-constructed-component-method-call.ts"},"message":"This component is created during render"},{"kind":"error","loc":{"start":{"line":3,"column":20,"index":91},"end":{"line":3,"column":35,"index":106},"filename":"invalid-dynamically-constructed-component-method-call.ts"},"message":"The component is created during render here"}]}},"fnLoc":null}
45 {"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}
46 ```
47
compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/static-components/invalid-dynamically-constructed-component-new.expect.md
+1 -2
@@ -32,8 +32,7 @@ function Example(props) {
32 ## Logs
33
34 ```
35 -{"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}
36 -{"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}
35 +{"kind":"CompileError","detail":{"options":{"severity":"InvalidReact","category":"Cannot create components during render","description":"Components created during render will reset their state each time they are created. Declare components outside of render. ","details":[{"kind":"error","loc":{"start":{"line":4,"column":10,"index":125},"end":{"line":4,"column":19,"index":134},"filename":"invalid-dynamically-constructed-component-new.ts"},"message":"This component is created during render"},{"kind":"error","loc":{"start":{"line":3,"column":20,"index":91},"end":{"line":3,"column":42,"index":113},"filename":"invalid-dynamically-constructed-component-new.ts"},"message":"The component is created during render here"}]}},"fnLoc":null}
36 {"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}
37 ```
38
compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/todo.error.object-pattern-computed-key.expect.md
+1 -2
@@ -22,6 +22,7 @@ export const FIXTURE_ENTRYPOINT = {
22
23 ```
24 Found 1 error:
25 +
26 Todo: (BuildHIR::lowerAssignment) Handle computed properties in ObjectPattern
27
28 todo.error.object-pattern-computed-key.ts:5:9
@@ -32,8 +33,6 @@ todo.error.object-pattern-computed-key.ts:5:9
33 6 | return value;
34 7 | }
35 8 |
35 -
36 -
36 ```
37
38
\ No newline at end of file
compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/transform-fire/bailout-retry/error.todo-syntax.expect.md
+1
@@ -30,6 +30,7 @@ function Component({prop1}) {
30
31 ```
32 Found 1 error:
33 +
34 Error: [Fire] Untransformed reference to compiler-required feature.
35
36 Todo: (BuildHIR::lowerStatement) Handle TryStatement without a catch clause (11:4)
compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/transform-fire/bailout-retry/error.untransformed-fire-reference.expect.md
+1
@@ -14,6 +14,7 @@ console.log(fire == null);
14
15 ```
16 Found 1 error:
17 +
18 Error: [Fire] Untransformed reference to compiler-required feature.
19
20 null
compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/transform-fire/bailout-retry/error.use-no-memo.expect.md
+1
@@ -31,6 +31,7 @@ function Component({props, bar}) {
31
32 ```
33 Found 1 error:
34 +
35 Error: [Fire] Untransformed reference to compiler-required feature.
36
37 null
compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/transform-fire/error.invalid-mix-fire-and-no-fire.expect.md
+1 -2
@@ -28,6 +28,7 @@ function Component(props) {
28
29 ```
30 Found 1 error:
31 +
32 Error: Cannot compile `fire`
33
34 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.
@@ -40,8 +41,6 @@ error.invalid-mix-fire-and-no-fire.ts:11:6
41 12 | }
42 13 |
43 14 | nested();
43 -
44 -
44 ```
45
46
\ No newline at end of file
compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/transform-fire/error.invalid-multiple-args.expect.md
+1 -2
@@ -23,6 +23,7 @@ function Component({bar, baz}) {
23
24 ```
25 Found 1 error:
26 +
27 Error: Cannot compile `fire`
28
29 fire() can only take in a single call expression as an argument but received multiple arguments.
@@ -35,8 +36,6 @@ error.invalid-multiple-args.ts:9:4
36 10 | });
37 11 |
38 12 | return null;
38 -
39 -
39 ```
40
41
\ No newline at end of file
compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/transform-fire/error.invalid-nested-use-effect.expect.md
+1 -2
@@ -29,6 +29,7 @@ function Component(props) {
29
30 ```
31 Found 1 error:
32 +
33 Error: 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)
34
35 Cannot call useEffect within a function expression.
@@ -41,8 +42,6 @@ error.invalid-nested-use-effect.ts:9:4
42 10 | function nested() {
43 11 | fire(foo(props));
44 12 | }
44 -
45 -
45 ```
46
47
\ No newline at end of file
compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/transform-fire/error.invalid-not-call.expect.md
+1 -2
@@ -23,6 +23,7 @@ function Component(props) {
23
24 ```
25 Found 1 error:
26 +
27 Error: Cannot compile `fire`
28
29 `fire()` can only receive a function call such as `fire(fn(a,b)). Method calls and other expressions are not allowed.
@@ -35,8 +36,6 @@ error.invalid-not-call.ts:9:4
36 10 | });
37 11 |
38 12 | return null;
38 -
39 -
39 ```
40
41
\ No newline at end of file
compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/transform-fire/error.invalid-outside-effect.expect.md
+1 -3
@@ -25,6 +25,7 @@ function Component({props, bar}) {
25
26 ```
27 Found 2 errors:
28 +
29 Invariant: Cannot compile `fire`
30
31 Cannot use `fire` outside of a useEffect function.
@@ -38,7 +39,6 @@ error.invalid-outside-effect.ts:8:2
39 10 | useCallback(() => {
40 11 | fire(foo(props));
41
41 -
42 Invariant: Cannot compile `fire`
43
44 Cannot use `fire` outside of a useEffect function.
@@ -51,8 +51,6 @@ error.invalid-outside-effect.ts:11:4
51 12 | }, [foo, props]);
52 13 |
53 14 | return null;
54 -
55 -
54 ```
55
56
\ No newline at end of file
compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/transform-fire/error.invalid-rewrite-deps-no-array-literal.expect.md
+1 -2
@@ -26,6 +26,7 @@ function Component(props) {
26
27 ```
28 Found 1 error:
29 +
30 Invariant: Cannot compile `fire`
31
32 You must use an array literal for an effect dependency array when that effect uses `fire()`.
@@ -38,8 +39,6 @@ error.invalid-rewrite-deps-no-array-literal.ts:13:5
39 14 |
40 15 | return null;
41 16 | }
41 -
42 -
42 ```
43
44
\ No newline at end of file
compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/transform-fire/error.invalid-rewrite-deps-spread.expect.md
+1 -2
@@ -29,6 +29,7 @@ function Component(props) {
29
30 ```
31 Found 1 error:
32 +
33 Invariant: Cannot compile `fire`
34
35 You must use an array literal for an effect dependency array when that effect uses `fire()`.
@@ -41,8 +42,6 @@ error.invalid-rewrite-deps-spread.ts:15:7
42 16 | );
43 17 |
44 18 | return null;
44 -
45 -
45 ```
46
47
\ No newline at end of file
compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/transform-fire/error.invalid-spread.expect.md
+1 -2
@@ -23,6 +23,7 @@ function Component(props) {
23
24 ```
25 Found 1 error:
26 +
27 Error: Cannot compile `fire`
28
29 fire() can only take in a single call expression as an argument but received a spread argument.
@@ -35,8 +36,6 @@ error.invalid-spread.ts:9:4
36 10 | });
37 11 |
38 12 | return null;
38 -
39 -
39 ```
40
41
\ No newline at end of file
compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/transform-fire/error.todo-method.expect.md
+1 -2
@@ -23,6 +23,7 @@ function Component(props) {
23
24 ```
25 Found 1 error:
26 +
27 Error: Cannot compile `fire`
28
29 `fire()` can only receive a function call such as `fire(fn(a,b)). Method calls and other expressions are not allowed.
@@ -35,8 +36,6 @@ error.todo-method.ts:9:4
36 10 | });
37 11 |
38 12 | return null;
38 -
39 -
39 ```
40
41
\ No newline at end of file
compiler/packages/eslint-plugin-react-compiler/__tests__/ReactCompilerRule-test.ts
+2 -2
@@ -159,7 +159,7 @@ const tests: CompilerTestCases = {
159 message: /Handle var kinds in VariableDeclaration/,
160 },
161 {
162 - message: /Mutating component props or hook arguments is not allowed/,
162 + message: /Modifying component props or hook arguments is not allowed/,
163 },
164 ],
165 },
@@ -195,7 +195,7 @@ const tests: CompilerTestCases = {
195 errors: [
196 {
197 message:
198 - /Unexpected reassignment of a variable which was defined outside of the component/,
198 + /Cannot reassign variables declared outside of the component\/hook/,
199 },
200 ],
201 },
compiler/packages/eslint-plugin-react-compiler/__tests__/ReactCompilerRuleTypescript-test.ts
+1 -1
@@ -61,7 +61,7 @@ const tests: CompilerTestCases = {
61 `,
62 errors: [
63 {
64 - message: /Mutating a value returned from 'useState\(\)'/,
64 + message: /Modifying a value returned from 'useState\(\)'/,
65 line: 7,
66 },
67 ],
compiler/packages/eslint-plugin-react-compiler/src/rules/ReactCompilerRule.ts
+4 -2
@@ -200,7 +200,7 @@ const rule: Rule.RuleModule = {
200 end: endLoc,
201 };
202 context.report({
203 - message: `${detail.printErrorMessage(sourceCode.text)} ${locStr}`,
203 + message: `${detail.printErrorMessage(sourceCode.text, {eslint: true})} ${locStr}`,
204 loc: firstLineLoc,
205 suggest,
206 });
@@ -223,7 +223,9 @@ const rule: Rule.RuleModule = {
223 }
224 if (loc != null) {
225 context.report({
226 - message: detail.printErrorMessage(sourceCode.text),
226 + message: detail.printErrorMessage(sourceCode.text, {
227 + eslint: true,
228 + }),
229 loc,
230 suggest,
231 });
packages/eslint-plugin-react-hooks/__tests__/ReactCompilerRule-test.ts
+2 -2
@@ -161,7 +161,7 @@ const tests: CompilerTestCases = {
161 message: /Handle var kinds in VariableDeclaration/,
162 },
163 {
164 - message: /Mutating component props or hook arguments is not allowed/,
164 + message: /Modifying component props or hook arguments is not allowed/,
165 },
166 ],
167 },
@@ -197,7 +197,7 @@ const tests: CompilerTestCases = {
197 errors: [
198 {
199 message:
200 - /Unexpected reassignment of a variable which was defined outside of the component/,
200 + /Cannot reassign variables declared outside of the component\/hook/,
201 },
202 ],
203 },
packages/eslint-plugin-react-hooks/__tests__/ReactCompilerRuleTypescript-test.ts
+1 -1
@@ -63,7 +63,7 @@ const tests: CompilerTestCases = {
63 `,
64 errors: [
65 {
66 - message: /Mutating a value returned from 'useState\(\)'/,
66 + message: /Modifying a value returned from 'useState\(\)'/,
67 line: 7,
68 },
69 ],
packages/eslint-plugin-react-hooks/src/rules/ReactCompiler.ts
+4 -2
@@ -202,7 +202,7 @@ const rule: Rule.RuleModule = {
202 end: endLoc,
203 };
204 context.report({
205 - message: `${detail.printErrorMessage(sourceCode.text)} ${locStr}`,
205 + message: `${detail.printErrorMessage(sourceCode.text, {eslint: true})} ${locStr}`,
206 loc: firstLineLoc,
207 suggest,
208 });
@@ -225,7 +225,9 @@ const rule: Rule.RuleModule = {
225 }
226 if (loc != null) {
227 context.report({
228 - message: detail.printErrorMessage(sourceCode.text),
228 + message: detail.printErrorMessage(sourceCode.text, {
229 + eslint: true,
230 + }),
231 loc,
232 suggest,
233 });