From 586c69515f602d70635841df1139fa762c9bdcdb Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Nacho=20Codo=C3=B1er?= <igcogi@gmail.com>
Date: Fri, 15 Aug 2025 09:52:05 +0200
Subject: [PATCH] add coverage for react-compiler as a rspack.config.js

---
 .../apps/react-router/babel.config.js         | 17 ++++++++++
 .../apps/react-router/client/main.jsx         |  8 +++--
 .../apps/react-router/package.json            | 12 +++++--
 .../apps/react-router/rspack.config.js        | 31 +++++++++++++++++++
 tools/modern-tests/react-router.test.js       |  3 ++
 5 files changed, 66 insertions(+), 5 deletions(-)
 create mode 100644 tools/modern-tests/apps/react-router/babel.config.js
 create mode 100644 tools/modern-tests/apps/react-router/rspack.config.js

diff --git a/tools/modern-tests/apps/react-router/babel.config.js b/tools/modern-tests/apps/react-router/babel.config.js
new file mode 100644
index 0000000000..69119e468d
--- /dev/null
+++ b/tools/modern-tests/apps/react-router/babel.config.js
@@ -0,0 +1,17 @@
+const ReactCompilerConfig = {
+  target: '18',
+};
+
+module.exports = function (api) {
+  // required when exporting a function
+  api.cache(true); // cache forever; or api.cache.using(() => process.env.NODE_ENV)
+
+  console.log('babel.config.js: babel-plugin-react-compiler');
+
+  return {
+    plugins: [
+      ['babel-plugin-react-compiler', ReactCompilerConfig], // must run first!
+      '@babel/plugin-syntax-jsx',
+    ],
+  };
+};
diff --git a/tools/modern-tests/apps/react-router/client/main.jsx b/tools/modern-tests/apps/react-router/client/main.jsx
index d2e380f93c..d61a8d996a 100644
--- a/tools/modern-tests/apps/react-router/client/main.jsx
+++ b/tools/modern-tests/apps/react-router/client/main.jsx
@@ -3,8 +3,12 @@ import { createRoot } from 'react-dom/client';
 import { Meteor } from 'meteor/meteor';
 import { App } from '/imports/ui/App';
 
+let root;
+
 Meteor.startup(() => {
-  const container = document.getElementById('react-target');
-  const root = createRoot(container);
+  const container = document.getElementById('react-target'); // your container id
+  if (!root) {
+    root = createRoot(container); // create once
+  }
   root.render(<App />);
 });
diff --git a/tools/modern-tests/apps/react-router/package.json b/tools/modern-tests/apps/react-router/package.json
index 57b27431b0..be63600f23 100644
--- a/tools/modern-tests/apps/react-router/package.json
+++ b/tools/modern-tests/apps/react-router/package.json
@@ -11,12 +11,18 @@
     "@babel/runtime": "^7.23.5",
     "@swc/helpers": "^0.5.17",
     "meteor-node-stubs": "^1.2.12",
-    "react": "^18.2.0",
-    "react-dom": "^18.2.0",
+    "react": "^18.3.1",
+    "react-compiler-runtime": "^19.1.0-rc.2",
+    "react-dom": "^18.3.1",
     "react-router-dom": "^7.0.0"
   },
   "devDependencies": {
-    "playwright": "^1.54.2"
+    "playwright": "^1.54.2",
+    "@babel/plugin-syntax-jsx": "^7.27.1",
+    "@babel/preset-env": "^7.23.5",
+    "@babel/preset-react": "^7.23.3",
+    "babel-plugin-react-compiler": "^19.1.0-rc.2",
+    "babel-loader": "^9.1.3"
   },
   "meteor": {
     "mainModule": {
diff --git a/tools/modern-tests/apps/react-router/rspack.config.js b/tools/modern-tests/apps/react-router/rspack.config.js
new file mode 100644
index 0000000000..cff469024d
--- /dev/null
+++ b/tools/modern-tests/apps/react-router/rspack.config.js
@@ -0,0 +1,31 @@
+import { defineConfig } from '@meteorjs/rspack';
+
+/**
+ * Rspack configuration for Meteor projects.
+ *
+ * Provides typed flags on the `Meteor` object, such as:
+ * - `Meteor.isClient` / `Meteor.isServer`
+ * - `Meteor.isDevelopment` / `Meteor.isProduction`
+ * - …and other flags available
+ *
+ * Use these flags to adjust your build settings based on environment.
+ */
+export default defineConfig(Meteor => {
+  return {
+    module: {
+      rules: [
+        {
+          test: /\.jsx$/,
+          use: [
+            {
+              loader: 'builtin:swc-loader',
+              options: { jsc: { parser: { syntax: 'ecmascript', jsx: true } } },
+            },
+            { loader: 'babel-loader' },
+          ],
+          type: 'javascript/auto',
+        },
+      ],
+    },
+  };
+});
diff --git a/tools/modern-tests/react-router.test.js b/tools/modern-tests/react-router.test.js
index 699e3db216..59b1303dc4 100644
--- a/tools/modern-tests/react-router.test.js
+++ b/tools/modern-tests/react-router.test.js
@@ -23,6 +23,7 @@ describe('ReactRouter App Bundling /', () => {
     customAssertions: {
       afterRun: async ({ result, port }) => {
         await waitForReactEnvs(result.outputLines, { isJsxEnabled: true });
+        await waitForMeteorOutput(result.outputLines, /.*babel-plugin-react-compiler.*/);
         await assert404Page(port);
       },
       afterRunRebuildClient: async ({ allConsoleLogs }) => {
@@ -31,6 +32,7 @@ describe('ReactRouter App Bundling /', () => {
       },
       afterRunProduction: async ({ result, port }) => {
         await waitForReactEnvs(result.outputLines, { isJsxEnabled: true });
+        await waitForMeteorOutput(result.outputLines, /.*babel-plugin-react-compiler.*/);
         await assert404Page(port, { isProductionMode: true });
       },
       afterRunProductionRebuildClient: async ({ allConsoleLogs }) => {
@@ -45,6 +47,7 @@ describe('ReactRouter App Bundling /', () => {
       },
       afterBuild: async ({ result }) => {
         await waitForReactEnvs(result.outputLines, { isJsxEnabled: true });
+        await waitForMeteorOutput(result.outputLines, /.*babel-plugin-react-compiler.*/);
       },
     }
   }));