merge?

Author: salazarm

.circleci/config.yml

@@ -2,7 +2,7 @@ version: 2.1
 
 aliases:
   - &docker
-    - image: circleci/openjdk:8-jdk-node-browsers
+    - image: cimg/openjdk:17.0.0-node
 
   - &environment
     TZ: /usr/share/zoneinfo/America/Los_Angeles
@@ -209,7 +209,20 @@ jobs:
       - run: yarn workspaces info | head -n -1 > workspace_info.txt
       - *restore_node_modules
       - run: yarn lint-build
-      - run: scripts/circleci/check_minified_errors.sh
+
+  check_error_codes:
+    docker: *docker
+    environment: *environment
+    steps:
+      - checkout
+      - attach_workspace: *attach_workspace
+      - run: yarn workspaces info | head -n -1 > workspace_info.txt
+      - *restore_node_modules
+      - run:
+          name: Search build artifacts for unminified errors
+          command: |
+            yarn extract-errors
+            git diff || (echo "Found unminified errors. Either update the error codes map or disable error minification for the affected build, if appropriate." && false)
 
   yarn_test:
     docker: *docker
@@ -414,6 +427,9 @@ workflows:
       - yarn_lint_build:
           requires:
             - yarn_build_combined
+      - check_error_codes:
+          requires:
+            - yarn_build_combined
       - RELEASE_CHANNEL_stable_yarn_test_dom_fixtures:
           requires:
             - yarn_build_combined

.eslintignore

@@ -22,5 +22,5 @@ packages/react-devtools-inline/dist
 packages/react-devtools-shared/src/hooks/__tests__/__source__/__compiled__/
 packages/react-devtools-shared/src/hooks/__tests__/__source__/__untransformed__/
 packages/react-devtools-shell/dist
-packages/react-devtools-scheduling-profiler/dist
-packages/react-devtools-scheduling-profiler/static
+packages/react-devtools-timeline/dist
+packages/react-devtools-timeline/static

.eslintrc.js

