{"patch":"diff --git a\/scripts\/fiber\/tests-failing.txt b\/scripts\/fiber\/tests-failing.txt\nindex dd4907f9b9..da68b422e9 100644\n--- a\/scripts\/fiber\/tests-failing.txt\n+++ b\/scripts\/fiber\/tests-failing.txt\n@@ -90,6 +90,7 @@ src\/renderers\/shared\/shared\/__tests__\/ReactUpdates-test.js\n * throws in setState if the update callback is not a function\n * throws in replaceState if the update callback is not a function\n * throws in forceUpdate if the update callback is not a function\n+* unmounts and remounts a root in the same batch\n \n src\/renderers\/shared\/shared\/__tests__\/refs-test.js\n * Should increase refs with an increase in divs\ndiff --git a\/scripts\/fiber\/tests-passing.txt b\/scripts\/fiber\/tests-passing.txt\nindex b8bc8acea7..586dd4f7e3 100644\n--- a\/scripts\/fiber\/tests-passing.txt\n+++ b\/scripts\/fiber\/tests-passing.txt\n@@ -1190,13 +1190,27 @@ src\/renderers\/shared\/fiber\/__tests__\/ReactIncrementalReflection-test.js\n * finds no node before insertion and correct node before deletion\n \n src\/renderers\/shared\/fiber\/__tests__\/ReactIncrementalScheduling-test.js\n-* schedules and flushes deferred work\n * schedules and flushes animation work\n-* searches for work on other roots once the current root completes\n-* schedules an animation callback when there`s leftover animation work\n-* schedules top-level updates in order of priority\n-* schedules top-level updates with same priority in order of insertion\n+* schedules and flushes animation work for many roots\n+* flushes all scheduled animation work\n+* flushes all scheduled animation work for many roots\n+* schedules and flushes deferred work\n+* schedules and flushes deferred work for many roots\n+* flushes scheduled deferred work fitting within deadline\n+* flushes scheduled deferred work fitting within deadline for many roots\n+* schedules more deferred work if it runs out of time\n+* schedules more deferred work if it runs out of time with many roots\n+* flushes late animation work in a deferred callback if it wins\n+* flushes late animation work in a deferred callback if it wins with many roots\n+* flushes late animation work in an animation callback if it wins\n+* flushes late animation work in an animation callback if it wins with many roots\n+* flushes all work in a deferred callback if it wins\n+* flushes all work in a deferred callback if it wins with many roots\n+* flushes root with late deferred work in an animation callback if it wins\n+* flushes all roots with animation work in an animation callback if it wins\n+* splits deferred work on multiple roots\n * works on deferred roots in the order they were scheduled\n+* handles interleaved deferred and animation work\n * schedules sync updates when inside componentDidMount\/Update\n * can opt-in to deferred\/animation scheduling inside componentDidMount\/Update\n * performs Task work even after time runs out\n@@ -1559,7 +1573,6 @@ src\/renderers\/shared\/shared\/__tests__\/ReactUpdates-test.js\n * does not update one component twice in a batch (#2410)\n * does not update one component twice in a batch (#6371)\n * unstable_batchedUpdates should return value from a callback\n-* unmounts and remounts a root in the same batch\n \n src\/renderers\/shared\/shared\/__tests__\/refs-destruction-test.js\n * should remove refs when destroying the parent\ndiff --git a\/src\/renderers\/art\/ReactARTFiber.js b\/src\/renderers\/art\/ReactARTFiber.js\nindex 89bbc61fda..1c6160d039 100644\n--- a\/src\/renderers\/art\/ReactARTFiber.js\n+++ b\/src\/renderers\/art\/ReactARTFiber.js\n@@ -357,11 +357,7 @@ class Surface extends Component {\n }\n \n componentWillUnmount() {\n- ARTRenderer.updateContainer(\n- null,\n- this._mountNode,\n- this,\n- );\n+ ARTRenderer.unmountContainer(this._mountNode);\n }\n \n render() {\ndiff --git a\/src\/renderers\/dom\/fiber\/ReactDOMFiber.js b\/src\/renderers\/dom\/fiber\/ReactDOMFiber.js\nindex 738b5bf53a..3bbc4d52a0 100644\n--- a\/src\/renderers\/dom\/fiber\/ReactDOMFiber.js\n+++ b\/src\/renderers\/dom\/fiber\/ReactDOMFiber.js\n@@ -259,7 +259,7 @@ function warnAboutUnstableUse() {\n warned = true;\n }\n \n-function renderSubtreeIntoContainer(parentComponent : ?ReactComponent, children : ReactNodeList, containerNode : DOMContainerElement | Document, callback: ?Function) {\n+function renderSubtreeIntoContainer(parentComponent : ?ReactComponent, element : ReactElement, containerNode : DOMContainerElement | Document, callback: ?Function) {\n let container : DOMContainerElement =\n containerNode.nodeType === DOCUMENT_NODE ? (containerNode : any).documentElement : (containerNode : any);\n let root;\n@@ -268,9 +268,9 @@ function renderSubtreeIntoContainer(parentComponent : ?ReactComponent {\n+ const root = container._reactRootContainer;\n+ if (root) {\n+ \/\/ TODO: Is it safe to reset this now or should I wait since this\n+ \/\/ unmount could be deferred?\n container._reactRootContainer = null;\n- });\n+ DOMRenderer.unmountContainer(root);\n+ }\n },\n \n findDOMNode: findDOMNode,\ndiff --git a\/src\/renderers\/native\/ReactNativeFiber.js b\/src\/renderers\/native\/ReactNativeFiber.js\nindex 42b39aca47..41fe052b7e 100644\n--- a\/src\/renderers\/native\/ReactNativeFiber.js\n+++ b\/src\/renderers\/native\/ReactNativeFiber.js\n@@ -329,7 +329,7 @@ const NativeRenderer = ReactFiberReconciler({\n \/\/ But creates an additional child Fiber for raw text children.\n \/\/ No additional native views are created though.\n \/\/ It's not clear to me which is better so I'm deferring for now.\n- \/\/ More context @ github.com\/facebook\/react\/pull\/8560#discussion_r92111303\n+ \/\/ More context @ github.com\/facebook\/react\/pull\/8560#discussion_r92111303 \n return false;\n },\n \n@@ -375,9 +375,8 @@ const ReactNative = {\n const root = roots.get(containerTag);\n if (root) {\n \/\/ TODO: Is it safe to reset this now or should I wait since this unmount could be deferred?\n- NativeRenderer.updateContainer(null, root, null, () => {\n- roots.delete(containerTag);\n- });\n+ roots.delete(containerTag);\n+ NativeRenderer.unmountContainer(root);\n }\n },\n \ndiff --git a\/src\/renderers\/noop\/ReactNoop.js b\/src\/renderers\/noop\/ReactNoop.js\nindex 6dde764abd..6e5102859b 100644\n--- a\/src\/renderers\/noop\/ReactNoop.js\n+++ b\/src\/renderers\/noop\/ReactNoop.js\n@@ -198,11 +198,10 @@ var ReactNoop = {\n \n unmountRootWithID(rootID : string) {\n const root = roots.get(rootID);\n+ roots.delete(rootID);\n+ rootContainers.delete(rootID);\n if (root) {\n- NoopRenderer.updateContainer(null, root, null, () => {\n- roots.delete(rootID);\n- rootContainers.delete(rootID);\n- });\n+ NoopRenderer.unmountContainer(root);\n }\n },\n \n@@ -305,16 +304,14 @@ var ReactNoop = {\n log(\n ' '.repeat(depth + 1) + '~',\n firstUpdate && firstUpdate.partialState,\n- firstUpdate.callback ? 'with callback' : '',\n- '[' + firstUpdate.priorityLevel + ']'\n+ firstUpdate.callback ? 'with callback' : ''\n );\n var next;\n while (next = firstUpdate.next) {\n log(\n ' '.repeat(depth + 1) + '~',\n next.partialState,\n- next.callback ? 'with callback' : '',\n- '[' + firstUpdate.priorityLevel + ']'\n+ next.callback ? 'with callback' : ''\n );\n }\n }\ndiff --git a\/src\/renderers\/shared\/fiber\/ReactFiberBeginWork.js b\/src\/renderers\/shared\/fiber\/ReactFiberBeginWork.js\nindex f7442c7bbd..35b3570db0 100644\n--- a\/src\/renderers\/shared\/fiber\/ReactFiberBeginWork.js\n+++ b\/src\/renderers\/shared\/fiber\/ReactFiberBeginWork.js\n@@ -542,16 +542,13 @@ module.exports = function(\n pushTopLevelContextObject(root.context, false);\n }\n \n- pushHostContainer(root.containerInfo);\n-\n if (updateQueue) {\n- const prevState = workInProgress.memoizedState;\n- const state = beginUpdateQueue(workInProgress, updateQueue, null, prevState, null, priorityLevel);\n- const element = state.element;\n- reconcileChildren(current, workInProgress, element);\n- workInProgress.memoizedState = state;\n+ beginUpdateQueue(workInProgress, updateQueue, null, null, null, priorityLevel);\n }\n \n+ pushHostContainer(workInProgress.stateNode.containerInfo);\n+ reconcileChildren(current, workInProgress, pendingProps);\n+\n \/\/ A yield component is just a placeholder, we can just run through the\n \/\/ next one immediately.\n return workInProgress.child;\ndiff --git a\/src\/renderers\/shared\/fiber\/ReactFiberReconciler.js b\/src\/renderers\/shared\/fiber\/ReactFiberReconciler.js\nindex c22ef6a47f..0a9b042471 100644\n--- a\/src\/renderers\/shared\/fiber\/ReactFiberReconciler.js\n+++ b\/src\/renderers\/shared\/fiber\/ReactFiberReconciler.js\n@@ -15,7 +15,6 @@\n import type { Fiber } from 'ReactFiber';\n import type { FiberRoot } from 'ReactFiberRoot';\n import type { PriorityLevel } from 'ReactPriorityLevel';\n-import type { ReactNodeList } from 'ReactTypes';\n \n var {\n findCurrentUnmaskedContext,\n@@ -71,8 +70,9 @@ export type HostConfig = {\n };\n \n export type Reconciler = {\n- mountContainer(element : ReactNodeList, containerInfo : C, parentComponent : ?ReactComponent) : OpaqueNode,\n- updateContainer(element : ReactNodeList, container : OpaqueNode, parentComponent : ?ReactComponent) : void,\n+ mountContainer(element : ReactElement, containerInfo : C, parentComponent : ?ReactComponent) : OpaqueNode,\n+ updateContainer(element : ReactElement, container : OpaqueNode, parentComponent : ?ReactComponent) : void,\n+ unmountContainer(container : OpaqueNode) : void,\n performWithPriority(priorityLevel : PriorityLevel, fn : Function) : void,\n \/* eslint-disable no-undef *\/\n \/\/ FIXME: ESLint complains about type parameter\n@@ -98,7 +98,7 @@ getContextForSubtree._injectFiber(function(fiber : Fiber) {\n module.exports = function(config : HostConfig) : Reconciler {\n \n var {\n- scheduleTopLevelSetState,\n+ scheduleWork,\n scheduleUpdateCallback,\n performWithPriority,\n batchedUpdates,\n@@ -108,16 +108,25 @@ module.exports = function(config : HostConfig, callback: ?Function) : OpaqueNode {\n+ mountContainer(element : ReactElement, containerInfo : C, parentComponent : ?ReactComponent, callback: ?Function) : OpaqueNode {\n const context = getContextForSubtree(parentComponent);\n const root = createFiberRoot(containerInfo, context);\n const current = root.current;\n \n- scheduleTopLevelSetState(current, { element });\n+ \/\/ TODO: Use the updateQueue and scheduleUpdate, instead of pendingProps.\n+ \/\/ TODO: This should not override the pendingWorkPriority if there is\n+ \/\/ higher priority work in the subtree.\n+\n+ current.pendingProps = element;\n+ if (current.alternate) {\n+ current.alternate.pendingProps = element;\n+ }\n if (callback) {\n scheduleUpdateCallback(current, callback);\n }\n \n+ scheduleWork(root);\n+\n if (__DEV__ && ReactFiberInstrumentation.debugTool) {\n ReactFiberInstrumentation.debugTool.onMountContainer(root);\n }\n@@ -128,27 +137,44 @@ module.exports = function(config : HostConfig, callback: ?Function) : void {\n+ updateContainer(element : ReactElement, container : OpaqueNode, parentComponent : ?ReactComponent, callback: ?Function) : void {\n \/\/ TODO: If this is a nested container, this won't be the root.\n const root : FiberRoot = (container.stateNode : any);\n const current = root.current;\n \n root.pendingContext = getContextForSubtree(parentComponent);\n \n- scheduleTopLevelSetState(current, { element });\n+ \/\/ TODO: Use the updateQueue and scheduleUpdate, instead of pendingProps.\n+ \/\/ TODO: This should not override the pendingWorkPriority if there is\n+ \/\/ higher priority work in the subtree.\n+ current.pendingProps = element;\n+ if (current.alternate) {\n+ current.alternate.pendingProps = element;\n+ }\n if (callback) {\n scheduleUpdateCallback(current, callback);\n }\n \n- if (__DEV__) {\n- if (ReactFiberInstrumentation.debugTool) {\n- if (element === null) {\n- ReactFiberInstrumentation.debugTool.onUpdateContainer(root);\n- } else {\n- \/\/ This is an unmount\n- ReactFiberInstrumentation.debugTool.onUnmountContainer(root);\n- }\n- }\n+ scheduleWork(root);\n+\n+ if (__DEV__ && ReactFiberInstrumentation.debugTool) {\n+ ReactFiberInstrumentation.debugTool.onUpdateContainer(root);\n+ }\n+ },\n+\n+ unmountContainer(container : OpaqueNode) : void {\n+ \/\/ TODO: If this is a nested container, this won't be the root.\n+ const root : FiberRoot = (container.stateNode : any);\n+ \/\/ TODO: Use pending work\/state instead of props.\n+ root.current.pendingProps = [];\n+ if (root.current.alternate) {\n+ root.current.alternate.pendingProps = [];\n+ }\n+\n+ scheduleWork(root);\n+\n+ if (__DEV__ && ReactFiberInstrumentation.debugTool) {\n+ ReactFiberInstrumentation.debugTool.onUnmountContainer(root);\n }\n },\n \ndiff --git a\/src\/renderers\/shared\/fiber\/ReactFiberScheduler.js b\/src\/renderers\/shared\/fiber\/ReactFiberScheduler.js\nindex 356c25422a..88887082d6 100644\n--- a\/src\/renderers\/shared\/fiber\/ReactFiberScheduler.js\n+++ b\/src\/renderers\/shared\/fiber\/ReactFiberScheduler.js\n@@ -59,7 +59,6 @@ var {\n addReplaceUpdate,\n addForceUpdate,\n addCallback,\n- addTopLevelUpdate,\n } = require('ReactFiberUpdateQueue');\n \n var {\n@@ -945,10 +944,28 @@ module.exports = function(config : HostConfig(config : HostConfig(config : HostConfig(config : HostConfig(config : HostConfig,\n- priorityLevel : PriorityLevel\n-) : void {\n- const isTopLevelUnmount = partialState === null;\n-\n- const update = {\n- priorityLevel,\n- partialState,\n- callback: null,\n- isReplace: false,\n- isForced: false,\n- isTopLevelUnmount,\n- next: null,\n- };\n- const update2 = insertUpdate(fiber, update);\n-\n- if (isTopLevelUnmount) {\n- \/\/ Drop all updates that are lower-priority, so that the tree is not\n- \/\/ remounted. We need to do this for both queues.\n- const queue1 = fiber.updateQueue;\n- const queue2 = fiber.alternate && fiber.alternate.updateQueue;\n-\n- if (queue1 && update.next) {\n- update.next = null;\n- queue1.last = update;\n- }\n- if (queue2 && update2 && update2.next) {\n- update2.next = null;\n- queue2.last = update;\n- }\n- }\n-}\n-exports.addTopLevelUpdate = addTopLevelUpdate;\n-\n function getStateFromUpdate(update, instance, prevState, props) {\n const partialState = update.partialState;\n if (typeof partialState === 'function') {\n@@ -459,14 +412,12 @@ function beginUpdateQueue(\n if (update.isForced) {\n queue.hasForceUpdate = true;\n }\n- \/\/ Second condition ignores top-level unmount callbacks if they are not the\n- \/\/ last update in the queue, since a subsequent update will cause a remount.\n- if (update.callback && !(update.isTopLevelUnmount && update.next)) {\n- const callbackUpdate = cloneUpdate(update);\n+ if (update.callback) {\n if (callbackList && callbackList.last) {\n- callbackList.last.next = callbackUpdate;\n- callbackList.last = callbackUpdate;\n+ callbackList.last.next = update;\n+ callbackList.last = update;\n } else {\n+ const callbackUpdate = cloneUpdate(update);\n callbackList = {\n first: callbackUpdate,\n last: callbackUpdate,\ndiff --git a\/src\/renderers\/shared\/fiber\/__tests__\/ReactIncremental-test.js b\/src\/renderers\/shared\/fiber\/__tests__\/ReactIncremental-test.js\nindex 6683a8edb0..3a91f6c3cc 100644\n--- a\/src\/renderers\/shared\/fiber\/__tests__\/ReactIncremental-test.js\n+++ b\/src\/renderers\/shared\/fiber\/__tests__\/ReactIncremental-test.js\n@@ -267,6 +267,7 @@ describe('ReactIncremental', () => {\n ReactNoop.performAnimationWork(() => {\n ReactNoop.render();\n });\n+ ReactNoop.render();\n ReactNoop.flushAnimationPri();\n \n expect(ops).toEqual(['Foo', 'Bar', 'Bar']);\ndiff --git a\/src\/renderers\/shared\/fiber\/__tests__\/ReactIncrementalErrorHandling-test.js b\/src\/renderers\/shared\/fiber\/__tests__\/ReactIncrementalErrorHandling-test.js\nindex 94a163a80d..3ee13eaa63 100644\n--- a\/src\/renderers\/shared\/fiber\/__tests__\/ReactIncrementalErrorHandling-test.js\n+++ b\/src\/renderers\/shared\/fiber\/__tests__\/ReactIncrementalErrorHandling-test.js\n@@ -654,7 +654,6 @@ describe('ReactIncrementalErrorHandling', () => {\n ReactNoop.unmountRootWithID('d');\n ReactNoop.unmountRootWithID('e');\n ReactNoop.unmountRootWithID('f');\n- ReactNoop.flush();\n expect(ReactNoop.getChildren('a')).toEqual(null);\n expect(ReactNoop.getChildren('b')).toEqual(null);\n expect(ReactNoop.getChildren('c')).toEqual(null);\ndiff --git a\/src\/renderers\/shared\/fiber\/__tests__\/ReactIncrementalScheduling-test.js b\/src\/renderers\/shared\/fiber\/__tests__\/ReactIncrementalScheduling-test.js\nindex c00dc89f37..f1bc165d2f 100644\n--- a\/src\/renderers\/shared\/fiber\/__tests__\/ReactIncrementalScheduling-test.js\n+++ b\/src\/renderers\/shared\/fiber\/__tests__\/ReactIncrementalScheduling-test.js\n@@ -25,93 +25,351 @@ describe('ReactIncrementalScheduling', () => {\n return { type: 'span', children: [], prop };\n }\n \n- it('schedules and flushes deferred work', () => {\n- ReactNoop.render();\n+ it('schedules and flushes animation work', () => {\n+ ReactNoop.performAnimationWork(() => {\n+ ReactNoop.render();\n+ });\n expect(ReactNoop.getChildren()).toEqual([]);\n \n- ReactNoop.flushDeferredPri();\n+ ReactNoop.flushAnimationPri();\n expect(ReactNoop.getChildren()).toEqual([span('1')]);\n });\n \n- it('schedules and flushes animation work', () => {\n+ it('schedules and flushes animation work for many roots', () => {\n+ ReactNoop.performAnimationWork(() => {\n+ ReactNoop.renderToRootWithID(, 'a');\n+ ReactNoop.renderToRootWithID(, 'b');\n+ ReactNoop.renderToRootWithID(, 'c');\n+ });\n+ expect(ReactNoop.getChildren('a')).toEqual([]);\n+ expect(ReactNoop.getChildren('b')).toEqual([]);\n+ expect(ReactNoop.getChildren('c')).toEqual([]);\n+\n+ ReactNoop.flushAnimationPri();\n+ expect(ReactNoop.getChildren('a')).toEqual([span('a:1')]);\n+ expect(ReactNoop.getChildren('b')).toEqual([span('b:1')]);\n+ expect(ReactNoop.getChildren('c')).toEqual([span('c:1')]);\n+ });\n+\n+ it('flushes all scheduled animation work', () => {\n ReactNoop.performAnimationWork(() => {\n ReactNoop.render();\n });\n+ ReactNoop.performAnimationWork(() => {\n+ ReactNoop.render();\n+ });\n expect(ReactNoop.getChildren()).toEqual([]);\n \n ReactNoop.flushAnimationPri();\n+ expect(ReactNoop.getChildren()).toEqual([span('2')]);\n+ });\n+\n+ it('flushes all scheduled animation work for many roots', () => {\n+ ReactNoop.performAnimationWork(() => {\n+ ReactNoop.renderToRootWithID(, 'a');\n+ ReactNoop.renderToRootWithID(, 'b');\n+ ReactNoop.renderToRootWithID(, 'c');\n+ });\n+ ReactNoop.performAnimationWork(() => {\n+ ReactNoop.renderToRootWithID(, 'a');\n+ ReactNoop.renderToRootWithID(, 'b');\n+ ReactNoop.renderToRootWithID(, 'c');\n+ });\n+ expect(ReactNoop.getChildren('a')).toEqual([]);\n+ expect(ReactNoop.getChildren('b')).toEqual([]);\n+ expect(ReactNoop.getChildren('c')).toEqual([]);\n+\n+ ReactNoop.flushAnimationPri();\n+ expect(ReactNoop.getChildren('a')).toEqual([span('a:2')]);\n+ expect(ReactNoop.getChildren('b')).toEqual([span('b:2')]);\n+ expect(ReactNoop.getChildren('c')).toEqual([span('c:2')]);\n+ });\n+\n+ it('schedules and flushes deferred work', () => {\n+ ReactNoop.render();\n+ expect(ReactNoop.getChildren()).toEqual([]);\n+\n+ ReactNoop.flushDeferredPri();\n expect(ReactNoop.getChildren()).toEqual([span('1')]);\n });\n \n- it('searches for work on other roots once the current root completes', () => {\n+ it('schedules and flushes deferred work for many roots', () => {\n ReactNoop.renderToRootWithID(, 'a');\n ReactNoop.renderToRootWithID(, 'b');\n ReactNoop.renderToRootWithID(, 'c');\n+ expect(ReactNoop.getChildren('a')).toEqual([]);\n+ expect(ReactNoop.getChildren('b')).toEqual([]);\n+ expect(ReactNoop.getChildren('c')).toEqual([]);\n \n- ReactNoop.flush();\n-\n+ ReactNoop.flushDeferredPri();\n expect(ReactNoop.getChildren('a')).toEqual([span('a:1')]);\n expect(ReactNoop.getChildren('b')).toEqual([span('b:1')]);\n expect(ReactNoop.getChildren('c')).toEqual([span('c:1')]);\n });\n \n- it('schedules an animation callback when there`\\s leftover animation work', () => {\n- class Foo extends React.Component {\n- state = { step: 0 };\n- componentDidMount() {\n- ReactNoop.performAnimationWork(() => {\n- this.setState({ step: 2 });\n- });\n- this.setState({ step: 1 });\n- }\n- render() {\n- return ;\n- }\n- }\n+ it('flushes scheduled deferred work fitting within deadline', () => {\n+ ReactNoop.render();\n+ ReactNoop.render();\n+ expect(ReactNoop.getChildren()).toEqual([]);\n \n- ReactNoop.render();\n- \/\/ Flush just enough work to mount the component, but not enough to flush\n- \/\/ the animation update.\n- ReactNoop.flushDeferredPri(25);\n- expect(ReactNoop.getChildren()).toEqual([span(1)]);\n+ ReactNoop.flushDeferredPri();\n+ expect(ReactNoop.getChildren()).toEqual([span('2')]);\n+ });\n+\n+ it('flushes scheduled deferred work fitting within deadline for many roots', () => {\n+ ReactNoop.renderToRootWithID(, 'a');\n+ ReactNoop.renderToRootWithID(, 'a');\n+ ReactNoop.renderToRootWithID(, 'b');\n+ ReactNoop.renderToRootWithID(, 'b');\n+ ReactNoop.renderToRootWithID(, 'c');\n+ ReactNoop.renderToRootWithID(, 'c');\n+ expect(ReactNoop.getChildren('a')).toEqual([]);\n+ expect(ReactNoop.getChildren('b')).toEqual([]);\n+ expect(ReactNoop.getChildren('c')).toEqual([]);\n+\n+ ReactNoop.flushDeferredPri();\n+ expect(ReactNoop.getChildren('a')).toEqual([span('a:2')]);\n+ expect(ReactNoop.getChildren('b')).toEqual([span('b:2')]);\n+ expect(ReactNoop.getChildren('c')).toEqual([span('c:2')]);\n+ });\n+\n+ it('schedules more deferred work if it runs out of time', () => {\n+ ReactNoop.render();\n+ ReactNoop.render();\n+ expect(ReactNoop.getChildren()).toEqual([]);\n+\n+ ReactNoop.flushDeferredPri(5);\n+ expect(ReactNoop.getChildren()).toEqual([]);\n+\n+ ReactNoop.flushDeferredPri(10);\n+ expect(ReactNoop.getChildren()).toEqual([]);\n+\n+ ReactNoop.flushDeferredPri(10 + 5);\n+ expect(ReactNoop.getChildren()).toEqual([span('2')]);\n+ });\n+\n+ it('schedules more deferred work if it runs out of time with many roots', () => {\n+ ReactNoop.renderToRootWithID(, 'a');\n+ ReactNoop.renderToRootWithID(, 'a');\n+ ReactNoop.renderToRootWithID(, 'b');\n+ ReactNoop.renderToRootWithID(, 'b');\n+ ReactNoop.renderToRootWithID(, 'c');\n+ ReactNoop.renderToRootWithID(, 'c');\n+ expect(ReactNoop.getChildren('a')).toEqual([]);\n+ expect(ReactNoop.getChildren('b')).toEqual([]);\n+ expect(ReactNoop.getChildren('c')).toEqual([]);\n \n- \/\/ There's more animation work. A callback should have been scheduled.\n+ ReactNoop.flushDeferredPri(15 + 5);\n+ expect(ReactNoop.getChildren('a')).toEqual([span('a:2')]);\n+ expect(ReactNoop.getChildren('b')).toEqual([]);\n+ expect(ReactNoop.getChildren('c')).toEqual([]);\n+\n+ ReactNoop.flushDeferredPri(15 + 5);\n+ expect(ReactNoop.getChildren('a')).toEqual([span('a:2')]);\n+ expect(ReactNoop.getChildren('b')).toEqual([span('b:2')]);\n+ expect(ReactNoop.getChildren('c')).toEqual([]);\n+\n+ ReactNoop.flushDeferredPri(15 + 5);\n+ expect(ReactNoop.getChildren('a')).toEqual([span('a:2')]);\n+ expect(ReactNoop.getChildren('b')).toEqual([span('b:2')]);\n+ expect(ReactNoop.getChildren('c')).toEqual([span('c:2')]);\n+ });\n+\n+ it('flushes late animation work in a deferred callback if it wins', () => {\n+ \/\/ Schedule early deferred\n+ ReactNoop.render();\n+ \/\/ Schedule late animation\n+ ReactNoop.performAnimationWork(() => {\n+ ReactNoop.render();\n+ });\n+ expect(ReactNoop.getChildren()).toEqual([]);\n+\n+ \/\/ We only scheduled deferred callback so that's what we get.\n+ \/\/ It will flush everything.\n+ ReactNoop.flushDeferredPri();\n+ expect(ReactNoop.getChildren()).toEqual([span('2')]);\n+ });\n+\n+ it('flushes late animation work in a deferred callback if it wins with many roots', () => {\n+ \/\/ Schedule early deferred\n+ ReactNoop.renderToRootWithID(, 'a');\n+ ReactNoop.renderToRootWithID(, 'b');\n+ \/\/ Schedule late animation\n+ ReactNoop.performAnimationWork(() => {\n+ ReactNoop.renderToRootWithID(, 'b');\n+ ReactNoop.renderToRootWithID(, 'c');\n+ });\n+ expect(ReactNoop.getChildren('a')).toEqual([]);\n+ expect(ReactNoop.getChildren('b')).toEqual([]);\n+ expect(ReactNoop.getChildren('c')).toEqual([]);\n+\n+ \/\/ We only scheduled deferred callback so that's what we get.\n+ \/\/ It will flush everything.\n+ ReactNoop.flushDeferredPri();\n+ expect(ReactNoop.getChildren('a')).toEqual([span('a:1')]);\n+ expect(ReactNoop.getChildren('b')).toEqual([span('b:2')]);\n+ expect(ReactNoop.getChildren('c')).toEqual([span('c:2')]);\n+ });\n+\n+ it('flushes late animation work in an animation callback if it wins', () => {\n+ \/\/ Schedule early deferred\n+ ReactNoop.render();\n+ \/\/ Schedule late animation\n+ ReactNoop.performAnimationWork(() => {\n+ ReactNoop.render();\n+ });\n+ expect(ReactNoop.getChildren()).toEqual([]);\n+\n+ \/\/ Flushing animation should have flushed the animation.\n ReactNoop.flushAnimationPri();\n- expect(ReactNoop.getChildren()).toEqual([span(2)]);\n+ expect(ReactNoop.getChildren()).toEqual([span('2')]);\n });\n \n- it('schedules top-level updates in order of priority', () => {\n- \/\/ Initial render.\n- ReactNoop.render();\n- ReactNoop.flush();\n- expect(ReactNoop.getChildren()).toEqual([span(1)]);\n+ it('flushes late animation work in an animation callback if it wins with many roots', () => {\n+ \/\/ Schedule early deferred\n+ ReactNoop.renderToRootWithID(, 'a');\n+ ReactNoop.renderToRootWithID(, 'b');\n+ \/\/ Schedule late animation\n+ ReactNoop.performAnimationWork(() => {\n+ ReactNoop.renderToRootWithID(, 'b');\n+ ReactNoop.renderToRootWithID(, 'c');\n+ });\n+ expect(ReactNoop.getChildren('a')).toEqual([]);\n+ expect(ReactNoop.getChildren('b')).toEqual([]);\n+ expect(ReactNoop.getChildren('c')).toEqual([]);\n \n- ReactNoop.render();\n+ \/\/ Flushing animation should have flushed the animation.\n+ ReactNoop.flushAnimationPri();\n+ expect(ReactNoop.getChildren('a')).toEqual([]);\n+ expect(ReactNoop.getChildren('b')).toEqual([span('b:2')]);\n+ expect(ReactNoop.getChildren('c')).toEqual([span('c:2')]);\n+\n+ ReactNoop.flushDeferredPri();\n+ expect(ReactNoop.getChildren('a')).toEqual([span('a:1')]);\n+ expect(ReactNoop.getChildren('b')).toEqual([span('b:2')]);\n+ expect(ReactNoop.getChildren('c')).toEqual([span('c:2')]);\n+ });\n+\n+ it('flushes all work in a deferred callback if it wins', () => {\n+ \/\/ Schedule early animation\n ReactNoop.performAnimationWork(() => {\n- ReactNoop.render();\n- ReactNoop.render();\n- ReactNoop.render();\n+ ReactNoop.render();\n });\n+ \/\/ Schedule late deferred\n+ ReactNoop.render();\n+ expect(ReactNoop.getChildren()).toEqual([]);\n \n- \/\/ The low pri update should be flushed last, even though it was scheduled\n- \/\/ before the animation updates.\n- ReactNoop.flush();\n- expect(ReactNoop.getChildren()).toEqual([span(5)]);\n+ \/\/ Flushing deferred should have flushed both early animation and late deferred work that invalidated it.\n+ \/\/ This is not a common case, as animation should generally be flushed before deferred work.\n+ ReactNoop.flushDeferredPri();\n+ expect(ReactNoop.getChildren()).toEqual([span('2')]);\n });\n \n- it('schedules top-level updates with same priority in order of insertion', () => {\n- \/\/ Initial render.\n- ReactNoop.render();\n- ReactNoop.flush();\n- expect(ReactNoop.getChildren()).toEqual([span(1)]);\n+ it('flushes all work in a deferred callback if it wins with many roots', () => {\n+ \/\/ Schedule early animation\n+ ReactNoop.performAnimationWork(() => {\n+ ReactNoop.renderToRootWithID(, 'a');\n+ ReactNoop.renderToRootWithID(, 'b');\n+ });\n+ \/\/ Schedule late deferred\n+ ReactNoop.renderToRootWithID(, 'b');\n+ ReactNoop.renderToRootWithID(, 'c');\n+ expect(ReactNoop.getChildren('a')).toEqual([]);\n+ expect(ReactNoop.getChildren('b')).toEqual([]);\n+ expect(ReactNoop.getChildren('c')).toEqual([]);\n \n- ReactNoop.render();\n- ReactNoop.render();\n- ReactNoop.render();\n- ReactNoop.render();\n+ \/\/ Flushing deferred should have flushed both early animation and late deferred work that invalidated it.\n+ \/\/ This is not a common case, as animation should generally be flushed before deferred work.\n+ ReactNoop.flushDeferredPri();\n+ expect(ReactNoop.getChildren('a')).toEqual([span('a:1')]);\n+ expect(ReactNoop.getChildren('b')).toEqual([span('b:2')]);\n+ expect(ReactNoop.getChildren('c')).toEqual([span('c:2')]);\n+ });\n \n- ReactNoop.flush();\n- expect(ReactNoop.getChildren()).toEqual([span(5)]);\n+ it('flushes root with late deferred work in an animation callback if it wins', () => {\n+ \/\/ Schedule early animation\n+ ReactNoop.performAnimationWork(() => {\n+ ReactNoop.render();\n+ });\n+ \/\/ Schedule late deferred\n+ ReactNoop.render();\n+ expect(ReactNoop.getChildren()).toEqual([]);\n+\n+ \/\/ Flushing animation work flushes everything on this root.\n+ ReactNoop.flushAnimationPri();\n+ expect(ReactNoop.getChildren()).toEqual([span('2')]);\n+ });\n+\n+ it('flushes all roots with animation work in an animation callback if it wins', () => {\n+ \/\/ Schedule early animation\n+ ReactNoop.performAnimationWork(() => {\n+ ReactNoop.renderToRootWithID(, 'a');\n+ ReactNoop.renderToRootWithID(, 'b');\n+ });\n+ \/\/ Schedule late deferred\n+ ReactNoop.renderToRootWithID(, 'b');\n+ ReactNoop.renderToRootWithID(, 'c');\n+ expect(ReactNoop.getChildren('a')).toEqual([]);\n+ expect(ReactNoop.getChildren('b')).toEqual([]);\n+ expect(ReactNoop.getChildren('c')).toEqual([]);\n+\n+ \/\/ Flushing animation work flushes all roots with animation work.\n+ ReactNoop.flushAnimationPri();\n+ expect(ReactNoop.getChildren('a')).toEqual([span('a:1')]);\n+ expect(ReactNoop.getChildren('b')).toEqual([span('b:2')]);\n+ expect(ReactNoop.getChildren('c')).toEqual([]);\n+\n+ \/\/ Flushing deferred work flushes the root with only deferred work.\n+ ReactNoop.flushDeferredPri();\n+ expect(ReactNoop.getChildren('a')).toEqual([span('a:1')]);\n+ expect(ReactNoop.getChildren('b')).toEqual([span('b:2')]);\n+ expect(ReactNoop.getChildren('c')).toEqual([span('c:2')]);\n+ });\n+\n+ it('splits deferred work on multiple roots', () => {\n+ \/\/ Schedule one root\n+ ReactNoop.renderToRootWithID(, 'a');\n+ ReactNoop.flushDeferredPri(15 + 5);\n+ expect(ReactNoop.getChildren('a')).toEqual([span('a:1')]);\n+\n+ \/\/ Schedule two roots\n+ ReactNoop.renderToRootWithID(, 'a');\n+ ReactNoop.renderToRootWithID(, 'b');\n+ \/\/ First scheduled one gets processed first\n+ ReactNoop.flushDeferredPri(15 + 5);\n+ expect(ReactNoop.getChildren('a')).toEqual([span('a:2')]);\n+ expect(ReactNoop.getChildren('b')).toEqual([]);\n+ expect(ReactNoop.getChildren('c')).toEqual(null);\n+ \/\/ Then the second one gets processed\n+ ReactNoop.flushDeferredPri(15 + 5);\n+ expect(ReactNoop.getChildren('a')).toEqual([span('a:2')]);\n+ expect(ReactNoop.getChildren('b')).toEqual([span('b:2')]);\n+ expect(ReactNoop.getChildren('c')).toEqual(null);\n+\n+ \/\/ Schedule three roots\n+ ReactNoop.renderToRootWithID(, 'a');\n+ ReactNoop.renderToRootWithID(, 'b');\n+ ReactNoop.renderToRootWithID(, 'c');\n+ \/\/ They get processed in the order they were scheduled\n+ ReactNoop.flushDeferredPri(15 + 5);\n+ expect(ReactNoop.getChildren('a')).toEqual([span('a:3')]);\n+ expect(ReactNoop.getChildren('b')).toEqual([span('b:2')]);\n+ expect(ReactNoop.getChildren('c')).toEqual([]);\n+ ReactNoop.flushDeferredPri(15 + 5);\n+ expect(ReactNoop.getChildren('a')).toEqual([span('a:3')]);\n+ expect(ReactNoop.getChildren('b')).toEqual([span('b:3')]);\n+ expect(ReactNoop.getChildren('c')).toEqual([]);\n+ ReactNoop.flushDeferredPri(15 + 5);\n+ expect(ReactNoop.getChildren('a')).toEqual([span('a:3')]);\n+ expect(ReactNoop.getChildren('b')).toEqual([span('b:3')]);\n+ expect(ReactNoop.getChildren('c')).toEqual([span('c:3')]);\n+\n+ \/\/ Schedule one root many times\n+ ReactNoop.renderToRootWithID(, 'a');\n+ ReactNoop.renderToRootWithID(, 'a');\n+ ReactNoop.renderToRootWithID(, 'a');\n+ ReactNoop.flushDeferredPri(15 + 5);\n+ expect(ReactNoop.getChildren('a')).toEqual([span('a:6')]);\n });\n \n it('works on deferred roots in the order they were scheduled', () => {\n@@ -144,6 +402,54 @@ describe('ReactIncrementalScheduling', () => {\n expect(ReactNoop.getChildren('c')).toEqual([span('c:2')]);\n });\n \n+ it('handles interleaved deferred and animation work', () => {\n+ ReactNoop.renderToRootWithID(, 'a');\n+ ReactNoop.renderToRootWithID(, 'b');\n+ ReactNoop.renderToRootWithID(, 'c');\n+ ReactNoop.flush();\n+ expect(ReactNoop.getChildren('a')).toEqual([span('a:1')]);\n+ expect(ReactNoop.getChildren('b')).toEqual([span('b:1')]);\n+ expect(ReactNoop.getChildren('c')).toEqual([span('c:1')]);\n+\n+ \/\/ Schedule both deferred and animation work\n+ ReactNoop.renderToRootWithID(, 'a');\n+ ReactNoop.performAnimationWork(() => {\n+ ReactNoop.renderToRootWithID(, 'b');\n+ ReactNoop.renderToRootWithID(, 'c');\n+ });\n+ \/\/ We're flushing deferred work\n+ \/\/ Still, roots with animation work are handled first\n+ ReactNoop.flushDeferredPri(15);\n+ expect(ReactNoop.getChildren('a')).toEqual([span('a:1')]);\n+ expect(ReactNoop.getChildren('b')).toEqual([span('b:2')]);\n+ expect(ReactNoop.getChildren('c')).toEqual([span('c:1')]);\n+ ReactNoop.flushDeferredPri(15);\n+ expect(ReactNoop.getChildren('a')).toEqual([span('a:1')]);\n+ expect(ReactNoop.getChildren('b')).toEqual([span('b:2')]);\n+ expect(ReactNoop.getChildren('c')).toEqual([span('c:2')]);\n+\n+ \/\/ More deferred and animation work just got scheduled!\n+ ReactNoop.renderToRootWithID(, 'c');\n+ ReactNoop.performAnimationWork(() => {\n+ ReactNoop.renderToRootWithID(, 'b');\n+ });\n+ \/\/ Animation is still handled first\n+ ReactNoop.flushDeferredPri(15);\n+ expect(ReactNoop.getChildren('a')).toEqual([span('a:1')]);\n+ expect(ReactNoop.getChildren('b')).toEqual([span('b:3')]);\n+ expect(ReactNoop.getChildren('c')).toEqual([span('c:2')]);\n+\n+ \/\/ Finally we handle deferred root in the order it was scheduled\n+ ReactNoop.flushDeferredPri(15 + 5);\n+ expect(ReactNoop.getChildren('a')).toEqual([span('a:2')]);\n+ expect(ReactNoop.getChildren('b')).toEqual([span('b:3')]);\n+ expect(ReactNoop.getChildren('c')).toEqual([span('c:2')]);\n+ ReactNoop.flushDeferredPri(15 + 5);\n+ expect(ReactNoop.getChildren('a')).toEqual([span('a:2')]);\n+ expect(ReactNoop.getChildren('b')).toEqual([span('b:3')]);\n+ expect(ReactNoop.getChildren('c')).toEqual([span('c:3')]);\n+ });\n+\n it('schedules sync updates when inside componentDidMount\/Update', () => {\n var instance;\n var ops = [];\ndiff --git a\/src\/renderers\/shared\/shared\/__tests__\/ReactCompositeComponentState-test.js b\/src\/renderers\/shared\/shared\/__tests__\/ReactCompositeComponentState-test.js\nindex 446fafe747..781ab0132b 100644\n--- a\/src\/renderers\/shared\/shared\/__tests__\/ReactCompositeComponentState-test.js\n+++ b\/src\/renderers\/shared\/shared\/__tests__\/ReactCompositeComponentState-test.js\n@@ -169,22 +169,16 @@ describe('ReactCompositeComponent-state', () => {\n \/\/ componentDidMount() called setState({color:'yellow'}), which is async.\n \/\/ The update doesn't happen until the next flush.\n ['componentDidMount-end', 'orange'],\n- ['setState-sunrise', 'orange'],\n- ['setState-orange', 'orange'],\n ];\n \n- \/\/ In Fiber, the initial callback is not enqueued until after any work\n- \/\/ scheduled by lifecycles has flushed (same semantics as a regular setState\n- \/\/ callback outside of a batch). In Stack, the initial render is scheduled\n- \/\/ inside of batchedUpdates, so the callback gets flushed right after\n- \/\/ componentDidMount.\n- \/\/ TODO: We should fix this, in both Stack and Fiber, so that the behavior\n- \/\/ is consistent regardless of whether you're in a batch.\n- if (!ReactDOMFeatureFlags.useFiber) {\n- expected.push(['initial-callback', 'orange']);\n- }\n-\n- expected.push(['shouldComponentUpdate-currentState', 'orange'],\n+ \/\/ The setState callbacks in componentWillMount, and the initial callback\n+ \/\/ passed to ReactDOM.render, should be flushed right after component\n+ \/\/ did mount:\n+ expected.push(\n+ ['setState-sunrise', 'orange'], \/\/ 1\n+ ['setState-orange', 'orange'], \/\/ 2\n+ ['initial-callback', 'orange'], \/\/ 3\n+ ['shouldComponentUpdate-currentState', 'orange'],\n ['shouldComponentUpdate-nextState', 'yellow'],\n ['componentWillUpdate-currentState', 'orange'],\n ['componentWillUpdate-nextState', 'yellow'],\n@@ -194,10 +188,6 @@ describe('ReactCompositeComponent-state', () => {\n ['setState-yellow', 'yellow'],\n );\n \n- if (ReactDOMFeatureFlags.useFiber) {\n- expected.push(['initial-callback', 'yellow']);\n- }\n-\n expected.push(\n ['componentWillReceiveProps-start', 'yellow'],\n \/\/ setState({color:'green'}) only enqueues a pending state.\n","commit":{"authoredAt":"2016-12-19T15:36:28-08:00","authorName":"Andrew Clark","subject":"Merge pull request #8605 from facebook\/revert-8584-fiberhostrootupdatequeue","shortRevision":"ab19dd0292","revision":"ab19dd02921e96ebf42fce6717c0af6de60c68bd","authorEmail":"acdlite@me.com"},"files":[{"status":"M","path":"scripts\/fiber\/tests-failing.txt"},{"status":"M","path":"scripts\/fiber\/tests-passing.txt"},{"status":"M","path":"src\/renderers\/art\/ReactARTFiber.js"},{"status":"M","path":"src\/renderers\/dom\/fiber\/ReactDOMFiber.js"},{"status":"M","path":"src\/renderers\/native\/ReactNativeFiber.js"},{"status":"M","path":"src\/renderers\/noop\/ReactNoop.js"},{"status":"M","path":"src\/renderers\/shared\/fiber\/ReactFiberBeginWork.js"},{"status":"M","path":"src\/renderers\/shared\/fiber\/ReactFiberReconciler.js"},{"status":"M","path":"src\/renderers\/shared\/fiber\/ReactFiberScheduler.js"},{"status":"M","path":"src\/renderers\/shared\/fiber\/ReactFiberUpdateQueue.js"},{"status":"M","path":"src\/renderers\/shared\/fiber\/__tests__\/ReactIncremental-test.js"},{"status":"M","path":"src\/renderers\/shared\/fiber\/__tests__\/ReactIncrementalErrorHandling-test.js"},{"status":"M","path":"src\/renderers\/shared\/fiber\/__tests__\/ReactIncrementalScheduling-test.js"},{"status":"M","path":"src\/renderers\/shared\/shared\/__tests__\/ReactCompositeComponentState-test.js"}],"body":"Revert \"[Fiber] Queue top-level updates\"","parents":["ddc44b7add41f103a5ffec104092c0855a43401a","0b37588171aa454eae4a31b499550377fff0c185"]}

dillon1000/react

Files changed