diff --git a/.babelrc b/.babelrc
new file mode 100644
index 00000000000..9d461d08688
--- /dev/null
+++ b/.babelrc
@@ -0,0 +1,7 @@
+{
+  "env": {
+    "test": {
+      "plugins": ["istanbul"]
+    }
+  }
+}
diff --git a/.yarn/patches/modular-scripts-npm-3.6.0-d967962075.patch b/.yarn/patches/modular-scripts-npm-3.6.0-d967962075.patch
index 3bd54e6038d..902e49d6ea6 100644
--- a/.yarn/patches/modular-scripts-npm-3.6.0-d967962075.patch
+++ b/.yarn/patches/modular-scripts-npm-3.6.0-d967962075.patch
@@ -31,7 +31,7 @@ index 3173ab0eb0ab508676a4e09c68c6da07f6d54070..60ed60feb3653cf56a1e7890681f187e
   */
  const DEPS_TO_CHECK = [// These are packages most likely to break in practice.
 -'esbuild', 'eslint', 'webpack', 'webpack-dev-server']; // We assume that having wrong versions of these
-+'esbuild', 'webpack-dev-server']; // We assume that having wrong versions of these
++'esbuild']; // We assume that having wrong versions of these
  // in the tree will likely break your setup.
  // This is a relatively low-effort way to find common issues.
 
diff --git a/cypress.config.ts b/cypress.config.ts
index 14256fc75b6..6cc94909fc2 100644
--- a/cypress.config.ts
+++ b/cypress.config.ts
@@ -2,6 +2,7 @@
 import installCoverageTask from "@cypress/code-coverage/task";
 import { defineConfig } from "cypress";
 import { devServer } from "cypress-rspack-dev-server";
