[compiler] repro of false positive for ValidatePreserveManualMemo
ghstack-source-id: 235c5bae0828b79db758871006e4c091923ca5fd Pull Request resolved: https://github.com/facebook/react/pull/30431
Joe Savona committed
Jul 23, 2024 at 16:34 UTC
c08b51600796706d59c51cddd372720e07c6b24b
2 files changed
+51
compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/preserve-memo-validation/error.false-positive-useMemo-with-refs.flow.expect.md
new
+38
@@ -0,0 +1,38 @@
1
+
2
+## Input
3
+
4
+```javascript
5
+// @flow @validatePreserveExistingMemoizationGuarantees
6
+import { identity } from "shared-runtime";
7
+
8
+component Component(
9
+ disableLocalRef,
10
+ ref,
11
+) {
12
+ const localRef = useFooRef();
13
+ const mergedRef = useMemo(() => {
14
+ return disableLocalRef ? ref : identity(ref, localRef);
15
+ }, [disableLocalRef, ref, localRef]);
16
+ return <div ref={mergedRef} />;
17
+}
18
+
19
+```
20
+
21
+
22
+## Error
23
+
24
+```
25
+ 7 | ) {
26
+ 8 | const localRef = useFooRef();
27
+> 9 | const mergedRef = useMemo(() => {
28
+ | ^^^^^^^
29
+> 10 | return disableLocalRef ? ref : identity(ref, localRef);
30
+ | ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^
31
+> 11 | }, [disableLocalRef, ref, localRef]);
32
+ | ^^^^ CannotPreserveMemoization: React Compiler has skipped optimizing this component because the existing manual memoization could not be preserved. This value may be mutated later, which could cause the value to change unexpectedly (9:11)
33
+ 12 | return <div ref={mergedRef} />;
34
+ 13 | }
35
+ 14 |
36
+```
37
+
38
+
\ No newline at end of file
compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/preserve-memo-validation/error.false-positive-useMemo-with-refs.flow.js
new
+13
@@ -0,0 +1,13 @@
1
+// @flow @validatePreserveExistingMemoizationGuarantees
2
+import { identity } from "shared-runtime";
3
+
4
+component Component(
5
+ disableLocalRef,
6
+ ref,
7
+) {
8
+ const localRef = useFooRef();
9
+ const mergedRef = useMemo(() => {
10
+ return disableLocalRef ? ref : identity(ref, localRef);
11
+ }, [disableLocalRef, ref, localRef]);
12
+ return <div ref={mergedRef} />;
13
+}