Merge branch 'main' into create-factory

.circleci/config.yml

@@ -107,8 +107,7 @@ jobs:
       - run:
           command: |
             mkdir -p ./build/__test_utils__
-            node ./scripts/print-warnings/print-warnings.js > build/WARNINGS
-            node ./scripts/print-warnings/print-warnings.js --js > build/__test_utils__/ReactAllWarnings.js
+            node ./scripts/print-warnings/print-warnings.js > build/__test_utils__/ReactAllWarnings.js
       - persist_to_workspace:
           root: .
           paths:

.github/workflows/commit_artifacts.yml

@@ -119,25 +119,24 @@ jobs:
             build/oss-experimental/react-refresh/cjs/react-refresh-babel.development.js
       - name: Move relevant files for React in www into compiled
         run: |
-          mkdir -p ./compiled
-          mkdir -p ./compiled/facebook-www
-          mkdir -p ./compiled/babel-plugin-react-refresh
-
-          # Copy the facebook-www folder into compiled
+          # Move the facebook-www folder into compiled
+          mkdir ./compiled
           mv build/facebook-www ./compiled
 
-          # Copy WARNINGS to facebook-www
-          mv build/WARNINGS ./compiled/facebook-www/WARNINGS
+          # Move ReactAllWarnings.js to facebook-www
+          mkdir ./compiled/facebook-www/__test_utils__
+          mv build/__test_utils__/ReactAllWarnings.js ./compiled/facebook-www/__test_utils__/ReactAllWarnings.js
 
-          # Copy eslint-plugin-react-hooks into facebook-www
+          # Move eslint-plugin-react-hooks into facebook-www
           mv build/oss-experimental/eslint-plugin-react-hooks/cjs/eslint-plugin-react-hooks.development.js \
             ./compiled/facebook-www/eslint-plugin-react-hooks.js
 
-          # Copy unstable_server-external-runtime.js into facebook-www
+          # Move unstable_server-external-runtime.js into facebook-www
           mv build/oss-stable/react-dom/unstable_server-external-runtime.js \
             ./compiled/facebook-www/unstable_server-external-runtime.js
 
-          # Copy react-refresh-babel.development.js into babel-plugin-react-refresh
+          # Move react-refresh-babel.development.js into babel-plugin-react-refresh
+          mkdir ./compiled/babel-plugin-react-refresh
           mv build/oss-experimental/react-refresh/cjs/react-refresh-babel.development.js \
             ./compiled/babel-plugin-react-refresh/index.js
 

fixtures/dom/src/__tests__/nested-act-test.js

