Wrapping TapGestureHandler for other TapGestureHandlers sometimes fails to trigger activity

[ylkhayat]

I had the following implementation for TapGestureHandler that needed to await children TapGestureHandlers.
The code goes as follows

<TapGestureHandler waitFor={[controller1Ref, controller2Ref]}>
  <TapGestureHandler ref={controller1Ref}>
    <Text style={{ backgroundColor: 'blue', padding: 20 }}>
      Controller 1
    </Text>
  </TapGestureHandler>
  <TapGestureHandler ref={controller2Ref}>
    <Text style={{ backgroundColor: 'blue', padding: 20 }}>
      Controller 2
    </Text>
  </TapGestureHandler>
</TapGestureHandler>

The above implementation fails to trigger the onActivated prop for the wrapping TapGestureHandler (the very outer one) on the web platform, works fine on other platforms.
Here's the implemented snack for you to visualize it.