Favor fallthrough switch instead of case statements for work tags (#17648)

sebmarkbage · web-flow · commit 4c270375e931 · 2019-12-18T15:53:27.000Z
* Favor fallthrough switch instead of case statements for work tags

Currently we're inconsistently handling tags that are only relevant
for certain flags. We should throw if the tag is not part of the built
feature flags. This should also mean that the case statements can be
eliminated.

We can achieve this effect by putting the invariant outside of the switch
and always early return in the switch. We already do this in beginWork.
This PR makes this consistent in other places.

* Fail if fundamental/scope tags are discovered without the flag on
diff --git a/packages/react-reconciler/src/ReactFiberBeginWork.js b/packages/react-reconciler/src/ReactFiberBeginWork.js
@@ -1075,7 +1075,7 @@ function mountLazyComponent(
         resolvedProps,
         renderExpirationTime,
       );
-      break;
+      return child;
     }
     case ClassComponent: {
       if (__DEV__) {
@@ -1090,7 +1090,7 @@ function mountLazyComponent(
         resolvedProps,
         renderExpirationTime,
       );
-      break;
+      return child;
     }
     case ForwardRef: {
       if (__DEV__) {
@@ -1105,7 +1105,7 @@ function mountLazyComponent(
         resolvedProps,
         renderExpirationTime,
       );
-      break;
+      return child;
     }
     case MemoComponent: {
       if (__DEV__) {
@@ -1130,32 +1130,29 @@ function mountLazyComponent(
         updateExpirationTime,
         renderExpirationTime,
       );
-      break;
+      return child;
     }
-    default: {
-      let hint = '';
-      if (__DEV__) {
-        if (
-          Component !== null &&
-          typeof Component === 'object' &&
-          Component.$$typeof === REACT_LAZY_TYPE
-        ) {
-          hint = ' Did you wrap a component in React.lazy() more than once?';
-        }
-      }
-      // This message intentionally doesn't mention ForwardRef or MemoComponent
-      // 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. ' +
-          'Lazy element type must resolve to a class or function.%s',
-        Component,
-        hint,
-      );
+  }
+  let hint = '';
+  if (__DEV__) {
+    if (
+      Component !== null &&
+      typeof Component === 'object' &&
+      Component.$$typeof === REACT_LAZY_TYPE
+    ) {
+      hint = ' Did you wrap a component in React.lazy() more than once?';
     }
   }
-  return child;
+  // This message intentionally doesn't mention ForwardRef or MemoComponent
+  // 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. ' +
+      'Lazy element type must resolve to a class or function.%s',
+    Component,
+    hint,
+  );
 }
 
 function mountIncompleteClassComponent(
diff --git a/packages/react-reconciler/src/ReactFiberCommitWork.js b/packages/react-reconciler/src/ReactFiberCommitWork.js
@@ -320,14 +320,12 @@ function commitBeforeMutationLifeCycles(
     case IncompleteClassComponent:
       // Nothing to do for these component types
       return;
-    default: {
-      invariant(
-        false,
-        'This unit of work tag should not have side-effects. This error is ' +
-          'likely caused by a bug in React. Please file an issue.',
-      );
-    }
   }
+  invariant(
+    false,
+    'This unit of work tag should not have side-effects. This error is ' +
+      'likely caused by a bug in React. Please file an issue.',
+  );
 }
 
 function commitHookEffectList(
@@ -420,7 +418,7 @@ function commitLifeCycles(
     case ForwardRef:
     case SimpleMemoComponent: {
       commitHookEffectList(UnmountLayout, MountLayout, finishedWork);
-      break;
+      return;
     }
     case ClassComponent: {
       const instance = finishedWork.stateNode;
@@ -629,14 +627,12 @@ function commitLifeCycles(
     case FundamentalComponent:
     case ScopeComponent:
       return;
-    default: {
-      invariant(
-        false,
-        'This unit of work tag should not have side-effects. This error is ' +
-          'likely caused by a bug in React. Please file an issue.',
-      );
-    }
   }
+  invariant(
+    false,
+    'This unit of work tag should not have side-effects. This error is ' +
+      'likely caused by a bug in React. Please file an issue.',
+  );
 }
 
 function hideOrUnhideAllChildren(finishedWork, isHidden) {
@@ -785,7 +781,7 @@ function commitUnmount(
           });
         }
       }
-      break;
+      return;
     }
     case ClassComponent: {
       safelyDetachRef(current);
@@ -843,6 +839,7 @@ function commitUnmount(
       if (enableScopeAPI) {
         safelyDetachRef(current);
       }
+      return;
     }
   }
 }
