[compiler][newinference] Update fixtures

Updates fixtures whose output I've double-checked should change

ghstack-source-id: bf3d5a6
Pull Request resolved: #33471

Author: josephsavona

compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/error.invalid-hoisting-setstate.expect.md

@@ -0,0 +1,49 @@
+
+## Input
+
+```javascript
+import {useEffect, useState} from 'react';
+import {Stringify} from 'shared-runtime';
+
+function Foo() {
+  /**
+   * Previously, this lowered to
+   * $1 = LoadContext capture setState
+   * $2 = FunctionExpression deps=$1 context=setState
+   *  [[ at this point, we freeze the `LoadContext setState` instruction, but it will never be referenced again ]]
+   *
+   * Now, this function expression directly references `setState`, which freezes
+   * the source `DeclareContext HoistedConst setState`. Freezing source identifiers
+   * (instead of the one level removed `LoadContext`) is more semantically correct
+   * for everything *other* than hoisted context declarations.
+   *
+   * $2 = Function context=setState
+   */
+  useEffect(() => setState(2), []);
+
+  const [state, setState] = useState(0);
+  return <Stringify state={state} />;
+}
+
+export const FIXTURE_ENTRYPOINT = {
+  fn: Foo,
+  params: [{}],
+  sequentialRenders: [{}, {}],
+};
+
+```
+
+
+## Error
+
+```
+  18 |   useEffect(() => setState(2), []);
+  19 |
+> 20 |   const [state, setState] = useState(0);
+     |                 ^^^^^^^^ InvalidReact: Updating a value used previously in an effect function or as an effect dependency is not allowed. Consider moving the mutation before calling useEffect(). Found mutation of `setState` (20:20)
+  21 |   return <Stringify state={state} />;
+  22 | }
+  23 |
+```
+          
+      

compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/hoisting-setstate.js renamed to compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/error.invalid-hoisting-setstate.js

@@ -24,7 +24,7 @@ function useFoo() {
 > 6 |     cache.set('key', 'value');
     | ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^
 > 7 |   });
-    | ^^^^ InvalidReact: This argument is a function which modifies local variables when called, which can bypass memoization and cause the UI not to update. Functions that are returned from hooks, passed as arguments to hooks, or passed as props to components may not mutate local variables (5:7)
+    | ^^^^ InvalidReact: This argument is a function which may reassign or mutate local variables after render, which can cause inconsistent behavior on subsequent renders. Consider using state instead (5:7)
 
 InvalidReact: The function modifies a local variable here (6:6)
   8 | }

compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/error.invalid-hook-function-argument-mutates-local-variable.expect.md

@@ -0,0 +1,61 @@
+
+## Input
+
+```javascript
+import {Stringify, useIdentity} from 'shared-runtime';
+
+function Component({prop1, prop2}) {
+  'use memo';
+
+  const data = useIdentity(
+    new Map([
+      [0, 'value0'],
+      [1, 'value1'],
+    ])
+  );
+  let i = 0;
+  const items = [];
+  items.push(
+    <Stringify
+      key={i}
+      onClick={() => data.get(i) + prop1}
+      shouldInvokeFns={true}
+    />
+  );
+  i = i + 1;
+  items.push(
+    <Stringify
+      key={i}
+      onClick={() => data.get(i) + prop2}
+      shouldInvokeFns={true}
+    />
+  );
+  return <>{items}</>;
+}
+
+export const FIXTURE_ENTRYPOINT = {
+  fn: Component,
+  params: [{prop1: 'prop1', prop2: 'prop2'}],
+  sequentialRenders: [
+    {prop1: 'prop1', prop2: 'prop2'},
+    {prop1: 'prop1', prop2: 'prop2'},
+    {prop1: 'changed', prop2: 'prop2'},
+  ],
+};
+
+```
+
+
+## Error
+
+```
+  19 |     />
+  20 |   );
+> 21 |   i = i + 1;
+     |   ^ InvalidReact: Updating a value used previously in JSX is not allowed. Consider moving the mutation before the JSX. Found mutation of `i` (21:21)
+  22 |   items.push(
+  23 |     <Stringify
+  24 |       key={i}
+```
+          
+      

compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/error.invalid-jsx-captures-context-variable.expect.md

@@ -20,7 +20,7 @@ function Component() {
   5 |     cache.set('key', 'value');
   6 |   };
 > 7 |   return <Foo fn={fn} />;
