PanResponder sometimes unresponsive on Windows Edge browser.

[ShaneMckenna23]

The problem The PanResponder sometimes does not work on the Windows Edge browser.

How to reproduce This issue is reproducible on the PanResponder example.

Simplified test case: https://codesandbox.io/s/github/necolas/react-native-web/tree/0.17.7/packages/examples?from-embed&initialpath=%2Fpan-responder

Steps to reproduce:

1. Open the above sandbox on windows edge
2. Double click the green circle, then wait for 2 seconds
3. Click and drag the circle

Expected behavior The circle moves as I drag my cursor.

Observed behavior The circle does not move as I drag my cursor. Instead, the cursor changes to not-allowed, and you can no longer click and drag the circle.

If I click somewhere outside of the circle it resets back to the expected behavior.

Environment (include versions). Did this work in previous versions?

• React Native for Web (version): 0.17.7
• React (version): 17.0.1
• Browser: Windows Edge

Additional context https://user-images.githubusercontent.com/18077159/162850693-97de18c5-2fa3-4e8b-8dbd-b7932a7681d4.mov

[BhaumikSurani]

I had similar issue

that generate after double click
on browser when you double click it select some view so panresponder cancel your drag event

Their is 2 soluation thats working for me

1) unselect all selected view by following code

if (Platform.OS === 'web') {
    if (window.getSelection) {
        var sel = window.getSelection();
        sel.removeAllRanges();
    }
}

2) disable selection using css

/* Disable Text Selection */
#root {
    user-select: none;
    /* supported by Chrome and Opera */
    -webkit-user-select: none;
    /* Safari */
    -khtml-user-select: none;
    /* Konqueror HTML */
    -moz-user-select: none;
    /* Firefox */
    -ms-user-select: none;
    /* Internet Explorer/Edge */
}