Modify React DevTools for Replay integration

.circleci/config.yml

@@ -2,7 +2,7 @@ version: 2.1
 
 aliases:
   - &docker
-    - image: cimg/openjdk:18.0-node
+    - image: cimg/node:18.20.1-browsers
 
   - &environment
     TZ: /usr/share/zoneinfo/America/Los_Angeles
@@ -53,6 +53,9 @@ commands:
             if [ $? -ne 0 ]; then
               yarn install --frozen-lockfile --cache-folder ~/.cache/yarn
             fi
+          environment:
+          # If we start needing the Electron binary, please ensure the binary is cached in CI following https://www.electronjs.org/docs/latest/tutorial/installation
+            ELECTRON_SKIP_BINARY_DOWNLOAD: 1
       - save_cache:
           name: Save yarn cache
           key: v2-yarn_cache-{{ arch }}-{{ checksum "yarn.lock" }}
@@ -81,7 +84,6 @@ jobs:
       - run: node ./scripts/prettier/index
       - run: node ./scripts/tasks/eslint
       - run: ./scripts/circleci/check_license.sh
-      - run: ./scripts/circleci/check_modules.sh
       - run: ./scripts/circleci/test_print_warnings.sh
 
   yarn_flow:
@@ -94,6 +96,16 @@ jobs:
       - setup_node_modules
       - run: node ./scripts/tasks/flow-ci
 
+
+  yarn_flags:
+    docker: *docker
+    environment: *environment
+
+    steps:
+      - checkout
+      - setup_node_modules
+      - run: yarn flags
+
   scrape_warning_messages:
     docker: *docker
     environment: *environment
@@ -103,8 +115,8 @@ jobs:
       - setup_node_modules
       - run:
           command: |
-            mkdir -p ./build
-            node ./scripts/print-warnings/print-warnings.js > build/WARNINGS
+            mkdir -p ./build/__test_utils__
+            node ./scripts/print-warnings/print-warnings.js > build/__test_utils__/ReactAllWarnings.js
       - persist_to_workspace:
           root: .
           paths:
@@ -199,6 +211,8 @@ jobs:
       - setup_node_modules
       - run:
           command: node ./scripts/tasks/danger
+      - store_artifacts:
+          path: sizebot-message.md
 
   build_devtools_and_process_artifacts:
     docker: *docker
@@ -214,6 +228,13 @@ jobs:
           command: ./scripts/circleci/pack_and_store_devtools_artifacts.sh
       - store_artifacts:
           path: ./build/devtools.tgz
+      # Simplifies getting the extension for local testing
+      - store_artifacts:
+          path: ./build/devtools/chrome-extension.zip
+          destination: react-devtools-chrome-extension.zip
+      - store_artifacts:
+          path: ./build/devtools/firefox-extension.zip
+          destination: react-devtools-firefox-extension.zip
 
   run_devtools_e2e_tests:
     docker: *docker
@@ -233,6 +254,52 @@ jobs:
             RELEASE_CHANNEL: experimental
           command: ./scripts/circleci/run_devtools_e2e_tests.js
 
+  run_fixtures_flight_tests:
+    docker: *docker
+    environment: *environment
+    steps:
+      - checkout
+      - attach_workspace:
+          at: .
+      # Fixture copies some built packages from the workroot after install.
+      # That means dependencies of the built packages are not installed.
+      # We need to install dependencies of the workroot to fulfill all dependency constraints
+      - setup_node_modules
+      - restore_cache:
+          name: Restore yarn cache of fixture
+          keys:
+            - v2-yarn_cache_fixtures_flight-{{ arch }}-{{ checksum "yarn.lock" }}
+      - run:
+          name: Install fixture dependencies
+          working_directory: fixtures/flight
+          command: |
+            yarn install --frozen-lockfile --cache-folder ~/.cache/yarn
+            if [ $? -ne 0 ]; then
+              yarn install --frozen-lockfile --cache-folder ~/.cache/yarn
+            fi
+      - save_cache:
+          name: Save yarn cache of fixture
+          key: v2-yarn_cache_fixtures_flight-{{ arch }}-{{ checksum "yarn.lock" }}
+          paths:
+            - ~/.cache/yarn
+      - run:
+          working_directory: fixtures/flight
+          name: Playwright install deps
+          command: |
+            npx playwright install
+            sudo npx playwright install-deps
+      - run:
+          name: Run tests
+          working_directory: fixtures/flight
+          command: yarn test
+          environment:
+          # Otherwise the webserver is a blackbox
+            DEBUG: pw:webserver
+      - store_artifacts:
+          path: fixtures/flight/playwright-report
+      - store_artifacts:
+          path: fixtures/flight/test-results
+
   run_devtools_tests_for_versions:
     docker: *docker
     environment: *environment