@@ -151,7 +151,7 @@ module.exports = {
         'packages/react-test-renderer/**/*.js',
         'packages/react-debug-tools/**/*.js',
         'packages/react-devtools-extensions/**/*.js',
-        'packages/react-devtools-scheduling-profiler/**/*.js',
+        'packages/react-devtools-timeline/**/*.js',
         'packages/react-native-renderer/**/*.js',
         'packages/eslint-plugin-react-hooks/**/*.js',
         'packages/jest-react/**/*.js',

.gitignore

@@ -35,4 +35,4 @@ packages/react-devtools-extensions/shared/build
 packages/react-devtools-extensions/.tempUserDataDir
 packages/react-devtools-inline/dist
 packages/react-devtools-shell/dist
-packages/react-devtools-scheduling-profiler/dist
+packages/react-devtools-timeline/dist

.prettierignore

@@ -7,5 +7,5 @@ packages/react-devtools-inline/dist
 packages/react-devtools-shared/src/hooks/__tests__/__source__/__compiled__/
 packages/react-devtools-shared/src/hooks/__tests__/__source__/__untransformed__/
 packages/react-devtools-shell/dist
-packages/react-devtools-scheduling-profiler/dist
-packages/react-devtools-scheduling-profiler/static
+packages/react-devtools-timeline/dist
+packages/react-devtools-timeline/static

ReactVersions.js

@@ -36,6 +36,7 @@ const stablePackages = {
   'react-refresh': '0.11.0',
   'react-test-renderer': ReactVersion,
   'use-subscription': '1.6.0',
+  'use-sync-external-store': '1.0.0',
   scheduler: '0.21.0',
 };
 
@@ -47,7 +48,6 @@ const experimentalPackages = [
   'react-fs',
   'react-pg',
   'react-server-dom-webpack',
-  'use-sync-external-store',
 ];
 
 module.exports = {

package.json

@@ -114,7 +114,7 @@
     "linc": "node ./scripts/tasks/linc.js",
     "lint": "node ./scripts/tasks/eslint.js",
     "lint-build": "node ./scripts/rollup/validate/index.js",
-    "extract-errors": "yarn build --type=dev --extract-errors",
+    "extract-errors": "node scripts/error-codes/extract-errors.js",
     "postinstall": "node node_modules/fbjs-scripts/node/check-dev-engines.js package.json && node ./scripts/flow/createFlowConfigs.js && node ./scripts/yarn/downloadReactIsForPrettyFormat.js",
     "debug-test": "yarn test --deprecated 'yarn test --debug'",
     "test": "node ./scripts/jest/jest-cli.js",

packages/react-art/src/ReactARTHostConfig.js

@@ -436,24 +436,6 @@ export function getInstanceFromNode(node) {
   throw new Error('Not implemented.');
 }
 
-export function isOpaqueHydratingObject(value: mixed): boolean {
-  throw new Error('Not implemented.');
-}
-
-export function makeOpaqueHydratingObject(
-  attemptToReadValue: () => void,
-): OpaqueIDType {
-  throw new Error('Not implemented.');
-}
-
-export function makeClientId(): OpaqueIDType {
-  throw new Error('Not implemented.');
-}
-
-export function makeClientIdInDEV(warnOnAccessInDEV: () => void): OpaqueIDType {
-  throw new Error('Not implemented.');
-}
-
 export function beforeActiveInstanceBlur(internalInstanceHandle: Object) {
   // noop
 }

packages/react-debug-tools/src/ReactDebugHooks.js

@@ -18,13 +18,9 @@ import type {
   Fiber,
   Dispatcher as DispatcherType,
 } from 'react-reconciler/src/ReactInternalTypes';
-import type {OpaqueIDType} from 'react-reconciler/src/ReactFiberHostConfig';
-
-import {NoMode} from 'react-reconciler/src/ReactTypeOfMode';
 
 import ErrorStackParser from 'error-stack-parser';
 import ReactSharedInternals from 'shared/ReactSharedInternals';
-import {REACT_OPAQUE_ID_TYPE} from 'shared/ReactSymbols';
 import {
   FunctionComponent,
   SimpleMemoComponent,
@@ -53,8 +49,6 @@ type Dispatch<A> = A => void;
 
 let primitiveStackCache: null | Map<string, Array<any>> = null;
 
-let currentFiber: Fiber | null = null;
-
 type Hook = {
   memoizedState: any,
   next: Hook | null,
@@ -324,21 +318,15 @@ function useDeferredValue<T>(value: T): T {
   return value;
 }
 
-function useOpaqueIdentifier(): OpaqueIDType | void {
-  const hook = nextHook(); // State
-  if (currentFiber && currentFiber.mode === NoMode) {
-    nextHook(); // Effect
-  }
-  let value = hook === null ? undefined : hook.memoizedState;
-  if (value && value.$$typeof === REACT_OPAQUE_ID_TYPE) {
-    value = undefined;
-  }
+function useId(): string {
+  const hook = nextHook();
+  const id = hook !== null ? hook.memoizedState : '';
   hookLog.push({
-    primitive: 'OpaqueIdentifier',
+    primitive: 'Id',
     stackError: new Error(),
-    value,
+    value: id,
   });
-  return value;
+  return id;
 }
 
 const Dispatcher: DispatcherType = {
@@ -360,7 +348,7 @@ const Dispatcher: DispatcherType = {
   useMutableSource,
   useSyncExternalStore,
   useDeferredValue,
-  useOpaqueIdentifier,
+  useId,
 };
 
 // Inspect
@@ -755,8 +743,6 @@ export function inspectHooksOfFiber(
     currentDispatcher = ReactSharedInternals.ReactCurrentDispatcher;
   }
 
-  currentFiber = fiber;
-
   if (
     fiber.tag !== FunctionComponent &&
     fiber.tag !== SimpleMemoComponent &&

packages/react-debug-tools/src/__tests__/ReactHooksInspectionIntegration-test.js

@@ -598,10 +598,10 @@ describe('ReactHooksInspectionIntegration', () => {
     ]);
   });
 
-  it('should support composite useOpaqueIdentifier hook', () => {
+  it('should support useId hook', () => {
     function Foo(props) {
-      const id = React.unstable_useOpaqueIdentifier();
-      const [state] = React.useState(() => 'hello', []);
+      const id = React.useId();
+      const [state] = React.useState('hello');
       return <div id={id}>{state}</div>;
     }
 
@@ -613,39 +613,8 @@ describe('ReactHooksInspectionIntegration', () => {
 
     expect(tree[0].id).toEqual(0);
     expect(tree[0].isStateEditable).toEqual(false);
-    expect(tree[0].name).toEqual('OpaqueIdentifier');
-    expect(String(tree[0].value).startsWith('c_')).toBe(true);
-
-    expect(tree[1]).toEqual({
-      id: 1,
-      isStateEditable: true,
-      name: 'State',
-      value: 'hello',
-      subHooks: [],
-    });
-  });
-
-  it('should support composite useOpaqueIdentifier hook in concurrent mode', () => {
-    function Foo(props) {
-      const id = React.unstable_useOpaqueIdentifier();
-      const [state] = React.useState(() => 'hello', []);
-      return <div id={id}>{state}</div>;
-    }
-
-    const renderer = ReactTestRenderer.create(<Foo />, {
-      unstable_isConcurrent: true,
-    });
-    expect(Scheduler).toFlushWithoutYielding();
-
-    const childFiber = renderer.root.findByType(Foo)._currentFiber();
-    const tree = ReactDebugTools.inspectHooksOfFiber(childFiber);
-
-    expect(tree.length).toEqual(2);
-
-    expect(tree[0].id).toEqual(0);
-    expect(tree[0].isStateEditable).toEqual(false);
-    expect(tree[0].name).toEqual('OpaqueIdentifier');
-    expect(String(tree[0].value).startsWith('c_')).toBe(true);
+    expect(tree[0].name).toEqual('Id');
+    expect(String(tree[0].value).startsWith('r:')).toBe(true);
 
     expect(tree[1]).toEqual({
       id: 1,
@@ -1018,6 +987,7 @@ describe('ReactHooksInspectionIntegration', () => {
     ]);
   });
 
+  // @gate enableUseMutableSource
   it('should support composite useMutableSource hook', () => {
     const createMutableSource =
       React.createMutableSource || React.unstable_createMutableSource;
@@ -1055,9 +1025,8 @@ describe('ReactHooksInspectionIntegration', () => {
     ]);
   });
 
-  // @gate experimental || www
   it('should support composite useSyncExternalStore hook', () => {
-    const useSyncExternalStore = React.unstable_useSyncExternalStore;
+    const useSyncExternalStore = React.useSyncExternalStore;
     function Foo() {
       const value = useSyncExternalStore(
         () => () => {},