Function ReactFiberCompleteWork

bundle.js:7487–7541

(config,hostContext,hydrationContext)

// to drop our effect list.
workInProgress.firstEffect=null;workInProgress.lastEffect=null;// Unmount the current children as if the component rendered null
var nextChildren=null;reconcileChildrenAtPriority(current,workInProgress,nextChildren,priorityLevel);if(workInProgress.tag===ClassComponent$6){var instance=workInProgress.stateNode;workInProgress.memoizedProps=instance.props;workInProgress.memoizedState=instance.state;}return workInProgress.child;}return{beginWork:beginWork,beginFailedWork:beginFailedWork};};var reconcileChildFibers$2=ReactChildFiber.reconcileChildFibers;var popContextProvider$2=ReactFiberContext.popContextProvider;var popTopLevelContextObject$1=ReactFiberContext.popTopLevelContextObject;var IndeterminateComponent$3=ReactTypeOfWork.IndeterminateComponent;var FunctionalComponent$3=ReactTypeOfWork.FunctionalComponent;var ClassComponent$8=ReactTypeOfWork.ClassComponent;var HostRoot$8=ReactTypeOfWork.HostRoot;var HostComponent$8=ReactTypeOfWork.HostComponent;var HostText$6=ReactTypeOfWork.HostText;var HostPortal$6=ReactTypeOfWork.HostPortal;var CoroutineComponent$3=ReactTypeOfWork.CoroutineComponent;var CoroutineHandlerPhase$1=ReactTypeOfWork.CoroutineHandlerPhase;var YieldComponent$4=ReactTypeOfWork.YieldComponent;var Fragment$4=ReactTypeOfWork.Fragment;var Placement$4=ReactTypeOfSideEffect.Placement;var Ref$2=ReactTypeOfSideEffect.Ref;var Update$2=ReactTypeOfSideEffect.Update;var OffscreenPriority$2=ReactPriorityLevel.OffscreenPriority;{var ReactDebugCurrentFiber$5=ReactDebugCurrentFiber_1;}var ReactFiberCompleteWork=function ReactFiberCompleteWork(config,hostContext,hydrationContext){var createInstance=config.createInstance,createTextInstance=config.createTextInstance,appendInitialChild=config.appendInitialChild,finalizeInitialChildren=config.finalizeInitialChildren,prepareUpdate=config.prepareUpdate;var getRootHostContainer=hostContext.getRootHostContainer,popHostContext=hostContext.popHostContext,getHostContext=hostContext.getHostContext,popHostContainer=hostContext.popHostContainer;var prepareToHydrateHostInstance=hydrationContext.prepareToHydrateHostInstance,prepareToHydrateHostTextInstance=hydrationContext.prepareToHydrateHostTextInstance,popHydrationState=hydrationContext.popHydrationState;function markUpdate(workInProgress){// Tag the fiber with an update effect. This turns a Placement into
// an UpdateAndPlacement.
workInProgress.effectTag|=Update$2;}function markRef(workInProgress){workInProgress.effectTag|=Ref$2;}function appendAllYields(yields,workInProgress){var node=workInProgress.stateNode;if(node){node['return']=workInProgress;}while(node!==null){if(node.tag===HostComponent$8||node.tag===HostText$6||node.tag===HostPortal$6){invariant(false,'A coroutine cannot have host component children.');}else if(node.tag===YieldComponent$4){yields.push(node.type);}else if(node.child!==null){node.child['return']=node;node=node.child;continue;}while(node.sibling===null){if(node['return']===null||node['return']===workInProgress){return;}node=node['return'];}node.sibling['return']=node['return'];node=node.sibling;}}function moveCoroutineToHandlerPhase(current,workInProgress){var coroutine=workInProgress.memoizedProps;!coroutine?invariant(false,'Should be resolved by now. This error is likely caused by a bug in React. Please file an issue.'):void 0;// First step of the coroutine has completed. Now we need to do the second.
// TODO: It would be nice to have a multi stage coroutine represented by a
// single component, or at least tail call optimize nested ones. Currently
// that requires additional fields that we don't want to add to the fiber.
// So this requires nested handlers.
// Note: This doesn't mutate the alternate node. I don't think it needs to
// since this stage is reset for every pass.
workInProgress.tag=CoroutineHandlerPhase$1;// Build up the yields.
// TODO: Compare this to a generator or opaque helpers like Children.
var yields=[];appendAllYields(yields,workInProgress);var fn=coroutine.handler;var props=coroutine.props;var nextChildren=fn(props,yields);var currentFirstChild=current!==null?current.child:null;// Inherit the priority of the returnFiber.
var priority=workInProgress.pendingWorkPriority;workInProgress.child=reconcileChildFibers$2(workInProgress,currentFirstChild,nextChildren,priority);return workInProgress.child;}function appendAllChildren(parent,workInProgress){// We only have the top Fiber that was created but we need recurse down its
// children to find all the terminal nodes.
var node=workInProgress.child;while(node!==null){if(node.tag===HostComponent$8||node.tag===HostText$6){appendInitialChild(parent,node.stateNode);}else if(node.tag===HostPortal$6){// If we have a portal child, then we don't want to traverse
// down its children. Instead, we'll get insertions from each child in
// the portal directly.
}else if(node.child!==null){node=node.child;continue;}if(node===workInProgress){return;}while(node.sibling===null){if(node['return']===null||node['return']===workInProgress){return;}node=node['return'];}node=node.sibling;}}function completeWork(current,workInProgress,renderPriority){{ReactDebugCurrentFiber$5.setCurrentFiber(workInProgress,null);}// Get the latest props.
var newProps=workInProgress.pendingProps;if(newProps===null){newProps=workInProgress.memoizedProps;}else if(workInProgress.pendingWorkPriority!==OffscreenPriority$2||renderPriority===OffscreenPriority$2){// Reset the pending props, unless this was a down-prioritization.
workInProgress.pendingProps=null;}switch(workInProgress.tag){case FunctionalComponent$3:return null;case ClassComponent$8:{// We are leaving this subtree, so pop context if any.
popContextProvider$2(workInProgress);return null;}case HostRoot$8:{popHostContainer(workInProgress);popTopLevelContextObject$1(workInProgress);var fiberRoot=workInProgress.stateNode;if(fiberRoot.pendingContext){fiberRoot.context=fiberRoot.pendingContext;fiberRoot.pendingContext=null;}if(current===null||current.child===null){// If we hydrated, pop so that we can delete any remaining children
// that weren't hydrated.
popHydrationState(workInProgress);// This resets the hacky state to fix isMounted before committing.
// TODO: Delete this when we delete isMounted and findDOMNode.
workInProgress.effectTag&=~Placement$4;}return null;}case HostComponent$8:{popHostContext(workInProgress);var rootContainerInstance=getRootHostContainer();var type=workInProgress.type;if(current!==null&&workInProgress.stateNode!=null){// If we have an alternate, that means this is an update and we need to
// schedule a side-effect to do the updates.
var oldProps=current.memoizedProps;// If we get updated because one of our children updated, we don't
// have newProps so we'll have to reuse them.
// TODO: Split the update API as separate for the props vs. children.
// Even better would be if children weren't special cased at all tho.
var instance=workInProgress.stateNode;var currentHostContext=getHostContext();var updatePayload=prepareUpdate(instance,type,oldProps,newProps,rootContainerInstance,currentHostContext);// TODO: Type this specific to this type of component.
workInProgress.updateQueue=updatePayload;// If the update payload indicates that there is a change or if there
// is a new ref we mark this as an update.
if(updatePayload){markUpdate(workInProgress);}if(current.ref!==workInProgress.ref){markRef(workInProgress);}}else{if(!newProps){!(workInProgress.stateNode!==null)?invariant(false,'We must have new props for new mounts. This error is likely caused by a bug in React. Please file an issue.'):void 0;// This can happen when we abort work.
return null;}var _currentHostContext=getHostContext();// TODO: Move createInstance to beginWork and keep it on a context
// "stack" as the parent. Then append children as we go in beginWork
// or completeWork depending on we want to add then top->down or
// bottom->up. Top->down is faster in IE11.
var wasHydrated=popHydrationState(workInProgress);if(wasHydrated){// TOOD: Move this and createInstance step into the beginPhase
// to consolidate.
if(prepareToHydrateHostInstance(workInProgress,rootContainerInstance,_currentHostContext)){// If changes to the hydrated node needs to be applied at the
// commit-phase we mark this as such.
markUpdate(workInProgress);}}else{var _instance=createInstance(type,newProps,rootContainerInstance,_currentHostContext,workInProgress);appendAllChildren(_instance,workInProgress);// Certain renderers require commit-time effects for initial mount.
// (eg DOM renderer supports auto-focus for certain elements).
// Make sure such renderers get scheduled for later work.
if(finalizeInitialChildren(_instance,type,newProps,rootContainerInstance)){markUpdate(workInProgress);}workInProgress.stateNode=_instance;}if(workInProgress.ref!==null){// If there is a ref on a host node we need to schedule a callback
markRef(workInProgress);}}return null;}case HostText$6:{var newText=newProps;if(current&&workInProgress.stateNode!=null){var oldText=current.memoizedProps;// If we have an alternate, that means this is an update and we need
// to schedule a side-effect to do the updates.
if(oldText!==newText){markUpdate(workInProgress);}}else{if(typeof newText!=='string'){!(workInProgress.stateNode!==null)?invariant(false,'We must have new props for new mounts. This error is likely caused by a bug in React. Please file an issue.'):void 0;// This can happen when we abort work.
return null;}var _rootContainerInstance=getRootHostContainer();var _currentHostContext2=getHostContext();var _wasHydrated=popHydrationState(workInProgress);if(_wasHydrated){if(prepareToHydrateHostTextInstance(workInProgress)){markUpdate(workInProgress);}}else{workInProgress.stateNode=createTextInstance(newText,_rootContainerInstance,_currentHostContext2,workInProgress);}}return null;}case CoroutineComponent$3:return moveCoroutineToHandlerPhase(current,workInProgress);case CoroutineHandlerPhase$1:// Reset the tag to now be a first phase coroutine.
workInProgress.tag=CoroutineComponent$3;return null;case YieldComponent$4:// Does nothing.
return null;case Fragment$4:return null;case HostPortal$6:// TODO: Only mark this as an update if we have any pending callbacks.
markUpdate(workInProgress);popHostContainer(workInProgress);return null;// Error cases
case IndeterminateComponent$3:invariant(false,'An indeterminate component should have become determinate before completing. This error is likely caused by a bug in React. Please file an issue.');// eslint-disable-next-line no-fallthrough
default:invariant(false,'Unknown unit of work tag. This error is likely caused by a bug in React. Please file an issue.');}}return{completeWork:completeWork};};{var warning$26=require$$0;}var onCommitFiberRoot=null;var onCommitFiberUnmount=null;var hasLoggedError=false;function catchErrors(fn){return function(arg){try{return fn(arg);}catch(err){if(true&&!hasLoggedError){hasLoggedError=true;warning$26(false,'React DevTools encountered an error: %s',err);}}};}function injectInternals$1(internals){if(typeof __REACT_DEVTOOLS_GLOBAL_HOOK__==='undefined'){// No DevTools
return false;}var hook=__REACT_DEVTOOLS_GLOBAL_HOOK__;if(!hook.supportsFiber){{warning$26(false,'The installed version of React DevTools is too old and will not work '+'with the current version of React. Please update React DevTools. '+'https://fb.me/react-devtools');}// DevTools exists, even though it doesn't support Fiber.
return true;}try{var rendererID=hook.inject(internals);// We have successfully injected, so now it is safe to set up hooks.
onCommitFiberRoot=catchErrors(function(root){return hook.onCommitFiberRoot(rendererID,root);});onCommitFiberUnmount=catchErrors(function(fiber){return hook.onCommitFiberUnmount(rendererID,fiber);});}catch(err){// Catch all errors because it is unsafe to throw during initialization.