From f2841c2a490b4b776b98568871b69693fedf985c Mon Sep 17 00:00:00 2001
From: Mike Vitousek <mmvitousek@gmail.com>
Date: Tue, 27 Aug 2024 10:11:50 -0700
Subject: [PATCH] [compiler] Fixture to demonstrate issue with returning object
 containing ref

Summary:
We currently can return a ref from a hook but not an object containing a ref.

ghstack-source-id: 8b1de4991eb2731b7f758e685ba62d9f07d584b2
Pull Request resolved: https://github.com/facebook/react/pull/30820
---
 ...or.return-ref-callback-structure.expect.md | 45 +++++++++++++++++++
 .../error.return-ref-callback-structure.js    | 20 +++++++++
 2 files changed, 65 insertions(+)
 create mode 100644 compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/error.return-ref-callback-structure.expect.md
 create mode 100644 compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/error.return-ref-callback-structure.js

diff --git a/compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/error.return-ref-callback-structure.expect.md b/compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/error.return-ref-callback-structure.expect.md
new file mode 100644
index 0000000000000..866d2e2fea657
--- /dev/null
+++ b/compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/error.return-ref-callback-structure.expect.md
@@ -0,0 +1,45 @@
+
+## Input
+
+```javascript
+// @flow @validateRefAccessDuringRender @validatePreserveExistingMemoizationGuarantees
+
+import {useRef} from 'react';
+
+component Foo(cond: boolean, cond2: boolean) {
+  const ref = useRef();
+
+  const s = () => {
+    return ref.current;
+  };
+
+  if (cond) return [s];
+  else if (cond2) return {s};
+  else return {s: [s]};
+}
+
+export const FIXTURE_ENTRYPOINT = {
+  fn: Foo,
+  params: [{cond: false, cond2: false}],
+};
+
+```
+
+
+## Error
+
+```
+  10 |   };
+  11 |
+> 12 |   if (cond) return [s];
+     |                     ^ InvalidReact: Ref values (the `current` property) may not be accessed during render. (https://react.dev/reference/react/useRef) (12:12)
+
+InvalidReact: Ref values (the `current` property) may not be accessed during render. (https://react.dev/reference/react/useRef) (13:13)
+
+InvalidReact: Ref values (the `current` property) may not be accessed during render. (https://react.dev/reference/react/useRef) (14:14)
+  13 |   else if (cond2) return {s};
+  14 |   else return {s: [s]};
+  15 | }
+```
+          
+      
\ No newline at end of file
diff --git a/compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/error.return-ref-callback-structure.js b/compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/error.return-ref-callback-structure.js
new file mode 100644
index 0000000000000..e37acbde348d1
--- /dev/null
+++ b/compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/error.return-ref-callback-structure.js
@@ -0,0 +1,20 @@
+// @flow @validateRefAccessDuringRender @validatePreserveExistingMemoizationGuarantees
+
+import {useRef} from 'react';
+
+component Foo(cond: boolean, cond2: boolean) {
+  const ref = useRef();
+
+  const s = () => {
+    return ref.current;
+  };
+
+  if (cond) return [s];
+  else if (cond2) return {s};
+  else return {s: [s]};
+}
+
+export const FIXTURE_ENTRYPOINT = {
+  fn: Foo,
+  params: [{cond: false, cond2: false}],
+};