React-beautiful-dnd: failed: Attempting to move in an unsupported phase PREPARING: Regression

[gihrig]

Bug or feature request?

Bug

This is a regression to a bug that was fixed in 8.0.3 and reappeared in 8.0.6

Previously reported in #617 and fixed with PR #633

I'm calling setState inside onDragStart and I'm getting the following error:

Error: Invariant failed: Attempting to move in an unsupported phase PREPARING

Expected behavior

Able to drag and drop without error

Actual behavior

Error, above occurs on drag

Steps to reproduce

See @ntelkedzhiev's Code Sandbox here: https://codesandbox.io/s/vm528x79w3

1. Perform a drag operation, observer error.
2. Update react-beautiful-dnd dependency to 8.0.5, error corrected
3. Update react-beautiful-dnd dependency to 8.0.6 (or 8.0.7), error returns

What version of React are you using?

16.4.2

What version of react-beautiful-dnd are you running?

8.0.7

What browser are you using?

Chrome Mac 67.0.3396.99 (Official Build) (64-bit)

Demo

https://codesandbox.io/s/vm528x79w3 with thanks to @ntelkedzhiev

P.S. I'm loving the Egghead course, thanks for a fantastic library 💖

[alexreardon]

Damn. I think it is a seperate issue which I can look into to. The timing of these hooks is hard to get right!!

[alexreardon]

I should also add a test for this exact use case as it keeps coming up
On Tue, 7 Aug 2018 at 5:43 pm, Glen Ihrig [e-mail] wrote:

Bug or feature request?

Bug

This is a regression to a bug that was fixed in 8.0.3 and reappeared 8.0.6

Previously reported in #617
https://github.com/atlassian/react-beautiful-dnd/issues/617 and fixed
with PR #633 https://github.com/atlassian/react-beautiful-dnd/pull/633

I'm calling setState inside onDragStart and I'm getting the following
error:

Error: Invariant failed: Attempting to move in an unsupported phase
PREPARING

Expected behavior

Able to drag and drop without error
Actual behavior

Error, above occurs on drag
Steps to reproduce

See @ntelkedzhiev https://github.com/ntelkedzhiev's Code Sandbox here:
https://codesandbox.io/s/vm528x79w3

1. Perform a drag operation, observer error.
2. Update react-beautiful-dnd dependency to 8.0.5, error corrected
3. Update react-beautiful-dnd dependency to 8.0.6 (or 8.0.7), error
   returns

What version of React are you using?

16.4.2
What version of react-beautiful-dnd are you running?

8.0.7
What browser are you using?

Chrome Mac 67.0.3396.99 (Official Build) (64-bit)
Demo

https://codesandbox.io/s/vm528x79w3 with thanks to @ntelkedzhiev
https://github.com/ntelkedzhiev

P.S. I'm loving the Egghead course, thanks for a fantastic library 💖

—
You are receiving this because you are subscribed to this thread.
Reply to this email directly, view it on GitHub
https://github.com/atlassian/react-beautiful-dnd/issues/693, or mute
the thread
https://github.com/notifications/unsubscribe-auth/ACFN7QpQVt-0DFCjry4dBsUTFXb5W61pks5uOUUUgaJpZM4VxpkK
.

[alexreardon]

A simple work around is to use setTimeout: https://codesandbox.io/s/qvnmy3mnrq

[alexreardon]

I am working on a more comprehensive fix though

[alexreardon]

This was super painful and expose a big timing issue. It ended up causing a major release (ouch!)

[gihrig]

@alexreardon thanks for the hard work and fast response. 🎉

9.0.0 works in my project as a drop in replacement for 8.0.5. 💯

I haven't implemented the the hooks guide ideas, but looks like some good stuff there.

[rickdzekman]

Hi @alexreardon

Just an FYI, if you use onBeforeDragStart to change the isDropDisabled property of a <Droppable> it produces the following error:

Attempting to move in an unsupported phase IDLE

It turns out that I thought I needed onBeforeDragStart but I was mistaken and could use onDragStart instead.

But I thought I would leave a comment here for anyone else having the same problem