@@ -943,14 +940,12 @@ function commitContainer(finishedWork: Fiber) {
       replaceContainerChildren(containerInfo, pendingChildren);
       return;
     }
-    default: {
-      invariant(
-        false,
-        'This unit of work tag should not have side-effects. This error is ' +
-          'likely caused by a bug in React. Please file an issue.',
-      );
-    }
   }
+  invariant(
+    false,
+    'This unit of work tag should not have side-effects. This error is ' +
+      'likely caused by a bug in React. Please file an issue.',
+  );
 }
 
 function getHostParentFiber(fiber: Fiber): Fiber {
@@ -1408,8 +1403,9 @@ function commitWork(current: Fiber | null, finishedWork: Fiber): void {
       if (enableFundamentalAPI) {
         const fundamentalInstance = finishedWork.stateNode;
         updateFundamentalComponent(fundamentalInstance);
+        return;
       }
-      return;
+      break;
     }
     case ScopeComponent: {
       if (enableScopeAPI) {
@@ -1424,17 +1420,16 @@ function commitWork(current: Fiber | null, finishedWork: Fiber): void {
             updateDeprecatedEventListeners(nextListeners, finishedWork, null);
           }
         }
+        return;
       }
-      return;
-    }
-    default: {
-      invariant(
-        false,
-        'This unit of work tag should not have side-effects. This error is ' +
-          'likely caused by a bug in React. Please file an issue.',
-      );
+      break;
     }
   }
+  invariant(
+    false,
+    'This unit of work tag should not have side-effects. This error is ' +
+      'likely caused by a bug in React. Please file an issue.',
+  );
 }
 
 function commitSuspenseComponent(finishedWork: Fiber) {
diff --git a/packages/react-reconciler/src/ReactFiberCompleteWork.js b/packages/react-reconciler/src/ReactFiberCompleteWork.js
@@ -638,18 +638,22 @@ function completeWork(
 
   switch (workInProgress.tag) {
     case IndeterminateComponent:
-      break;
     case LazyComponent:
-      break;
     case SimpleMemoComponent:
     case FunctionComponent:
-      break;
+    case ForwardRef:
+    case Fragment:
+    case Mode:
+    case Profiler:
+    case ContextConsumer:
+    case MemoComponent:
+      return null;
     case ClassComponent: {
       const Component = workInProgress.type;
       if (isLegacyContextProvider(Component)) {
         popLegacyContext(workInProgress);
       }
-      break;
+      return null;
     }
     case HostRoot: {
       popHostContainer(workInProgress);
@@ -670,7 +674,7 @@ function completeWork(
         }
       }
       updateHostContainer(workInProgress);
-      break;
+      return null;
     }
     case HostComponent: {
       popHostContext(workInProgress);
@@ -704,7 +708,7 @@ function completeWork(
               'caused by a bug in React. Please file an issue.',
           );
           // This can happen when we abort work.
-          break;
+          return null;
         }
 
         const currentHostContext = getHostContext();
@@ -783,7 +787,7 @@ function completeWork(
           markRef(workInProgress);
         }
       }
-      break;
+      return null;
     }
     case HostText: {
       let newText = newProps;
@@ -817,10 +821,8 @@ function completeWork(
           );
         }
       }
-      break;
+      return null;
     }
-    case ForwardRef:
-      break;
     case SuspenseComponent: {
       popSuspenseContext(workInProgress);
       const nextState: null | SuspenseState = workInProgress.memoizedState;
@@ -961,34 +963,24 @@ function completeWork(
         // Always notify the callback
         workInProgress.effectTag |= Update;
       }
-      break;
+      return null;
     }
-    case Fragment:
-      break;
-    case Mode:
-      break;
-    case Profiler:
-      break;
     case HostPortal:
       popHostContainer(workInProgress);
       updateHostContainer(workInProgress);
-      break;
+      return null;
     case ContextProvider:
       // Pop provider fiber
       popProvider(workInProgress);
-      break;
-    case ContextConsumer:
-      break;
-    case MemoComponent:
-      break;
+      return null;
     case IncompleteClassComponent: {
       // Same as class component case. I put it down here so that the tags are
       // sequential to ensure this switch is compiled to a jump table.
       const Component = workInProgress.type;
       if (isLegacyContextProvider(Component)) {
         popLegacyContext(workInProgress);
       }
-      break;
+      return null;
     }
     case SuspenseListComponent: {
       popSuspenseContext(workInProgress);
@@ -999,7 +991,7 @@ function completeWork(
       if (renderState === null) {
         // We're running in the default, "independent" mode. We don't do anything
         // in this mode.
-        break;
+        return null;
       }
 
       let didSuspendAlready =
@@ -1198,7 +1190,7 @@ function completeWork(
         // Do a pass over the next row.
         return next;
       }
-      break;
+      return null;
     }
     case FundamentalComponent: {
       if (enableFundamentalAPI) {
@@ -1248,6 +1240,7 @@ function completeWork(
             markUpdate(workInProgress);
           }
         }
+        return null;
       }
       break;
     }
