software-mansion / react-native-gesture-handler

Declarative API exposing platform native touch and gesture system to React Native.
https://docs.swmansion.com/react-native-gesture-handler/
MIT License
6.14k stars 982 forks source link

Replace `queueMicrotask` with `requestAnimationFrame` #2969

Closed m-bert closed 5 months ago

m-bert commented 5 months ago

Description

This PR replaces queueMicrotask with requestAnimationFrame. Turns out that introducing useLayoutEffect (which was introduced in #2925) ended up in gestures being attached in wrong order in some cases.

This can be observed in #2963 (it is highly recommended to look into repro structure):

  1. 3 handlers from ZoomView where attached - they have correct tags
  2. Re-render happens, handlers' tags are now -1
  3. Pan from SVGMask is attached - all handlers marked as simultaneous have tag -1, therefore relations are not set up
  4. Handlers from 1. are attached again, so they get back their original tags

In this scenario, simultaneous handlers array in Pan in SVGMask was empty, effectively disabling this relation. Switching to requestAnimationFrame solves this problem.

Test plan

Verify that examples work as they used to (draggable, multitap, transformations)

Also tested on code from #2963 .