From b2a6f93033c4d84518ed467614aa393653dfb907 Mon Sep 17 00:00:00 2001
From: "Zakariya Jabbar (Viper Droid)" <gaszaka20@gmail.com>
Date: Fri, 17 Apr 2026 22:28:26 +0300
Subject: [PATCH] feat(compiler): add snap fixture for flatMap reactive
 dependencies

Adds array-flatmap-reactive-deps fixture covering props.items.flatMap with a
callback that closes over props.suffix, plus generated expect output.
---
 .../array-flatmap-reactive-deps.expect.md     | 82 +++++++++++++++++++
 .../compiler/array-flatmap-reactive-deps.js   | 21 +++++
 2 files changed, 103 insertions(+)
 create mode 100644 compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/array-flatmap-reactive-deps.expect.md
 create mode 100644 compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/array-flatmap-reactive-deps.js

diff --git a/compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/array-flatmap-reactive-deps.expect.md b/compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/array-flatmap-reactive-deps.expect.md
new file mode 100644
index 00000000000..bd13ef5d6d7
--- /dev/null
+++ b/compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/array-flatmap-reactive-deps.expect.md
@@ -0,0 +1,82 @@
+
+## Input
+
+```javascript
+function Component(props) {
+  const cells = props.items.flatMap(item => [item, item.id + props.suffix]);
+  return (
+    <div>
+      {cells.map((cell, i) => (
+        <span key={i}>{typeof cell === 'object' ? cell.id : cell}</span>
+      ))}
+    </div>
+  );
+}
+
+export const FIXTURE_ENTRYPOINT = {
+  fn: Component,
+  params: [
+    {
+      items: [{id: 1}, {id: 2}],
+      suffix: '-x',
+    },
+  ],
+  isComponent: true,
+};
+
+```
+
+## Code
+
+```javascript
+import { c as _c } from "react/compiler-runtime";
+function Component(props) {
+  const $ = _c(7);
+  let t0;
+  if ($[0] !== props.items || $[1] !== props.suffix) {
+    let t1;
+    if ($[3] !== props.suffix) {
+      t1 = (item) => [item, item.id + props.suffix];
+      $[3] = props.suffix;
+      $[4] = t1;
+    } else {
+      t1 = $[4];
+    }
+    const cells = props.items.flatMap(t1);
+    t0 = cells.map(_temp);
+    $[0] = props.items;
+    $[1] = props.suffix;
+    $[2] = t0;
+  } else {
+    t0 = $[2];
+  }
+  let t1;
+  if ($[5] !== t0) {
+    t1 = <div>{t0}</div>;
+    $[5] = t0;
+    $[6] = t1;
+  } else {
+    t1 = $[6];
+  }
+  return t1;
+}
+function _temp(cell, i) {
+  return <span key={i}>{typeof cell === "object" ? cell.id : cell}</span>;
+}
+
+export const FIXTURE_ENTRYPOINT = {
+  fn: Component,
+  params: [
+    {
+      items: [{ id: 1 }, { id: 2 }],
+      suffix: "-x",
+    },
+  ],
+
+  isComponent: true,
+};
+
+```
+      
+### Eval output
+(kind: ok) <div><span>1</span><span>1-x</span><span>2</span><span>2-x</span></div>
\ No newline at end of file
diff --git a/compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/array-flatmap-reactive-deps.js b/compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/array-flatmap-reactive-deps.js
new file mode 100644
index 00000000000..5d50bc06190
--- /dev/null
+++ b/compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/array-flatmap-reactive-deps.js
@@ -0,0 +1,21 @@
+function Component(props) {
+  const cells = props.items.flatMap(item => [item, item.id + props.suffix]);
+  return (
+    <div>
+      {cells.map((cell, i) => (
+        <span key={i}>{typeof cell === 'object' ? cell.id : cell}</span>
+      ))}
+    </div>
+  );
+}
+
+export const FIXTURE_ENTRYPOINT = {
+  fn: Component,
+  params: [
+    {
+      items: [{id: 1}, {id: 2}],
+      suffix: '-x',
+    },
+  ],
+  isComponent: true,
+};