Rename Chunks API to Blocks (#18086)

Sounds like this is the name we're going with. This also helps us
distinguish it from other "chunking" implementation details.

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

@@ -25,7 +25,7 @@ import {
   SimpleMemoComponent,
   ContextProvider,
   ForwardRef,
-  Chunk,
+  Block,
 } from 'shared/ReactWorkTags';
 
 type CurrentDispatcherRef = typeof ReactSharedInternals.ReactCurrentDispatcher;
@@ -628,7 +628,7 @@ export function inspectHooksOfFiber(
     fiber.tag !== FunctionComponent &&
     fiber.tag !== SimpleMemoComponent &&
     fiber.tag !== ForwardRef &&
-    fiber.tag !== Chunk
+    fiber.tag !== Block
   ) {
     throw new Error(
       'Unknown Fiber. Needs to be a function component to inspect hooks.',

packages/react-reconciler/src/ReactChildFiber.js

@@ -19,18 +19,18 @@ import {
   REACT_ELEMENT_TYPE,
   REACT_FRAGMENT_TYPE,
   REACT_PORTAL_TYPE,
-  REACT_CHUNK_TYPE,
+  REACT_BLOCK_TYPE,
 } from 'shared/ReactSymbols';
 import {
   FunctionComponent,
   ClassComponent,
   HostText,
   HostPortal,
   Fragment,
-  Chunk,
+  Block,
 } from 'shared/ReactWorkTags';
 import invariant from 'shared/invariant';
-import {warnAboutStringRefs, enableChunksAPI} from 'shared/ReactFeatureFlags';
+import {warnAboutStringRefs, enableBlocksAPI} from 'shared/ReactFeatureFlags';
 
 import {
   createWorkInProgress,
@@ -416,9 +416,9 @@ function ChildReconciler(shouldTrackSideEffects) {
         }
         return existing;
       } else if (
-        enableChunksAPI &&
-        current.tag === Chunk &&
-        element.type.$$typeof === REACT_CHUNK_TYPE &&
+        enableBlocksAPI &&
+        current.tag === Block &&
+        element.type.$$typeof === REACT_BLOCK_TYPE &&
         element.type.render === current.type.render
       ) {
         // Same as above but also update the .type field.
@@ -1175,10 +1175,10 @@ function ChildReconciler(shouldTrackSideEffects) {
             }
             break;
           }
-          case Chunk:
-            if (enableChunksAPI) {
+          case Block:
+            if (enableBlocksAPI) {
               if (
-                element.type.$$typeof === REACT_CHUNK_TYPE &&
+                element.type.$$typeof === REACT_BLOCK_TYPE &&
                 element.type.render === child.type.render
               ) {
                 deleteRemainingChildren(returnFiber, child.sibling);
@@ -1192,7 +1192,7 @@ function ChildReconciler(shouldTrackSideEffects) {
                 return existing;
               }
             }
-          // We intentionally fallthrough here if enableChunksAPI is not on.
+          // We intentionally fallthrough here if enableBlocksAPI is not on.
           // eslint-disable-next-lined no-fallthrough
           default: {
             if (

packages/react-reconciler/src/ReactFiber.js

@@ -33,7 +33,7 @@ import {
   enableFundamentalAPI,
   enableUserTimingAPI,
   enableScopeAPI,
-  enableChunksAPI,
+  enableBlocksAPI,
 } from 'shared/ReactFeatureFlags';
 import {NoEffect, Placement} from 'shared/ReactSideEffectTags';
 import {ConcurrentRoot, BlockingRoot} from 'shared/ReactRootTags';
@@ -59,7 +59,7 @@ import {
   LazyComponent,
   FundamentalComponent,
   ScopeComponent,
-  Chunk,
+  Block,
 } from 'shared/ReactWorkTags';
 import getComponentName from 'shared/getComponentName';
 
@@ -91,7 +91,7 @@ import {
   REACT_LAZY_TYPE,
   REACT_FUNDAMENTAL_TYPE,
   REACT_SCOPE_TYPE,
-  REACT_CHUNK_TYPE,
+  REACT_BLOCK_TYPE,
 } from 'shared/ReactSymbols';
 
 let hasBadMapPolyfill;
@@ -391,9 +391,9 @@ export function resolveLazyComponentTag(Component: Function): WorkTag {
     if ($$typeof === REACT_MEMO_TYPE) {
       return MemoComponent;
     }
-    if (enableChunksAPI) {
-      if ($$typeof === REACT_CHUNK_TYPE) {
-        return Chunk;
+    if (enableBlocksAPI) {
+      if ($$typeof === REACT_BLOCK_TYPE) {
+        return Block;
       }
     }
   }
@@ -676,8 +676,8 @@ export function createFiberFromTypeAndProps(
               fiberTag = LazyComponent;
               resolvedType = null;
               break getTag;
-            case REACT_CHUNK_TYPE:
-              fiberTag = Chunk;
+            case REACT_BLOCK_TYPE:
+              fiberTag = Block;
               break getTag;
             case REACT_FUNDAMENTAL_TYPE:
               if (enableFundamentalAPI) {

packages/react-reconciler/src/ReactFiberBeginWork.js

@@ -42,7 +42,7 @@ import {
   IncompleteClassComponent,
   FundamentalComponent,
   ScopeComponent,
-  Chunk,
+  Block,
 } from 'shared/ReactWorkTags';
 import {
   NoEffect,
@@ -65,7 +65,7 @@ import {
   enableFundamentalAPI,
   warnAboutDefaultPropsOnFunctionComponents,
   enableScopeAPI,
-  enableChunksAPI,
+  enableBlocksAPI,
 } from 'shared/ReactFeatureFlags';
 import invariant from 'shared/invariant';
 import shallowEqual from 'shared/shallowEqual';
@@ -701,19 +701,19 @@ function updateFunctionComponent(
   return workInProgress.child;
 }
 
-function updateChunk(
+function updateBlock(
   current: Fiber | null,
   workInProgress: Fiber,
-  chunk: any,
+  block: any,
   nextProps: any,
   renderExpirationTime: ExpirationTime,
 ) {
   // TODO: current can be non-null here even if the component
   // hasn't yet mounted. This happens after the first render suspends.
   // We'll need to figure out if this is fine or can cause issues.
 
-  const render = chunk.render;
-  const data = chunk.query();
+  const render = block.render;
+  const data = block.query();
 
   // The rest is a fork of updateFunctionComponent
   let nextChildren;
@@ -1215,10 +1215,10 @@ function mountLazyComponent(
       );
       return child;
     }
-    case Chunk: {
-      if (enableChunksAPI) {
+    case Block: {
+      if (enableBlocksAPI) {
         // TODO: Resolve for Hot Reloading.
-        child = updateChunk(
+        child = updateBlock(
           null,
           workInProgress,
           Component,
@@ -3289,14 +3289,14 @@ function beginWork(
       }
       break;
     }
-    case Chunk: {
-      if (enableChunksAPI) {
-        const chunk = workInProgress.type;
+    case Block: {
+      if (enableBlocksAPI) {
+        const block = workInProgress.type;
         const props = workInProgress.pendingProps;
-        return updateChunk(
+        return updateBlock(
           current,
           workInProgress,
-          chunk,
+          block,
           props,
           renderExpirationTime,
         );

packages/react-reconciler/src/ReactFiberCommitWork.js

@@ -53,7 +53,7 @@ import {
   SuspenseListComponent,
   FundamentalComponent,
   ScopeComponent,
-  Chunk,
+  Block,
 } from 'shared/ReactWorkTags';
 import {
   invokeGuardedCallback,
@@ -249,7 +249,7 @@ function commitBeforeMutationLifeCycles(
     case FunctionComponent:
     case ForwardRef:
     case SimpleMemoComponent:
-    case Chunk: {
+    case Block: {
       return;
     }
     case ClassComponent: {
@@ -426,7 +426,7 @@ export function commitPassiveHookEffects(finishedWork: Fiber): void {
       case FunctionComponent:
       case ForwardRef:
       case SimpleMemoComponent:
-      case Chunk: {
+      case Block: {
         // TODO (#17945) We should call all passive destroy functions (for all fibers)
         // before calling any create functions. The current approach only serializes
         // these for a single fiber.
@@ -450,7 +450,7 @@ function commitLifeCycles(
     case FunctionComponent:
     case ForwardRef:
     case SimpleMemoComponent:
-    case Chunk: {
+    case Block: {
       // At this point layout effects have already been destroyed (during mutation phase).
       // This is done to prevent sibling component effects from interfering with each other,
       // e.g. a destroy function in one component should never override a ref set
@@ -779,7 +779,7 @@ function commitUnmount(
     case ForwardRef:
     case MemoComponent:
     case SimpleMemoComponent:
-    case Chunk: {
+    case Block: {
       const updateQueue: FunctionComponentUpdateQueue | null = (current.updateQueue: any);
       if (updateQueue !== null) {
         const lastEffect = updateQueue.lastEffect;
@@ -1360,7 +1360,7 @@ function commitWork(current: Fiber | null, finishedWork: Fiber): void {
       case ForwardRef:
       case MemoComponent:
       case SimpleMemoComponent:
-      case Chunk: {
+      case Block: {
         // Layout effects are destroyed during the mutation phase so that all
         // destroy functions for all fibers are called before any create functions.
         // This prevents sibling component effects from interfering with each other,
@@ -1403,7 +1403,7 @@ function commitWork(current: Fiber | null, finishedWork: Fiber): void {
     case ForwardRef:
     case MemoComponent:
     case SimpleMemoComponent:
-    case Chunk: {
+    case Block: {
       // Layout effects are destroyed during the mutation phase so that all
       // destroy functions for all fibers are called before any create functions.
       // This prevents sibling component effects from interfering with each other,

packages/react-reconciler/src/ReactFiberCompleteWork.js

@@ -51,7 +51,7 @@ import {
   IncompleteClassComponent,
   FundamentalComponent,
   ScopeComponent,
-  Chunk,
+  Block,
 } from 'shared/ReactWorkTags';
 import {NoMode, BlockingMode} from './ReactTypeOfMode';
 import {
@@ -119,7 +119,7 @@ import {
   enableDeprecatedFlareAPI,
   enableFundamentalAPI,
   enableScopeAPI,
-  enableChunksAPI,
+  enableBlocksAPI,
 } from 'shared/ReactFeatureFlags';
 import {
   markSpawnedWork,
@@ -1295,8 +1295,8 @@ function completeWork(
       }
       break;
     }
-    case Chunk:
-      if (enableChunksAPI) {
+    case Block:
+      if (enableBlocksAPI) {
         return null;
       }
       break;

packages/react-reconciler/src/ReactFiberWorkLoop.js

@@ -88,7 +88,7 @@ import {
   ForwardRef,
   MemoComponent,
   SimpleMemoComponent,
-  Chunk,
+  Block,
 } from 'shared/ReactWorkTags';
 import {
   NoEffect,
@@ -2682,7 +2682,7 @@ function warnAboutUpdateOnUnmountedFiberInDEV(fiber) {
       tag !== ForwardRef &&
       tag !== MemoComponent &&
       tag !== SimpleMemoComponent &&
-      tag !== Chunk
+      tag !== Block
     ) {
       // Only warn for user-defined components, not internal ones like Suspense.
       return;

packages/react-reconciler/src/__tests__/ReactChunks-test.js → packages/react-reconciler/src/__tests__/ReactBlocks-test.js

@@ -12,17 +12,17 @@ let React;
 let ReactNoop;
 let useState;
 let Suspense;
-let chunk;
+let block;
 let readString;
 
-describe('ReactChunks', () => {
+describe('ReactBlocks', () => {
   beforeEach(() => {
     jest.resetModules();
 
     React = require('react');
     ReactNoop = require('react-noop-renderer');
 
-    chunk = React.chunk;
+    block = React.block;
     useState = React.useState;
     Suspense = React.Suspense;
     let cache = new Map();
@@ -63,7 +63,7 @@ describe('ReactChunks', () => {
       );
     }
 
-    let loadUser = chunk(Query, Render);
+    let loadUser = block(Query, Render);
 
     function App({User}) {
       return (
@@ -102,7 +102,7 @@ describe('ReactChunks', () => {
       );
     }
 
-    let loadUser = chunk(Query, Render);
+    let loadUser = block(Query, Render);
 
     function App({User}) {
       return (
@@ -164,7 +164,7 @@ describe('ReactChunks', () => {
         );
       }
 
-      let loadUser = chunk(Query, Render);
+      let loadUser = block(Query, Render);
 
       function App({User}) {
         return (

packages/react-test-renderer/src/ReactTestRenderer.js

@@ -37,7 +37,7 @@ import {
   Profiler,
   MemoComponent,
   SimpleMemoComponent,
-  Chunk,
+  Block,
   IncompleteClassComponent,
   ScopeComponent,
 } from 'shared/ReactWorkTags';
@@ -188,9 +188,9 @@ function toTree(node: ?Fiber) {
         instance: null,
         rendered: childrenToTree(node.child),
       };
-    case Chunk:
+    case Block:
       return {
-        nodeType: 'chunk',
+        nodeType: 'block',
         type: node.type,
         props: {...node.memoizedProps},
         instance: null,
@@ -233,7 +233,7 @@ const validWrapperTypes = new Set([
   ForwardRef,
   MemoComponent,
   SimpleMemoComponent,
-  Chunk,
+  Block,
   // Normally skipped, but used when there's more than one root child.
   HostRoot,
 ]);