@@ -20,7 +20,7 @@ describe('unmocked scheduler', () => {
   beforeEach(() => {
     jest.resetModules();
     React = require('react');
-    DOMAct = require('react-dom/test-utils').act;
+    DOMAct = React.unstable_act;
     TestRenderer = require('react-test-renderer');
     TestAct = TestRenderer.act;
   });
@@ -61,7 +61,7 @@ describe('mocked scheduler', () => {
       require.requireActual('scheduler/unstable_mock')
     );
     React = require('react');
-    DOMAct = require('react-dom/test-utils').act;
+    DOMAct = React.unstable_act;
     TestRenderer = require('react-test-renderer');
     TestAct = TestRenderer.act;
   });

packages/react-cache/src/__tests__/ReactCacheOld-test.internal.js

@@ -121,7 +121,7 @@ describe('ReactCache', () => {
     }
 
     ReactTestRenderer.create(<App />, {
-      unstable_isConcurrent: true,
+      isConcurrent: true,
     });
 
     await waitForAll(['Suspend! [Hi]', 'Loading...']);
@@ -141,7 +141,7 @@ describe('ReactCache', () => {
     }
 
     const root = ReactTestRenderer.create(<App />, {
-      unstable_isConcurrent: true,
+      isConcurrent: true,
     });
 
     await waitForAll(['Suspend! [Hi]', 'Loading...']);
@@ -181,7 +181,7 @@ describe('ReactCache', () => {
         <App />
       </Suspense>,
       {
-        unstable_isConcurrent: true,
+        isConcurrent: true,
       },
     );
 
@@ -210,7 +210,7 @@ describe('ReactCache', () => {
         <AsyncText ms={100} text={3} />
       </Suspense>,
       {
-        unstable_isConcurrent: true,
+        isConcurrent: true,
       },
     );
     await waitForAll(['Suspend! [1]', 'Loading...']);
@@ -298,7 +298,7 @@ describe('ReactCache', () => {
         <App />
       </Suspense>,
       {
-        unstable_isConcurrent: true,
+        isConcurrent: true,
       },
     );
 
@@ -356,7 +356,7 @@ describe('ReactCache', () => {
         <BadAsyncText text="Hi" />
       </Suspense>,
       {
-        unstable_isConcurrent: true,
+        isConcurrent: true,
       },
     );
 
@@ -372,7 +372,7 @@ describe('ReactCache', () => {
         <BadAsyncText text="Hi" />
       </Suspense>,
       {
-        unstable_isConcurrent: true,
+        isConcurrent: true,
       },
     );
 

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

@@ -254,7 +254,7 @@ describe('React hooks DevTools integration', () => {
             <MyComponent />
           </React.Suspense>
         </div>,
-        {unstable_isConcurrent: true},
+        {isConcurrent: true},
       ),
     );
 

packages/react-devtools-shared/src/__tests__/inspectedElement-test.js

@@ -75,7 +75,7 @@ describe('InspectedElement', () => {
     // Used by inspectElementAtIndex() helper function
     utils.act(() => {
       testRendererInstance = TestRenderer.create(null, {
-        unstable_isConcurrent: true,
+        isConcurrent: true,
       });
     });
 
@@ -307,7 +307,7 @@ describe('InspectedElement', () => {
         ['An update to %s inside a test was not wrapped in act'],
         () => {
           testRendererInstance = TestRenderer.create(null, {
-            unstable_isConcurrent: true,
+            isConcurrent: true,
           });
         },
       );
@@ -469,7 +469,7 @@ describe('InspectedElement', () => {
       ['An update to %s inside a test was not wrapped in act'],
       () => {
         testRendererInstance = TestRenderer.create(null, {
-          unstable_isConcurrent: true,
+          isConcurrent: true,
         });
       },
     );
@@ -2034,7 +2034,7 @@ describe('InspectedElement', () => {
       ['An update to %s inside a test was not wrapped in act'],
       () => {
         testRendererInstance = TestRenderer.create(null, {
-          unstable_isConcurrent: true,
+          isConcurrent: true,
         });
       },
     );
@@ -2317,7 +2317,7 @@ describe('InspectedElement', () => {
               <Suspender target={id} />
             </React.Suspense>
           </Contexts>,
-          {unstable_isConcurrent: true},
+          {isConcurrent: true},
         );
       }, false);
       await utils.actAsync(() => {
@@ -2817,7 +2817,7 @@ describe('InspectedElement', () => {
           ['An update to %s inside a test was not wrapped in act'],
           () => {
             testRendererInstance = TestRenderer.create(null, {
-              unstable_isConcurrent: true,
+              isConcurrent: true,
             });
           },
         );

packages/react-devtools-shared/src/__tests__/utils.js

@@ -19,7 +19,7 @@ export function act(
   recursivelyFlush: boolean = true,
 ): void {
   const {act: actTestRenderer} = require('react-test-renderer');
-  const {act: actDOM} = require('react-dom/test-utils');
+  const actDOM = require('react').unstable_act;
 
   actDOM(() => {
     actTestRenderer(() => {
@@ -44,7 +44,7 @@ export async function actAsync(
   recursivelyFlush: boolean = true,
 ): Promise<void> {
   const {act: actTestRenderer} = require('react-test-renderer');
-  const {act: actDOM} = require('react-dom/test-utils');
+  const actDOM = require('react').unstable_act;
 
   await actDOM(async () => {
     await actTestRenderer(async () => {

packages/react-dom/src/__tests__/ReactDOMHydrationDiff-test.js

@@ -25,7 +25,7 @@ describe('ReactDOMServerHydration', () => {
     React = require('react');
     ReactDOMClient = require('react-dom/client');
     ReactDOMServer = require('react-dom/server');
-    act = require('react-dom/test-utils').act;
+    act = React.unstable_act;
 
     console.error = jest.fn();
     container = document.createElement('div');

packages/react-dom/src/__tests__/ReactDOMInput-test.js

@@ -110,23 +110,32 @@ describe('ReactDOMInput', () => {
     expect(() => {
       ReactDOM.render(<input type="text" value={0} />, container);
     }).toErrorDev(
-      'Warning: You provided a `value` prop to a form field without an `onChange` handler.',
+      'Warning: You provided a `value` prop to a form ' +
+        'field without an `onChange` handler. This will render a read-only ' +
+        'field. If the field should be mutable use `defaultValue`. ' +
+        'Otherwise, set either `onChange` or `readOnly`.',
     );
   });
 
   it('should warn for controlled value of "" with missing onChange', () => {
     expect(() => {
       ReactDOM.render(<input type="text" value="" />, container);
     }).toErrorDev(
-      'Warning: You provided a `value` prop to a form field without an `onChange` handler.',
+      'Warning: You provided a `value` prop to a form ' +
+        'field without an `onChange` handler. This will render a read-only ' +
+        'field. If the field should be mutable use `defaultValue`. ' +
+        'Otherwise, set either `onChange` or `readOnly`.',
     );
   });
 
   it('should warn for controlled value of "0" with missing onChange', () => {
     expect(() => {
       ReactDOM.render(<input type="text" value="0" />, container);
     }).toErrorDev(
-      'Warning: You provided a `value` prop to a form field without an `onChange` handler.',
+      'Warning: You provided a `value` prop to a form ' +
+        'field without an `onChange` handler. This will render a read-only ' +
+        'field. If the field should be mutable use `defaultValue`. ' +
+        'Otherwise, set either `onChange` or `readOnly`.',
     );
   });
 

packages/react-dom/src/__tests__/ReactDOMTextarea-test.js

@@ -759,4 +759,85 @@ describe('ReactDOMTextarea', () => {
     ReactDOM.render(<textarea defaultValue={null} />, container);
     expect(node.defaultValue).toBe('');
   });
+
+  it('should not warn about missing onChange if value is not set', () => {
+    expect(() => {
+      ReactTestUtils.renderIntoDocument(<textarea />);
+    }).not.toThrow();
+  });
+
+  it('should not warn about missing onChange if value is undefined', () => {
+    expect(() => {
+      ReactTestUtils.renderIntoDocument(<textarea value={undefined} />);
+    }).not.toThrow();
+  });
+
+  it('should not warn about missing onChange if onChange is set', () => {
+    expect(() => {
+      const change = jest.fn();
+      ReactTestUtils.renderIntoDocument(
+        <textarea value="something" onChange={change} />,
+      );
+    }).not.toThrow();
+  });
+
+  it('should not warn about missing onChange if disabled is true', () => {
+    expect(() => {
+      ReactTestUtils.renderIntoDocument(
+        <textarea value="something" disabled={true} />,
+      );
+    }).not.toThrow();
+  });
+
+  it('should not warn about missing onChange if value is not set', () => {
+    expect(() => {
+      ReactTestUtils.renderIntoDocument(
+        <textarea value="something" readOnly={true} />,
+      );
+    }).not.toThrow();
+  });
+
+  it('should warn about missing onChange if value is false', () => {
+    expect(() =>
+      ReactTestUtils.renderIntoDocument(<textarea value={false} />),
+    ).toErrorDev(
+      'Warning: You provided a `value` prop to a form ' +
+        'field without an `onChange` handler. This will render a read-only ' +
+        'field. If the field should be mutable use `defaultValue`. ' +
+        'Otherwise, set either `onChange` or `readOnly`.',
+    );
+  });
+
+  it('should warn about missing onChange if value is 0', () => {
+    expect(() =>
+      ReactTestUtils.renderIntoDocument(<textarea value={0} />),
+    ).toErrorDev(
+      'Warning: You provided a `value` prop to a form ' +
+        'field without an `onChange` handler. This will render a read-only ' +
+        'field. If the field should be mutable use `defaultValue`. ' +
+        'Otherwise, set either `onChange` or `readOnly`.',
+    );
+  });
+
+  it('should warn about missing onChange if value is "0"', () => {
+    expect(() =>
+      ReactTestUtils.renderIntoDocument(<textarea value="0" />),
+    ).toErrorDev(
+      'Warning: You provided a `value` prop to a form ' +
+        'field without an `onChange` handler. This will render a read-only ' +
+        'field. If the field should be mutable use `defaultValue`. ' +
+        'Otherwise, set either `onChange` or `readOnly`.',
+    );
+  });
+
+  it('should warn about missing onChange if value is ""', () => {
+    expect(() =>
+      ReactTestUtils.renderIntoDocument(<textarea value="" />),
+    ).toErrorDev(
+      'Warning: You provided a `value` prop to a form ' +
+        'field without an `onChange` handler. This will render a read-only ' +
+        'field. If the field should be mutable use `defaultValue`. ' +
+        'Otherwise, set either `onChange` or `readOnly`.',
+    );
+  });
 });

packages/react-dom/src/__tests__/ReactTestUtilsActUnmockedScheduler-test.js

@@ -37,7 +37,7 @@ beforeEach(() => {
   yields = [];
   React = require('react');
   ReactDOM = require('react-dom');
-  act = require('react-dom/test-utils').act;
+  act = React.unstable_act;
   container = document.createElement('div');
   document.body.appendChild(container);
 });

packages/react-reconciler/src/ReactFiberLane.js

@@ -25,6 +25,9 @@ import {
   enableTransitionTracing,
   enableUnifiedSyncLane,
   enableUpdaterTracking,
+  syncLaneExpirationMs,
+  transitionLaneExpirationMs,
+  retryLaneExpirationMs,
 } from 'shared/ReactFeatureFlags';
 import {isDevToolsPresent} from './ReactFiberDevToolsHook';
 import {ConcurrentUpdatesByDefaultMode, NoMode} from './ReactTypeOfMode';
@@ -355,7 +358,7 @@ function computeExpirationTime(lane: Lane, currentTime: number) {
       // to fix the starvation. However, this scenario supports the idea that
       // expiration times are an important safeguard when starvation
       // does happen.
-      return currentTime + 250;
+      return currentTime + syncLaneExpirationMs;
     case DefaultHydrationLane:
     case DefaultLane:
     case TransitionHydrationLane:
@@ -374,7 +377,7 @@ function computeExpirationTime(lane: Lane, currentTime: number) {
     case TransitionLane13:
     case TransitionLane14:
     case TransitionLane15:
-      return currentTime + 5000;
+      return currentTime + transitionLaneExpirationMs;
     case RetryLane1:
     case RetryLane2:
     case RetryLane3:
@@ -384,7 +387,9 @@ function computeExpirationTime(lane: Lane, currentTime: number) {
       // crashes. There must be some other underlying bug; not super urgent but
       // ideally should figure out why and fix it. Unfortunately we don't have
       // a repro for the crashes, only detected via production metrics.
-      return enableRetryLaneExpiration ? currentTime + 5000 : NoTimestamp;
+      return enableRetryLaneExpiration
+        ? currentTime + retryLaneExpirationMs
+        : NoTimestamp;
     case SelectiveHydrationLane:
     case IdleHydrationLane:
     case IdleLane:
@@ -423,7 +428,9 @@ export function markStarvedLanesAsExpired(
   // We exclude retry lanes because those must always be time sliced, in order
   // to unwrap uncached promises.
   // TODO: Write a test for this
-  let lanes = pendingLanes & ~RetryLanes;
+  let lanes = enableRetryLaneExpiration
+    ? pendingLanes
+    : pendingLanes & ~RetryLanes;
   while (lanes > 0) {
     const index = pickArbitraryLaneIndex(lanes);
     const lane = 1 << index;