+import { merge } from "webpack-merge";
 
 export default defineConfig({
   viewportWidth: 1280,
@@ -25,12 +26,11 @@ export default defineConfig({
       return devServer({
         ...devServerConfig,
         framework: "react",
-        rspackConfig: {
-          ...require("./rspack.config").default,
+        rspackConfig: merge(require("./rspack.config").default, {
           experiments: {
             lazyCompilation: !devServerConfig.cypressConfig.isTextTerminal,
           },
-        },
+        }),
       });
     },
     specPattern: "packages/**/src/**/*.cy.{js,ts,jsx,tsx}",
diff --git a/package.json b/package.json
index eaa8e2e531e..97870abad0c 100644
--- a/package.json
+++ b/package.json
@@ -93,6 +93,7 @@
     "ag-grid-enterprise": "^31.3.0",
     "ag-grid-react": "^31.3.0",
     "axe-core": "^4.9.0",
+    "babel-loader": "^9.1.3",
     "chromatic": "^11.3.2",
     "ci-info": "^3.3.1",
     "clsx": "^2.0.0",
diff --git a/rspack.config.ts b/rspack.config.ts
index f4319bc6994..ab73e57ae00 100644
--- a/rspack.config.ts
+++ b/rspack.config.ts
@@ -1,5 +1,6 @@
 import path from "node:path";
 import { defineConfig } from "@rspack/cli";
+import { version as reactVersion } from "react";
 
 const prod = true;
 
@@ -15,6 +16,10 @@ export default defineConfig({
         test: /\.css$/,
         use: ["style-loader", "css-loader", "postcss-loader"],
       },
+      {
+        test: /packages\/.*\/src\/.*\.[tj]sx?$/,
+        use: ["babel-loader"],
+      },
       {
         test: /\.(j|t)s$/,
         exclude: [/[\\/]node_modules[\\/]/],
@@ -63,6 +68,15 @@ export default defineConfig({
       configFile: path.resolve(__dirname, "./tsconfig.json"),
       references: "auto",
     },
+    alias: {
+      "cypress/react18": reactVersion.startsWith("18")
+        ? "cypress/react18"
+        : "cypress/react",
+      "@storybook/react-dom-shim":
+        reactVersion.startsWith("16") || reactVersion.startsWith("17")
+          ? "@storybook/react-dom-shim/dist/react-16"
+          : "@storybook/react-dom-shim",
+    },
     extensions: ["...", ".ts", ".tsx", ".js", ".jsx", ".css"],
   },
 });
diff --git a/yarn.lock b/yarn.lock
index b1ce0b9faf2..f277a15bc12 100644
--- a/yarn.lock
+++ b/yarn.lock
@@ -5928,6 +5928,7 @@ __metadata:
     ag-grid-enterprise: "npm:^31.3.0"
     ag-grid-react: "npm:^31.3.0"
     axe-core: "npm:^4.9.0"
+    babel-loader: "npm:^9.1.3"
     chromatic: "npm:^11.3.2"
     ci-info: "npm:^3.3.1"
     clsx: "npm:^2.0.0"
@@ -9931,6 +9932,19 @@ __metadata:
   languageName: node
   linkType: hard
 
+"babel-loader@npm:^9.1.3":
+  version: 9.1.3
+  resolution: "babel-loader@npm:9.1.3"
+  dependencies:
+    find-cache-dir: "npm:^4.0.0"
+    schema-utils: "npm:^4.0.0"
+  peerDependencies:
+    "@babel/core": ^7.12.0
+    webpack: ">=5"
+  checksum: 10/7086e678273b5d1261141dca84ed784caab9f7921c8c24d7278c8ee3088235a9a9fd85caac9f0fa687336cb3c27248ca22dbf431469769b1b995d55aec606992
+  languageName: node
+  linkType: hard
+
 "babel-plugin-istanbul@npm:^6.0.0":
   version: 6.1.1
   resolution: "babel-plugin-istanbul@npm:6.1.1"
@@ -11379,6 +11393,13 @@ __metadata:
   languageName: node
   linkType: hard
 
+"common-path-prefix@npm:^3.0.0":
+  version: 3.0.0
+  resolution: "common-path-prefix@npm:3.0.0"
+  checksum: 10/09c180e8d8495d42990d617f4d4b7522b5da20f6b236afe310192d401d1da8147a7835ae1ea37797ba0c2238ef3d06f3492151591451df34539fdb4b2630f2b3
+  languageName: node
+  linkType: hard
+
 "common-tags@npm:^1.8.0":
   version: 1.8.2
   resolution: "common-tags@npm:1.8.2"
@@ -15134,6 +15155,16 @@ __metadata:
   languageName: node
   linkType: hard
 
+"find-cache-dir@npm:^4.0.0":
+  version: 4.0.0
+  resolution: "find-cache-dir@npm:4.0.0"
+  dependencies:
+    common-path-prefix: "npm:^3.0.0"
+    pkg-dir: "npm:^7.0.0"
+  checksum: 10/52a456a80deeb27daa3af6e06059b63bdb9cc4af4d845fc6d6229887e505ba913cd56000349caa60bc3aa59dacdb5b4c37903d4ba34c75102d83cab330b70d2f
+  languageName: node
+  linkType: hard
+
 "find-my-way@npm:^7.7.0":
   version: 7.7.0
   resolution: "find-my-way@npm:7.7.0"
@@ -15155,7 +15186,7 @@ __metadata:
   languageName: node
   linkType: hard
 
-"find-up@npm:6.3.0":
+"find-up@npm:6.3.0, find-up@npm:^6.3.0":
   version: 6.3.0
   resolution: "find-up@npm:6.3.0"
   dependencies:
@@ -21213,7 +21244,7 @@ __metadata:
 
 "modular-scripts@patch:modular-scripts@npm:3.6.0#.yarn/patches/modular-scripts-npm-3.6.0-d967962075.patch::locator=%40salt-ds%2Froot%40workspace%3A.":
   version: 3.6.0
-  resolution: "modular-scripts@patch:modular-scripts@npm%3A3.6.0#.yarn/patches/modular-scripts-npm-3.6.0-d967962075.patch::version=3.6.0&hash=a20b82&locator=%40salt-ds%2Froot%40workspace%3A."
+  resolution: "modular-scripts@patch:modular-scripts@npm%3A3.6.0#.yarn/patches/modular-scripts-npm-3.6.0-d967962075.patch::version=3.6.0&hash=2fcb36&locator=%40salt-ds%2Froot%40workspace%3A."
   dependencies:
     "@babel/code-frame": "npm:7.18.6"
     "@modular-scripts/workspace-resolver": "npm:1.2.0"
@@ -21324,7 +21355,7 @@ __metadata:
     typescript: ^4.3.5
   bin:
     modular: dist-cjs/cli.js
-  checksum: 10/3175f2fe959e4b256092a831352d2c23d6090f8497cf55d1c7aa9c6b88cea068553f201f2cb3800e044c25ad9c1de4134a147cfef63203722f94052a06da3a46
+  checksum: 10/324b341af1a7f6b03bf826e44d90b5ab6f99035b329cd7769e8b2e978a64c35339c294a9e541ac87f5e2f735936dc4e05060a60bd5c8ca323da5e0a704fcef60
   languageName: node
   linkType: hard
 
@@ -23060,6 +23091,15 @@ __metadata:
   languageName: node
   linkType: hard
 
+"pkg-dir@npm:^7.0.0":
+  version: 7.0.0
+  resolution: "pkg-dir@npm:7.0.0"
+  dependencies:
+    find-up: "npm:^6.3.0"
+  checksum: 10/94298b20a446bfbbd66604474de8a0cdd3b8d251225170970f15d9646f633e056c80520dd5b4c1d1050c9fed8f6a9e5054b141c93806439452efe72e57562c03
+  languageName: node
+  linkType: hard
+
 "pkg-types@npm:^1.0.3":
   version: 1.0.3
   resolution: "pkg-types@npm:1.0.3"