-    |                   ^^ InvalidReact: This argument is a function which modifies local variables when called, which can bypass memoization and cause the UI not to update. Functions that are returned from hooks, passed as arguments to hooks, or passed as props to components may not mutate local variables (7:7)
+    |                   ^^ InvalidReact: This argument is a function which may reassign or mutate local variables after render, which can cause inconsistent behavior on subsequent renders. Consider using state instead (7:7)
 
 InvalidReact: The function modifies a local variable here (5:5)
   8 | }

compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/jsx-captures-context-variable.js renamed to compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/error.invalid-jsx-captures-context-variable.js

@@ -15,11 +15,16 @@ function useFoo() {
 ## Error
 
 ```
+  1 | function useFoo() {
   2 |   let x = 0;
-  3 |   return value => {
+> 3 |   return value => {
+    |          ^^^^^^^^^^
 > 4 |     x = value;
-    |     ^ InvalidReact: Reassigning a variable after render has completed can cause inconsistent behavior on subsequent renders. Consider using state instead. Variable `x` cannot be reassigned after render (4:4)
-  5 |   };
+    | ^^^^^^^^^^^^^^
+> 5 |   };
+    | ^^^^ InvalidReact: This argument is a function which may reassign or mutate local variables after render, which can cause inconsistent behavior on subsequent renders. Consider using state instead (3:5)
+
+InvalidReact: The function modifies a local variable here (4:4)
   6 | }
   7 |
 ```

compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/error.invalid-pass-mutable-function-as-prop.expect.md

@@ -47,13 +47,19 @@ function Component() {
 ## Error
 
 ```
-   5 |
-   6 |   const reassignLocal = newValue => {
->  7 |     local = newValue;
-     |     ^^^^^ InvalidReact: Reassigning a variable after render has completed can cause inconsistent behavior on subsequent renders. Consider using state instead. Variable `local` cannot be reassigned after render (7:7)
-   8 |   };
-   9 |
-  10 |   const onMount = newValue => {
+  31 |   };
+  32 |
+> 33 |   useEffect(() => {
+     |             ^^^^^^^
+> 34 |     onMount();
+     | ^^^^^^^^^^^^^^
+> 35 |   }, [onMount]);
+     | ^^^^ InvalidReact: This argument is a function which may reassign or mutate local variables after render, which can cause inconsistent behavior on subsequent renders. Consider using state instead (33:35)
+
+InvalidReact: The function modifies a local variable here (7:7)
+  36 |
+  37 |   return 'ok';
+  38 | }
 ```
           
       

compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/error.invalid-reassign-local-in-hook-return-value.expect.md

@@ -48,13 +48,19 @@ function Component() {
 ## Error
 
 ```
-   6 |
-   7 |   const reassignLocal = newValue => {
->  8 |     local = newValue;
-     |     ^^^^^ InvalidReact: Reassigning a variable after render has completed can cause inconsistent behavior on subsequent renders. Consider using state instead. Variable `local` cannot be reassigned after render (8:8)
-   9 |   };
-  10 |
-  11 |   const callback = newValue => {
+  32 |   };
+  33 |
+> 34 |   useIdentity(() => {
+     |               ^^^^^^^
+> 35 |     callback();
+     | ^^^^^^^^^^^^^^^
+> 36 |   });
+     | ^^^^ InvalidReact: This argument is a function which may reassign or mutate local variables after render, which can cause inconsistent behavior on subsequent renders. Consider using state instead (34:36)
+
+InvalidReact: The function modifies a local variable here (8:8)
+  37 |
+  38 |   return 'ok';
+  39 | }
 ```
           
       

compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/error.invalid-reassign-local-variable-in-effect.expect.md

@@ -41,13 +41,14 @@ function Component() {
 ## Error
 
 ```
-  3 |
-  4 |   const reassignLocal = newValue => {
-> 5 |     local = newValue;
-    |     ^^^^^ InvalidReact: Reassigning a variable after render has completed can cause inconsistent behavior on subsequent renders. Consider using state instead. Variable `local` cannot be reassigned after render (5:5)
-  6 |   };
-  7 |
-  8 |   const onClick = newValue => {
+  29 |   };
+  30 |
+> 31 |   return <button onClick={onClick}>Submit</button>;
+     |                           ^^^^^^^ InvalidReact: This argument is a function which may reassign or mutate local variables after render, which can cause inconsistent behavior on subsequent renders. Consider using state instead (31:31)
+
+InvalidReact: The function modifies a local variable here (5:5)
+  32 | }
+  33 |
 ```