@@ -1296,19 +1289,17 @@ function completeWork(
             markRef(workInProgress);
           }
         }
+        return null;
       }
       break;
     }
-    default:
-      invariant(
-        false,
-        'Unknown unit of work tag (%s). This error is likely caused by a bug in ' +
-          'React. Please file an issue.',
-        workInProgress.tag,
-      );
   }
-
-  return null;
+  invariant(
+    false,
+    'Unknown unit of work tag (%s). This error is likely caused by a bug in ' +
+      'React. Please file an issue.',
+    workInProgress.tag,
+  );
 }
 
 export {completeWork};

Original file line number	Diff line number	Diff line change
`@@ -320,14 +320,12 @@ function commitBeforeMutationLifeCycles(`
`320`	`320`	`case IncompleteClassComponent:`
`321`	`321`	`// Nothing to do for these component types`
`322`	`322`	`return;`
`323`		`- default: {`
`324`		`- invariant(`
`325`		`- false,`
`326`		`- 'This unit of work tag should not have side-effects. This error is ' +`
`327`		`- 'likely caused by a bug in React. Please file an issue.',`
`328`		`- );`
`329`		`- }`
`330`	`323`	`}`
	`324`	`+ invariant(`
	`325`	`+ false,`
	`326`	`+ 'This unit of work tag should not have side-effects. This error is ' +`
	`327`	`+ 'likely caused by a bug in React. Please file an issue.',`
	`328`	`+ );`
`331`	`329`	`}`
`332`	`330`
`333`	`331`	`function commitHookEffectList(`
`@@ -420,7 +418,7 @@ function commitLifeCycles(`
`420`	`418`	`case ForwardRef:`
`421`	`419`	`case SimpleMemoComponent: {`
`422`	`420`	`commitHookEffectList(UnmountLayout, MountLayout, finishedWork);`
`423`		`- break;`
	`421`	`+ return;`
`424`	`422`	`}`
`425`	`423`	`case ClassComponent: {`
`426`	`424`	`const instance = finishedWork.stateNode;`
`@@ -629,14 +627,12 @@ function commitLifeCycles(`
`629`	`627`	`case FundamentalComponent:`
`630`	`628`	`case ScopeComponent:`
`631`	`629`	`return;`
`632`		`- default: {`
`633`		`- invariant(`
`634`		`- false,`
`635`		`- 'This unit of work tag should not have side-effects. This error is ' +`
`636`		`- 'likely caused by a bug in React. Please file an issue.',`
`637`		`- );`
`638`		`- }`
`639`	`630`	`}`
	`631`	`+ invariant(`
	`632`	`+ false,`
	`633`	`+ 'This unit of work tag should not have side-effects. This error is ' +`
	`634`	`+ 'likely caused by a bug in React. Please file an issue.',`
	`635`	`+ );`
`640`	`636`	`}`
`641`	`637`
`642`	`638`	`function hideOrUnhideAllChildren(finishedWork, isHidden) {`
`@@ -785,7 +781,7 @@ function commitUnmount(`
`785`	`781`	`});`
`786`	`782`	`}`
`787`	`783`	`}`
`788`		`- break;`
	`784`	`+ return;`
`789`	`785`	`}`
`790`	`786`	`case ClassComponent: {`
`791`	`787`	`safelyDetachRef(current);`
`@@ -843,6 +839,7 @@ function commitUnmount(`
`843`	`839`	`if (enableScopeAPI) {`
`844`	`840`	`safelyDetachRef(current);`
`845`	`841`	`}`
	`842`	`+ return;`
`846`	`843`	`}`
`847`	`844`	`}`
`848`	`845`	`}`
`@@ -943,14 +940,12 @@ function commitContainer(finishedWork: Fiber) {`
`943`	`940`	`replaceContainerChildren(containerInfo, pendingChildren);`
`944`	`941`	`return;`
`945`	`942`	`}`
`946`		`- default: {`
`947`		`- invariant(`
`948`		`- false,`
`949`		`- 'This unit of work tag should not have side-effects. This error is ' +`
`950`		`- 'likely caused by a bug in React. Please file an issue.',`
`951`		`- );`
`952`		`- }`
`953`	`943`	`}`
	`944`	`+ invariant(`
	`945`	`+ false,`
	`946`	`+ 'This unit of work tag should not have side-effects. This error is ' +`
	`947`	`+ 'likely caused by a bug in React. Please file an issue.',`
	`948`	`+ );`
