Add code frame to snap errors
Add code frame to snap errors This should make it easier (possible) to see if errors point at the right lines. No idea why I had to add 1 to the column, you'd think it's all babel-standard (whatever it is) and there wouldn't be off by one errors, but I'm not quite in the mood to debug babel issues more then necessary right now...
Jan Kassens committed
Feb 15, 2024 at 18:42 UTC
ac8971275021c3488a03cf32620c2d563468770b
116 files changed
+830
-115
compiler/packages/babel-plugin-react-forget/src/__tests__/fixtures/compiler/error._todo.computed-lval-in-destructure.expect.md
+7
-1
@@ -15,7 +15,13 @@ function Component(props) {
15
## Error
16
17
```
18
-[ReactForget] Todo: (BuildHIR::lowerAssignment) Handle computed properties in ObjectPattern (3:3)
18
+ 1 | function Component(props) {
19
+ 2 | const computedKey = props.key;
20
+> 3 | const { [computedKey]: x } = props.val;
21
+ | ^^^^^^^^^^^^^^^^ [ReactForget] Todo: (BuildHIR::lowerAssignment) Handle computed properties in ObjectPattern (3:3)
22
+ 4 |
23
+ 5 | return x;
24
+ 6 | }
25
```
26
27
\ No newline at end of file
compiler/packages/babel-plugin-react-forget/src/__tests__/fixtures/compiler/error.bailout-on-flow-suppression.expect.md
+7
-1
@@ -16,7 +16,13 @@ function Foo(props) {
16
## Error
17
18
```
19
-[ReactForget] InvalidReact: React Forget has bailed out of optimizing this component as one or more React rule violations were reported by Flow. React Forget only works when your components follow all the rules of React, disabling them may result in undefined behavior. $FlowFixMe[react-rule-hook] (4:4)
19
+ 2 |
20
+ 3 | function Foo(props) {
21
+> 4 | // $FlowFixMe[react-rule-hook]
22
+ | ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^ [ReactForget] InvalidReact: React Forget has bailed out of optimizing this component as one or more React rule violations were reported by Flow. React Forget only works when your components follow all the rules of React, disabling them may result in undefined behavior. $FlowFixMe[react-rule-hook] (4:4)
23
+ 5 | useX();
24
+ 6 | return null;
25
+ 7 | }
26
```
27
28
\ No newline at end of file
compiler/packages/babel-plugin-react-forget/src/__tests__/fixtures/compiler/error.bailout-on-suppression-of-custom-rule.expect.md
+7
-1
@@ -19,9 +19,15 @@ function lowercasecomponent() {
19
## Error
20
21
```
22
-[ReactForget] InvalidReact: React Forget has bailed out of optimizing this component as one or more React eslint rules were disabled. React Forget only works when your components follow all the rules of React, disabling them may result in undefined behavior. eslint-disable my-app/react-rule (3:3)
22
+ 1 | // @eslintSuppressionRules(my-app/react-rule)
23
+ 2 |
24
+> 3 | /* eslint-disable my-app/react-rule */
25
+ | ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^ [ReactForget] InvalidReact: React Forget has bailed out of optimizing this component as one or more React eslint rules were disabled. React Forget only works when your components follow all the rules of React, disabling them may result in undefined behavior. eslint-disable my-app/react-rule (3:3)
26
27
[ReactForget] InvalidReact: React Forget has bailed out of optimizing this component as one or more React eslint rules were disabled. React Forget only works when your components follow all the rules of React, disabling them may result in undefined behavior. eslint-disable-next-line my-app/react-rule (7:7)
28
+ 4 | function lowercasecomponent() {
29
+ 5 | "use forget";
30
+ 6 | const x = [];
31
```
32
33
\ No newline at end of file
compiler/packages/babel-plugin-react-forget/src/__tests__/fixtures/compiler/error.call-args-destructuring-asignment-complex.expect.md
+7
-1
@@ -14,7 +14,13 @@ function Component(props) {
14
## Error
15
16
```
17
-[ReactForget] Invariant: Const declaration cannot be referenced as an expression (3:3)
17
+ 1 | function Component(props) {
18
+ 2 | let x = makeObject();
19
+> 3 | x.foo(([[x]] = makeObject()));
20
+ | ^^^^^ [ReactForget] Invariant: Const declaration cannot be referenced as an expression (3:3)
21
+ 4 | return x;
22
+ 5 | }
23
+ 6 |
24
```
25
26
\ No newline at end of file
compiler/packages/babel-plugin-react-forget/src/__tests__/fixtures/compiler/error.capitalized-function-call-aliased.expect.md
+6
-1
@@ -14,7 +14,12 @@ function Foo() {
14
## Error
15
16
```
17
-[ReactForget] InvalidReact: Capitalized function calls may be calling components that use hooks, which make them dangerous to memoize. Ensure there are no hook calls in the function and rename it to begin with a lowercase letter to fix this error. Bar may be a component. (4:4)
17
+ 2 | function Foo() {
18
+ 3 | let x = Bar;
19
+> 4 | x(); // ERROR
20
+ | ^^^ [ReactForget] InvalidReact: Capitalized function calls may be calling components that use hooks, which make them dangerous to memoize. Ensure there are no hook calls in the function and rename it to begin with a lowercase letter to fix this error. Bar may be a component. (4:4)
21
+ 5 | }
22
+ 6 |
23
```
24
25
\ No newline at end of file
compiler/packages/babel-plugin-react-forget/src/__tests__/fixtures/compiler/error.capitalized-function-call.expect.md
+7
-1
@@ -15,7 +15,13 @@ function Component() {
15
## Error
16
17
```
18
-[ReactForget] InvalidReact: Capitalized function calls may be calling components that use hooks, which make them dangerous to memoize. Ensure there are no hook calls in the function and rename it to begin with a lowercase letter to fix this error. SomeFunc may be a component. (3:3)
18
+ 1 | // @validateNoCapitalizedCalls
19
+ 2 | function Component() {
20
+> 3 | const x = SomeFunc();
21
+ | ^^^^^^^^^^ [ReactForget] InvalidReact: Capitalized function calls may be calling components that use hooks, which make them dangerous to memoize. Ensure there are no hook calls in the function and rename it to begin with a lowercase letter to fix this error. SomeFunc may be a component. (3:3)
22
+ 4 |
23
+ 5 | return x;
24
+ 6 | }
25
```
26
27
\ No newline at end of file
compiler/packages/babel-plugin-react-forget/src/__tests__/fixtures/compiler/error.component-syntax-ref-gating.flow.expect.md
+5
-1
@@ -12,7 +12,11 @@ component Foo(ref: React.RefSetter<Controls>) {
12
## Error
13
14
```
15
-[ReactForget] Invariant: Encountered a function used before its declaration, which breaks Forget's gating codegen due to hoisting. Rewrite the reference to Foo_withRef to not rely on hoisting to fix this issue (2:2)
15
+ 1 | // @flow @gating
16
+> 2 | component Foo(ref: React.RefSetter<Controls>) {
17
+ | ^^^ [ReactForget] Invariant: Encountered a function used before its declaration, which breaks Forget's gating codegen due to hoisting. Rewrite the reference to Foo_withRef to not rely on hoisting to fix this issue (2:2)
18
+ 3 | return <Bar ref={ref}/>;
19
+ 4 | }
20
```
21
22
\ No newline at end of file
compiler/packages/babel-plugin-react-forget/src/__tests__/fixtures/compiler/error.conditional-hook-unknown-hook-react-namespace.expect.md
+7
-1
@@ -16,7 +16,13 @@ function Component(props) {
16
## Error
17
18
```
19
-[ReactForget] InvalidReact: Hooks must always be called in a consistent order, and may not be called conditionally. See the Rules of Hooks (https://react.dev/warnings/invalid-hook-call-warning) (4:4)
19
+ 2 | let x = null;
20
+ 3 | if (props.cond) {
21
+> 4 | x = React.useNonexistentHook();
22
+ | ^^^^^^^^^^^^^^^^^^^^^^^^ [ReactForget] InvalidReact: Hooks must always be called in a consistent order, and may not be called conditionally. See the Rules of Hooks (https://react.dev/warnings/invalid-hook-call-warning) (4:4)
23
+ 5 | }
24
+ 6 | return x;
25
+ 7 | }
26
```
27
28
\ No newline at end of file
compiler/packages/babel-plugin-react-forget/src/__tests__/fixtures/compiler/error.conditional-hooks-as-method-call.expect.md
+7
-1
@@ -16,7 +16,13 @@ function Component(props) {
16
## Error
17
18
```
19
-[ReactForget] InvalidReact: Hooks must always be called in a consistent order, and may not be called conditionally. See the Rules of Hooks (https://react.dev/warnings/invalid-hook-call-warning) (4:4)
19
+ 2 | let x = null;
20
+ 3 | if (props.cond) {
21
+> 4 | x = Foo.useFoo();
22
+ | ^^^^^^^^^^ [ReactForget] InvalidReact: Hooks must always be called in a consistent order, and may not be called conditionally. See the Rules of Hooks (https://react.dev/warnings/invalid-hook-call-warning) (4:4)
23
+ 5 | }
24
+ 6 | return x;
25
+ 7 | }
26
```
27
28
\ No newline at end of file
compiler/packages/babel-plugin-react-forget/src/__tests__/fixtures/compiler/error.default-param-accesses-local.expect.md
+11
-1
@@ -22,7 +22,17 @@ export const FIXTURE_ENTRYPOINT = {
22
## Error
23
24
```
25
-[ReactForget] Todo: (BuildHIR::node.lowerReorderableExpression) Expression type 'ArrowFunctionExpression' cannot be safely reordered (3:5)
25
+ 1 | function Component(
26
+ 2 | x,
27
+> 3 | y = () => {
28
+ | ^^^^^^^
29
+> 4 | return x;
30
+ | ^^^^^^^^^^^^^
31
+> 5 | }
32
+ | ^^^^ [ReactForget] Todo: (BuildHIR::node.lowerReorderableExpression) Expression type 'ArrowFunctionExpression' cannot be safely reordered (3:5)
33
+ 6 | ) {
34
+ 7 | return y();
35
+ 8 | }
36
```
37
38
\ No newline at end of file
compiler/packages/babel-plugin-react-forget/src/__tests__/fixtures/compiler/error.dont-hoist-inline-reference.expect.md
+7
-1
@@ -19,7 +19,13 @@ export const FIXTURE_ENTRYPOINT = {
19
## Error
20
21
```
22
-[ReactForget] Todo: [hoisting] EnterSSA: Expected identifier to be defined before being used. Identifier x$1 is undefined (3:3)
22
+ 1 | import { identity } from "shared-runtime";
23
+ 2 | function useInvalid() {
24
+> 3 | const x = identity(x);
25
+ | ^^^^^^^^^^^^^^^^^^^^^^ [ReactForget] Todo: [hoisting] EnterSSA: Expected identifier to be defined before being used. Identifier x$1 is undefined (3:3)
26
+ 4 | return x;
27
+ 5 | }
28
+ 6 |
29
```
30
31
\ No newline at end of file
compiler/packages/babel-plugin-react-forget/src/__tests__/fixtures/compiler/error.gating-hoisting.expect.md
+7
-1
@@ -14,7 +14,13 @@ function Foo_withRef(props, ref) {
14
## Error
15
16
```
17
-[ReactForget] Invariant: Encountered a function used before its declaration, which breaks Forget's gating codegen due to hoisting. Rewrite the reference to Foo_withRef to not rely on hoisting to fix this issue (3:3)
17
+ 1 | // @gating
18
+ 2 | const Foo = React.forwardRef(Foo_withRef);
19
+> 3 | function Foo_withRef(props, ref) {
20
+ | ^^^^^^^^^^^ [ReactForget] Invariant: Encountered a function used before its declaration, which breaks Forget's gating codegen due to hoisting. Rewrite the reference to Foo_withRef to not rely on hoisting to fix this issue (3:3)
21
+ 4 | return <Bar ref={ref} {...props}></Bar>;
22
+ 5 | }
23
+ 6 |
24
```
25
26
\ No newline at end of file
compiler/packages/babel-plugin-react-forget/src/__tests__/fixtures/compiler/error.gating-use-before-decl.expect.md
+5
-1
@@ -14,7 +14,11 @@ function Foo() {}
14
## Error
15
16
```
17
-[ReactForget] Invariant: Encountered a function used before its declaration, which breaks Forget's gating codegen due to hoisting. Rewrite the reference to Foo to not rely on hoisting to fix this issue (5:5)
17
+ 3 |
18
+ 4 | export default memo(Foo);
19
+> 5 | function Foo() {}
20
+ | ^^^ [ReactForget] Invariant: Encountered a function used before its declaration, which breaks Forget's gating codegen due to hoisting. Rewrite the reference to Foo to not rely on hoisting to fix this issue (5:5)
21
+ 6 |
22
```
23
24
\ No newline at end of file
compiler/packages/babel-plugin-react-forget/src/__tests__/fixtures/compiler/error.hoisted-function-declaration.expect.md
+7
-1
@@ -17,7 +17,13 @@ function component(a) {
17
## Error
18
19
```
20
-[ReactForget] Todo: Unsupported declaration type for hoisting. variable "x" declared with FunctionDeclaration (3:3)
20
+ 1 | function component(a) {
21
+ 2 | let t = { a };
22
+> 3 | x(t); // hoisted call
23
+ | ^^^^ [ReactForget] Todo: Unsupported declaration type for hoisting. variable "x" declared with FunctionDeclaration (3:3)
24
+ 4 | function x(p) {
25
+ 5 | p.foo();
26
+ 6 | }
27
```
28
29
\ No newline at end of file
compiler/packages/babel-plugin-react-forget/src/__tests__/fixtures/compiler/error.hoisting-simple-function-declaration.expect.md
+7
-1
@@ -24,7 +24,13 @@ export const FIXTURE_ENTRYPOINT = {
24
## Error
25
26
```
27
-[ReactForget] Todo: Unsupported declaration type for hoisting. variable "baz" declared with FunctionDeclaration (5:5)
27
+ 3 | return x;
28
+ 4 | }
29
+> 5 | return baz(); // OK: FuncDecls are HoistableDeclarations that have both declaration and value hoisting
30
+ | ^^^^^ [ReactForget] Todo: Unsupported declaration type for hoisting. variable "baz" declared with FunctionDeclaration (5:5)
31
+ 6 | function baz() {
32
+ 7 | return bar();
33
+ 8 | }
34
```
35
36
\ No newline at end of file
compiler/packages/babel-plugin-react-forget/src/__tests__/fixtures/compiler/error.invalid-ReactUseMemo-async-callback.expect.md
+10
-1
@@ -15,7 +15,16 @@ function component(a, b) {
15
## Error
16
17
```
18
-[ReactForget] InvalidReact: useMemo callbacks may not be async or generator functions (2:4)
18
+ 1 | function component(a, b) {
19
+> 2 | let x = React.useMemo(async () => {
20
+ | ^^^^^^^^^^^^^
21
+> 3 | await a;
22
+ | ^^^^^^^^^^^^
23
+> 4 | }, []);
24
+ | ^^^^ [ReactForget] InvalidReact: useMemo callbacks may not be async or generator functions (2:4)
25
+ 5 | return x;
26
+ 6 | }
27
+ 7 |
28
```
29
30
\ No newline at end of file
compiler/packages/babel-plugin-react-forget/src/__tests__/fixtures/compiler/error.invalid-access-ref-during-render.expect.md
+6
-1
@@ -15,7 +15,12 @@ function Component(props) {
15
## Error
16
17
```
18
-[ReactForget] InvalidReact: Ref values (the `current` property) may not be accessed during render. (https://react.dev/reference/react/useRef). Cannot access ref value at freeze $22:TObject<BuiltInRefValue> (5:5)
18
+ 3 | const ref = useRef(null);
19
+ 4 | const value = ref.current;
20
+> 5 | return value;
21
+ | ^^^^^ [ReactForget] InvalidReact: Ref values (the `current` property) may not be accessed during render. (https://react.dev/reference/react/useRef). Cannot access ref value at freeze $22:TObject<BuiltInRefValue> (5:5)
22
+ 6 | }
23
+ 7 |
24
```
25
26
\ No newline at end of file
compiler/packages/babel-plugin-react-forget/src/__tests__/fixtures/compiler/error.invalid-aliased-ref-in-callback-invoked-during-render-.expect.md
+6
-1
@@ -19,7 +19,12 @@ function Component(props) {
19
## Error
20
21
```
22
-[ReactForget] InvalidReact: Ref values (the `current` property) may not be accessed during render. (https://react.dev/reference/react/useRef). Cannot access ref value at mutate? $64[13:15] (9:9)
22
+ 7 | return <Foo item={item} current={current} />;
23
+ 8 | };
24
+> 9 | return <Items>{props.items.map((item) => renderItem(item))}</Items>;
25
+ | ^^^^^^^^^^^^^^^^^^^^^^^^^^ [ReactForget] InvalidReact: Ref values (the `current` property) may not be accessed during render. (https://react.dev/reference/react/useRef). Cannot access ref value at mutate? $64[13:15] (9:9)
26
+ 10 | }
27
+ 11 |
28
```
29
30
\ No newline at end of file
compiler/packages/babel-plugin-react-forget/src/__tests__/fixtures/compiler/error.invalid-array-push-frozen.expect.md
+7
-1
@@ -15,7 +15,13 @@ function Component(props) {
15
## Error
16
17
```
18
-[ReactForget] InvalidReact: Updating a value used previously in JSX is not allowed. Consider moving the mutation before the JSX. (4:4)
18
+ 2 | const x = [];
19
+ 3 | <div>{x}</div>;
20
+> 4 | x.push(props.value);
21
+ | ^ [ReactForget] InvalidReact: Updating a value used previously in JSX is not allowed. Consider moving the mutation before the JSX. (4:4)
22
+ 5 | return x;
23
+ 6 | }
24
+ 7 |
25
```
26
27
\ No newline at end of file
compiler/packages/babel-plugin-react-forget/src/__tests__/fixtures/compiler/error.invalid-assign-hook-to-local.expect.md
+6
-1
@@ -14,7 +14,12 @@ function Component(props) {
14
## Error
15
16
```
17
-[ReactForget] InvalidReact: Hooks may not be referenced as normal values, they must be called. See the Rules of Hooks (https://react.dev/warnings/invalid-hook-call-warning) (2:2)
17
+ 1 | function Component(props) {
18
+> 2 | const x = useState;
19
+ | ^^^^^^^^ [ReactForget] InvalidReact: Hooks may not be referenced as normal values, they must be called. See the Rules of Hooks (https://react.dev/warnings/invalid-hook-call-warning) (2:2)
20
+ 3 | const state = x(null);
21
+ 4 | return state[0];
22
+ 5 | }
23
```
24
25
\ No newline at end of file
compiler/packages/babel-plugin-react-forget/src/__tests__/fixtures/compiler/error.invalid-computed-store-to-frozen-value.expect.md
+7
-1
@@ -16,7 +16,13 @@ function Component(props) {
16
## Error
17
18
```
19
-[ReactForget] InvalidReact: Updating a value used previously in JSX is not allowed. Consider moving the mutation before the JSX. (5:5)
19
+ 3 | // freeze
20
+ 4 | <div>{x}</div>;
21
+> 5 | x[0] = true;
22
+ | ^ [ReactForget] InvalidReact: Updating a value used previously in JSX is not allowed. Consider moving the mutation before the JSX. (5:5)
23
+ 6 | return x;
24
+ 7 | }
25
+ 8 |
26
```
27
28
\ No newline at end of file
compiler/packages/babel-plugin-react-forget/src/__tests__/fixtures/compiler/error.invalid-delete-computed-property-of-frozen-value.expect.md
+7
-1
@@ -16,7 +16,13 @@ function Component(props) {
16
## Error
17
18
```
19
-[ReactForget] InvalidReact: Updating a value used previously in JSX is not allowed. Consider moving the mutation before the JSX. (5:5)
19
+ 3 | // freeze
20
+ 4 | <div>{x}</div>;
21
+> 5 | delete x[y];
22
+ | ^ [ReactForget] InvalidReact: Updating a value used previously in JSX is not allowed. Consider moving the mutation before the JSX. (5:5)
23
+ 6 | return x;
24
+ 7 | }
25
+ 8 |
26
```
27
28
\ No newline at end of file
compiler/packages/babel-plugin-react-forget/src/__tests__/fixtures/compiler/error.invalid-delete-property-of-frozen-value.expect.md
+7
-1
@@ -16,7 +16,13 @@ function Component(props) {
16
## Error
17
18
```
19
-[ReactForget] InvalidReact: Updating a value used previously in JSX is not allowed. Consider moving the mutation before the JSX. (5:5)
19
+ 3 | // freeze
20
+ 4 | <div>{x}</div>;
21
+> 5 | delete x.y;
22
+ | ^ [ReactForget] InvalidReact: Updating a value used previously in JSX is not allowed. Consider moving the mutation before the JSX. (5:5)
23
+ 6 | return x;
24
+ 7 | }
25
+ 8 |
26
```
27
28
\ No newline at end of file
compiler/packages/babel-plugin-react-forget/src/__tests__/fixtures/compiler/error.invalid-destructure-assignment-to-global.expect.md
+6
-1
@@ -13,7 +13,12 @@ function useFoo(props) {
13
## Error
14
15
```
16
-[ReactForget] InvalidReact: This reassigns a variable which was not defined inside of the component. Components should be pure and side-effect free. If this variable is used in rendering, use useState instead. (https://react.dev/learn/keeping-components-pure) (2:2)
16
+ 1 | function useFoo(props) {
17
+> 2 | [x] = props;
18
+ | ^^^ [ReactForget] InvalidReact: This reassigns a variable which was not defined inside of the component. Components should be pure and side-effect free. If this variable is used in rendering, use useState instead. (https://react.dev/learn/keeping-components-pure) (2:2)
19
+ 3 | return { x };
20
+ 4 | }
21
+ 5 |
22
```
23
24
\ No newline at end of file
compiler/packages/babel-plugin-react-forget/src/__tests__/fixtures/compiler/error.invalid-destructure-to-local-global-variables.expect.md
+7
-1
@@ -15,7 +15,13 @@ function Component(props) {
15
## Error
16
17
```
18
-[ReactForget] InvalidReact: This reassigns a variable which was not defined inside of the component. Components should be pure and side-effect free. If this variable is used in rendering, use useState instead. (https://react.dev/learn/keeping-components-pure) (3:3)
18
+ 1 | function Component(props) {
19
+ 2 | let a;
20
+> 3 | [a, b] = props.value;
21
+ | ^^^^^^ [ReactForget] InvalidReact: This reassigns a variable which was not defined inside of the component. Components should be pure and side-effect free. If this variable is used in rendering, use useState instead. (https://react.dev/learn/keeping-components-pure) (3:3)
22
+ 4 |
23
+ 5 | return [a, b];
24
+ 6 | }
25
```
26
27
\ No newline at end of file
compiler/packages/babel-plugin-react-forget/src/__tests__/fixtures/compiler/error.invalid-function-expression-mutates-immutable-value.expect.md
+7
-1
@@ -18,7 +18,13 @@ function Component(props) {
18
## Error
19
20
```
21
-[ReactForget] InvalidReact: Mutating a value returned from a function that should not be mutated. (5:5)
21
+ 3 | const onChange = (e) => {
22
+ 4 | // INVALID! should use copy-on-write and pass the new value
23
+> 5 | x.value = e.target.value;
24
+ | ^^^^^^^ [ReactForget] InvalidReact: Mutating a value returned from a function that should not be mutated. (5:5)
25
+ 6 | setX(x);
26
+ 7 | };
27
+ 8 | return <input value={x.value} onChange={onChange} />;
28
```
29
30
\ No newline at end of file
compiler/packages/babel-plugin-react-forget/src/__tests__/fixtures/compiler/error.invalid-mutate-after-aliased-freeze.expect.md
+7
-1
@@ -25,7 +25,13 @@ function Component(props) {
25
## Error
26
27
```
28
-[ReactForget] InvalidReact: Updating a value used previously in JSX is not allowed. Consider moving the mutation before the JSX. (13:13)
28
+ 11 | // y is MaybeFrozen at this point, since it may alias to x
29
+ 12 | // (which is the above line freezes)
30
+> 13 | y.push(props.p2);
31
+ | ^ [ReactForget] InvalidReact: Updating a value used previously in JSX is not allowed. Consider moving the mutation before the JSX. (13:13)
32
+ 14 |
33
+ 15 | return <Component x={x} y={y} />;
34
+ 16 | }
35
```
36
37
\ No newline at end of file
compiler/packages/babel-plugin-react-forget/src/__tests__/fixtures/compiler/error.invalid-mutate-after-freeze.expect.md
+7
-1
@@ -19,7 +19,13 @@ function Component(props) {
19
## Error
20
21
```
22
-[ReactForget] InvalidReact: Updating a value used previously in JSX is not allowed. Consider moving the mutation before the JSX. (7:7)
22
+ 5 |
23
+ 6 | // x is Frozen at this point
24
+> 7 | x.push(props.p2);
25
+ | ^ [ReactForget] InvalidReact: Updating a value used previously in JSX is not allowed. Consider moving the mutation before the JSX. (7:7)
26
+ 8 |
27
+ 9 | return <div>{_}</div>;
28
+ 10 | }
29
```
30
31
\ No newline at end of file
compiler/packages/babel-plugin-react-forget/src/__tests__/fixtures/compiler/error.invalid-mutate-context-in-callback.expect.md
+7
-1
@@ -24,7 +24,13 @@ function Component(props) {
24
## Error
25
26
```
27
-[ReactForget] InvalidReact: Mutating a value returned from 'useContext()', which should not be mutated. (12:12)
27
+ 10 | // independently
28
+ 11 | const onClick = () => {
29
+> 12 | FooContext.current = true;
30
+ | ^^^^^^^^^^^^^^^^^^ [ReactForget] InvalidReact: Mutating a value returned from 'useContext()', which should not be mutated. (12:12)
31
+ 13 | };
32
+ 14 | return <div onClick={onClick} />;
33
+ 15 | }
34
```
35
36
\ No newline at end of file
compiler/packages/babel-plugin-react-forget/src/__tests__/fixtures/compiler/error.invalid-mutate-context.expect.md
+7
-1
@@ -14,7 +14,13 @@ function Component(props) {
14
## Error
15
16
```
17
-[ReactForget] InvalidReact: Mutating a value returned from 'useContext()', which should not be mutated. (3:3)
17
+ 1 | function Component(props) {
18
+ 2 | const context = useContext(FooContext);
19
+> 3 | context.value = props.value;
20
+ | ^^^^^^^ [ReactForget] InvalidReact: Mutating a value returned from 'useContext()', which should not be mutated. (3:3)
21
+ 4 | return context.value;
22
+ 5 | }
23
+ 6 |
24
```
25
26
\ No newline at end of file
compiler/packages/babel-plugin-react-forget/src/__tests__/fixtures/compiler/error.invalid-pass-hook-as-call-arg.expect.md
+5
-1
@@ -12,7 +12,11 @@ function Component(props) {
12
## Error
13
14
```
15
-[ReactForget] InvalidReact: Hooks may not be referenced as normal values, they must be called. See the Rules of Hooks (https://react.dev/warnings/invalid-hook-call-warning) (2:2)
15
+ 1 | function Component(props) {
16
+> 2 | return foo(useFoo);
17
+ | ^^^^^^ [ReactForget] InvalidReact: Hooks may not be referenced as normal values, they must be called. See the Rules of Hooks (https://react.dev/warnings/invalid-hook-call-warning) (2:2)
18
+ 3 | }
19
+ 4 |
20
```
21
22
\ No newline at end of file
compiler/packages/babel-plugin-react-forget/src/__tests__/fixtures/compiler/error.invalid-pass-hook-as-prop.expect.md
+5
-1
@@ -12,7 +12,11 @@ function Component(props) {
12
## Error
13
14
```
15
-[ReactForget] InvalidReact: Hooks may not be referenced as normal values, they must be called. See the Rules of Hooks (https://react.dev/warnings/invalid-hook-call-warning) (2:2)
15
+ 1 | function Component(props) {
16
+> 2 | return <Child foo={useFoo} />;
17
+ | ^^^^^^ [ReactForget] InvalidReact: Hooks may not be referenced as normal values, they must be called. See the Rules of Hooks (https://react.dev/warnings/invalid-hook-call-warning) (2:2)
18
+ 3 | }
19
+ 4 |
20
```
21
22
\ No newline at end of file
compiler/packages/babel-plugin-react-forget/src/__tests__/fixtures/compiler/error.invalid-pass-ref-to-function.expect.md
+7
-1
@@ -15,7 +15,13 @@ function Component(props) {
15
## Error
16
17
```
18
-[ReactForget] InvalidReact: Ref values (the `current` property) may not be accessed during render. (https://react.dev/reference/react/useRef). Cannot access ref value at mutate? $21[6:8]:TObject<BuiltInUseRefId> (4:4)
18
+ 2 | function Component(props) {
19
+ 3 | const ref = useRef(null);
20
+> 4 | const x = foo(ref);
21
+ | ^^^ [ReactForget] InvalidReact: Ref values (the `current` property) may not be accessed during render. (https://react.dev/reference/react/useRef). Cannot access ref value at mutate? $21[6:8]:TObject<BuiltInUseRefId> (4:4)
22
+ 5 | return x.current;
23
+ 6 | }
24
+ 7 |
25
```
26
27
\ No newline at end of file
compiler/packages/babel-plugin-react-forget/src/__tests__/fixtures/compiler/error.invalid-property-store-to-frozen-value.expect.md
+7
-1
@@ -16,7 +16,13 @@ function Component(props) {
16
## Error
17
18
```
19
-[ReactForget] InvalidReact: Updating a value used previously in JSX is not allowed. Consider moving the mutation before the JSX. (5:5)
19
+ 3 | // freeze
20
+ 4 | <div>{x}</div>;
21
+> 5 | x.y = true;
22
+ | ^ [ReactForget] InvalidReact: Updating a value used previously in JSX is not allowed. Consider moving the mutation before the JSX. (5:5)
23
+ 6 | return x;
24
+ 7 | }
25
+ 8 |
26
```
27
28
\ No newline at end of file
compiler/packages/babel-plugin-react-forget/src/__tests__/fixtures/compiler/error.invalid-ref-in-callback-invoked-during-render.expect.md
+6
-1
@@ -18,7 +18,12 @@ function Component(props) {
18
## Error
19
20
```
21
-[ReactForget] InvalidReact: Ref values (the `current` property) may not be accessed during render. (https://react.dev/reference/react/useRef). Cannot access ref value at mutate? $60[14:16] (8:8)
21
+ 6 | return <Foo item={item} current={current} />;
22
+ 7 | };
23
+> 8 | return <Items>{props.items.map((item) => renderItem(item))}</Items>;
24
+ | ^^^^^^^^^^^^^^^^^^^^^^^^^^ [ReactForget] InvalidReact: Ref values (the `current` property) may not be accessed during render. (https://react.dev/reference/react/useRef). Cannot access ref value at mutate? $60[14:16] (8:8)
25
+ 9 | }
26
+ 10 |
27
```
28
29
\ No newline at end of file
compiler/packages/babel-plugin-react-forget/src/__tests__/fixtures/compiler/error.invalid-ref-value-as-props.expect.md
+6
-1
@@ -14,7 +14,12 @@ function Component(props) {
14
## Error
15
16
```
17
-[ReactForget] InvalidReact: Ref values (the `current` property) may not be accessed during render. (https://react.dev/reference/react/useRef). Cannot access ref value at freeze $19:TObject<BuiltInRefValue> (4:4)
17
+ 2 | function Component(props) {
18
+ 3 | const ref = useRef(null);
19
+> 4 | return <Foo ref={ref.current} />;
20
+ | ^^^^^^^^^^^ [ReactForget] InvalidReact: Ref values (the `current` property) may not be accessed during render. (https://react.dev/reference/react/useRef). Cannot access ref value at freeze $19:TObject<BuiltInRefValue> (4:4)
21
+ 5 | }
22
+ 6 |
23
```
24
25
\ No newline at end of file
compiler/packages/babel-plugin-react-forget/src/__tests__/fixtures/compiler/error.invalid-set-and-read-ref-during-render.expect.md
+6
-1
@@ -15,7 +15,12 @@ function Component(props) {
15
## Error
16
17
```
18
-[ReactForget] InvalidReact: Ref values (the `current` property) may not be accessed during render. (https://react.dev/reference/react/useRef). Cannot access ref value at freeze $24:TObject<BuiltInRefValue> (5:5)
18
+ 3 | const ref = useRef(null);
19
+ 4 | ref.current = props.value;
20
+> 5 | return ref.current;
21
+ | ^^^^^^^^^^^ [ReactForget] InvalidReact: Ref values (the `current` property) may not be accessed during render. (https://react.dev/reference/react/useRef). Cannot access ref value at freeze $24:TObject<BuiltInRefValue> (5:5)
22
+ 6 | }
23
+ 7 |
24
```
25
26
\ No newline at end of file
compiler/packages/babel-plugin-react-forget/src/__tests__/fixtures/compiler/error.invalid-sketchy-code-use-forget.expect.md
+5
-1
@@ -17,9 +17,13 @@ function lowercasecomponent() {
17
## Error
18
19
```
20
-[ReactForget] InvalidReact: React Forget has bailed out of optimizing this component as one or more React eslint rules were disabled. React Forget only works when your components follow all the rules of React, disabling them may result in undefined behavior. eslint-disable react-hooks/rules-of-hooks (1:1)
20
+> 1 | /* eslint-disable react-hooks/rules-of-hooks */
21
+ | ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^ [ReactForget] InvalidReact: React Forget has bailed out of optimizing this component as one or more React eslint rules were disabled. React Forget only works when your components follow all the rules of React, disabling them may result in undefined behavior. eslint-disable react-hooks/rules-of-hooks (1:1)
22
23
[ReactForget] InvalidReact: React Forget has bailed out of optimizing this component as one or more React eslint rules were disabled. React Forget only works when your components follow all the rules of React, disabling them may result in undefined behavior. eslint-disable-next-line react-hooks/rules-of-hooks (5:5)
24
+ 2 | function lowercasecomponent() {
25
+ 3 | "use forget";
26
+ 4 | const x = [];
27
```
28
29
\ No newline at end of file
compiler/packages/babel-plugin-react-forget/src/__tests__/fixtures/compiler/error.invalid-ternary-with-hook-values.expect.md
+6
-1
@@ -13,13 +13,18 @@ function Component(props) {
13
## Error
14
15
```
16
-[ReactForget] InvalidReact: Hooks may not be referenced as normal values, they must be called. See the Rules of Hooks (https://react.dev/warnings/invalid-hook-call-warning) (2:2)
16
+ 1 | function Component(props) {
17
+> 2 | const x = props.cond ? useA : useB;
18
+ | ^^^^ [ReactForget] InvalidReact: Hooks may not be referenced as normal values, they must be called. See the Rules of Hooks (https://react.dev/warnings/invalid-hook-call-warning) (2:2)
19
20
[ReactForget] InvalidReact: Hooks may not be referenced as normal values, they must be called. See the Rules of Hooks (https://react.dev/warnings/invalid-hook-call-warning) (2:2)
21
22
[ReactForget] InvalidReact: Hooks may not be referenced as normal values, they must be called. See the Rules of Hooks (https://react.dev/warnings/invalid-hook-call-warning) (2:2)
23
24
[ReactForget] InvalidReact: Hooks may not be referenced as normal values, they must be called. See the Rules of Hooks (https://react.dev/warnings/invalid-hook-call-warning) (3:3)
25
+ 3 | return x();
26
+ 4 | }
27
+ 5 |
28
```
29
30
\ No newline at end of file
compiler/packages/babel-plugin-react-forget/src/__tests__/fixtures/compiler/error.invalid-unclosed-eslint-suppression.expect.md
+6
-1
@@ -36,9 +36,14 @@ function CrimesAgainstReact() {
36
## Error
37
38
```
39
-[ReactForget] InvalidReact: React Forget has bailed out of optimizing this component as one or more React eslint rules were disabled. React Forget only works when your components follow all the rules of React, disabling them may result in undefined behavior. eslint-disable react-hooks/rules-of-hooks (2:2)
39
+ 1 | // Note: Everything below this is sketchy
40
+> 2 | /* eslint-disable react-hooks/rules-of-hooks */
41
+ | ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^ [ReactForget] InvalidReact: React Forget has bailed out of optimizing this component as one or more React eslint rules were disabled. React Forget only works when your components follow all the rules of React, disabling them may result in undefined behavior. eslint-disable react-hooks/rules-of-hooks (2:2)
42
43
[ReactForget] InvalidReact: React Forget has bailed out of optimizing this component as one or more React eslint rules were disabled. React Forget only works when your components follow all the rules of React, disabling them may result in undefined behavior. eslint-disable-next-line react-hooks/rules-of-hooks (25:25)
44
+ 3 | function lowercasecomponent() {
45
+ 4 | "use forget";
46
+ 5 | const x = [];
47
```
48
49
\ No newline at end of file
compiler/packages/babel-plugin-react-forget/src/__tests__/fixtures/compiler/error.invalid-unconditional-set-state-in-render.expect.md
+7
-1
@@ -19,9 +19,15 @@ function Component(props) {
19
## Error
20
21
```
22
-[ReactForget] InvalidReact: This is an unconditional set state during render, which will trigger an infinite loop. (https://react.dev/reference/react/useState) (6:6)
22
+ 4 | const aliased = setX;
23
+ 5 |
24
+> 6 | setX(1);
25
+ | ^^^^ [ReactForget] InvalidReact: This is an unconditional set state during render, which will trigger an infinite loop. (https://react.dev/reference/react/useState) (6:6)
26
27
[ReactForget] InvalidReact: This is an unconditional set state during render, which will trigger an infinite loop. (https://react.dev/reference/react/useState) (7:7)
28
+ 7 | aliased(2);
29
+ 8 |
30
+ 9 | return x;
31
```
32
33
\ No newline at end of file
compiler/packages/babel-plugin-react-forget/src/__tests__/fixtures/compiler/error.invalid-use-ref-added-to-dep-without-type-info.expect.md
+7
-1
@@ -22,7 +22,13 @@ function Foo({ a }) {
22
## Error
23
24
```
25
-[ReactForget] InvalidReact: Ref values (the `current` property) may not be accessed during render. (https://react.dev/reference/react/useRef). Cannot access ref value at capture $29:TObject<BuiltInUseRefId> (5:5)
25
+ 3 | const ref = useRef();
26
+ 4 | // type information is lost here as we don't track types of fields
27
+> 5 | const val = { ref };
28
+ | ^^^ [ReactForget] InvalidReact: Ref values (the `current` property) may not be accessed during render. (https://react.dev/reference/react/useRef). Cannot access ref value at capture $29:TObject<BuiltInUseRefId> (5:5)
29
+ 6 | // without type info, we don't know that val.ref.current is a ref value so we
30
+ 7 | // *would* end up depending on val.ref.current
31
+ 8 | // however, this is an instance of accessing a ref during render and is disallowed
32
```
33
34
\ No newline at end of file
compiler/packages/babel-plugin-react-forget/src/__tests__/fixtures/compiler/error.invalid-useEffect-dep-not-memoized-bc-range-overlaps-hook.expect.md
+11
-1
@@ -23,7 +23,17 @@ function Component(props) {
23
## Error
24
25
```
26
-[ReactForget] InvalidReact: This effect may trigger an infinite loop: one or more of its dependencies could not be memoized due to a later mutation (9:11)
26
+ 7 |
27
+ 8 | // Items is no longer mutable here, but it hasn't been memoized
28
+> 9 | useEffect(() => {
29
+ | ^^^^^^^^^^^^^^^^^
30
+> 10 | console.log(items);
31
+ | ^^^^^^^^^^^^^^^^^^^^^^^
32
+> 11 | }, [items]);
33
+ | ^^^^^^^^^^^^^^ [ReactForget] InvalidReact: This effect may trigger an infinite loop: one or more of its dependencies could not be memoized due to a later mutation (9:11)
34
+ 12 |
35
+ 13 | return [items, state];
36
+ 14 | }
37
```
38
39
\ No newline at end of file
compiler/packages/babel-plugin-react-forget/src/__tests__/fixtures/compiler/error.invalid-useEffect-dep-not-memoized.expect.md
+11
-1
@@ -20,7 +20,17 @@ function Component(props) {
20
## Error
21
22
```
23
-[ReactForget] InvalidReact: This effect may trigger an infinite loop: one or more of its dependencies could not be memoized due to a later mutation (6:8)
23
+ 4 | function Component(props) {
24
+ 5 | const data = {};
25
+> 6 | useEffect(() => {
26
+ | ^^^^^^^^^^^^^^^^^
27
+> 7 | console.log(props.value);
28
+ | ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^
29
+> 8 | }, [data]);
30
+ | ^^^^^^^^^^^^^ [ReactForget] InvalidReact: This effect may trigger an infinite loop: one or more of its dependencies could not be memoized due to a later mutation (6:8)
31
+ 9 | mutate(data);
32
+ 10 | return data;
33
+ 11 | }
34
```
35
36
\ No newline at end of file
compiler/packages/babel-plugin-react-forget/src/__tests__/fixtures/compiler/error.invalid-useInsertionEffect-dep-not-memoized.expect.md
+11
-1
@@ -20,7 +20,17 @@ function Component(props) {
20
## Error
21
22
```
23
-[ReactForget] InvalidReact: This effect may trigger an infinite loop: one or more of its dependencies could not be memoized due to a later mutation (6:8)
23
+ 4 | function Component(props) {
24
+ 5 | const data = {};
25
+> 6 | useInsertionEffect(() => {
26
+ | ^^^^^^^^^^^^^^^^^^^^^^^^^^
27
+> 7 | console.log(props.value);
28
+ | ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^
29
+> 8 | }, [data]);
30
+ | ^^^^^^^^^^^^^ [ReactForget] InvalidReact: This effect may trigger an infinite loop: one or more of its dependencies could not be memoized due to a later mutation (6:8)
31
+ 9 | mutate(data);
32
+ 10 | return data;
33
+ 11 | }
34
```
35
36
\ No newline at end of file
compiler/packages/babel-plugin-react-forget/src/__tests__/fixtures/compiler/error.invalid-useLayoutEffect-dep-not-memoized.expect.md
+11
-1
@@ -20,7 +20,17 @@ function Component(props) {
20
## Error
21
22
```
23
-[ReactForget] InvalidReact: This effect may trigger an infinite loop: one or more of its dependencies could not be memoized due to a later mutation (6:8)
23
+ 4 | function Component(props) {
24
+ 5 | const data = {};
25
+> 6 | useLayoutEffect(() => {
26
+ | ^^^^^^^^^^^^^^^^^^^^^^^
27
+> 7 | console.log(props.value);
28
+ | ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^
29
+> 8 | }, [data]);
30
+ | ^^^^^^^^^^^^^ [ReactForget] InvalidReact: This effect may trigger an infinite loop: one or more of its dependencies could not be memoized due to a later mutation (6:8)
31
+ 9 | mutate(data);
32
+ 10 | return data;
33
+ 11 | }
34
```
35
36
\ No newline at end of file
compiler/packages/babel-plugin-react-forget/src/__tests__/fixtures/compiler/error.invalid-useMemo-async-callback.expect.md
+10
-1
@@ -15,7 +15,16 @@ function component(a, b) {
15
## Error
16
17
```
18
-[ReactForget] InvalidReact: useMemo callbacks may not be async or generator functions (2:4)
18
+ 1 | function component(a, b) {
19
+> 2 | let x = useMemo(async () => {
20
+ | ^^^^^^^^^^^^^
21
+> 3 | await a;
22
+ | ^^^^^^^^^^^^
23
+> 4 | }, []);
24
+ | ^^^^ [ReactForget] InvalidReact: useMemo callbacks may not be async or generator functions (2:4)
25
+ 5 | return x;
26
+ 6 | }
27
+ 7 |
28
```
29
30
\ No newline at end of file
compiler/packages/babel-plugin-react-forget/src/__tests__/fixtures/compiler/error.invalid-useMemo-callback-args.expect.md
+6
-1
@@ -13,7 +13,12 @@ function component(a, b) {
13
## Error
14
15
```
16
-[ReactForget] InvalidReact: useMemo callbacks may not accept any arguments (2:2)
16
+ 1 | function component(a, b) {
17
+> 2 | let x = useMemo((c) => a, []);
18
+ | ^^^^^^^^ [ReactForget] InvalidReact: useMemo callbacks may not accept any arguments (2:2)
19
+ 3 | return x;
20
+ 4 | }
21
+ 5 |
22
```
23
24
\ No newline at end of file
compiler/packages/babel-plugin-react-forget/src/__tests__/fixtures/compiler/error.mutate-captured-arg-separately.expect.md
+7
-1
@@ -19,7 +19,13 @@ function component(a) {
19
## Error
20
21
```
22
-[ReactForget] Todo: Handle non-const declarations for hoisting. variable "x" declared with let (4:4)
22
+ 2 | function component(a) {
23
+ 3 | let y = function () {
24
+> 4 | m(x);
25
+ | ^^^^ [ReactForget] Todo: Handle non-const declarations for hoisting. variable "x" declared with let (4:4)
26
+ 5 | };
27
+ 6 |
28
+ 7 | let x = { a };
29
```
30
31
\ No newline at end of file
compiler/packages/babel-plugin-react-forget/src/__tests__/fixtures/compiler/error.mutate-function-property.expect.md
+7
-1
@@ -15,7 +15,13 @@ export function ViewModeSelector(props) {
15
## Error
16
17
```
18
-[ReactForget] InvalidReact: This mutates a variable that React considers immutable. (3:3)
18
+ 1 | export function ViewModeSelector(props) {
19
+ 2 | const renderIcon = () => <AcceptIcon />;
20
+> 3 | renderIcon.displayName = "AcceptIcon";
21
+ | ^^^^^^^^^^ [ReactForget] InvalidReact: This mutates a variable that React considers immutable. (3:3)
22
+ 4 |
23
+ 5 | return <Dropdown checkableIndicator={{ children: renderIcon }} />;
24
+ 6 | }
25
```
26
27
\ No newline at end of file
compiler/packages/babel-plugin-react-forget/src/__tests__/fixtures/compiler/error.mutate-global-increment-op-invalid-react.expect.md
+7
-1
@@ -15,7 +15,13 @@ function NoHooks() {
15
## Error
16
17
```
18
-[ReactForget] InvalidReact: This reassigns a variable which was not defined inside of the component. Components should be pure and side-effect free. If this variable is used in rendering, use useState instead. (https://react.dev/learn/keeping-components-pure) (4:4)
18
+ 2 |
19
+ 3 | function NoHooks() {
20
+> 4 | renderCount++;
21
+ | ^^^^^^^^^^^^^ [ReactForget] InvalidReact: This reassigns a variable which was not defined inside of the component. Components should be pure and side-effect free. If this variable is used in rendering, use useState instead. (https://react.dev/learn/keeping-components-pure) (4:4)
22
+ 5 | return <div />;
23
+ 6 | }
24
+ 7 |
25
```
26
27
\ No newline at end of file
compiler/packages/babel-plugin-react-forget/src/__tests__/fixtures/compiler/error.mutate-hook-argument.expect.md
+6
-1
@@ -13,7 +13,12 @@ function useHook(a, b) {
13
## Error
14
15
```
16
-[ReactForget] InvalidReact: Mutating props or hook arguments is not allowed. Consider using a local variable instead. (2:2)
16
+ 1 | function useHook(a, b) {
17
+> 2 | b.test = 1;
18
+ | ^ [ReactForget] InvalidReact: Mutating props or hook arguments is not allowed. Consider using a local variable instead. (2:2)
19
+ 3 | a.test = 2;
20
+ 4 | }
21
+ 5 |
22
```
23
24
\ No newline at end of file
compiler/packages/babel-plugin-react-forget/src/__tests__/fixtures/compiler/error.mutate-property-from-global.expect.md
+7
-1
@@ -15,7 +15,13 @@ function Foo() {
15
## Error
16
17
```
18
-[ReactForget] InvalidReact: Writing to a variable defined outside a component or hook is not allowed. Consider using an effect. (4:4)
18
+ 2 |
19
+ 3 | function Foo() {
20
+> 4 | delete wat.foo;
21
+ | ^^^ [ReactForget] InvalidReact: Writing to a variable defined outside a component or hook is not allowed. Consider using an effect. (4:4)
22
+ 5 | return wat;
23
+ 6 | }
24
+ 7 |
25
```
26
27
\ No newline at end of file
compiler/packages/babel-plugin-react-forget/src/__tests__/fixtures/compiler/error.mutate-props.expect.md
+6
-1
@@ -13,7 +13,12 @@ function Foo(props) {
13
## Error
14
15
```
16
-[ReactForget] InvalidReact: Mutating props or hook arguments is not allowed. Consider using a local variable instead. (2:2)
16
+ 1 | function Foo(props) {
17
+> 2 | props.test = 1;
18
+ | ^^^^^ [ReactForget] InvalidReact: Mutating props or hook arguments is not allowed. Consider using a local variable instead. (2:2)
19
+ 3 | return null;
20
+ 4 | }
21
+ 5 |
22
```
23
24
\ No newline at end of file
compiler/packages/babel-plugin-react-forget/src/__tests__/fixtures/compiler/error.propertyload-hook.expect.md
+6
-1
@@ -13,9 +13,14 @@ function Component() {
13
## Error
14
15
```
16
-[ReactForget] InvalidReact: Hooks may not be referenced as normal values, they must be called. See the Rules of Hooks (https://react.dev/warnings/invalid-hook-call-warning) (2:2)
16
+ 1 | function Component() {
17
+> 2 | const x = Foo.useFoo;
18
+ | ^^^^^^^^^^ [ReactForget] InvalidReact: Hooks may not be referenced as normal values, they must be called. See the Rules of Hooks (https://react.dev/warnings/invalid-hook-call-warning) (2:2)
19
20
[ReactForget] InvalidReact: Hooks may not be referenced as normal values, they must be called. See the Rules of Hooks (https://react.dev/warnings/invalid-hook-call-warning) (3:3)
21
+ 3 | return x();
22
+ 4 | }
23
+ 5 |
24
```
25
26
\ No newline at end of file
compiler/packages/babel-plugin-react-forget/src/__tests__/fixtures/compiler/error.reassignment-to-global.expect.md
+7
-1
@@ -14,9 +14,15 @@ function Component() {
14
## Error
15
16
```
17
-[ReactForget] InvalidReact: This reassigns a variable which was not defined inside of the component. Components should be pure and side-effect free. If this variable is used in rendering, use useState instead. (https://react.dev/learn/keeping-components-pure) (3:3)
17
+ 1 | function Component() {
18
+ 2 | // Cannot assign to globals
19
+> 3 | someUnknownGlobal = true;
20
+ | ^^^^^^^^^^^^^^^^^^^^^^^^ [ReactForget] InvalidReact: This reassigns a variable which was not defined inside of the component. Components should be pure and side-effect free. If this variable is used in rendering, use useState instead. (https://react.dev/learn/keeping-components-pure) (3:3)
21
22
[ReactForget] InvalidReact: This reassigns a variable which was not defined inside of the component. Components should be pure and side-effect free. If this variable is used in rendering, use useState instead. (https://react.dev/learn/keeping-components-pure) (4:4)
23
+ 4 | moduleLocal = true;
24
+ 5 | }
25
+ 6 |
26
```
27
28
\ No newline at end of file
compiler/packages/babel-plugin-react-forget/src/__tests__/fixtures/compiler/error.sketchy-code-exhaustive-deps.expect.md
+7
-1
@@ -20,7 +20,13 @@ function Component() {
20
## Error
21
22
```
23
-[ReactForget] InvalidReact: React Forget has bailed out of optimizing this component as one or more React eslint rules were disabled. React Forget only works when your components follow all the rules of React, disabling them may result in undefined behavior. eslint-disable-next-line react-hooks/exhaustive-deps (6:6)
23
+ 4 | () => {
24
+ 5 | item.push(1);
25
+> 6 | }, // eslint-disable-next-line react-hooks/exhaustive-deps
26
+ | ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^ [ReactForget] InvalidReact: React Forget has bailed out of optimizing this component as one or more React eslint rules were disabled. React Forget only works when your components follow all the rules of React, disabling them may result in undefined behavior. eslint-disable-next-line react-hooks/exhaustive-deps (6:6)
27
+ 7 | []
28
+ 8 | );
29
+ 9 |
30
```
31
32
\ No newline at end of file
compiler/packages/babel-plugin-react-forget/src/__tests__/fixtures/compiler/error.sketchy-code-rules-of-hooks.expect.md
+5
-1
@@ -21,7 +21,11 @@ export const FIXTURE_ENTRYPOINT = {
21
## Error
22
23
```
24
-[ReactForget] InvalidReact: React Forget has bailed out of optimizing this component as one or more React eslint rules were disabled. React Forget only works when your components follow all the rules of React, disabling them may result in undefined behavior. eslint-disable react-hooks/rules-of-hooks (1:1)
24
+> 1 | /* eslint-disable react-hooks/rules-of-hooks */
25
+ | ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^ [ReactForget] InvalidReact: React Forget has bailed out of optimizing this component as one or more React eslint rules were disabled. React Forget only works when your components follow all the rules of React, disabling them may result in undefined behavior. eslint-disable react-hooks/rules-of-hooks (1:1)
26
+ 2 | function lowercasecomponent() {
27
+ 3 | const x = [];
28
+ 4 | return <div>{x}</div>;
29
```
30
31
\ No newline at end of file
compiler/packages/babel-plugin-react-forget/src/__tests__/fixtures/compiler/error.store-property-in-global.expect.md
+7
-1
@@ -15,7 +15,13 @@ function Foo() {
15
## Error
16
17
```
18
-[ReactForget] InvalidReact: Writing to a variable defined outside a component or hook is not allowed. Consider using an effect. (4:4)
18
+ 2 |
19
+ 3 | function Foo() {
20
+> 4 | wat.test = 1;
21
+ | ^^^ [ReactForget] InvalidReact: Writing to a variable defined outside a component or hook is not allowed. Consider using an effect. (4:4)
22
+ 5 | return wat;
23
+ 6 | }
24
+ 7 |
25
```
26
27
\ No newline at end of file
compiler/packages/babel-plugin-react-forget/src/__tests__/fixtures/compiler/error.todo-early-return--early-return-within-reactive-scope.expect.md
+7
-1
@@ -25,7 +25,13 @@ export const FIXTURE_ENTRYPOINT = {
25
## Error
26
27
```
28
-[ReactForget] Todo: Support early return within a reactive scope (7:7)
28
+ 5 | x.push(props.a);
29
+ 6 | // oops no memo!
30
+> 7 | return x;
31
+ | ^ [ReactForget] Todo: Support early return within a reactive scope (7:7)
32
+ 8 | } else {
33
+ 9 | return foo();
34
+ 10 | }
35
```
36
37
\ No newline at end of file
compiler/packages/babel-plugin-react-forget/src/__tests__/fixtures/compiler/error.todo-handle-update-context-identifiers.expect.md
+7
-1
@@ -22,7 +22,13 @@ export const FIXTURE_ENTRYPOINT = {
22
## Error
23
24
```
25
-[ReactForget] Todo: (BuildHIR::lowerExpression) Handle UpdateExpression to variables captured within lambdas. (4:4)
25
+ 2 | let counter = 2;
26
+ 3 | const fn = () => {
27
+> 4 | return counter++;
28
+ | ^^^^^^^^^ [ReactForget] Todo: (BuildHIR::lowerExpression) Handle UpdateExpression to variables captured within lambdas. (4:4)
29
+ 5 | };
30
+ 6 |
31
+ 7 | return fn();
32
```
33
34
\ No newline at end of file
compiler/packages/babel-plugin-react-forget/src/__tests__/fixtures/compiler/error.todo-hoist-function-decls.expect.md
+6
-1
@@ -15,7 +15,12 @@ function Component() {
15
## Error
16
17
```
18
-[ReactForget] Todo: Unsupported declaration type for hoisting. variable "get2" declared with FunctionDeclaration (2:2)
18
+ 1 | function Component() {
19
+> 2 | return get2();
20
+ | ^^^^^^ [ReactForget] Todo: Unsupported declaration type for hoisting. variable "get2" declared with FunctionDeclaration (2:2)
21
+ 3 | function get2() {
22
+ 4 | return 2;
23
+ 5 | }
24
```
25
26
\ No newline at end of file
compiler/packages/babel-plugin-react-forget/src/__tests__/fixtures/compiler/error.todo-hoisting-simple-var-declaration.expect.md
+7
-1
@@ -25,7 +25,13 @@ export const FIXTURE_ENTRYPOINT = {
25
## Error
26
27
```
28
-[ReactForget] Todo: (BuildHIR::lowerStatement) Handle var kinds in VariableDeclaration (7:7)
28
+ 5 | }
29
+ 6 | const result = addOne(2);
30
+> 7 | var a = 1;
31
+ | ^^^^^^^^^^ [ReactForget] Todo: (BuildHIR::lowerStatement) Handle var kinds in VariableDeclaration (7:7)
32
+ 8 |
33
+ 9 | return result; // OK: returns NaN. The code is semantically wrong but technically correct
34
+ 10 | }
35
```
36
37
\ No newline at end of file
compiler/packages/babel-plugin-react-forget/src/__tests__/fixtures/compiler/error.todo-kitchensink.expect.md
+7
-1
@@ -79,7 +79,10 @@ let moduleLocal = false;
79
## Error
80
81
```
82
-[ReactForget] Todo: (BuildHIR::lowerStatement) Handle var kinds in VariableDeclaration (3:3)
82
+ 1 | function foo([a, b], { c, d, e = "e" }, f = "f", ...args) {
83
+ 2 | let i = 0;
84
+> 3 | var x = [];
85
+ | ^^^^^^^^^^^ [ReactForget] Todo: (BuildHIR::lowerStatement) Handle var kinds in VariableDeclaration (3:3)
86
87
[ReactForget] Todo: (BuildHIR::lowerStatement) Handle ClassDeclaration statements (5:10)
88
@@ -108,6 +111,9 @@ let moduleLocal = false;
111
[ReactForget] Todo: (BuildHIR::node.lowerReorderableExpression) Expression type 'MemberExpression' cannot be safely reordered (57:57)
112
113
[ReactForget] Todo: (BuildHIR::node.lowerReorderableExpression) Expression type 'BinaryExpression' cannot be safely reordered (53:53)
114
+ 4 |
115
+ 5 | class Bar {
116
+ 6 | #secretSauce = 42;
117
```
118
119
\ No newline at end of file
compiler/packages/babel-plugin-react-forget/src/__tests__/fixtures/compiler/error.todo-object-expression-computed-key-modified-during-after-construction-sequence-expr.expect.md
+7
-1
@@ -24,7 +24,13 @@ export const FIXTURE_ENTRYPOINT = {
24
## Error
25
26
```
27
-[ReactForget] Todo: (BuildHIR::lowerExpression) Expected Identifier, got SequenceExpression key in ObjectExpression (6:6)
27
+ 4 | const key = {};
28
+ 5 | const context = {
29
+> 6 | [(mutate(key), key)]: identity([props.value]),
30
+ | ^^^^^^^^^^^^^^^^ [ReactForget] Todo: (BuildHIR::lowerExpression) Expected Identifier, got SequenceExpression key in ObjectExpression (6:6)
31
+ 7 | };
32
+ 8 | mutate(key);
33
+ 9 | return context;
34
```
35
36
\ No newline at end of file
compiler/packages/babel-plugin-react-forget/src/__tests__/fixtures/compiler/error.todo-object-expression-computed-key-modified-during-after-construction.expect.md
+7
-1
@@ -24,7 +24,13 @@ export const FIXTURE_ENTRYPOINT = {
24
## Error
25
26
```
27
-[ReactForget] Todo: (BuildHIR::lowerExpression) Expected Identifier, got CallExpression key in ObjectExpression (6:6)
27
+ 4 | const key = {};
28
+ 5 | const context = {
29
+> 6 | [mutateAndReturn(key)]: identity([props.value]),
30
+ | ^^^^^^^^^^^^^^^^^^^^ [ReactForget] Todo: (BuildHIR::lowerExpression) Expected Identifier, got CallExpression key in ObjectExpression (6:6)
31
+ 7 | };
32
+ 8 | mutate(key);
33
+ 9 | return context;
34
```
35
36
\ No newline at end of file
compiler/packages/babel-plugin-react-forget/src/__tests__/fixtures/compiler/error.todo-object-expression-computed-key-mutate-key-while-constructing-object.expect.md
+7
-1
@@ -23,7 +23,13 @@ export const FIXTURE_ENTRYPOINT = {
23
## Error
24
25
```
26
-[ReactForget] Todo: (BuildHIR::lowerExpression) Expected Identifier, got CallExpression key in ObjectExpression (6:6)
26
+ 4 | const key = {};
27
+ 5 | const context = {
28
+> 6 | [mutateAndReturn(key)]: identity([props.value]),
29
+ | ^^^^^^^^^^^^^^^^^^^^ [ReactForget] Todo: (BuildHIR::lowerExpression) Expected Identifier, got CallExpression key in ObjectExpression (6:6)
30
+ 7 | };
31
+ 8 | return context;
32
+ 9 | }
33
```
34
35
\ No newline at end of file
compiler/packages/babel-plugin-react-forget/src/__tests__/fixtures/compiler/error.todo-optional-call-chain-in-logical-expr.expect.md
+7
-1
@@ -20,7 +20,13 @@ export const FIXTURE_ENTRYPONT = {
20
## Error
21
22
```
23
-[ReactForget] Todo: Unexpected terminal kind 'optional' for logical test block (5:5)
23
+ 3 | function useFoo(props: { value: { x: string; y: string } | null }) {
24
+ 4 | const value = props.value;
25
+> 5 | return useNoAlias(value?.x, value?.y) ?? {};
26
+ | ^^^^^^^^ [ReactForget] Todo: Unexpected terminal kind 'optional' for logical test block (5:5)
27
+ 6 | }
28
+ 7 |
29
+ 8 | export const FIXTURE_ENTRYPONT = {
30
```
31
32
\ No newline at end of file
compiler/packages/babel-plugin-react-forget/src/__tests__/fixtures/compiler/error.todo-optional-call-chain-in-optional.expect.md
+7
-1
@@ -22,7 +22,13 @@ export const FIXTURE_ENTRYPONT = {
22
## Error
23
24
```
25
-[ReactForget] Todo: Unexpected terminal kind 'optional' for optional test block (3:3)
25
+ 1 | function useFoo(props: { value: { x: string; y: string } | null }) {
26
+ 2 | const value = props.value;
27
+> 3 | return createArray(value?.x, value?.y)?.join(", ");
28
+ | ^^^^^^^^ [ReactForget] Todo: Unexpected terminal kind 'optional' for optional test block (3:3)
29
+ 4 | }
30
+ 5 |
31
+ 6 | function createArray<T>(...args: Array<T>): Array<T> {
32
```
33
34
\ No newline at end of file
compiler/packages/babel-plugin-react-forget/src/__tests__/fixtures/compiler/error.todo-optional-call-chain-in-ternary.expect.md
+7
-1
@@ -20,7 +20,13 @@ export const FIXTURE_ENTRYPONT = {
20
## Error
21
22
```
23
-[ReactForget] Todo: Unexpected terminal kind 'optional' for ternary test block (5:5)
23
+ 3 | function useFoo(props: { value: { x: string; y: string } | null }) {
24
+ 4 | const value = props.value;
25
+> 5 | return useNoAlias(value?.x, value?.y) ? {} : null;
26
+ | ^^^^^^^^ [ReactForget] Todo: Unexpected terminal kind 'optional' for ternary test block (5:5)
27
+ 6 | }
28
+ 7 |
29
+ 8 | export const FIXTURE_ENTRYPONT = {
30
```
31
32
\ No newline at end of file
compiler/packages/babel-plugin-react-forget/src/__tests__/fixtures/compiler/error.todo-useCallback-accesses-ref-mutated-later-via-function-preserve-memoization.expect.md
+15
-1
@@ -34,9 +34,23 @@ export const FIXTURE_ENTRYPOINT = {
34
## Error
35
36
```
37
-[ReactForget] InvalidReact: This value was manually memoized, but cannot be memoized under Forget because it may be mutated after it is memoized (7:11)
37
+ 5 | const ref = useRef({ inner: null });
38
+ 6 |
39
+> 7 | const onChange = useCallback((event) => {
40
+ | ^^^^^^^^^^^^^^^^^^^^^^^^
41
+> 8 | // The ref should still be mutable here even though function deps are frozen in
42
+ | ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^
43
+> 9 | // @enablePreserveExistingMemoizationGuarantees mode
44
+ | ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^
45
+> 10 | ref.current.inner = event.target.value;
46
+ | ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^
47
+> 11 | });
48
+ | ^^^^^ [ReactForget] InvalidReact: This value was manually memoized, but cannot be memoized under Forget because it may be mutated after it is memoized (7:11)
49
50
[ReactForget] InvalidReact: This value was manually memoized, but cannot be memoized under Forget because it may be mutated after it is memoized (7:11)
51
+ 12 |
52
+ 13 | // The ref is modified later, extending its range and preventing memoization of onChange
53
+ 14 | const reset = () => {
54
```
55
56
\ No newline at end of file
compiler/packages/babel-plugin-react-forget/src/__tests__/fixtures/compiler/error.todo-useCallback-set-ref-nested-property-ref-modified-later-preserve-memoization.expect.md
+15
-1
@@ -31,9 +31,23 @@ export const FIXTURE_ENTRYPOINT = {
31
## Error
32
33
```
34
-[ReactForget] InvalidReact: This value was manually memoized, but cannot be memoized under Forget because it may be mutated after it is memoized (7:11)
34
+ 5 | const ref = useRef({ inner: null });
35
+ 6 |
36
+> 7 | const onChange = useCallback((event) => {
37
+ | ^^^^^^^^^^^^^^^^^^^^^^^^
38
+> 8 | // The ref should still be mutable here even though function deps are frozen in
39
+ | ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^
40
+> 9 | // @enablePreserveExistingMemoizationGuarantees mode
41
+ | ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^
42
+> 10 | ref.current.inner = event.target.value;
43
+ | ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^
44
+> 11 | });
45
+ | ^^^^^ [ReactForget] InvalidReact: This value was manually memoized, but cannot be memoized under Forget because it may be mutated after it is memoized (7:11)
46
47
[ReactForget] InvalidReact: This value was manually memoized, but cannot be memoized under Forget because it may be mutated after it is memoized (7:11)
48
+ 12 |
49
+ 13 | // The ref is modified later, extending its range and preventing memoization of onChange
50
+ 14 | ref.current.inner = null;
51
```
52
53
\ No newline at end of file
compiler/packages/babel-plugin-react-forget/src/__tests__/fixtures/compiler/error.todo.try-catch-with-throw.expect.md
+7
-1
@@ -18,7 +18,13 @@ function Component(props) {
18
## Error
19
20
```
21
-[ReactForget] Todo: (BuildHIR::lowerStatement) Support ThrowStatement inside of try/catch (4:4)
21
+ 2 | let x;
22
+ 3 | try {
23
+> 4 | throw [];
24
+ | ^^^^^^^^^ [ReactForget] Todo: (BuildHIR::lowerStatement) Support ThrowStatement inside of try/catch (4:4)
25
+ 5 | } catch (e) {
26
+ 6 | x.push(e);
27
+ 7 | }
28
```
29
30
\ No newline at end of file
compiler/packages/babel-plugin-react-forget/src/__tests__/fixtures/compiler/error.unconditional-set-state-in-render-after-loop-break.expect.md
+7
-1
@@ -22,7 +22,13 @@ function Component(props) {
22
## Error
23
24
```
25
-[ReactForget] InvalidReact: This is an unconditional set state during render, which will trigger an infinite loop. (https://react.dev/reference/react/useState) (11:11)
25
+ 9 | }
26
+ 10 | }
27
+> 11 | setState(true);
28
+ | ^^^^^^^^ [ReactForget] InvalidReact: This is an unconditional set state during render, which will trigger an infinite loop. (https://react.dev/reference/react/useState) (11:11)
29
+ 12 | return state;
30
+ 13 | }
31
+ 14 |
32
```
33
34
\ No newline at end of file
compiler/packages/babel-plugin-react-forget/src/__tests__/fixtures/compiler/error.unconditional-set-state-in-render-after-loop.expect.md
+7
-1
@@ -17,7 +17,13 @@ function Component(props) {
17
## Error
18
19
```
20
-[ReactForget] InvalidReact: This is an unconditional set state during render, which will trigger an infinite loop. (https://react.dev/reference/react/useState) (6:6)
20
+ 4 | for (const _ of props) {
21
+ 5 | }
22
+> 6 | setState(true);
23
+ | ^^^^^^^^ [ReactForget] InvalidReact: This is an unconditional set state during render, which will trigger an infinite loop. (https://react.dev/reference/react/useState) (6:6)
24
+ 7 | return state;
25
+ 8 | }
26
+ 9 |
27
```
28
29
\ No newline at end of file
compiler/packages/babel-plugin-react-forget/src/__tests__/fixtures/compiler/error.unconditional-set-state-in-render-with-loop-throw.expect.md
+7
-1
@@ -22,7 +22,13 @@ function Component(props) {
22
## Error
23
24
```
25
-[ReactForget] InvalidReact: This is an unconditional set state during render, which will trigger an infinite loop. (https://react.dev/reference/react/useState) (11:11)
25
+ 9 | }
26
+ 10 | }
27
+> 11 | setState(true);
28
+ | ^^^^^^^^ [ReactForget] InvalidReact: This is an unconditional set state during render, which will trigger an infinite loop. (https://react.dev/reference/react/useState) (11:11)
29
+ 12 | return state;
30
+ 13 | }
31
+ 14 |
32
```
33
34
\ No newline at end of file
compiler/packages/babel-plugin-react-forget/src/__tests__/fixtures/compiler/error.unconditional-set-state-lambda.expect.md
+7
-1
@@ -20,7 +20,13 @@ function Component(props) {
20
## Error
21
22
```
23
-[ReactForget] InvalidReact: This is an unconditional set state during render, which will trigger an infinite loop. (https://react.dev/reference/react/useState) (8:8)
23
+ 6 | setX(1);
24
+ 7 | };
25
+> 8 | foo();
26
+ | ^^^ [ReactForget] InvalidReact: This is an unconditional set state during render, which will trigger an infinite loop. (https://react.dev/reference/react/useState) (8:8)
27
+ 9 |
28
+ 10 | return [x];
29
+ 11 | }
30
```
31
32
\ No newline at end of file
compiler/packages/babel-plugin-react-forget/src/__tests__/fixtures/compiler/error.unconditional-set-state-nested-function-expressions.expect.md
+7
-1
@@ -28,7 +28,13 @@ function Component(props) {
28
## Error
29
30
```
31
-[ReactForget] InvalidReact: This is an unconditional set state during render, which will trigger an infinite loop. (https://react.dev/reference/react/useState) (16:16)
31
+ 14 | bar();
32
+ 15 | };
33
+> 16 | baz();
34
+ | ^^^ [ReactForget] InvalidReact: This is an unconditional set state during render, which will trigger an infinite loop. (https://react.dev/reference/react/useState) (16:16)
35
+ 17 |
36
+ 18 | return [x];
37
+ 19 | }
38
```
39
40
\ No newline at end of file
compiler/packages/babel-plugin-react-forget/src/__tests__/fixtures/compiler/error.useMemo-callback-generator.expect.md
+7
-1
@@ -18,7 +18,13 @@ function component(a, b) {
18
## Error
19
20
```
21
-[ReactForget] Todo: (BuildHIR::lowerExpression) Handle YieldExpression expressions (6:6)
21
+ 4 | // add support for generators in the future.
22
+ 5 | let x = useMemo(function* () {
23
+> 6 | yield a;
24
+ | ^^^^^^^ [ReactForget] Todo: (BuildHIR::lowerExpression) Handle YieldExpression expressions (6:6)
25
+ 7 | }, []);
26
+ 8 | return x;
27
+ 9 | }
28
```
29
30
\ No newline at end of file
compiler/packages/babel-plugin-react-forget/src/__tests__/fixtures/compiler/rules-of-hooks/error.invalid-call-phi-possibly-hook.expect.md
+7
-1
@@ -18,11 +18,17 @@ function Component(props) {
18
## Error
19
20
```
21
-[ReactForget] InvalidReact: Hooks may not be referenced as normal values, they must be called. See the Rules of Hooks (https://react.dev/warnings/invalid-hook-call-warning) (3:3)
21
+ 1 | function Component(props) {
22
+ 2 | // This is a violation of using a hook as a normal value rule:
23
+> 3 | const getUser = props.cond ? useGetUser : emptyFunction;
24
+ | ^^^^^^^^^^ [ReactForget] InvalidReact: Hooks may not be referenced as normal values, they must be called. See the Rules of Hooks (https://react.dev/warnings/invalid-hook-call-warning) (3:3)
25
26
[ReactForget] InvalidReact: Hooks may not be referenced as normal values, they must be called. See the Rules of Hooks (https://react.dev/warnings/invalid-hook-call-warning) (3:3)
27
28
[ReactForget] InvalidReact: Hooks may not be referenced as normal values, they must be called. See the Rules of Hooks (https://react.dev/warnings/invalid-hook-call-warning) (8:8)
29
+ 4 |
30
+ 5 | // Ideally we would report a "conditional hook call" error here.
31
+ 6 | // It's an unconditional call, but the value may or may not be a hook.
32
```
33
34
\ No newline at end of file
compiler/packages/babel-plugin-react-forget/src/__tests__/fixtures/compiler/rules-of-hooks/error.invalid-conditionally-call-local-named-like-hook.expect.md
+7
-1
@@ -17,7 +17,13 @@ function Component(props) {
17
## Error
18
19
```
20
-[ReactForget] InvalidReact: Hooks must always be called in a consistent order, and may not be called conditionally. See the Rules of Hooks (https://react.dev/warnings/invalid-hook-call-warning) (6:6)
20
+ 4 | const useFoo = makeObject_Primitives();
21
+ 5 | if (props.cond) {
22
+> 6 | useFoo();
23
+ | ^^^^^^ [ReactForget] InvalidReact: Hooks must always be called in a consistent order, and may not be called conditionally. See the Rules of Hooks (https://react.dev/warnings/invalid-hook-call-warning) (6:6)
24
+ 7 | }
25
+ 8 | }
26
+ 9 |
27
```
28
29
\ No newline at end of file
compiler/packages/babel-plugin-react-forget/src/__tests__/fixtures/compiler/rules-of-hooks/error.invalid-conditionally-call-prop-named-like-hook.expect.md
+7
-1
@@ -14,7 +14,13 @@ function Component({ cond, useFoo }) {
14
## Error
15
16
```
17
-[ReactForget] InvalidReact: Hooks must always be called in a consistent order, and may not be called conditionally. See the Rules of Hooks (https://react.dev/warnings/invalid-hook-call-warning) (3:3)
17
+ 1 | function Component({ cond, useFoo }) {
18
+ 2 | if (cond) {
19
+> 3 | useFoo();
20
+ | ^^^^^^ [ReactForget] InvalidReact: Hooks must always be called in a consistent order, and may not be called conditionally. See the Rules of Hooks (https://react.dev/warnings/invalid-hook-call-warning) (3:3)
21
+ 4 | }
22
+ 5 | }
23
+ 6 |
24
```
25
26
\ No newline at end of file
compiler/packages/babel-plugin-react-forget/src/__tests__/fixtures/compiler/rules-of-hooks/error.invalid-conditionally-methodcall-hooklike-property-of-local.expect.md
+7
-1
@@ -17,7 +17,13 @@ function Component(props) {
17
## Error
18
19
```
20
-[ReactForget] InvalidReact: Hooks must always be called in a consistent order, and may not be called conditionally. See the Rules of Hooks (https://react.dev/warnings/invalid-hook-call-warning) (6:6)
20
+ 4 | const local = makeObject_Primitives();
21
+ 5 | if (props.cond) {
22
+> 6 | local.useFoo();
23
+ | ^^^^^^^^^^^^ [ReactForget] InvalidReact: Hooks must always be called in a consistent order, and may not be called conditionally. See the Rules of Hooks (https://react.dev/warnings/invalid-hook-call-warning) (6:6)
24
+ 7 | }
25
+ 8 | }
26
+ 9 |
27
```
28
29
\ No newline at end of file
compiler/packages/babel-plugin-react-forget/src/__tests__/fixtures/compiler/rules-of-hooks/error.invalid-condtionally-call-hooklike-property-of-local.expect.md
+7
-1
@@ -18,7 +18,13 @@ function Component(props) {
18
## Error
19
20
```
21
-[ReactForget] InvalidReact: Hooks must always be called in a consistent order, and may not be called conditionally. See the Rules of Hooks (https://react.dev/warnings/invalid-hook-call-warning) (7:7)
21
+ 5 | if (props.cond) {
22
+ 6 | const foo = local.useFoo;
23
+> 7 | foo();
24
+ | ^^^ [ReactForget] InvalidReact: Hooks must always be called in a consistent order, and may not be called conditionally. See the Rules of Hooks (https://react.dev/warnings/invalid-hook-call-warning) (7:7)
25
+ 8 | }
26
+ 9 | }
27
+ 10 |
28
```
29
30
\ No newline at end of file
compiler/packages/babel-plugin-react-forget/src/__tests__/fixtures/compiler/rules-of-hooks/error.invalid-hook-after-early-return.expect.md
+6
-1
@@ -15,7 +15,12 @@ function Component(props) {
15
## Error
16
17
```
18
-[ReactForget] InvalidReact: Hooks must always be called in a consistent order, and may not be called conditionally. See the Rules of Hooks (https://react.dev/warnings/invalid-hook-call-warning) (5:5)
18
+ 3 | return null;
19
+ 4 | }
20
+> 5 | return useHook();
21
+ | ^^^^^^^ [ReactForget] InvalidReact: Hooks must always be called in a consistent order, and may not be called conditionally. See the Rules of Hooks (https://react.dev/warnings/invalid-hook-call-warning) (5:5)
22
+ 6 | }
23
+ 7 |
24
```
25
26
\ No newline at end of file
compiler/packages/babel-plugin-react-forget/src/__tests__/fixtures/compiler/rules-of-hooks/error.invalid-hook-as-conditional-test.expect.md
+6
-1
@@ -13,7 +13,12 @@ function Component(props) {
13
## Error
14
15
```
16
-[ReactForget] InvalidReact: Hooks may not be referenced as normal values, they must be called. See the Rules of Hooks (https://react.dev/warnings/invalid-hook-call-warning) (2:2)
16
+ 1 | function Component(props) {
17
+> 2 | const x = props.cond ? (useFoo ? 1 : 2) : 3;
18
+ | ^^^^^^ [ReactForget] InvalidReact: Hooks may not be referenced as normal values, they must be called. See the Rules of Hooks (https://react.dev/warnings/invalid-hook-call-warning) (2:2)
19
+ 3 | return x;
20
+ 4 | }
21
+ 5 |
22
```
23
24
\ No newline at end of file
compiler/packages/babel-plugin-react-forget/src/__tests__/fixtures/compiler/rules-of-hooks/error.invalid-hook-for.expect.md
+7
-1
@@ -16,9 +16,15 @@ function Component(props) {
16
## Error
17
18
```
19
-[ReactForget] InvalidReact: Hooks must always be called in a consistent order, and may not be called conditionally. See the Rules of Hooks (https://react.dev/warnings/invalid-hook-call-warning) (4:4)
19
+ 2 | let i = 0;
20
+ 3 | for (let x = 0; useHook(x) < 10; useHook(i), x++) {
21
+> 4 | i += useHook(x);
22
+ | ^^^^^^^ [ReactForget] InvalidReact: Hooks must always be called in a consistent order, and may not be called conditionally. See the Rules of Hooks (https://react.dev/warnings/invalid-hook-call-warning) (4:4)
23
24
[ReactForget] InvalidReact: Hooks must always be called in a consistent order, and may not be called conditionally. See the Rules of Hooks (https://react.dev/warnings/invalid-hook-call-warning) (3:3)
25
+ 5 | }
26
+ 6 | return i;
27
+ 7 | }
28
```
29
30
\ No newline at end of file
compiler/packages/babel-plugin-react-forget/src/__tests__/fixtures/compiler/rules-of-hooks/error.invalid-hook-if-alternate.expect.md
+7
-1
@@ -17,7 +17,13 @@ function Component(props) {
17
## Error
18
19
```
20
-[ReactForget] InvalidReact: Hooks must always be called in a consistent order, and may not be called conditionally. See the Rules of Hooks (https://react.dev/warnings/invalid-hook-call-warning) (5:5)
20
+ 3 | if (props.cond) {
21
+ 4 | } else {
22
+> 5 | x = useHook();
23
+ | ^^^^^^^ [ReactForget] InvalidReact: Hooks must always be called in a consistent order, and may not be called conditionally. See the Rules of Hooks (https://react.dev/warnings/invalid-hook-call-warning) (5:5)
24
+ 6 | }
25
+ 7 | return x;
26
+ 8 | }
27
```
28
29
\ No newline at end of file
compiler/packages/babel-plugin-react-forget/src/__tests__/fixtures/compiler/rules-of-hooks/error.invalid-hook-if-consequent.expect.md
+7
-1
@@ -16,7 +16,13 @@ function Component(props) {
16
## Error
17
18
```
19
-[ReactForget] InvalidReact: Hooks must always be called in a consistent order, and may not be called conditionally. See the Rules of Hooks (https://react.dev/warnings/invalid-hook-call-warning) (4:4)
19
+ 2 | let x = null;
20
+ 3 | if (props.cond) {
21
+> 4 | x = useHook();
22
+ | ^^^^^^^ [ReactForget] InvalidReact: Hooks must always be called in a consistent order, and may not be called conditionally. See the Rules of Hooks (https://react.dev/warnings/invalid-hook-call-warning) (4:4)
23
+ 5 | }
24
+ 6 | return x;
25
+ 7 | }
26
```
27
28
\ No newline at end of file
compiler/packages/babel-plugin-react-forget/src/__tests__/fixtures/compiler/rules-of-hooks/error.invalid-hook-optional-methodcall.expect.md
+6
-1
@@ -13,7 +13,12 @@ function Component() {
13
## Error
14
15
```
16
-[ReactForget] InvalidReact: Hooks must always be called in a consistent order, and may not be called conditionally. See the Rules of Hooks (https://react.dev/warnings/invalid-hook-call-warning) (2:2)
16
+ 1 | function Component() {
17
+> 2 | const { result } = Module.useConditionalHook?.() ?? {};
18
+ | ^^^^^^^^^^^^^^^^^^^^^^^^^ [ReactForget] InvalidReact: Hooks must always be called in a consistent order, and may not be called conditionally. See the Rules of Hooks (https://react.dev/warnings/invalid-hook-call-warning) (2:2)
19
+ 3 | return result;
20
+ 4 | }
21
+ 5 |
22
```
23
24
\ No newline at end of file
compiler/packages/babel-plugin-react-forget/src/__tests__/fixtures/compiler/rules-of-hooks/error.invalid-hook-optional-property.expect.md
+6
-1
@@ -13,7 +13,12 @@ function Component() {
13
## Error
14
15
```
16
-[ReactForget] InvalidReact: Hooks must always be called in a consistent order, and may not be called conditionally. See the Rules of Hooks (https://react.dev/warnings/invalid-hook-call-warning) (2:2)
16
+ 1 | function Component() {
17
+> 2 | const { result } = Module?.useConditionalHook() ?? {};
18
+ | ^^^^^^^^^^^^^^^^^^^^^^^^^^ [ReactForget] InvalidReact: Hooks must always be called in a consistent order, and may not be called conditionally. See the Rules of Hooks (https://react.dev/warnings/invalid-hook-call-warning) (2:2)
19
+ 3 | return result;
20
+ 4 | }
21
+ 5 |
22
```
23
24
\ No newline at end of file
compiler/packages/babel-plugin-react-forget/src/__tests__/fixtures/compiler/rules-of-hooks/error.invalid-hook-optionalcall.expect.md
+6
-1
@@ -13,7 +13,12 @@ function Component() {
13
## Error
14
15
```
16
-[ReactForget] InvalidReact: Hooks must always be called in a consistent order, and may not be called conditionally. See the Rules of Hooks (https://react.dev/warnings/invalid-hook-call-warning) (2:2)
16
+ 1 | function Component() {
17
+> 2 | const { result } = useConditionalHook?.() ?? {};
18
+ | ^^^^^^^^^^^^^^^^^^ [ReactForget] InvalidReact: Hooks must always be called in a consistent order, and may not be called conditionally. See the Rules of Hooks (https://react.dev/warnings/invalid-hook-call-warning) (2:2)
19
+ 3 | return result;
20
+ 4 | }
21
+ 5 |
22
```
23
24
\ No newline at end of file
compiler/packages/babel-plugin-react-forget/src/__tests__/fixtures/compiler/rules-of-hooks/error.invalid-hook-reassigned-in-conditional.expect.md
+7
-1
@@ -14,11 +14,17 @@ function Component(props) {
14
## Error
15
16
```
17
-[ReactForget] InvalidReact: Hooks may not be referenced as normal values, they must be called. See the Rules of Hooks (https://react.dev/warnings/invalid-hook-call-warning) (3:3)
17
+ 1 | function Component(props) {
18
+ 2 | let y;
19
+> 3 | props.cond ? (y = useFoo) : null;
20
+ | ^^^^^^ [ReactForget] InvalidReact: Hooks may not be referenced as normal values, they must be called. See the Rules of Hooks (https://react.dev/warnings/invalid-hook-call-warning) (3:3)
21
22
[ReactForget] InvalidReact: Hooks may not be referenced as normal values, they must be called. See the Rules of Hooks (https://react.dev/warnings/invalid-hook-call-warning) (3:3)
23
24
[ReactForget] InvalidReact: Hooks may not be referenced as normal values, they must be called. See the Rules of Hooks (https://react.dev/warnings/invalid-hook-call-warning) (4:4)
25
+ 4 | return y();
26
+ 5 | }
27
+ 6 |
28
```
29
30
\ No newline at end of file
compiler/packages/babel-plugin-react-forget/src/__tests__/fixtures/compiler/rules-of-hooks/error.invalid-rules-of-hooks-1b9527f967f3.expect.md
+7
-1
@@ -25,13 +25,19 @@ function useHookInLoops() {
25
## Error
26
27
```
28
-[ReactForget] InvalidReact: Hooks must always be called in a consistent order, and may not be called conditionally. See the Rules of Hooks (https://react.dev/warnings/invalid-hook-call-warning) (7:7)
28
+ 5 | function useHookInLoops() {
29
+ 6 | while (a) {
30
+> 7 | useHook1();
31
+ | ^^^^^^^^ [ReactForget] InvalidReact: Hooks must always be called in a consistent order, and may not be called conditionally. See the Rules of Hooks (https://react.dev/warnings/invalid-hook-call-warning) (7:7)
32
33
[ReactForget] InvalidReact: Hooks must always be called in a consistent order, and may not be called conditionally. See the Rules of Hooks (https://react.dev/warnings/invalid-hook-call-warning) (9:9)
34
35
[ReactForget] InvalidReact: Hooks must always be called in a consistent order, and may not be called conditionally. See the Rules of Hooks (https://react.dev/warnings/invalid-hook-call-warning) (12:12)
36
37
[ReactForget] InvalidReact: Hooks must always be called in a consistent order, and may not be called conditionally. See the Rules of Hooks (https://react.dev/warnings/invalid-hook-call-warning) (14:14)
38
+ 8 | if (b) return;
39
+ 9 | useHook2();
40
+ 10 | }
41
```
42
43
\ No newline at end of file
compiler/packages/babel-plugin-react-forget/src/__tests__/fixtures/compiler/rules-of-hooks/error.invalid-rules-of-hooks-2aabd222fc6a.expect.md
+7
-1
@@ -18,7 +18,13 @@ function ComponentWithConditionalHook() {
18
## Error
19
20
```
21
-[ReactForget] InvalidReact: Hooks must always be called in a consistent order, and may not be called conditionally. See the Rules of Hooks (https://react.dev/warnings/invalid-hook-call-warning) (7:7)
21
+ 5 | function ComponentWithConditionalHook() {
22
+ 6 | if (cond) {
23
+> 7 | useConditionalHook();
24
+ | ^^^^^^^^^^^^^^^^^^ [ReactForget] InvalidReact: Hooks must always be called in a consistent order, and may not be called conditionally. See the Rules of Hooks (https://react.dev/warnings/invalid-hook-call-warning) (7:7)
25
+ 8 | }
26
+ 9 | }
27
+ 10 |
28
```
29
30
\ No newline at end of file
compiler/packages/babel-plugin-react-forget/src/__tests__/fixtures/compiler/rules-of-hooks/error.invalid-rules-of-hooks-49d341e5d68f.expect.md
+7
-1
@@ -19,7 +19,13 @@ function useLabeledBlock() {
19
## Error
20
21
```
22
-[ReactForget] InvalidReact: Hooks must always be called in a consistent order, and may not be called conditionally. See the Rules of Hooks (https://react.dev/warnings/invalid-hook-call-warning) (8:8)
22
+ 6 | label: {
23
+ 7 | if (a) break label;
24
+> 8 | useHook();
25
+ | ^^^^^^^ [ReactForget] InvalidReact: Hooks must always be called in a consistent order, and may not be called conditionally. See the Rules of Hooks (https://react.dev/warnings/invalid-hook-call-warning) (8:8)
26
+ 9 | }
27
+ 10 | }
28
+ 11 |
29
```
30
31
\ No newline at end of file
compiler/packages/babel-plugin-react-forget/src/__tests__/fixtures/compiler/rules-of-hooks/error.invalid-rules-of-hooks-79128a755612.expect.md
+7
-1
@@ -18,7 +18,13 @@ function ComponentWithHookInsideLoop() {
18
## Error
19
20
```
21
-[ReactForget] InvalidReact: Hooks must always be called in a consistent order, and may not be called conditionally. See the Rules of Hooks (https://react.dev/warnings/invalid-hook-call-warning) (7:7)
21
+ 5 | function ComponentWithHookInsideLoop() {
22
+ 6 | while (cond) {
23
+> 7 | useHookInsideLoop();
24
+ | ^^^^^^^^^^^^^^^^^ [ReactForget] InvalidReact: Hooks must always be called in a consistent order, and may not be called conditionally. See the Rules of Hooks (https://react.dev/warnings/invalid-hook-call-warning) (7:7)
25
+ 8 | }
26
+ 9 | }
27
+ 10 |
28
```
29
30
\ No newline at end of file
compiler/packages/babel-plugin-react-forget/src/__tests__/fixtures/compiler/rules-of-hooks/error.invalid-rules-of-hooks-9718e30b856c.expect.md
+6
-1
@@ -22,7 +22,12 @@ function useHook() {
22
## Error
23
24
```
25
-[ReactForget] InvalidReact: Hooks must always be called in a consistent order, and may not be called conditionally. See the Rules of Hooks (https://react.dev/warnings/invalid-hook-call-warning) (12:12)
25
+ 10 | console.log("false");
26
+ 11 | }
27
+> 12 | useState();
28
+ | ^^^^^^^^ [ReactForget] InvalidReact: Hooks must always be called in a consistent order, and may not be called conditionally. See the Rules of Hooks (https://react.dev/warnings/invalid-hook-call-warning) (12:12)
29
+ 13 | }
30
+ 14 |
31
```
32
33
\ No newline at end of file
compiler/packages/babel-plugin-react-forget/src/__tests__/fixtures/compiler/rules-of-hooks/error.invalid-rules-of-hooks-9bf17c174134.expect.md
+7
-1
@@ -17,9 +17,15 @@ function useHook() {
17
## Error
18
19
```
20
-[ReactForget] InvalidReact: Hooks must always be called in a consistent order, and may not be called conditionally. See the Rules of Hooks (https://react.dev/warnings/invalid-hook-call-warning) (6:6)
20
+ 4 | // This *must* be invalid.
21
+ 5 | function useHook() {
22
+> 6 | a && useHook1();
23
+ | ^^^^^^^^ [ReactForget] InvalidReact: Hooks must always be called in a consistent order, and may not be called conditionally. See the Rules of Hooks (https://react.dev/warnings/invalid-hook-call-warning) (6:6)
24
25
[ReactForget] InvalidReact: Hooks must always be called in a consistent order, and may not be called conditionally. See the Rules of Hooks (https://react.dev/warnings/invalid-hook-call-warning) (7:7)
26
+ 7 | b && useHook2();
27
+ 8 | }
28
+ 9 |
29
```
30
31
\ No newline at end of file
compiler/packages/babel-plugin-react-forget/src/__tests__/fixtures/compiler/rules-of-hooks/error.invalid-rules-of-hooks-b4dcda3d60ed.expect.md
+6
-1
@@ -16,7 +16,12 @@ function ComponentWithTernaryHook() {
16
## Error
17
18
```
19
-[ReactForget] InvalidReact: Hooks must always be called in a consistent order, and may not be called conditionally. See the Rules of Hooks (https://react.dev/warnings/invalid-hook-call-warning) (6:6)
19
+ 4 | // This *must* be invalid.
20
+ 5 | function ComponentWithTernaryHook() {
21
+> 6 | cond ? useTernaryHook() : null;
22
+ | ^^^^^^^^^^^^^^ [ReactForget] InvalidReact: Hooks must always be called in a consistent order, and may not be called conditionally. See the Rules of Hooks (https://react.dev/warnings/invalid-hook-call-warning) (6:6)
23
+ 7 | }
24
+ 8 |
25
```
26
27
\ No newline at end of file
compiler/packages/babel-plugin-react-forget/src/__tests__/fixtures/compiler/rules-of-hooks/error.invalid-rules-of-hooks-c906cace44e9.expect.md
+6
-1
@@ -17,7 +17,12 @@ function useHook() {
17
## Error
18
19
```
20
-[ReactForget] InvalidReact: Hooks must always be called in a consistent order, and may not be called conditionally. See the Rules of Hooks (https://react.dev/warnings/invalid-hook-call-warning) (7:7)
20
+ 5 | function useHook() {
21
+ 6 | if (a) return;
22
+> 7 | useState();
23
+ | ^^^^^^^^ [ReactForget] InvalidReact: Hooks must always be called in a consistent order, and may not be called conditionally. See the Rules of Hooks (https://react.dev/warnings/invalid-hook-call-warning) (7:7)
24
+ 8 | }
25
+ 9 |
26
```
27
28
\ No newline at end of file
compiler/packages/babel-plugin-react-forget/src/__tests__/fixtures/compiler/rules-of-hooks/error.invalid-rules-of-hooks-d740d54e9c21.expect.md
+7
-1
@@ -18,7 +18,13 @@ function normalFunctionWithConditionalHook() {
18
## Error
19
20
```
21
-[ReactForget] InvalidReact: Hooks must always be called in a consistent order, and may not be called conditionally. See the Rules of Hooks (https://react.dev/warnings/invalid-hook-call-warning) (7:7)
21
+ 5 | function normalFunctionWithConditionalHook() {
22
+ 6 | if (cond) {
23
+> 7 | useHookInsideNormalFunction();
24
+ | ^^^^^^^^^^^^^^^^^^^^^^^^^^^ [ReactForget] InvalidReact: Hooks must always be called in a consistent order, and may not be called conditionally. See the Rules of Hooks (https://react.dev/warnings/invalid-hook-call-warning) (7:7)
25
+ 8 | }
26
+ 9 | }
27
+ 10 |
28
```
29
30
\ No newline at end of file
compiler/packages/babel-plugin-react-forget/src/__tests__/fixtures/compiler/rules-of-hooks/error.invalid-rules-of-hooks-d85c144bdf40.expect.md
+7
-1
@@ -20,9 +20,15 @@ function useHookInLoops() {
20
## Error
21
22
```
23
-[ReactForget] InvalidReact: Hooks must always be called in a consistent order, and may not be called conditionally. See the Rules of Hooks (https://react.dev/warnings/invalid-hook-call-warning) (7:7)
23
+ 5 | function useHookInLoops() {
24
+ 6 | while (a) {
25
+> 7 | useHook1();
26
+ | ^^^^^^^^ [ReactForget] InvalidReact: Hooks must always be called in a consistent order, and may not be called conditionally. See the Rules of Hooks (https://react.dev/warnings/invalid-hook-call-warning) (7:7)
27
28
[ReactForget] InvalidReact: Hooks must always be called in a consistent order, and may not be called conditionally. See the Rules of Hooks (https://react.dev/warnings/invalid-hook-call-warning) (9:9)
29
+ 8 | if (b) continue;
30
+ 9 | useHook2();
31
+ 10 | }
32
```
33
34
\ No newline at end of file
compiler/packages/babel-plugin-react-forget/src/__tests__/fixtures/compiler/rules-of-hooks/error.invalid-rules-of-hooks-ea7c2fb545a9.expect.md
+7
-1
@@ -18,7 +18,13 @@ function useHookWithConditionalHook() {
18
## Error
19
20
```
21
-[ReactForget] InvalidReact: Hooks must always be called in a consistent order, and may not be called conditionally. See the Rules of Hooks (https://react.dev/warnings/invalid-hook-call-warning) (7:7)
21
+ 5 | function useHookWithConditionalHook() {
22
+ 6 | if (cond) {
23
+> 7 | useConditionalHook();
24
+ | ^^^^^^^^^^^^^^^^^^ [ReactForget] InvalidReact: Hooks must always be called in a consistent order, and may not be called conditionally. See the Rules of Hooks (https://react.dev/warnings/invalid-hook-call-warning) (7:7)
25
+ 8 | }
26
+ 9 | }
27
+ 10 |
28
```
29
30
\ No newline at end of file
compiler/packages/babel-plugin-react-forget/src/__tests__/fixtures/compiler/rules-of-hooks/error.invalid-rules-of-hooks-f3d6c5e9c83d.expect.md
+6
-1
@@ -22,7 +22,12 @@ function useHook() {
22
## Error
23
24
```
25
-[ReactForget] InvalidReact: Hooks must always be called in a consistent order, and may not be called conditionally. See the Rules of Hooks (https://react.dev/warnings/invalid-hook-call-warning) (12:12)
25
+ 10 | }
26
+ 11 | if (a) return;
27
+> 12 | useState();
28
+ | ^^^^^^^^ [ReactForget] InvalidReact: Hooks must always be called in a consistent order, and may not be called conditionally. See the Rules of Hooks (https://react.dev/warnings/invalid-hook-call-warning) (12:12)
29
+ 13 | }
30
+ 14 |
31
```
32
33
\ No newline at end of file
compiler/packages/babel-plugin-react-forget/src/__tests__/fixtures/compiler/rules-of-hooks/error.invalid-rules-of-hooks-f69800950ff0.expect.md
+7
-1
@@ -18,11 +18,17 @@ function useHook({ bar }) {
18
## Error
19
20
```
21
-[ReactForget] InvalidReact: Hooks must always be called in a consistent order, and may not be called conditionally. See the Rules of Hooks (https://react.dev/warnings/invalid-hook-call-warning) (6:6)
21
+ 4 | // This *must* be invalid.
22
+ 5 | function useHook({ bar }) {
23
+> 6 | let foo1 = bar && useState();
24
+ | ^^^^^^^^ [ReactForget] InvalidReact: Hooks must always be called in a consistent order, and may not be called conditionally. See the Rules of Hooks (https://react.dev/warnings/invalid-hook-call-warning) (6:6)
25
26
[ReactForget] InvalidReact: Hooks must always be called in a consistent order, and may not be called conditionally. See the Rules of Hooks (https://react.dev/warnings/invalid-hook-call-warning) (7:7)
27
28
[ReactForget] InvalidReact: Hooks must always be called in a consistent order, and may not be called conditionally. See the Rules of Hooks (https://react.dev/warnings/invalid-hook-call-warning) (8:8)
29
+ 7 | let foo2 = bar || useState();
30
+ 8 | let foo3 = bar ?? useState();
31
+ 9 | }
32
```
33
34
\ No newline at end of file
compiler/packages/babel-plugin-react-forget/src/__tests__/fixtures/compiler/rules-of-hooks/todo.error.invalid-rules-of-hooks-368024110a58.expect.md
+7
-1
@@ -20,7 +20,13 @@ const FancyButton = forwardRef(function (props, ref) {
20
## Error
21
22
```
23
-[ReactForget] InvalidReact: Hooks must always be called in a consistent order, and may not be called conditionally. See the Rules of Hooks (https://react.dev/warnings/invalid-hook-call-warning) (8:8)
23
+ 6 | const FancyButton = forwardRef(function (props, ref) {
24
+ 7 | if (props.fancy) {
25
+> 8 | useCustomHook();
26
+ | ^^^^^^^^^^^^^ [ReactForget] InvalidReact: Hooks must always be called in a consistent order, and may not be called conditionally. See the Rules of Hooks (https://react.dev/warnings/invalid-hook-call-warning) (8:8)
27
+ 9 | }
28
+ 10 | return <button ref={ref}>{props.children}</button>;
29
+ 11 | });
30
```
31
32
\ No newline at end of file
compiler/packages/babel-plugin-react-forget/src/__tests__/fixtures/compiler/rules-of-hooks/todo.error.invalid-rules-of-hooks-8566f9a360e2.expect.md
+7
-1
@@ -20,7 +20,13 @@ const MemoizedButton = memo(function (props) {
20
## Error
21
22
```
23
-[ReactForget] InvalidReact: Hooks must always be called in a consistent order, and may not be called conditionally. See the Rules of Hooks (https://react.dev/warnings/invalid-hook-call-warning) (8:8)
23
+ 6 | const MemoizedButton = memo(function (props) {
24
+ 7 | if (props.fancy) {
25
+> 8 | useCustomHook();
26
+ | ^^^^^^^^^^^^^ [ReactForget] InvalidReact: Hooks must always be called in a consistent order, and may not be called conditionally. See the Rules of Hooks (https://react.dev/warnings/invalid-hook-call-warning) (8:8)
27
+ 9 | }
28
+ 10 | return <button>{props.children}</button>;
29
+ 11 | });
30
```
31
32
\ No newline at end of file
compiler/packages/babel-plugin-react-forget/src/__tests__/fixtures/compiler/rules-of-hooks/todo.error.invalid-rules-of-hooks-a0058f0b446d.expect.md
+7
-1
@@ -19,7 +19,13 @@ function ComponentWithConditionalHook() {
19
## Error
20
21
```
22
-[ReactForget] InvalidReact: Hooks must always be called in a consistent order, and may not be called conditionally. See the Rules of Hooks (https://react.dev/warnings/invalid-hook-call-warning) (8:8)
22
+ 6 | function ComponentWithConditionalHook() {
23
+ 7 | if (cond) {
24
+> 8 | Namespace.useConditionalHook();
25
+ | ^^^^^^^^^^^^^^^^^^^^^^^^^^^^ [ReactForget] InvalidReact: Hooks must always be called in a consistent order, and may not be called conditionally. See the Rules of Hooks (https://react.dev/warnings/invalid-hook-call-warning) (8:8)
26
+ 9 | }
27
+ 10 | }
28
+ 11 |
29
```
30
31
\ No newline at end of file
compiler/packages/babel-plugin-react-forget/src/__tests__/fixtures/compiler/rules-of-hooks/todo.error.rules-of-hooks-27c18dc8dad2.expect.md
+7
-1
@@ -20,7 +20,13 @@ const FancyButton = React.forwardRef((props, ref) => {
20
## Error
21
22
```
23
-[ReactForget] InvalidReact: Hooks must always be called in a consistent order, and may not be called conditionally. See the Rules of Hooks (https://react.dev/warnings/invalid-hook-call-warning) (8:8)
23
+ 6 | const FancyButton = React.forwardRef((props, ref) => {
24
+ 7 | if (props.fancy) {
25
+> 8 | useCustomHook();
26
+ | ^^^^^^^^^^^^^ [ReactForget] InvalidReact: Hooks must always be called in a consistent order, and may not be called conditionally. See the Rules of Hooks (https://react.dev/warnings/invalid-hook-call-warning) (8:8)
27
+ 9 | }
28
+ 10 | return <button ref={ref}>{props.children}</button>;
29
+ 11 | });
30
```
31
32
\ No newline at end of file
compiler/packages/babel-plugin-react-forget/src/__tests__/fixtures/compiler/rules-of-hooks/todo.error.rules-of-hooks-d0935abedc42.expect.md
+7
-1
@@ -19,7 +19,13 @@ React.unknownFunction((foo, bar) => {
19
## Error
20
21
```
22
-[ReactForget] InvalidReact: Hooks must always be called in a consistent order, and may not be called conditionally. See the Rules of Hooks (https://react.dev/warnings/invalid-hook-call-warning) (8:8)
22
+ 6 | React.unknownFunction((foo, bar) => {
23
+ 7 | if (foo) {
24
+> 8 | useNotAHook(bar);
25
+ | ^^^^^^^^^^^ [ReactForget] InvalidReact: Hooks must always be called in a consistent order, and may not be called conditionally. See the Rules of Hooks (https://react.dev/warnings/invalid-hook-call-warning) (8:8)
26
+ 9 | }
27
+ 10 | });
28
+ 11 |
29
```
30
31
\ No newline at end of file
compiler/packages/babel-plugin-react-forget/src/__tests__/fixtures/compiler/rules-of-hooks/todo.error.rules-of-hooks-e29c874aa913.expect.md
+7
-1
@@ -20,7 +20,13 @@ function useHook() {
20
## Error
21
22
```
23
-[ReactForget] InvalidReact: Hooks must always be called in a consistent order, and may not be called conditionally. See the Rules of Hooks (https://react.dev/warnings/invalid-hook-call-warning) (9:9)
23
+ 7 | try {
24
+ 8 | f();
25
+> 9 | useState();
26
+ | ^^^^^^^^ [ReactForget] InvalidReact: Hooks must always be called in a consistent order, and may not be called conditionally. See the Rules of Hooks (https://react.dev/warnings/invalid-hook-call-warning) (9:9)
27
+ 10 | } catch {}
28
+ 11 | }
29
+ 12 |
30
```
31
32
\ No newline at end of file
compiler/packages/babel-plugin-react-forget/src/__tests__/fixtures/compiler/todo.error.object-pattern-computed-key.expect.md
+7
-1
@@ -21,7 +21,13 @@ export const FIXTURE_ENTRYPOINT = {
21
## Error
22
23
```
24
-[ReactForget] Todo: (BuildHIR::lowerAssignment) Handle computed properties in ObjectPattern (5:5)
24
+ 3 | const SCALE = 2;
25
+ 4 | function Component(props) {
26
+> 5 | const { [props.name]: value } = props;
27
+ | ^^^^^^^^^^^^^^^^^^^ [ReactForget] Todo: (BuildHIR::lowerAssignment) Handle computed properties in ObjectPattern (5:5)
28
+ 6 | return value;
29
+ 7 | }
30
+ 8 |
31
```
32
33
\ No newline at end of file
compiler/packages/snap/package.json
+4
-2
@@ -18,14 +18,16 @@
18
"url": "git+https://github.com/facebook/react-forget.git"
19
},
20
"dependencies": {
21
+ "@babel/code-frame": "^7.22.5",
22
"@parcel/watcher": "^2.1.0",
23
"chalk": "4",
24
+ "fixture-test-utils": "*",
25
"readline": "^1.3.0",
26
"typescript": "^5.1.0",
25
- "yargs": "^17.7.1",
26
- "fixture-test-utils": "*"
27
+ "yargs": "^17.7.1"
28
},
29
"devDependencies": {
30
+ "@types/babel__code-frame": "^7.0.6",
31
"@types/node": "^18.7.18",
32
"@typescript-eslint/eslint-plugin": "^5.51.0",
33
"@typescript-eslint/parser": "^5.51.0",
compiler/packages/snap/src/compiler-worker.ts
+24
@@ -5,6 +5,7 @@
5
* LICENSE file in the root directory of this source tree.
6
*/
7
8
+import { codeFrameColumns } from "@babel/code-frame";
9
import type { runReactForgetBabelPlugin as RunReactForgetBabelPlugin } from "babel-plugin-react-forget/src/Babel/RunReactForgetBabelPlugin";
10
import type { parseConfigPragma as ParseConfigPragma } from "babel-plugin-react-forget/src/HIR/Environment";
11
import {
@@ -94,6 +95,29 @@ export async function compile(
95
console.error(e.stack);
96
}
97
error = e.message.replace(/\u001b[^m]*m/g, "");
98
+ const loc = e.details?.[0]?.loc;
99
+ if (loc != null) {
100
+ try {
101
+ error = codeFrameColumns(
102
+ input,
103
+ {
104
+ start: {
105
+ line: loc.start.line,
106
+ column: loc.start.column + 1,
107
+ },
108
+ end: {
109
+ line: loc.end.line,
110
+ column: loc.end.column + 1,
111
+ },
112
+ },
113
+ {
114
+ message: e.message,
115
+ }
116
+ );
117
+ } catch {
118
+ // In case the location data isn't valid, skip printing a code frame.
119
+ }
120
+ }
121
}
122
123
// Promote console errors so they can be recorded in fixture output
compiler/yarn.lock
+5
@@ -2790,6 +2790,11 @@
2790
resolved "https://registry.yarnpkg.com/@types/aria-query/-/aria-query-4.2.2.tgz#ed4e0ad92306a704f9fb132a0cfcf77486dbe2bc"
2791
integrity sha512-HnYpAE1Y6kRyKM/XkEuiRQhTHvkzMBurTHnpFLYLBGPIylZNPs9jJcuOOYWxPLJCSEtmZT0Y8rHDokKN7rRTig==
2792
2793
+"@types/babel__code-frame@^7.0.6":
2794
+ version "7.0.6"
2795
+ resolved "https://registry.yarnpkg.com/@types/babel__code-frame/-/babel__code-frame-7.0.6.tgz#20a899c0d29fba1ddf5c2156a10a2bda75ee6f29"
2796
+ integrity sha512-Anitqkl3+KrzcW2k77lRlg/GfLZLWXBuNgbEcIOU6M92yw42vsd3xV/Z/yAHEj8m+KUjL6bWOVOFqX8PFPJ4LA==
2797
+
2798
"@types/babel__core@^7.1.14":
2799
version "7.1.19"
2800
resolved "https://registry.yarnpkg.com/@types/babel__core/-/babel__core-7.1.19.tgz#7b497495b7d1b4812bdb9d02804d0576f43ee460"