@@ -370,18 +437,6 @@ jobs:
             yarn predev
             yarn test --maxWorkers=2
 
-  test_fuzz:
-    docker: *docker
-    environment: *environment
-    steps:
-      - checkout
-      - setup_node_modules
-      - run:
-          name: Run fuzz tests
-          command: |
-            FUZZ_TEST_SEED=$RANDOM yarn test fuzz --ci
-            FUZZ_TEST_SEED=$RANDOM yarn test --prod fuzz --ci
-
   publish_prerelease:
     parameters:
       commit_sha:
@@ -409,6 +464,11 @@ workflows:
   build_and_test:
     unless: << pipeline.parameters.prerelease_commit_sha >>
     jobs:
+      - yarn_flags:
+          filters:
+            branches:
+              ignore:
+                - builds/facebook-www
       - yarn_flow:
           filters:
             branches:
@@ -447,6 +507,10 @@ workflows:
                 - "-r=www-modern --env=production --variant=false"
                 - "-r=www-modern --env=development --variant=true"
                 - "-r=www-modern --env=production --variant=true"
+                - "-r=xplat --env=development --variant=false"
+                - "-r=xplat --env=development --variant=true"
+                - "-r=xplat --env=production --variant=false"
+                - "-r=xplat --env=production --variant=true"
 
                 # TODO: Test more persistent configurations?
                 - '-r=stable --env=development --persistent'
@@ -492,6 +556,12 @@ workflows:
                 # - "-r=www-modern --env=development --variant=true"
                 # - "-r=www-modern --env=production --variant=true"
 
+                # TODO: Update test config to support xplat build tests
+                # - "-r=xplat --env=development --variant=false"
+                # - "-r=xplat --env=development --variant=true"
+                # - "-r=xplat --env=production --variant=false"
+                # - "-r=xplat --env=production --variant=true"
+
                 # TODO: Test more persistent configurations?
       - download_base_build_for_sizebot:
           filters:
@@ -525,19 +595,9 @@ workflows:
       - run_devtools_e2e_tests:
           requires:
             - build_devtools_and_process_artifacts
-
-  fuzz_tests:
-    unless: << pipeline.parameters.prerelease_commit_sha >>
-    triggers:
-      - schedule:
-          # Fuzz tests run hourly
-          cron: "0 * * * *"
-          filters:
-            branches:
-              only:
-                - main
-    jobs:
-      - test_fuzz
+      - run_fixtures_flight_tests:
+          requires:
+            - yarn_build
 
   devtools_regression_tests:
     unless: << pipeline.parameters.prerelease_commit_sha >>
@@ -596,7 +656,7 @@ workflows:
           # because this used to be called the "next" channel and some
           # downstream consumers might still expect that tag. We can remove this
           # after some time has elapsed and the change has been communicated.
-          dist_tag: "canary,next"
+          dist_tag: "canary,next,rc"
       - publish_prerelease:
           name: Publish to Experimental channel
           requires:
@@ -625,7 +685,7 @@ workflows:
           name: Publish to Canary channel
           commit_sha: << pipeline.git.revision >>
           release_channel: stable
-          dist_tag: "canary,next"
+          dist_tag: "canary,next,rc"
       - publish_prerelease:
           name: Publish to Experimental channel
           requires:

.eslintignore

@@ -13,11 +13,15 @@ scripts/bench/benchmarks/**/*.js
 # React repository clone
 scripts/bench/remote-repo/
 
+# Compiler uses its own lint setup
+compiler/
+
 packages/react-devtools-core/dist
 packages/react-devtools-extensions/chrome/build
 packages/react-devtools-extensions/firefox/build
 packages/react-devtools-extensions/shared/build
 packages/react-devtools-extensions/src/ErrorTesterCompiled.js
+packages/react-devtools-fusebox/dist
 packages/react-devtools-inline/dist
 packages/react-devtools-shared/src/hooks/__tests__/__source__/__compiled__/
 packages/react-devtools-shared/src/hooks/__tests__/__source__/__untransformed__/

.eslintrc.js

@@ -326,6 +326,8 @@ module.exports = {
         'packages/react-refresh/**/*.js',
         'packages/react-server-dom-esm/**/*.js',
         'packages/react-server-dom-webpack/**/*.js',
+        'packages/react-server-dom-turbopack/**/*.js',
+        'packages/react-server-dom-fb/**/*.js',
         'packages/react-test-renderer/**/*.js',
         'packages/react-debug-tools/**/*.js',
         'packages/react-devtools-extensions/**/*.js',
@@ -379,6 +381,13 @@ module.exports = {
         'jest/valid-expect-in-promise': ERROR,
       },
     },