`954`	`949`	`}`
`955`	`950`
`956`	`951`	`function getHostParentFiber(fiber: Fiber): Fiber {`
`@@ -1408,8 +1403,9 @@ function commitWork(current: Fiber \| null, finishedWork: Fiber): void {`
`1408`	`1403`	`if (enableFundamentalAPI) {`
`1409`	`1404`	`const fundamentalInstance = finishedWork.stateNode;`
`1410`	`1405`	`updateFundamentalComponent(fundamentalInstance);`
	`1406`	`+ return;`
`1411`	`1407`	`}`
`1412`		`- return;`
	`1408`	`+ break;`
`1413`	`1409`	`}`
`1414`	`1410`	`case ScopeComponent: {`
`1415`	`1411`	`if (enableScopeAPI) {`
`@@ -1424,17 +1420,16 @@ function commitWork(current: Fiber \| null, finishedWork: Fiber): void {`
`1424`	`1420`	`updateDeprecatedEventListeners(nextListeners, finishedWork, null);`
`1425`	`1421`	`}`
`1426`	`1422`	`}`
	`1423`	`+ return;`
`1427`	`1424`	`}`
`1428`		`- return;`
`1429`		`- }`
`1430`		`- default: {`
`1431`		`- invariant(`
`1432`		`- false,`
`1433`		`- 'This unit of work tag should not have side-effects. This error is ' +`
`1434`		`- 'likely caused by a bug in React. Please file an issue.',`
`1435`		`- );`
	`1425`	`+ break;`
`1436`	`1426`	`}`
`1437`	`1427`	`}`
	`1428`	`+ invariant(`
	`1429`	`+ false,`
	`1430`	`+ 'This unit of work tag should not have side-effects. This error is ' +`
	`1431`	`+ 'likely caused by a bug in React. Please file an issue.',`
	`1432`	`+ );`
`1438`	`1433`	`}`
`1439`	`1434`
`1440`	`1435`	`function commitSuspenseComponent(finishedWork: Fiber) {`
Original file line number	Diff line number	Diff line change
`@@ -638,18 +638,22 @@ function completeWork(`
`638`	`638`
`639`	`639`	`switch (workInProgress.tag) {`
`640`	`640`	`case IndeterminateComponent:`
`641`		`- break;`
`642`	`641`	`case LazyComponent:`
`643`		`- break;`
`644`	`642`	`case SimpleMemoComponent:`
`645`	`643`	`case FunctionComponent:`
`646`		`- break;`
	`644`	`+ case ForwardRef:`
	`645`	`+ case Fragment:`
	`646`	`+ case Mode:`
	`647`	`+ case Profiler:`
	`648`	`+ case ContextConsumer:`
	`649`	`+ case MemoComponent:`
	`650`	`+ return null;`
`647`	`651`	`case ClassComponent: {`
`648`	`652`	`const Component = workInProgress.type;`
`649`	`653`	`if (isLegacyContextProvider(Component)) {`
`650`	`654`	`popLegacyContext(workInProgress);`
`651`	`655`	`}`
`652`		`- break;`
	`656`	`+ return null;`
`653`	`657`	`}`
`654`	`658`	`case HostRoot: {`
`655`	`659`	`popHostContainer(workInProgress);`
`@@ -670,7 +674,7 @@ function completeWork(`
`670`	`674`	`}`
`671`	`675`	`}`
`672`	`676`	`updateHostContainer(workInProgress);`
`673`		`- break;`
	`677`	`+ return null;`
`674`	`678`	`}`
`675`	`679`	`case HostComponent: {`
`676`	`680`	`popHostContext(workInProgress);`
`@@ -704,7 +708,7 @@ function completeWork(`
`704`	`708`	`'caused by a bug in React. Please file an issue.',`
`705`	`709`	`);`
`706`	`710`	`// This can happen when we abort work.`
`707`		`- break;`
	`711`	`+ return null;`
`708`	`712`	`}`
`709`	`713`
`710`	`714`	`const currentHostContext = getHostContext();`
`@@ -783,7 +787,7 @@ function completeWork(`
`783`	`787`	`markRef(workInProgress);`
`784`	`788`	`}`
`785`	`789`	`}`
`786`		`- break;`
	`790`	`+ return null;`
