[Web] Make PointerTracker elements nullable (#3565)

## Description

It was reported that in some cases _Gesture Handler_ crashes on web on the following [line](https://github.com/software-mansion/react-native-gesture-handler/blob/a19c683fa2d2849c5ed72f5d85c1ff9528fe8f6f/packages/react-native-gesture-handler/src/web/handlers/GestureHandler.ts#L704). Seems like elements in `PointerTracker` may not exist, even though we believed that during our workflow they always do. Casts in `PointerTracker` were introduced because `Map.get` may return `undefined` if the element doesn't exist. Turns out that it actually may be the case, so we decided to remove those casts and handle these cases across our codebase.

While we don't know what exactly causes the fact that elements are not inside `trackedPointers` map, we have two possibilities:

1. Pointer is removed form `PointerTracker` before handler enters `BEGAN` state - removing may happen for example when one lifts pointer from the view (calling `onPointerUp`, etc.).
2. `PointerTracker` is reset before handler enters `BEGAN` state - this one can happen when `pointercancel` event is received.

## Test plan

Tested on `expo-example` on `web`

Author: m-bert

packages/react-native-gesture-handler/src/web/detectors/RotationGestureDetector.ts

@@ -42,6 +42,10 @@ export default class RotationGestureDetector
     const firstPointerCoords = tracker.getLastAbsoluteCoords(firstPointerID);
     const secondPointerCoords = tracker.getLastAbsoluteCoords(secondPointerID);
 
+    if (!firstPointerCoords || !secondPointerCoords) {
+      return;
+    }
+
     const vectorX: number = secondPointerCoords.x - firstPointerCoords.x;
     const vectorY: number = secondPointerCoords.y - firstPointerCoords.y;
 

packages/react-native-gesture-handler/src/web/handlers/FlingGestureHandler.ts

@@ -49,6 +49,10 @@ export default class FlingGestureHandler extends GestureHandler {
   private tryEndFling(): boolean {
     const velocityVector = Vector.fromVelocity(this.tracker, this.keyPointer);
 
+    if (!velocityVector) {
+      return false;
+    }
+
     const getAlignment = (
       direction: Directions | DiagonalDirections,
       minimalAlignmentCosine: number

packages/react-native-gesture-handler/src/web/handlers/GestureHandler.ts

@@ -701,9 +701,15 @@ export default abstract class GestureHandler implements IGestureHandler {
     }
 
     const rect = this.delegate.measureView();
-    const { x, y } = this.tracker.getLastAbsoluteCoords();
-    const offsetX: number = x - rect.pageX;
-    const offsetY: number = y - rect.pageY;
+
+    const lastCoords = this.tracker.getLastAbsoluteCoords();
+
+    if (!lastCoords) {
+      return false;
+    }
+
+    const offsetX: number = lastCoords.x - rect.pageX;
+    const offsetY: number = lastCoords.y - rect.pageY;
 
     return (
       offsetX >= left && offsetX <= right && offsetY >= top && offsetY <= bottom

packages/react-native-gesture-handler/src/web/handlers/PanGestureHandler.ts

@@ -226,10 +226,10 @@ export default class PanGestureHandler extends GestureHandler {
   }
 
   private updateVelocity(pointerId: number) {
-    const { x, y } = this.tracker.getVelocity(pointerId);
+    const velocities = this.tracker.getVelocity(pointerId);
 
-    this.velocityX = x;
-    this.velocityY = y;
+    this.velocityX = velocities?.x ?? 0;
+    this.velocityY = velocities?.y ?? 0;
   }
 
   // Events Handling

packages/react-native-gesture-handler/src/web/tools/GestureHandlerOrchestrator.ts

@@ -337,6 +337,7 @@ export default class GestureHandlerOrchestrator {
       const point = handler.tracker.getLastAbsoluteCoords(pointer);
 
       return (
+        point &&
         handler.delegate.isPointerInBounds(point) &&
         otherHandler.delegate.isPointerInBounds(point)
       );

packages/react-native-gesture-handler/src/web/tools/PointerTracker.ts

@@ -61,11 +61,9 @@ export default class PointerTracker {
   }
 
   public track(event: AdaptedEvent): void {
-    const element: TrackerElement = this.trackedPointers.get(
-      event.pointerId
-    ) as TrackerElement;
+    const pointerData = this.trackedPointers.get(event.pointerId);
 
-    if (!element) {
+    if (!pointerData) {
       return;
     }
 
@@ -74,13 +72,13 @@ export default class PointerTracker {
     this.velocityTracker.add(event);
     const [velocityX, velocityY] = this.velocityTracker.velocity;
 
-    element.velocityX = velocityX;
-    element.velocityY = velocityY;
+    pointerData.velocityX = velocityX;
+    pointerData.velocityY = velocityY;
 
-    element.abosoluteCoords = { x: event.x, y: event.y };
-    element.relativeCoords = { x: event.offsetX, y: event.offsetY };
+    pointerData.abosoluteCoords = { x: event.x, y: event.y };
+    pointerData.relativeCoords = { x: event.offsetX, y: event.offsetY };
 
-    this.trackedPointers.set(event.pointerId, element);
+    this.trackedPointers.set(event.pointerId, pointerData);
 
     this.cachedAbsoluteAverages = this.getAbsoluteCoordsAverage();
     this.cachedRelativeAverages = this.getRelativeCoordsAverage();
@@ -114,20 +112,24 @@ export default class PointerTracker {
   }
 
   public getVelocity(pointerId: number) {
-    return {
-      x: this.trackedPointers.get(pointerId)?.velocityX as number,
-      y: this.trackedPointers.get(pointerId)?.velocityY as number,
-    };
+    const pointerData = this.trackedPointers.get(pointerId);
+
+    return pointerData
+      ? {
+          x: pointerData.velocityX,
+          y: pointerData.velocityY,
+        }
+      : null;
   }
 
   public getLastAbsoluteCoords(pointerId?: number) {
     return this.trackedPointers.get(pointerId ?? this.lastMovedPointerId)
-      ?.abosoluteCoords as Point;
+      ?.abosoluteCoords;
   }
 
   public getLastRelativeCoords(pointerId?: number) {
     return this.trackedPointers.get(pointerId ?? this.lastMovedPointerId)
-      ?.relativeCoords as Point;
+      ?.relativeCoords;
   }
 
   // Some handlers use these methods to send average values in native event.

packages/react-native-gesture-handler/src/web/tools/Vector.ts

@@ -27,7 +27,7 @@ export default class Vector {
 
   static fromVelocity(tracker: PointerTracker, pointerId: number) {
     const velocity = tracker.getVelocity(pointerId);
-    return new Vector(velocity.x, velocity.y);
+    return velocity ? new Vector(velocity.x, velocity.y) : null;
   }
 
   public get magnitude() {