+    {
+      // disable no focused tests for test setup helper files even if they are inside __tests__ directory
+      files: ['**/setupTests.js'],
+      rules: {
+        'jest/no-focused-tests': OFF,
+      },
+    },
     {
       files: [
         '**/__tests__/**/*.js',
@@ -415,11 +424,10 @@ module.exports = {
       },
     },
     {
-      files: [
-        'packages/react-native-renderer/**/*.js',
-      ],
+      files: ['packages/react-native-renderer/**/*.js'],
       globals: {
         nativeFabricUIManager: 'readonly',
+        RN$enableMicrotasksInReact: 'readonly',
       },
     },
     {
@@ -429,12 +437,34 @@ module.exports = {
         __webpack_require__: 'readonly',
       },
     },
+    {
+      files: ['packages/react-server-dom-turbopack/**/*.js'],
+      globals: {
+        __turbopack_load__: 'readonly',
+        __turbopack_require__: 'readonly',
+      },
+    },
     {
       files: ['packages/scheduler/**/*.js'],
       globals: {
         TaskController: 'readonly',
       },
     },
+    {
+      files: ['packages/react-devtools-extensions/**/*.js'],
+      globals: {
+        __IS_CHROME__: 'readonly',
+        __IS_FIREFOX__: 'readonly',
+        __IS_EDGE__: 'readonly',
+        __IS_INTERNAL_VERSION__: 'readonly',
+      },
+    },
+    {
+      files: ['packages/react-devtools-shared/**/*.js'],
+      globals: {
+        __IS_INTERNAL_VERSION__: 'readonly',
+      },
+    },
   ],
 
   env: {
@@ -456,6 +486,7 @@ module.exports = {
     $ReadOnlyArray: 'readonly',
     $ArrayBufferView: 'readonly',
     $Shape: 'readonly',
+    ConsoleTask: 'readonly', // TOOD: Figure out what the official name of this will be.
     ReturnType: 'readonly',
     AnimationFrameID: 'readonly',
     // For Flow type annotation. Only `BigInt` is valid at runtime.
@@ -469,7 +500,12 @@ module.exports = {
     DOMHighResTimeStamp: 'readonly',
     EventListener: 'readonly',
     Iterable: 'readonly',
+    AsyncIterable: 'readonly',
+    $AsyncIterable: 'readonly',
+    $AsyncIterator: 'readonly',
     Iterator: 'readonly',
+    AsyncIterator: 'readonly',
+    IteratorResult: 'readonly',
     JSONValue: 'readonly',
     JSResourceReference: 'readonly',
     MouseEventHandler: 'readonly',
@@ -489,8 +525,8 @@ module.exports = {
     React$Node: 'readonly',
     React$Portal: 'readonly',
     React$Ref: 'readonly',
-    React$StatelessFunctionalComponent: 'readonly',
     ReadableStreamController: 'readonly',
+    ReadableStreamReader: 'readonly',
     RequestInfo: 'readonly',
     RequestOptions: 'readonly',
     StoreAsGlobal: 'readonly',
@@ -500,6 +536,7 @@ module.exports = {
     Thenable: 'readonly',
     TimeoutID: 'readonly',
     WheelEventHandler: 'readonly',
+    FinalizationRegistry: 'readonly',
 
     spyOnDev: 'readonly',
     spyOnDevAndProd: 'readonly',
@@ -509,12 +546,13 @@ module.exports = {
     __EXTENSION__: 'readonly',
     __PROFILE__: 'readonly',
     __TEST__: 'readonly',
-    __UMD__: 'readonly',
     __VARIANT__: 'readonly',
+    __unmockReact: 'readonly',
     gate: 'readonly',
     trustedTypes: 'readonly',
     IS_REACT_ACT_ENVIRONMENT: 'readonly',
     AsyncLocalStorage: 'readonly',
+    async_hooks: 'readonly',
     globalThis: 'readonly',
   },
 };

.git-blame-ignore-revs

@@ -0,0 +1 @@
+c998bb1ed4b3285398c9c7797135d3f060243c6a

.github/ISSUE_TEMPLATE/19.md

@@ -0,0 +1,18 @@
+---
+name: "⚛React 19 beta issue"
+about: Report a issue with React 19 beta.
+title: '[React 19]'
+labels: 'React 19'
+
+---
+
+
+## Summary
+
+<!--
+  Please provide a CodeSandbox (https://codesandbox.io/s/new), a link to a
+  repository on GitHub, or provide a minimal code example that reproduces the
+  problem. You may provide a screenshot of the application if you think it is
+  relevant to your bug report. Here are some tips for providing a minimal
+  example: https://stackoverflow.com/help/mcve.
+-->