[Fizz] Run console.createTask during SSR when available (#30142)

Same as #30140 but for Fizz. This is rarely used but it does allow seeing component stacks when inspecting the Node.js server running Fizz using `--inspect` and the Chrome DevTools. <img width="504" alt="Screenshot 2024-06-29 at 4 08 22 PM" src="https://github.com/facebook/react/assets/63648/f89bdf89-2598-42b4-8623-3b87f03326c4">
facebook · Jul 1, 2024 · e6783e7 · e6783e7
1 parent d40ea87
commit e6783e7
Show file tree

Hide file tree

Showing 2 changed files with 41 additions and 2 deletions.
diff --git a/fixtures/flight/package.json b/fixtures/flight/package.json
@@ -70,8 +70,8 @@
     "predev": "cp -r ../../build/oss-experimental/* ./node_modules/",
     "prebuild": "cp -r ../../build/oss-experimental/* ./node_modules/",
     "dev": "concurrently \"npm run dev:region\" \"npm run dev:global\"",
-    "dev:global": "NODE_ENV=development BUILD_PATH=dist node --experimental-loader ./loader/global.js server/global",
-    "dev:region": "NODE_ENV=development BUILD_PATH=dist nodemon --watch src --watch dist -- --enable-source-maps --experimental-loader ./loader/region.js --conditions=react-server --inspect server/region",
+    "dev:global": "NODE_ENV=development BUILD_PATH=dist node --experimental-loader ./loader/global.js --inspect=127.0.0.1:9230 server/global",
+    "dev:region": "NODE_ENV=development BUILD_PATH=dist nodemon --watch src --watch dist -- --enable-source-maps --experimental-loader ./loader/region.js --conditions=react-server --inspect=127.0.0.1:9229 server/region",
     "start": "node scripts/build.js && concurrently \"npm run start:region\" \"npm run start:global\"",
     "start:global": "NODE_ENV=production node --experimental-loader ./loader/global.js server/global",
     "start:region": "NODE_ENV=production node --experimental-loader ./loader/region.js --conditions=react-server server/region",

diff --git a/packages/react-server/src/ReactFizzServer.js b/packages/react-server/src/ReactFizzServer.js
@@ -150,6 +150,7 @@ import {
   disableDefaultPropsExceptForClasses,
   enableAsyncIterableChildren,
   disableStringRefs,
+  enableOwnerStacks,
 } from 'shared/ReactFeatureFlags';
 
 import assign from 'shared/assign';
@@ -2372,6 +2373,27 @@ function renderNodeDestructive(
           key == null ? (childIndex === -1 ? 0 : childIndex) : key;
         const keyPath = [task.keyPath, name, keyOrIndex];
         if (task.replay !== null) {
+          if (__DEV__ && enableOwnerStacks) {
+            const debugTask: null | ConsoleTask = element._debugTask;
+            if (debugTask) {
+              debugTask.run(
+                replayElement.bind(
+                  null,
+                  request,
+                  task,
+                  keyPath,
+                  name,
+                  keyOrIndex,
+                  childIndex,
+                  type,
+                  props,
+                  ref,
+                  task.replay,
+                ),
+              );
+              return;
+            }
+          }
           replayElement(
             request,
             task,
@@ -2388,6 +2410,23 @@ function renderNodeDestructive(
           // prelude and skip it during the replay.
         } else {
           // We're doing a plain render.
+          if (__DEV__ && enableOwnerStacks) {
+            const debugTask: null | ConsoleTask = element._debugTask;
+            if (debugTask) {
+              debugTask.run(
+                renderElement.bind(
+                  null,
+                  request,
+                  task,
+                  keyPath,
+                  type,
+                  props,
+                  ref,
+                ),
+              );
+              return;
+            }
+          }
           renderElement(request, task, keyPath, type, props, ref);
         }
         return;