From 480c85174276ad5560551692b7c12a1fdc72a8b9 Mon Sep 17 00:00:00 2001
From: ai-jz <jingqiao@gmail.com>
Date: Tue, 2 Dec 2025 21:56:48 -0800
Subject: [PATCH] Use outlined workers for DevTools extensions and update CI
 artifacts path

---
 .github/workflows/devtools_regression_tests.yml            | 4 ++--
 .gitignore                                                 | 1 +
 packages/react-devtools-core/webpack.standalone.js         | 3 +++
 packages/react-devtools-extensions/src/main/index.js       | 6 ++----
 packages/react-devtools-extensions/webpack.config.js       | 2 +-
 packages/react-devtools-fusebox/webpack.config.frontend.js | 3 +++
 packages/react-devtools-inline/webpack.config.js           | 3 +++
 scripts/ci/run_devtools_e2e_tests.js                       | 2 +-
 8 files changed, 16 insertions(+), 8 deletions(-)

diff --git a/.github/workflows/devtools_regression_tests.yml b/.github/workflows/devtools_regression_tests.yml
index 13b37f1743b..eea0d2d6249 100644
--- a/.github/workflows/devtools_regression_tests.yml
+++ b/.github/workflows/devtools_regression_tests.yml
@@ -200,6 +200,6 @@ jobs:
         run: rm -r ./build-regression
       - uses: actions/upload-artifact@v4
         with:
-          name: screenshots
-          path: ./tmp/screenshots
+          name: playwright-artifacts
+          path: ./tmp/playwright-artifacts
           if-no-files-found: warn
diff --git a/.gitignore b/.gitignore
index 6432df4f054..6fe3ab84a8c 100644
--- a/.gitignore
+++ b/.gitignore
@@ -38,3 +38,4 @@ packages/react-devtools-inline/dist
 packages/react-devtools-shell/dist
 packages/react-devtools-timeline/dist
 
+tmp/
diff --git a/packages/react-devtools-core/webpack.standalone.js b/packages/react-devtools-core/webpack.standalone.js
index 6a9636c6911..eade5934212 100644
--- a/packages/react-devtools-core/webpack.standalone.js
+++ b/packages/react-devtools-core/webpack.standalone.js
@@ -106,6 +106,9 @@ module.exports = {
         test: /\.worker\.js$/,
         use: [
           {
+          // NOTE: Keep inline: true for standalone builds.
+          // Only extension builds use outlined workers (inline: false)
+          // because they have a known public path.
             loader: 'workerize-loader',
             options: {
               inline: true,
diff --git a/packages/react-devtools-extensions/src/main/index.js b/packages/react-devtools-extensions/src/main/index.js
index 362793e3eb4..36a93dc4763 100644
--- a/packages/react-devtools-extensions/src/main/index.js
+++ b/packages/react-devtools-extensions/src/main/index.js
@@ -39,6 +39,7 @@ import registerEventsLogger from './registerEventsLogger';
 import getProfilingFlags from './getProfilingFlags';
 import debounce from './debounce';
 import './requestAnimationFramePolyfill';
+import * as ParseHookNames from 'react-devtools-shared/src/hooks/parseHookNames';
 
 function createBridge() {
   bridge = new Bridge({
@@ -189,10 +190,7 @@ function createBridgeAndStore() {
   };
 
   // TODO (Webpack 5) Hopefully we can remove this prop after the Webpack 5 migration.
-  const hookNamesModuleLoaderFunction = () =>
-    import(
-      /* webpackChunkName: 'parseHookNames' */ 'react-devtools-shared/src/hooks/parseHookNames'
-    );
+  const hookNamesModuleLoaderFunction = () => Promise.resolve(ParseHookNames);
 
   root = createRoot(document.createElement('div'));
 
diff --git a/packages/react-devtools-extensions/webpack.config.js b/packages/react-devtools-extensions/webpack.config.js
index 5c03d85dd93..4592363c64a 100644
--- a/packages/react-devtools-extensions/webpack.config.js
+++ b/packages/react-devtools-extensions/webpack.config.js
@@ -261,7 +261,7 @@ module.exports = {
           {
             loader: 'workerize-loader',
             options: {
-              inline: true,
+              inline: false,
               name: '[name]',
             },
           },
diff --git a/packages/react-devtools-fusebox/webpack.config.frontend.js b/packages/react-devtools-fusebox/webpack.config.frontend.js
index 1266d3d8289..a71be92e103 100644
--- a/packages/react-devtools-fusebox/webpack.config.frontend.js
+++ b/packages/react-devtools-fusebox/webpack.config.frontend.js
@@ -99,6 +99,9 @@ module.exports = {
         test: /\.worker\.js$/,
         use: [
           {
+          // NOTE: Keep inline: true for Fusebox builds.
+          // Only extension builds use outlined workers (inline: false)
+          // because they have a known public path.
             loader: 'workerize-loader',
             options: {
               inline: true,
diff --git a/packages/react-devtools-inline/webpack.config.js b/packages/react-devtools-inline/webpack.config.js
index 358a18f0e7d..d7b8e82a632 100644
--- a/packages/react-devtools-inline/webpack.config.js
+++ b/packages/react-devtools-inline/webpack.config.js
@@ -91,6 +91,9 @@ module.exports = {
         test: /\.worker\.js$/,
         use: [
           {
+          // NOTE: Keep inline: true for inline builds.
+          // Only extension builds use outlined workers (inline: false)
+          // because they have a known public path.
             loader: 'workerize-loader',
             options: {
               inline: true,
diff --git a/scripts/ci/run_devtools_e2e_tests.js b/scripts/ci/run_devtools_e2e_tests.js
index 0d54e710b4d..170e1cf698f 100755
--- a/scripts/ci/run_devtools_e2e_tests.js
+++ b/scripts/ci/run_devtools_e2e_tests.js
@@ -9,7 +9,7 @@ const ROOT_PATH = join(__dirname, '..', '..');
 const reactVersion = process.argv[2];
 const inlinePackagePath = join(ROOT_PATH, 'packages', 'react-devtools-inline');
 const shellPackagePath = join(ROOT_PATH, 'packages', 'react-devtools-shell');
-const screenshotPath = join(ROOT_PATH, 'tmp', 'screenshots');
+const screenshotPath = join(ROOT_PATH, 'tmp', 'playwright-artifacts');
 
 const {SUCCESSFUL_COMPILATION_MESSAGE} = require(
   join(shellPackagePath, 'constants.js')