Split IndeterminateComponent out from Lazy

This way we don't have to check the type in a hacky way in the
indeterminate path. Also, lets us deal with lazy that resolves to
indeterminate and such.

Author: sebmarkbage

packages/react-reconciler/src/ReactCurrentFiber.js

@@ -14,6 +14,7 @@ import {
   ClassComponent,
   HostComponent,
   Mode,
+  LazyComponent,
 } from 'shared/ReactWorkTags';
 import describeComponentFrame from 'shared/describeComponentFrame';
 import getComponentName from 'shared/getComponentName';
@@ -27,6 +28,7 @@ type LifeCyclePhase = 'render' | 'getChildContext';
 function describeFiber(fiber: Fiber): string {
   switch (fiber.tag) {
     case IndeterminateComponent:
+    case LazyComponent:
     case FunctionComponent:
     case ClassComponent:
     case HostComponent:

packages/react-reconciler/src/ReactFiber.js

@@ -36,6 +36,7 @@ import {
   SuspenseComponent,
   FunctionComponent,
   PureComponent,
+  LazyComponent,
 } from 'shared/ReactWorkTags';
 import getComponentName from 'shared/getComponentName';
 
@@ -473,7 +474,7 @@ function createFiberFromElementWithoutDebugInfo(
               fiberTag = PureComponent;
               break getTag;
             case REACT_LAZY_TYPE:
-              fiberTag = IndeterminateComponent;
+              fiberTag = LazyComponent;
               resolvedType = null;
               break getTag;
           }

packages/react-reconciler/src/ReactFiberBeginWork.js

@@ -31,6 +31,7 @@ import {
   Profiler,
   SuspenseComponent,
   PureComponent,
+  LazyComponent,
 } from 'shared/ReactWorkTags';
 import {
   NoEffect,
@@ -105,7 +106,6 @@ import {
   createFiberFromFragment,
   createWorkInProgress,
 } from './ReactFiber';
-import {REACT_LAZY_TYPE} from 'shared/ReactSymbols';
 
 const ReactCurrentOwner = ReactSharedInternals.ReactCurrentOwner;
 
@@ -691,7 +691,7 @@ function resolveDefaultProps(Component, baseProps) {
   return baseProps;
 }
 
-function mountIndeterminateComponent(
+function mountLazyComponent(
   _current,
   workInProgress,
   elementType,
@@ -710,85 +710,94 @@ function mountIndeterminateComponent(
   }
 
   const props = workInProgress.pendingProps;
-  let Component;
-  if (
-    typeof elementType === 'object' &&
-    elementType !== null &&
-    elementType.$$typeof === REACT_LAZY_TYPE
-  ) {
-    // We can't start a User Timing measurement with correct label yet.
-    // Cancel and resume right after we know the tag.
-    cancelWorkTimer(workInProgress);
-    Component = readLazyComponentType(elementType);
-    // Store the unwrapped component in the type.
-    workInProgress.type = Component;
-    const resolvedTag = (workInProgress.tag = resolveLazyComponentTag(
-      workInProgress,
-      Component,
-    ));
-    startWorkTimer(workInProgress);
-    const resolvedProps = resolveDefaultProps(Component, props);
-    let child;
-    switch (resolvedTag) {
-      case FunctionComponent: {
-        child = updateFunctionComponent(
-          null,
-          workInProgress,
-          Component,
-          resolvedProps,
-          renderExpirationTime,
-        );
-        break;
-      }
-      case ClassComponent: {
-        child = updateClassComponent(
-          null,
-          workInProgress,
-          Component,
-          resolvedProps,
-          renderExpirationTime,
-        );
-        break;
-      }
-      case ForwardRef: {
-        child = updateForwardRef(
-          null,
-          workInProgress,
-          Component,
-          resolvedProps,
-          renderExpirationTime,
-        );
-        break;
-      }
-      case PureComponent: {
-        child = updatePureComponent(
-          null,
-          workInProgress,
-          Component,
-          resolvedProps,
-          updateExpirationTime,
-          renderExpirationTime,
-        );
-        break;
-      }
-      default: {
-        // This message intentionally doesn't metion ForwardRef or PureComponent
-        // because the fact that it's a separate type of work is an
-        // implementation detail.
-        invariant(
-          false,
-          'Element type is invalid. Received a promise that resolves to: %s. ' +
-            'Promise elements must resolve to a class or function.',
-          Component,
-        );
-      }
+  // We can't start a User Timing measurement with correct label yet.
+  // Cancel and resume right after we know the tag.
+  cancelWorkTimer(workInProgress);
+  let Component = readLazyComponentType(elementType);
+  // Store the unwrapped component in the type.
+  workInProgress.type = Component;
+  const resolvedTag = (workInProgress.tag = resolveLazyComponentTag(
+    workInProgress,
+    Component,
+  ));
+  startWorkTimer(workInProgress);
+  const resolvedProps = resolveDefaultProps(Component, props);
+  let child;
+  switch (resolvedTag) {
+    case FunctionComponent: {
+      child = updateFunctionComponent(
+        null,
+        workInProgress,
+        Component,
+        resolvedProps,
+        renderExpirationTime,
+      );
+      break;
     }
-    return child;
-  } else {
-    workInProgress.type = elementType;
-    Component = elementType;
+    case ClassComponent: {
+      child = updateClassComponent(
+        null,
+        workInProgress,
+        Component,
+        resolvedProps,
+        renderExpirationTime,
+      );
+      break;
+    }
+    case ForwardRef: {
+      child = updateForwardRef(
+        null,
+        workInProgress,
+        Component,
+        resolvedProps,
+        renderExpirationTime,
+      );
+      break;
+    }
+    case PureComponent: {
+      child = updatePureComponent(
+        null,
+        workInProgress,
+        Component,
+        resolvedProps,
+        updateExpirationTime,
+        renderExpirationTime,
+      );
+      break;
+    }
+    default: {
+      // This message intentionally doesn't metion ForwardRef or PureComponent
+      // because the fact that it's a separate type of work is an
+      // implementation detail.
+      invariant(
+        false,
+        'Element type is invalid. Received a promise that resolves to: %s. ' +
+          'Promise elements must resolve to a class or function.',
+        Component,
+      );
+    }
+  }
+  return child;
+}
+
+function mountIndeterminateComponent(
+  _current,
+  workInProgress,
+  Component,
+  renderExpirationTime,
+) {
+  if (_current !== null) {
+    // An indeterminate component only mounts if it suspended inside a non-
+    // concurrent tree, in an inconsistent state. We want to tree it like
+    // a new mount, even though an empty version of it already committed.
+    // Disconnect the alternate pointers.
+    _current.alternate = null;
+    workInProgress.alternate = null;
+    // Since this is conceptually a new fiber, schedule a Placement effect
+    workInProgress.effectTag |= Placement;
   }
 
+  const props = workInProgress.pendingProps;
   const unmaskedContext = getUnmaskedContext(workInProgress, Component, false);
   const context = getMaskedContext(workInProgress, unmaskedContext);
 
@@ -1443,6 +1452,15 @@ function beginWork(
     case IndeterminateComponent: {
       const elementType = workInProgress.elementType;
       return mountIndeterminateComponent(
+        current,
+        workInProgress,
+        elementType,
+        renderExpirationTime,
+      );
+    }
+    case LazyComponent: {
+      const elementType = workInProgress.elementType;
+      return mountLazyComponent(
         current,
         workInProgress,
         elementType,

packages/react-reconciler/src/ReactFiberCompleteWork.js

@@ -35,6 +35,7 @@ import {
   Profiler,
   SuspenseComponent,
   PureComponent,
+  LazyComponent,
 } from 'shared/ReactWorkTags';
 import {Placement, Ref, Update} from 'shared/ReactSideEffectTags';
 import invariant from 'shared/invariant';
@@ -536,6 +537,8 @@ function completeWork(
   switch (workInProgress.tag) {
     case IndeterminateComponent:
       break;
+    case LazyComponent:
+      break;
     case FunctionComponent:
       break;
     case ClassComponent: {

packages/shared/ReactWorkTags.js

@@ -43,3 +43,4 @@ export const ForwardRef = 11;
 export const Profiler = 12;
 export const SuspenseComponent = 13;
 export const PureComponent = 14;
+export const LazyComponent = 15;