Skip to content

Commit 8079391

Browse files
committed
[compiler] Repro for false positive ValidateNoFreezingKnownMutableFunctions
Found when testing the new validation from #33079 internally. I haven't fully debugged, but somehow the combination of the effect function *accessing* a ref and also calling a second function which has a purely local mutation triggers the validation. Even though the called second function only mutates local variables. If i remove the ref access in the effect function, the error goes away. Anyway I'll keep debugging, putting up a repro for now. ghstack-source-id: 39cdff2 Pull Request resolved: #33113
1 parent 0db8db1 commit 8079391

File tree

2 files changed

+85
-0
lines changed

2 files changed

+85
-0
lines changed
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,58 @@
1+
2+
## Input
3+
4+
```javascript
5+
// @validateNoFreezingKnownMutableFunctions
6+
7+
import {useCallback, useEffect, useRef} from 'react';
8+
import {useHook} from 'shared-runtime';
9+
10+
function Component() {
11+
const params = useHook();
12+
const update = useCallback(
13+
partialParams => {
14+
const nextParams = {
15+
...params,
16+
...partialParams,
17+
};
18+
nextParams.param = 'value';
19+
console.log(nextParams);
20+
},
21+
[params]
22+
);
23+
const ref = useRef(null);
24+
useEffect(() => {
25+
if (ref.current === null) {
26+
update();
27+
}
28+
}, [update]);
29+
30+
return 'ok';
31+
}
32+
33+
```
34+
35+
36+
## Error
37+
38+
```
39+
18 | );
40+
19 | const ref = useRef(null);
41+
> 20 | useEffect(() => {
42+
| ^^^^^^^
43+
> 21 | if (ref.current === null) {
44+
| ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^
45+
> 22 | update();
46+
| ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^
47+
> 23 | }
48+
| ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^
49+
> 24 | }, [update]);
50+
| ^^^^ InvalidReact: This argument is a function which modifies local variables when called, which can bypass memoization and cause the UI not to update. Functions that are returned from hooks, passed as arguments to hooks, or passed as props to components may not mutate local variables (20:24)
51+
52+
InvalidReact: The function modifies a local variable here (14:14)
53+
25 |
54+
26 | return 'ok';
55+
27 | }
56+
```
57+
58+
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,27 @@
1+
// @validateNoFreezingKnownMutableFunctions
2+
3+
import {useCallback, useEffect, useRef} from 'react';
4+
import {useHook} from 'shared-runtime';
5+
6+
function Component() {
7+
const params = useHook();
8+
const update = useCallback(
9+
partialParams => {
10+
const nextParams = {
11+
...params,
12+
...partialParams,
13+
};
14+
nextParams.param = 'value';
15+
console.log(nextParams);
16+
},
17+
[params]
18+
);
19+
const ref = useRef(null);
20+
useEffect(() => {
21+
if (ref.current === null) {
22+
update();
23+
}
24+
}, [update]);
25+
26+
return 'ok';
27+
}

0 commit comments

Comments
 (0)