setState being called synchronously

[jasimon]

Do you want to request a feature or report a bug?
bug

What is the current behavior?
setState is merging state synchronously when called from asynchronous code (i.e. a .then on an ajax request)

If the current behavior is a bug, please provide the steps to reproduce and if possible a minimal demo of the problem. Your bug will get fixed much faster if we can run your code and it doesn't have dependencies other than React. Paste the link to your JSFiddle (https://jsfiddle.net/Luktwrdm/) or CodeSandbox (https://codesandbox.io/s/new) example below:
https://jsfiddle.net/Luktwrdm/1456/

What is the expected behavior?
setState should be merging state asynchronously I think?

Which versions of React, and which browser / OS are affected by this issue? Did this work in previous versions of React?
react 16.4.1, unsure if it was in previous versions (the code affected is new)

[TrySound]

@jasimon Currently setState calls are batched only in react event handlers. In other cases it's called synchronously. This is expected behaviour. But do not rely on it please. React v17 will enable concurrent mode by default so all setState calls will be asynchronous and code written that way will be broken.

[jasimon]

Got it, thanks for your quick response. Is there any way to force batched updates? When I get an HTTP response I have a few distinct calls to setState (some happen conditionally based on the type of the response). I'm relying on batching to have those changes all happen atomically to the component. (This issue is actually presenting itself through redux dispatching multiple actions in a then callback so it's not as simple as building a payload in the callback and passing that at once to setState).

[markerikson]

@jasimon : try wrapping that chunk of code in ReactDOM.unstable_batchedUpdates().

You may also want to look at the Redux FAQ entry on reducing UI update notifications.

[jasimon]

Ah, thanks! Will close, seems to be working as intended