`787`	`791`	`}`
`788`	`792`	`case HostText: {`
`789`	`793`	`let newText = newProps;`
`@@ -817,10 +821,8 @@ function completeWork(`
`817`	`821`	`);`
`818`	`822`	`}`
`819`	`823`	`}`
`820`		`- break;`
	`824`	`+ return null;`
`821`	`825`	`}`
`822`		`- case ForwardRef:`
`823`		`- break;`
`824`	`826`	`case SuspenseComponent: {`
`825`	`827`	`popSuspenseContext(workInProgress);`
`826`	`828`	`const nextState: null \| SuspenseState = workInProgress.memoizedState;`
`@@ -961,34 +963,24 @@ function completeWork(`
`961`	`963`	`// Always notify the callback`
`962`	`964`	`workInProgress.effectTag \|= Update;`
`963`	`965`	`}`
`964`		`- break;`
	`966`	`+ return null;`
`965`	`967`	`}`
`966`		`- case Fragment:`
`967`		`- break;`
`968`		`- case Mode:`
`969`		`- break;`
`970`		`- case Profiler:`
`971`		`- break;`
`972`	`968`	`case HostPortal:`
`973`	`969`	`popHostContainer(workInProgress);`
`974`	`970`	`updateHostContainer(workInProgress);`
`975`		`- break;`
	`971`	`+ return null;`
`976`	`972`	`case ContextProvider:`
`977`	`973`	`// Pop provider fiber`
`978`	`974`	`popProvider(workInProgress);`
`979`		`- break;`
`980`		`- case ContextConsumer:`
`981`		`- break;`
`982`		`- case MemoComponent:`
`983`		`- break;`
	`975`	`+ return null;`
`984`	`976`	`case IncompleteClassComponent: {`
`985`	`977`	`// Same as class component case. I put it down here so that the tags are`
`986`	`978`	`// sequential to ensure this switch is compiled to a jump table.`
`987`	`979`	`const Component = workInProgress.type;`
`988`	`980`	`if (isLegacyContextProvider(Component)) {`
`989`	`981`	`popLegacyContext(workInProgress);`
`990`	`982`	`}`
`991`		`- break;`
	`983`	`+ return null;`
`992`	`984`	`}`
`993`	`985`	`case SuspenseListComponent: {`
`994`	`986`	`popSuspenseContext(workInProgress);`
`@@ -999,7 +991,7 @@ function completeWork(`
`999`	`991`	`if (renderState === null) {`
`1000`	`992`	`// We're running in the default, "independent" mode. We don't do anything`
`1001`	`993`	`// in this mode.`
`1002`		`- break;`
	`994`	`+ return null;`
`1003`	`995`	`}`
`1004`	`996`
`1005`	`997`	`let didSuspendAlready =`
`@@ -1198,7 +1190,7 @@ function completeWork(`
`1198`	`1190`	`// Do a pass over the next row.`
`1199`	`1191`	`return next;`
`1200`	`1192`	`}`
`1201`		`- break;`
	`1193`	`+ return null;`
`1202`	`1194`	`}`
`1203`	`1195`	`case FundamentalComponent: {`
`1204`	`1196`	`if (enableFundamentalAPI) {`
`@@ -1248,6 +1240,7 @@ function completeWork(`
`1248`	`1240`	`markUpdate(workInProgress);`
`1249`	`1241`	`}`
`1250`	`1242`	`}`
	`1243`	`+ return null;`
`1251`	`1244`	`}`
`1252`	`1245`	`break;`
`1253`	`1246`	`}`
`@@ -1296,19 +1289,17 @@ function completeWork(`
`1296`	`1289`	`markRef(workInProgress);`
`1297`	`1290`	`}`
`1298`	`1291`	`}`
	`1292`	`+ return null;`
`1299`	`1293`	`}`
`1300`	`1294`	`break;`
`1301`	`1295`	`}`
`1302`		`- default:`
`1303`		`- invariant(`
`1304`		`- false,`
`1305`		`- 'Unknown unit of work tag (%s). This error is likely caused by a bug in ' +`
`1306`		`- 'React. Please file an issue.',`
`1307`		`- workInProgress.tag,`
`1308`		`- );`
`1309`	`1296`	`}`
`1310`		`-`
`1311`		`- return null;`
	`1297`	`+ invariant(`
	`1298`	`+ false,`
	`1299`	`+ 'Unknown unit of work tag (%s). This error is likely caused by a bug in ' +`
	`1300`	`+ 'React. Please file an issue.',`
	`1301`	`+ workInProgress.tag,`
	`1302`	`+ );`
`1312`	`1303`	`}`
`1313`	`1304`
`1314`	`1305`	`export {completeWork};`