[compiler] Add tests for incorrect global mutation detection
If a function expression that mutates a global is passed as a prop, we don't throw an error as we assume it's not called in render. But if this function expression is captured in an object and passed down as prop, we throw an error. ghstack-source-id: 74cacee09f565550007b2e01fa8877ad64ccfbe9 Pull Request resolved: https://github.com/facebook/react/pull/30456
Sathya Gunsasekaran committed
Jul 25, 2024 at 14:06 UTC
c5fa460784c41a2e09e9ed1c4468f4f089e2a78b
2 files changed
+45
compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/error.object-capture-global-mutation.expect.md
new
+33
@@ -0,0 +1,33 @@
1
+
2
+## Input
3
+
4
+```javascript
5
+function Foo() {
6
+ const x = () => {
7
+ window.href = 'foo';
8
+ };
9
+ const y = {x};
10
+ return <Bar y={y} />;
11
+}
12
+
13
+export const FIXTURE_ENTRYPOINT = {
14
+ fn: Foo,
15
+ params: [],
16
+};
17
+
18
+```
19
+
20
+
21
+## Error
22
+
23
+```
24
+ 1 | function Foo() {
25
+ 2 | const x = () => {
26
+> 3 | window.href = 'foo';
27
+ | ^^^^^^ InvalidReact: Writing to a variable defined outside a component or hook is not allowed. Consider using an effect (3:3)
28
+ 4 | };
29
+ 5 | const y = {x};
30
+ 6 | return <Bar y={y} />;
31
+```
32
+
33
+
\ No newline at end of file
compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/error.object-capture-global-mutation.js
new
+12
@@ -0,0 +1,12 @@
1
+function Foo() {
2
+ const x = () => {
3
+ window.href = 'foo';
4
+ };
5
+ const y = {x};
6
+ return <Bar y={y} />;
7
+}
8
+
9
+export const FIXTURE_ENTRYPOINT = {
10
+ fn: Foo,
11
+ params: [],
12
+};