Motion: [BUG] Complex drag behaviour breaks under react strict mode.

Created on 8 Nov 2019  路  2Comments  路  Source: framer/motion

Overview
Complex drag behaviour breaks under react strict mode. Specifically, it seems something is broken with the positionTransition and useMotionValue api.
This sandbox reproduces the issue: https://codesandbox.io/s/framer-motion-drag-to-reorder-ij014
If you remove StrictMode, the problem disappears.

Steps to reproduce

Steps to reproduce the behaviour:

  1. Go to https://codesandbox.io/s/framer-motion-drag-to-reorder-ij014
  2. Try dragging the elements around
  3. As soon as their actual position in the list changes, rapid back and forth flickering occurs, which doesn't happen when not using strict mode.

Expected behaviour

In the example above, adding strict mode does not alter the behaviour of the components.

Environment details

I'm using Chrome 78.0.3904.87 (64-bit) under MacOS mojave.

bug

Most helpful comment

Hey man I'm actually doing a deep dive into StrictMode at the moment. I think its specifically positionTransition that has the problem in general. I'll update the ticket when I get somewhere with this.

All 2 comments

Let me know If you'd like me to track this down further - didn't dig deeper than finding out strict mode was causing this problem in my application, as I figured you might have a better idea why this is occurring. If you could guide me in the right direction, i'd be happy to implement a fix as well.

Hey man I'm actually doing a deep dive into StrictMode at the moment. I think its specifically positionTransition that has the problem in general. I'll update the ticket when I get somewhere with this.

Was this page helpful?
0 / 5 - 0 ratings