-
Notifications
You must be signed in to change notification settings - Fork 24k
/
PointerEventPointerMove.js
60 lines (51 loc) · 1.74 KB
/
PointerEventPointerMove.js
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
/**
* Copyright (c) Meta Platforms, Inc. and affiliates.
*
* This source code is licensed under the MIT license found in the
* LICENSE file in the root directory of this source tree.
*
* @format
* @flow
*/
// adapted from https://github.com/web-platform-tests/wpt/blob/master/pointerevents/pointerevent_pointermove.html
import type {PlatformTestComponentBaseProps} from '../PlatformTest/RNTesterPlatformTestTypes';
import type {PointerEvent} from 'react-native/Libraries/Types/CoreEventTypes';
import {useTestEventHandler} from './PointerEventSupport';
import RNTesterPlatformTest from '../PlatformTest/RNTesterPlatformTest';
import * as React from 'react';
import {useRef} from 'react';
import {StyleSheet, View} from 'react-native';
function PointerEventPointerMoveTestCase(
props: PlatformTestComponentBaseProps,
) {
const {harness} = props;
const detectedPointerTypesRef = useRef({});
const testPointerMove = harness.useAsyncTest('pointermove event received');
const handlers = useTestEventHandler(
['pointerMove'],
(event: PointerEvent) => {
detectedPointerTypesRef.current[event.nativeEvent.pointerType] = true;
testPointerMove.done();
},
);
return <View {...handlers} style={styles.target} />;
}
const styles = StyleSheet.create({
target: {
backgroundColor: 'black',
height: 64,
width: '100%',
},
});
type Props = $ReadOnly<{}>;
export default function PointerEventPointerMove(
props: Props,
): React.MixedElement {
return (
<RNTesterPlatformTest
component={PointerEventPointerMoveTestCase}
description="This test checks if pointermove event triggers. Move your mouse over the black rectangle or slide it if you are using touchscreen."
title="PointerMove test"
/>
);
}