Cancel a gesture after issuing the action

This ensures that we have already scheduled some work before we cancel.
That way we know that this work will be the one to commit the new state.
Otherwise we might cancel too soon.

Author: sebmarkbage

fixtures/view-transition/src/components/SwipeRecognizer.js

@@ -33,11 +33,6 @@ export default function SwipeRecognizer({
     });
   }
   function onScrollEnd() {
-    if (activeGesture.current !== null) {
-      const cancelGesture = activeGesture.current;
-      activeGesture.current = null;
-      cancelGesture();
-    }
     let changed;
     const scrollElement = scrollRef.current;
     if (axis === 'x') {
@@ -60,6 +55,11 @@ export default function SwipeRecognizer({
       // Trigger side-effects
       startTransition(action);
     }
+    if (activeGesture.current !== null) {
+      const cancelGesture = activeGesture.current;
+      activeGesture.current = null;
+      cancelGesture();
+    }
   }
 
   useEffect(() => {