New commit phase lifecycle: getSnapshotBeforeUpdate #12404

bvaughn · 2018-03-19T21:17:46Z

Add new "commit" phase lifecycle, getSnapshotBeforeUpdate, that gets called before mutations are made. Any value returned by this lifecycle will be passed as the third parameter to componentDidUpdate.

This lifecycle is important for async rendering, where there may be delays between "render" phase lifecycles (e.g. componentWillUpdate and render) and "commit" phase lifecycles (e.g. componentDidUpdate).

This PR follows the precedent set by getDerivedStateFromProps and does not call unsafe legacy lifecycles componentWillMount, componentWillReceiveProps, or componentWillUpdate for any component that defines the new getSnapshotBeforeUpdate method. This is not strictly necessary, unless we decide to polyfill the new method (see reactjs/react-lifecycles-compat/pull/1) but I think it may still be a good thing to do, for consistency.

Likewise, it does not log warnings for componentWillUpdate if a __suppressDeprecationWarning flag is present.

If others disagree, I can remove this specific part of the PR (aka revert 55e75da and 2428604).

Relates to reactjs/rfcs/pull/33 (view formatted).

acdlite · 2018-03-19T21:24:05Z

packages/react-reconciler/src/ReactFiber.js

@@ -204,6 +207,8 @@ function FiberNode(

  this.alternate = null;

+  this.snapshot = null;


We should be able to implement this without adding a new field to every fiber.

Could we try storing it on the stateNode (instance) instead? It's confined to the commit phase, so should be fine.

Yeah, there's a TODO about this 😄 This PR isn't ready yet.

Initially I was thinking maybe the updateQueue could be a good place to store the snapshot but I'm not sure if this would work out. I think updateQueue could be null when I'd need it in some cases.

I dunno about using the instance. Seems like we could have potential collision issues if we tried that?

The snapshot is only used within a single commit phase so it shouldn't collide with anything. Commit phase is uninterruptible.

I meant naming collisions. Writing to the instance might clobber an existing property.

We already write to __reactInternalMemoizedMaskedChildContext and __reactInternalMemoizedMergedChildContext for legacy context. I think anything __reactInternal is fair game.

acdlite · 2018-03-19T21:25:48Z

packages/react-reconciler/src/ReactFiberCommitWork.js

+  ): void {
+    switch (finishedWork.tag) {
+      case ClassComponent: {
+        const instance = finishedWork.stateNode;


Nit: move this inside the condition

acdlite · 2018-03-19T21:26:13Z

packages/react-reconciler/src/ReactFiberCommitWork.js

+              prevState,
+            );
+            // TODO Warn about undefined return value
+            current.snapshot = snapshot != null ? snapshot : null;


What's the point of coercing this to null?

To pass null instead of undefined

Seems better to pass a consistent value regardless of whether getSnapshotBeforeUpdate exists or not.

Let's stop this mini review for now 😄 I don't think it's useful. I'll let you know when the PR is ready.

acdlite · 2018-03-19T21:27:45Z

packages/react-reconciler/src/ReactFiberScheduler.js

+    // Invoke instances of getSnapshotBeforeUpdate before mutation.
+    nextEffect = firstEffect;
+    // TODO Start new commit phase timer from ReactDebugFiberPerf
+    while (nextEffect !== null) {


Why are we adding a new traversal of the effect list instead of using the host effect traversal (commitAllHostEffects)?

Yeah, good call. Initial approach was just whatever I could get working quickly. Planning on iterating.

bvaughn · 2018-03-20T18:34:32Z

Okay, i think this is ready for a review pass.

…eforeUpdate)

…d. DEV warn about this.

bvaughn · 2018-03-22T20:33:06Z

PR has been updated to not call unsafe legacy lifecycles if the new getSnapshotBeforeUpdate method is used. DEV warning has been added for this. Tests added as well.

bvaughn · 2018-03-26T15:34:49Z

The relevant RFC was merged this morning.

gaearon · 2018-03-26T15:44:12Z

packages/react-dom/src/__tests__/ReactComponentLifeCycle-test.js

+      state = {};
+      getSnapshotBeforeUpdate() {}
+      componentWillMount() {}
+      UNSAFE_componentWillReceiveProps() {}


Why use UNSAFE_componentWillReceiveProps in this test? Just curious—doesn't seem like the test is specifically about UNSAFE_componentWillReceiveProps.

I just tried to cover a mix of old and new aliases in the test. There's not really a meaningful pattern to it.

To be clear, these tests are kind of verbose and I was hoping to avoid having to duplicate them for old and new lifecycle aliases, so I just tried to cover a mix of both (so the test could verify that the correct lifecycle name was printed in the warning)

gaearon · 2018-03-26T15:46:54Z

packages/react-reconciler/src/ReactFiberClassComponent.js

 let didWarnAboutLegacyLifecyclesAndDerivedState;
 let warnOnInvalidCallback;

 if (__DEV__) {
  didWarnAboutStateAssignmentForComponent = {};
  didWarnAboutUndefinedDerivedState = {};
  didWarnAboutUninitializedState = {};
+  didWarnAboutGetSnapshotBeforeUpdateWithoutDidUpdate = new Set();


Personally I find it a bit confusing that one of them has a different type. Maybe convert them to sets (or even create a helper for this pattern) later?

Sure! I updated the old objects to be sets (ca09ef8)

gaearon · 2018-03-26T15:47:16Z

packages/react-reconciler/src/ReactFiberClassComponent.js

+      if (
+        typeof instance.getSnapshotBeforeUpdate === 'function' &&
+        typeof instance.componentDidUpdate !== 'function' &&
+        typeof instance.UNSAFE_componentDidUpdate !== 'function' &&


What is UNSAFE_componentDidUpdate?

Same as above. Just trying to cover more cases.

To be clear I mean that there's no lifecycle called UNSAFE_componentDidUpdate at all. It's not an actual alias we use because componentDidUpdate is not deprecated.

Sorry. I misinterpreted this comment to be another like the one in the test above. This is a legit mistake.

gaearon · 2018-03-26T15:48:24Z

packages/react-reconciler/src/ReactFiberClassComponent.js

-        // Warn about these lifecycles if they are present.
-        // Don't warn about react-lifecycles-compat polyfilled methods though.
+      // If new component APIs are defined, "unsafe" lifecycles won't be called.
+      // Warn about these lifecycles if they are present.


We're sure we won't forget to fire this warning at FB? Since it would be pretty essential to know this happened.

I think you're just saying that we should be sure to update the warning whitelist?

Maybe, I'm just not sure if this warning is also coalesced, and whether it will be in the whitelist or not. I don't think I remember our plan for what warnings are visible externally vs internally.

This warning isn't coalesced. We log once per component-type if there is a combo of new and unsafe lifecycles. We'll need to add this pattern to the createWarning list though for sure. It isn't there currently.

gaearon · 2018-03-26T15:49:46Z

packages/react-reconciler/src/ReactFiberClassComponent.js

    if (
+      typeof ctor.getDerivedStateFromProps !== 'function' &&
+      typeof instance.getSnapshotBeforeUpdate !== 'function' &&


We seem to repeat these checks quite a few times. Can we extract them to cached variables, and use them throughout the method?

Sure, I removed the redundant checks from the two methods that had them (88d4cac)

koba04 · 2018-03-31T01:45:54Z

ShallowRendering doesn't support getSnapshotBeforeUpdate. It's intentionally, isn't it?

bvaughn · 2018-03-31T01:49:29Z

Yes. Shallow rendering doesn't call ref callbacks either (b'c there's no refs- so getSnapshotBeforeUpdate doesn't really make sense)

koba04 · 2018-03-31T02:49:00Z

Thanks! That makes sense.

gaearon · 2018-04-01T01:17:45Z

We should probably change shallow rendering to not call componentDidUpdate either though.

bvaughn · 2018-04-01T02:22:56Z

Hm 🤔Yeah, that might make sense too.

I don't really know how people use shallow rendering in practice. I haven't used it much myself.

koba04 · 2018-04-02T16:32:59Z

We should probably change shallow rendering to not call componentDidUpdate either though.

Shallow rendering already doesn't call componentDidUpdate.

https://github.com/facebook/react/blob/master/packages/react-test-renderer/src/ReactShallowRenderer.js#L234-L235

I don't really know how people use shallow rendering in practice. I haven't used it much myself.

I guess there are two reasons that people use shallow rendering.

Testing on Node environment
Testing a component without to care about child components behavior

The first one can be achieved with react-test-renderer.
The second one requires shallow rendering or mock features like provided by Jest.

I think people use shallow rendering to test behaviors like event handling and lifecycle methods through the rendered results.
Also, I think people use shallow rendering through enzyme's shallow, which supports all lifecycle methods. the feature is implemented by some hacks so supporting getSnapshotBeforeUpdate is a little hard (not impossible).

Are you gonna continue to support shallow rendering in the future versions?

People don't care about the difference between shallow renderer and other renderers based on Fiber.
I'm concerned about increasing the difference between them. It makes testing with shallow rendering harder so it seems to make sense to show how to migrate from shallow rendering to others and deprecate it.

That might be an off topic😅

bvaughn · 2018-04-02T17:46:39Z

I think people use shallow rendering to test behaviors like event handling and lifecycle methods through the rendered results.

This sounds flaky to me, given the lifecycle differences we've been discussing above (no ref setters, no did-mount/did-update).

It makes testing with shallow rendering harder so it seems to make sense to show how to migrate from shallow rendering to others and deprecate it.

I'm inclined to agree although- as someone who never really used shallow renderer- my opinion should not carry as much weight.

FOODy · 2018-04-04T12:21:22Z

packages/react-reconciler/src/ReactFiberClassComponent.js

+      if (
+        typeof instance.getSnapshotBeforeUpdate === 'function' &&
+        typeof instance.componentDidUpdate !== 'function' &&
+        typeof instance.componentDidUpdate !== 'function' &&


Duplicate line. ;-)

* Implemented new getSnapshotBeforeUpdate lifecycle * Store snapshot value from Fiber to instance (__reactInternalSnapshotBeforeUpdate) * Use commitAllHostEffects() traversal for getSnapshotBeforeUpdate() * Added DEV warnings and tests for new lifecycle * Don't invoke legacy lifecycles if getSnapshotBeforeUpdate() is defined. DEV warn about this. * Converted did-warn objects to Sets in ReactFiberClassComponent * Replaced redundant new lifecycle checks in a few methods * Check for polyfill suppress flag on cWU as well before warning * Added Snapshot bit to HostEffectMask

5: Update react monorepo to v16.3.2 r=mythmon a=renovate[bot] This Pull Request renovates the package group "react monorepo". - [react-dom](https://github.com/facebook/react) (`dependencies`): from `16.2.0` to `16.3.2` - [react](https://github.com/facebook/react) (`dependencies`): from `16.2.0` to `16.3.2` # Release Notes <details> <summary>facebook/react</summary> ### [`v16.3.0`](https://github.com/facebook/react/blob/master/CHANGELOG.md#1630-March-29-2018) ##### React * Add a new officially supported context API. ([@acdlite] in [#11818](`https://github.com/facebook/react/pull/11818`)) * Add a new `React.createRef()` API as an ergonomic alternative to callback refs. ([@trueadm] in [#12162](`https://github.com/facebook/react/pull/12162`)) * Add a new `React.forwardRef()` API to let components forward their refs to a child. ([@bvaughn] in [#12346](`https://github.com/facebook/react/pull/12346`)) * Fix a false positive warning in IE11 when using `React.Fragment`. ([@XaveScor] in [#11823](`https://github.com/facebook/react/pull/11823`)) * Replace `React.unstable_AsyncComponent` with `React.unstable_AsyncMode`. ([@acdlite] in [#12117](`https://github.com/facebook/react/pull/12117`)) * Improve the error message when calling `setState()` on an unmounted component. ([@sophiebits] in [#12347](`https://github.com/facebook/react/pull/12347`)) ##### React DOM * Add a new `getDerivedStateFromProps()` lifecycle and `UNSAFE_` aliases for the legacy lifecycles. ([@bvaughn] in [#12028](`https://github.com/facebook/react/pull/12028`)) * Add a new `getSnapshotBeforeUpdate()` lifecycle. ([@bvaughn] in [#12404](`https://github.com/facebook/react/pull/12404`)) * Add a new `<React.StrictMode>` wrapper to help prepare apps for async rendering. ([@bvaughn] in [#12083](`https://github.com/facebook/react/pull/12083`)) * Add support for `onLoad` and `onError` events on the `<link>` tag. ([@roderickhsiao] in [#11825](`https://github.com/facebook/react/pull/11825`)) * Add support for `noModule` boolean attribute on the `<script>` tag. ([@aweary] in [#11900](`https://github.com/facebook/react/pull/11900`)) * Fix minor DOM input bugs in IE and Safari. ([@nhunzaker] in [#11534](`https://github.com/facebook/react/pull/11534`)) * Correctly detect Ctrl + Enter in `onKeyPress` in more browsers. ([@nstraub] in [#10514](`https://github.com/facebook/react/pull/10514`)) * Fix containing elements getting focused on SSR markup mismatch. ([@koba04] in [#11737](`https://github.com/facebook/react/pull/11737`)) * Fix `value` and `defaultValue` to ignore Symbol values. ([@nhunzaker] in [#11741](`https://github.com/facebook/react/pull/11741`)) * Fix refs to class components not getting cleaned up when the attribute is removed. ([@bvaughn] in [#12178](`https://github.com/facebook/react/pull/12178`)) * Fix an IE/Edge issue when rendering inputs into a different window. ([@M-ZubairAhmed] in [#11870](`https://github.com/facebook/react/pull/11870`)) * Throw with a meaningful message if the component runs after jsdom has been destroyed. ([@gaearon] in [#11677](`https://github.com/facebook/react/pull/11677`)) * Don't crash if there is a global variable called `opera` with a `null` value. [@alisherdavronov] in [#11854](`https://github.com/facebook/react/pull/11854`)) * Don't check for old versions of Opera. ([@skiritsis] in [#11921](`https://github.com/facebook/react/pull/11921`)) * Deduplicate warning messages about `<option selected>`. ([@watadarkstar] in [#11821](`https://github.com/facebook/react/pull/11821`)) * Deduplicate warning messages about invalid callback. ([@yenshih] in [#11833](`https://github.com/facebook/react/pull/11833`)) * Deprecate `ReactDOM.unstable_createPortal()` in favor of `ReactDOM.createPortal()`. ([@prometheansacrifice] in [#11747](`https://github.com/facebook/react/pull/11747`)) * Don't emit User Timing entries for context types. ([@abhaynikam] in [#12250](`https://github.com/facebook/react/pull/12250`)) * Improve the error message when context consumer child isn't a function. ([@raunofreiberg] in [#12267](`https://github.com/facebook/react/pull/12267`)) * Improve the error message when adding a ref to a functional component. ([@skiritsis] in [#11782](`https://github.com/facebook/react/pull/11782`)) ##### React DOM Server * Prevent an infinite loop when attempting to render portals with SSR. ([@gaearon] in [#11709](`https://github.com/facebook/react/pull/11709`)) * Warn if a class doesn't extend `React.Component`. ([@wyze] in [#11993](`https://github.com/facebook/react/pull/11993`)) * Fix an issue with `this.state` of different components getting mixed up. ([@sophiebits] in [#12323](`https://github.com/facebook/react/pull/12323`)) * Provide a better message when component type is undefined. ([@HeroProtagonist] in [#11966](`https://github.com/facebook/react/pull/11966`)) --- ### [`v16.3.1`](https://github.com/facebook/react/blob/master/CHANGELOG.md#1631-April-3-2018) ##### React * Fix a false positive warning in IE11 when using `Fragment`. ([@heikkilamarko] in [#12504](`https://github.com/facebook/react/pull/12504`)) * Prefix a private API. ([@Andarist] in [#12501](`https://github.com/facebook/react/pull/12501`)) * Improve the warning when calling `setState()` in constructor. ([@gaearon] in [#12532](`https://github.com/facebook/react/pull/12532`)) ##### React DOM * Fix `getDerivedStateFromProps()` not getting applied in some cases. ([@acdlite] in [#12528](`https://github.com/facebook/react/pull/12528`)) * Fix a performance regression in development mode. ([@gaearon] in [#12510](`https://github.com/facebook/react/pull/12510`)) * Fix error handling bugs in development mode. ([@gaearon] and [@acdlite] in [#12508](`https://github.com/facebook/react/pull/12508`)) * Improve user timing API messages for profiling. ([@flarnie] in [#12384](`https://github.com/facebook/react/pull/12384`)) ##### Create Subscription * Set the package version to be in sync with React releases. ([@bvaughn] in [#12526](`https://github.com/facebook/react/pull/12526`)) * Add a peer dependency on React 16.3+. ([@NMinhNguyen] in [#12496](`https://github.com/facebook/react/pull/12496`)) --- ### [`v16.3.2`](https://github.com/facebook/react/blob/master/CHANGELOG.md#1632-April-16-2018) ##### React * Improve the error message when passing `null` or `undefined` to `React.cloneElement`. ([@nicolevy] in [#12534](`https://github.com/facebook/react/pull/12534`)) ##### React DOM * Fix an IE crash in development when using `<StrictMode>`. ([@bvaughn] in [#12546](`https://github.com/facebook/react/pull/12546`)) * Fix labels in User Timing measurements for new component types. ([@bvaughn] in [#12609](`https://github.com/facebook/react/pull/12609`)) * Improve the warning about wrong component type casing. ([@nicolevy] in [#12533](`https://github.com/facebook/react/pull/12533`)) * Improve general performance in development mode. ([@gaearon] in [#12537](`https://github.com/facebook/react/pull/12537`)) * Improve performance of the experimental `unstable_observedBits` API with nesting. ([@gaearon] in [#12543](`https://github.com/facebook/react/pull/12543`)) ##### React Test Renderer * Add a UMD build. ([@bvaughn] in [#12594](`https://github.com/facebook/react/pull/12594`)) --- </details> # Commits <details> <summary>facebook/react</summary> #### v16.3.0 - [`c2c3c0c`](facebook/react@c2c3c0cc36878cd6f020a480b83ff1c03b62fd28)Fix build script to handle react-is (no peer deps) (#12471) - [`488ad5a`](facebook/react@488ad5a6b94ac4b71ff587ecde05e48a218aba62)Fix typo in create-subscription readme - [`c1b21a7`](facebook/react@c1b21a746c7d08554eed8bf55030a4049380c32c)Added DEV warning if getSnapshotBeforeUpdate is defined as a static method (#12475) - [`268a3f6`](facebook/react@268a3f60dfe67c4f6439fc37b569a2d81c81a53a)Add unstable APIs for async rendering to test renderer (#12478) - [`c44665e`](facebook/react@c44665e83278becfe7a3afdf788789536d63387b)Fix bug when fatal error is thrown as a result of `batch.commit` (#12480) - [`7a833da`](facebook/react@7a833dad95b3059ebfdfba44d3fa68e1301d8e6a)setState() in componentDidMount() should flush synchronously even with createBatch() (#12466) - [`5855e9f`](facebook/react@5855e9f2158b31d945f3fcc5bc582389dbecc88e)Improve warning message for setState-on-unmounted (#12347) - [`15e3dff`](facebook/react@15e3dffb4c9ca9b9466f4ef1a6b8b2293d41e9d6)Don&#x27;t bail out on referential equality of Consumer's props.children function (#12470) - [`125dd16`](facebook/react@125dd16ba0b3fa74767b1cf417a3116a4a2b251a)Update user timing to record the timeout deadline with 'waiting' events (#12479) - [`96fe3b1`](facebook/react@96fe3b1be2fe74e83c9a25d7511f23dbef15ac99)Add React.isValidElementType() (#12483) - [`53fdc19`](facebook/react@53fdc19df092bbc4bd736aea4ef8e0f12d692ee6)Updated react-is README to show new isValidElementType() - [`8650d2a`](facebook/react@8650d2a1357985958c2738da55ea349406482721)Disable createRoot for open source builds (#12486) - [`6294b67`](facebook/react@6294b67a406d21cc6b65162e47497c1e8afe398f)unstable_createRoot (#12487) - [`b2379d4`](facebook/react@b2379d4cbe82653da931ccb128916707bc53d28a)Updating package versions for release 16.3.0 - [`9778873`](facebook/react@9778873143072635a795fec2ad0e1ac0bb7d8b91)Updating dependencies for react-noop-renderer - [`8e3d94f`](facebook/react@8e3d94ffa1d2e19a5bf4b9f8030973b65b0fc854)Update bundle sizes for 16.3.0 release #### v16.3.1 - [`2c3f5fb`](facebook/react@2c3f5fb97b6ea077f3e9aae6c6587bfe8328036d)Add React 16.3.0 changelog (#12488) - [`4304475`](facebook/react@43044757e55eca13ae788056b59f94788fc15050)Fix links - [`18ba36d`](facebook/react@18ba36d89165ec15655f2606b0a6ba2e709ce641)Move context API in Changelog to "React" section - [`59b3905`](facebook/react@59b39056d91787f6a3e4e0dfc0825c8687bd0af9)Fix method name in changelog - [`fa8e678`](facebook/react@fa8e67893fca1b3902637129972032bca248a584)Change create-subscription's peerDep on react to ^16.3.0 (#12496) - [`0c80977`](facebook/react@0c80977061ba576cee9ae0891245be233929d2ed)Validate React.Fragment props without Map. (#12504) - [`59dac9d`](facebook/react@59dac9d7a6a2f0b66003cf717d71b5587265423f)Fix DEV performance regression by avoiding Object.assign on Fibers (#12510) - [`6b99c6f`](facebook/react@6b99c6f9d376bacbb769264d743c405b495b03ad)Add missing changelog item - [`7a27ebd`](facebook/react@7a27ebd52a3025a946c67eaf84d2646fd307cb44)Update user timing to record when we are about to commit (#12384) - [`4ccf58a`](facebook/react@4ccf58a94dce323718540b8185a32070ded6094b)Fix context stack misalignment caused by error replay (#12508) - [`6f2ea73`](facebook/react@6f2ea73978168372f33a6dfad6c049afddc4aef3)Extract throw to separate function so performUnitOfWork does not deopt (#12521) - [`ba245f6`](facebook/react@ba245f6f9b0bf31c2ebff5c087c21bcae111e6c3)Prefix _context property on returned ReactContext from createContext - it's private (#12501) - [`eb6e752`](facebook/react@eb6e752cabafed0b72e1d0a38819ff156557d537)Bumped create-subscription package version (#12526) - [`da4e855`](facebook/react@da4e85567b411a180c2cfa1ef6573cf3cc9257f1)Remove @providesModule in www bundles (#12529) - [`0f2f90b`](https://github.com/facebook/react/commit/0f2f90bd9a9daf241d691bf4af3ea2e3a263c0e3)getDerivedStateFrom{Props,Catch} should update updateQueue.baseState (#12528) - [`36c2939`](facebook/react@36c29393720157a3966ce1d50449a33a35bdf14c)Improve not-yet-mounted setState warning (#12531) - [`a2cc3c3`](facebook/react@a2cc3c38e214c16ff6805312d4353c1faab9ff95)Follow up: make new warning less wordy (#12532) - [`2279843`](facebook/react@2279843ef966ea2e0460986efa1f91513cd50623)Updating yarn.lock file for 16.3.1 release - [`787b343`](facebook/react@787b343f674c72837209bdffd55c59682910d807)Updating package versions for release 16.3.1 - [`dc05957`](facebook/react@dc059579c3e56ca338a999b86d146d2341ee6f64)Update bundle sizes for 16.3.1 release - [`b15b165`](facebook/react@b15b165e0798dca03492e354ebd5bcf87b711184)Changelog for 16.3.1 #### v16.3.2 - [`1c2876d`](facebook/react@1c2876d5b558b8591feb335d8d7204bc46f7da8a)Add a build step to hoist warning conditions (#12537) - [`5e3706c`](facebook/react@5e3706cca0fe0da462c771d14a271cd2961e5718)Don&#x27;t render bitmask-bailing consumers even if there's a deeper matching child (#12543) - [`e932e32`](https://github.com/facebook/react/commit/e932e321a88e07935224701bc4580e3dc9889afe)facebook.github.io/react -> reactjs.org (#12545) - [`d328e36`](facebook/react@d328e362e86a6af4a0664e004b8f97f18ce972c8)Removed duplicate typeof check (#12541) - [`8ec0e4a`](facebook/react@8ec0e4a99df76c0ff1779cac4f2eaaaf35a6b5bb)Removed Array.from() usage (#12546) - [`27535e7`](facebook/react@27535e7bfcb63e8a4d65f273311e380b4ca12eff)Clarify ReactDOM's case warning for html tags (#12533) - [`7a3416f`](facebook/react@7a3416f27532ac25849dfbc505300d469b43bbcc)Expose component stack from reactTag to React Native renderer (#12549) - [`cf649b4`](facebook/react@cf649b40a56dc5c0ffe2595b963847f0ff8de245)Move TouchHistoryMath to React Native repo (#12557) - [`5b16b39`](facebook/react@5b16b39508ec33f2f374a5a12aa71647e1728d08)Bug fix - [`6bf2797`](facebook/react@6bf2797d6cf76676791424afc93b76dd60d7074c)Remove flushSync from React Native (#12565) - [`bc753a7`](facebook/react@bc753a716e185c31d8eb7404ab5dd6ee7467b7cb)Support findNodeHandle in Fabric (#12573) - [`181747a`](https://github.com/facebook/react/commit/181747a6cc25f3020b8561f475eca4ad2824256b)[RN] Move takeSnapshot to RN (#12574) - [`20c5d97`](facebook/react@20c5d97bb6c6a4af76d66a7e5134952989f9a9b2)Keep consistency in the comment (#12579) - [`ea37545`](facebook/react@ea3754503742afc3d5c5de2140717817794870ec)Must be *a* before PlacementAndUpdate (#12580) - [`76b4ba0`](facebook/react@76b4ba01290f446f4313adf3846954412c6051b8)Preserve error codes for invariants on www (#12539) - [`8dfb057`](facebook/react@8dfb0578816435a1a72f04506ee20d3c55d0f9bc)Unfork invariant and instead use it from reactProdInvariant (#12585) - [`f88deda`](facebook/react@f88deda83bab316385f39e8479850527cda90607)Throw more specific error if passed undefined in React.cloneElement (#12534) - [`2f7bca0`](facebook/react@2f7bca0eb2487955e71a45e288e5847b5af522a5)Allocate unique reactTags for RN and Fabric (#12587) - [`933f882`](facebook/react@933f882a9df728662befe558005f2ea3fe827a1d)Remove ReactNativePropRegistry (#12559) - [`40d0772`](https://github.com/facebook/react/commit/40d07724fcc801ad69e17b295b68ebea753d5977)[RN] Remove unstable_batchedUpdates and unmountComponentAtNodeAndRemoveContainer from Fabric (#12571) - [`b6e0512`](facebook/react@b6e0512a81524d397ff4fbfb892372ecc84c6b02)Consolidate eventTypes registry with view configs (#12556) - [`b99d0b1`](https://github.com/facebook/react/commit/b99d0b14160150c566e091bd10b634beec9a58c3)[RN] Move view config registry to shims (#12569) - [`725c054`](facebook/react@725c054d4d5d07c5c553a1ca724b01f2e6a43c5d)Refactor findHostInstance and findNodeHandle (#12575) - [`52afbe0`](facebook/react@52afbe0ebb6fca0fe480e77c6fa8482870ddb2c9)createReactNativeComponentClass needs to be CommonJS - [`3eae866`](facebook/react@3eae866e03a96c4f46e257cba73ca158b049ab05)Fixes language in error message. (#12590) - [`b846152`](facebook/react@b8461524db6d3e016fabf001ad8fa086b4918ef9)Added UMD build to test renderer package (#12594) - [`3e9515e`](facebook/react@3e9515eedebe0c19f047391605c5b3c71d13fbc2)Remove @providesModule in www shims - [`915bb53`](facebook/react@915bb5321a8db3435eb36ef1cf9414c15333b447)Bump expiration for interactive updates to 150ms in production (#12599) - [`c27a998`](https://github.com/facebook/react/commit/c27a99812e75e73d9fad88c97ac8b8db452012c1)[Danger] Minor fixes (#12606) - [`5dfbfe9`](facebook/react@5dfbfe9da740398c0a2cf4d897a0085000d06b7b)Fixed debug performance labels for new component types (#12609) - [`1591c8e`](facebook/react@1591c8ebab6151f3cae59ad42e3c15acc52cd67b)Update GCC (#12618) - [`a4cef29`](facebook/react@a4cef2970341c08e5c16a2406fbf532fc8053d12)tests: add regression test for reading ReactCurrentOwner stateNode (#12412) - [`2e1cc28`](facebook/react@2e1cc2802709877fb2454163ba30e52a91feac8e)Fix small typos in create-subscription readme (#12399) - [`1e97a71`](facebook/react@1e97a71a829e698ddac0a5e15fbdec97d35ed2bc)Fix documentation of the release process (#12337) - [`66c44a7`](facebook/react@66c44a7bc34cb3fcb3c788dcce3f3345a5bd9f58)Updating yarn.lock file for 16.3.2 release - [`82f67d6`](facebook/react@82f67d65fd4584c4528352e6b9166ca4da282382)Updating package versions for release 16.3.2 - [`6494f6b`](facebook/react@6494f6b6b8e1cfa5df9f72b4d94cf9ed582805cd)Update error codes for 16.3.2 release - [`3232616`](facebook/react@32326163480b5028ee16f6b4e4ea4426f3c5e95c)Update bundle sizes for 16.3.2 release - [`01402f4`](facebook/react@01402f4ad922b5467812586567519e9e5bbd595f)Add 16.3.2 changelog (#12621) </details> --- This PR has been generated by [Renovate Bot](https://renovateapp.com). Co-authored-by: Renovate Bot <bot@renovateapp.com>

* Implemented new getSnapshotBeforeUpdate lifecycle * Store snapshot value from Fiber to instance (__reactInternalSnapshotBeforeUpdate) * Use commitAllHostEffects() traversal for getSnapshotBeforeUpdate() * Added DEV warnings and tests for new lifecycle * Don't invoke legacy lifecycles if getSnapshotBeforeUpdate() is defined. DEV warn about this. * Converted did-warn objects to Sets in ReactFiberClassComponent * Replaced redundant new lifecycle checks in a few methods * Check for polyfill suppress flag on cWU as well before warning * Added Snapshot bit to HostEffectMask

facebook-github-bot added the CLA Signed label Mar 19, 2018

acdlite reviewed Mar 19, 2018

View reviewed changes

facebook deleted a comment from pull-bot Mar 19, 2018

bvaughn changed the title ~~[WIP] new commit phase lifecycle: getSnapshotBeforeUpdate~~ New commit phase lifecycle: getSnapshotBeforeUpdate Mar 20, 2018

bvaughn requested review from sophiebits, sebmarkbage, gaearon, flarnie and acdlite March 21, 2018 22:30

bvaughn added 4 commits March 22, 2018 08:46

Initial pass at getSnapshotBeforeUpdate. More to do.

f68a77b

Moved snapshot value from Fiber to instance (__reactInternalSnapshotB…

0f984ac

…eforeUpdate)

Use commitAllHostEffects() traversal for getSnapshotBeforeUpdate()

db84b9a

Added DEV warnings and tests for new lifecycle

7022568

bvaughn force-pushed the getSnapshotBeforeUpdate branch from 3eb29cd to 7022568 Compare March 22, 2018 15:46

bvaughn mentioned this pull request Mar 22, 2018

Remove DEV-only warnings from shallow renderer #12432

Closed

bvaughn added 3 commits March 22, 2018 11:26

Merged master; resolved conflicts

47c7afb

Merge branch 'master' into getSnapshotBeforeUpdate

3b1d23c

Don't invoke legacy lifecycles if getSnapshotBeforeUpdate() is define…

55e75da

…d. DEV warn about this.

Fixed a type-check

d4ac106

This was referenced Mar 22, 2018

Polyfill for getSnapshotBeforeUpdate reactjs/react-lifecycles-compat#1

Merged

An update on async rendering reactjs/react.dev#596

Merged

Merge branch 'master' into getSnapshotBeforeUpdate

b09b5d2

gaearon reviewed Mar 26, 2018

View reviewed changes

Converted did-warn objects to Sets in ReactFiberClassComponent

ca09ef8

This was referenced Apr 1, 2018

Update 14 dependencies from npm uclaradio/panel#27

Closed

Update react-dom in / from 16.2.0 to 16.3.0 leonardofaria/leozera-ui#160

Closed

Update react in / from 16.2.0 to 16.3.0 leonardofaria/leozera-ui#161

Closed

renovate bot mentioned this pull request Apr 2, 2018

Update react monorepo packages to v16.3.0 mozilla/ensemble#74

Merged

This was referenced Apr 2, 2018

react-test-renderer versions available: 16.3.0 serlo/serlo-abc#306

Closed

Update react-dom in / from 16.2.0 to 16.3.0 severest/retrobot#88

Merged

Update react in / from 16.2.0 to 16.3.0 severest/retrobot#90

Merged

dependencies bot mentioned this pull request Apr 2, 2018

Update yarn.lock dropseed/jump#97

Closed

FOODy reviewed Apr 4, 2018

View reviewed changes

This was referenced Apr 17, 2018

Update react to 16.3.2-abandoned sbardian/DebtTrackerAPI#15

Closed

Update react-dom to ^16.0.0-abandoned sbardian/DebtTrackerAPI#18

Closed

		@@ -204,6 +207,8 @@ function FiberNode(

		this.alternate = null;

		this.snapshot = null;

New commit phase lifecycle: getSnapshotBeforeUpdate #12404

New commit phase lifecycle: getSnapshotBeforeUpdate #12404

Conversation

bvaughn commented Mar 19, 2018 • edited Loading

Choose a reason for hiding this comment

Choose a reason for hiding this comment

acdlite Mar 19, 2018 • edited Loading

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

acdlite Mar 19, 2018 • edited Loading

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

acdlite Mar 19, 2018 • edited Loading

Choose a reason for hiding this comment

Choose a reason for hiding this comment

bvaughn commented Mar 20, 2018

bvaughn commented Mar 22, 2018

bvaughn commented Mar 26, 2018

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

gaearon Mar 26, 2018 • edited Loading

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

koba04 commented Mar 31, 2018

bvaughn commented Mar 31, 2018

koba04 commented Mar 31, 2018

gaearon commented Apr 1, 2018

bvaughn commented Apr 1, 2018

koba04 commented Apr 2, 2018

bvaughn commented Apr 2, 2018

Choose a reason for hiding this comment

bvaughn commented Mar 19, 2018 •

edited

Loading

acdlite Mar 19, 2018 •

edited

Loading

acdlite Mar 19, 2018 •

edited

Loading

acdlite Mar 19, 2018 •

edited

Loading

gaearon Mar 26, 2018 •

edited

Loading