Skip to content

Commit f1ea8c4

Browse files
authored
Replace target in snapshot, so it doesn't keep changing (#15924)
* Replace target in snapshot, so it doesn't keep changing * fix * snapshot
1 parent eb5546d commit f1ea8c4

3 files changed

Lines changed: 101 additions & 82 deletions

File tree

packages/@react-native-windows/tester/src/js/examples-win/Pointer/PointerClickEventsExample.windows.js

Lines changed: 14 additions & 10 deletions
Original file line numberDiff line numberDiff line change
@@ -11,32 +11,37 @@
1111
import type {RNTesterModuleExample} from '../../types/RNTesterTypes';
1212

1313
const React = require('react');
14-
import {Pressable, StyleSheet, View} from 'react-native';
14+
import {StyleSheet, View} from 'react-native';
1515
import RNTesterText from '../../components/RNTesterText';
1616

1717
function PointerClickEventsExample(): React.Node {
1818
const [text, setText] = React.useState(
1919
'onClick should cause the box to go red, onAuxClick will cause it go green',
2020
);
21-
const [bgColor, setBgColor]= React.useState('gray');
21+
const [bgColor, setBgColor] = React.useState('gray');
2222
return (
2323
<View>
2424
<View
2525
accessible
2626
testID="pointer-click-target"
2727
style={[styles.targetBox, {backgroundColor: bgColor}]}
28-
onClick={(e) => {
28+
onClick={e => {
2929
setBgColor('red');
30-
setText('onClick.nativeEvent: ' + JSON.stringify(e.nativeEvent, null, 2));
30+
setText(
31+
'onClick.nativeEvent: ' + JSON.stringify(e.nativeEvent, null, 2),
32+
);
3133
}}
32-
onAuxClick={(e) => {
34+
onAuxClick={e => {
3335
setBgColor('green');
34-
setText('onAuxClick.nativeEvent: ' + JSON.stringify(e.nativeEvent, null, 2));
36+
setText(
37+
'onAuxClick.nativeEvent: ' + JSON.stringify(e.nativeEvent, null, 2),
38+
);
3539
}}
3640
/>
37-
<RNTesterText accessible testID='pointer-click-text'>{text}</RNTesterText>
41+
<RNTesterText accessible testID="pointer-click-text">
42+
{text}
43+
</RNTesterText>
3844
</View>
39-
4045
);
4146
}
4247

@@ -46,8 +51,7 @@ exports.category = 'Basic';
4651
exports.title = 'Pointer Clicks';
4752
exports.documentationURL =
4853
'https://developer.mozilla.org/en-US/docs/Web/API/Element/auxclick_event';
49-
exports.description =
50-
'Tests that onClick and onAuxClick work.';
54+
exports.description = 'Tests that onClick and onAuxClick work.';
5155

5256
exports.examples = [
5357
{

packages/e2e-test-app-fabric/test/PointerClickEventsTest.test.ts

Lines changed: 24 additions & 9 deletions
Original file line numberDiff line numberDiff line change
@@ -20,7 +20,6 @@ afterEach(async () => {
2020
await verifyNoErrorLogs();
2121
});
2222

23-
2423
describe('Pointer onClick Test', () => {
2524
test('onClick reports correct native event properties on left click', async () => {
2625
const component = await app.findElementByTestID('pointer-click-target');
@@ -33,7 +32,9 @@ describe('Pointer onClick Test', () => {
3332
await app.waitUntil(
3433
async () => {
3534
const currentText = await stateText.getText();
36-
return currentText.includes('"button": 0') && currentText.includes('onClick');
35+
return (
36+
currentText.includes('"button": 0') && currentText.includes('onClick')
37+
);
3738
},
3839
{
3940
timeout: 5000,
@@ -43,7 +44,10 @@ describe('Pointer onClick Test', () => {
4344
);
4445

4546
const text = await stateText.getText();
46-
expect(text).toMatchSnapshot();
47+
const nativeEvent = JSON.parse(text.split('onClick.nativeEvent: ')[1]);
48+
expect(typeof nativeEvent.target).toBe('number');
49+
nativeEvent.target = '<target>';
50+
expect(nativeEvent).toMatchSnapshot();
4751
});
4852
test('onAuxClick reports correct native event properties on middle click', async () => {
4953
const component = await app.findElementByTestID('pointer-click-target');
@@ -56,7 +60,10 @@ describe('Pointer onClick Test', () => {
5660
await app.waitUntil(
5761
async () => {
5862
const currentText = await stateText.getText();
59-
return currentText.includes('"button": 1') && currentText.includes('onAuxClick');
63+
return (
64+
currentText.includes('"button": 1') &&
65+
currentText.includes('onAuxClick')
66+
);
6067
},
6168
{
6269
timeout: 5000,
@@ -66,20 +73,26 @@ describe('Pointer onClick Test', () => {
6673
);
6774

6875
const text = await stateText.getText();
69-
expect(text).toMatchSnapshot();
76+
const nativeEvent = JSON.parse(text.split('onAuxClick.nativeEvent: ')[1]);
77+
expect(typeof nativeEvent.target).toBe('number');
78+
nativeEvent.target = '<target>';
79+
expect(nativeEvent).toMatchSnapshot();
7080
});
7181
test('onAuxClick reports correct native event properties on right click', async () => {
7282
const component = await app.findElementByTestID('pointer-click-target');
7383
await component.waitForDisplayed({ timeout: 5000 });
7484

75-
// Middle click triggers onPointerDown with button=2
85+
// Right click triggers onPointerDown with button=2
7686
await component.click({ button: 'right' });
7787
const stateText = await app.findElementByTestID('pointer-click-text');
7888

7989
await app.waitUntil(
8090
async () => {
8191
const currentText = await stateText.getText();
82-
return currentText.includes('"button": 2') && currentText.includes('onAuxClick');
92+
return (
93+
currentText.includes('"button": 2') &&
94+
currentText.includes('onAuxClick')
95+
);
8396
},
8497
{
8598
timeout: 5000,
@@ -89,7 +102,9 @@ describe('Pointer onClick Test', () => {
89102
);
90103

91104
const text = await stateText.getText();
92-
expect(text).toMatchSnapshot();
105+
const nativeEvent = JSON.parse(text.split('onAuxClick.nativeEvent: ')[1]);
106+
expect(typeof nativeEvent.target).toBe('number');
107+
nativeEvent.target = '<target>';
108+
expect(nativeEvent).toMatchSnapshot();
93109
});
94-
95110
});
Lines changed: 63 additions & 63 deletions
Original file line numberDiff line numberDiff line change
@@ -1,100 +1,100 @@
11
// Jest Snapshot v1, https://goo.gl/fbAQLP
22

33
exports[`Pointer onClick Test onAuxClick reports correct native event properties on middle click 1`] = `
4-
"onAuxClick.nativeEvent: {
5-
"pointerId": 1,
6-
"pressure": 0,
7-
"pointerType": "mouse",
4+
{
5+
"altKey": false,
6+
"button": 1,
7+
"buttons": 0,
88
"clientX": 110,
99
"clientY": 165,
10-
"x": 110,
11-
"y": 165,
10+
"ctrlKey": false,
11+
"detail": 0,
12+
"height": 0,
13+
"isPrimary": true,
14+
"metaKey": false,
15+
"offsetX": 100,
16+
"offsetY": 99,
1217
"pageX": 110,
1318
"pageY": 165,
19+
"pointerId": 1,
20+
"pointerType": "mouse",
21+
"pressure": 0,
1422
"screenX": 100,
1523
"screenY": 99,
16-
"offsetX": 100,
17-
"offsetY": 99,
18-
"width": 0,
19-
"height": 0,
24+
"shiftKey": false,
25+
"tangentialPressure": 0,
26+
"target": "<target>",
2027
"tiltX": 0,
2128
"tiltY": 0,
22-
"detail": 0,
23-
"buttons": 0,
24-
"tangentialPressure": 0,
2529
"twist": 0,
26-
"ctrlKey": false,
27-
"shiftKey": false,
28-
"altKey": false,
29-
"metaKey": false,
30-
"isPrimary": true,
31-
"button": 1,
32-
"target": 1272
33-
}"
30+
"width": 0,
31+
"x": 110,
32+
"y": 165,
33+
}
3434
`;
3535

3636
exports[`Pointer onClick Test onAuxClick reports correct native event properties on right click 1`] = `
37-
"onAuxClick.nativeEvent: {
38-
"pointerId": 1,
39-
"pressure": 0,
40-
"pointerType": "mouse",
37+
{
38+
"altKey": false,
39+
"button": 2,
40+
"buttons": 0,
4141
"clientX": 110,
4242
"clientY": 165,
43-
"x": 110,
44-
"y": 165,
43+
"ctrlKey": false,
44+
"detail": 0,
45+
"height": 0,
46+
"isPrimary": true,
47+
"metaKey": false,
48+
"offsetX": 100,
49+
"offsetY": 99,
4550
"pageX": 110,
4651
"pageY": 165,
52+
"pointerId": 1,
53+
"pointerType": "mouse",
54+
"pressure": 0,
4755
"screenX": 100,
4856
"screenY": 99,
49-
"offsetX": 100,
50-
"offsetY": 99,
51-
"width": 0,
52-
"height": 0,
57+
"shiftKey": false,
58+
"tangentialPressure": 0,
59+
"target": "<target>",
5360
"tiltX": 0,
5461
"tiltY": 0,
55-
"detail": 0,
56-
"buttons": 0,
57-
"tangentialPressure": 0,
5862
"twist": 0,
59-
"ctrlKey": false,
60-
"shiftKey": false,
61-
"altKey": false,
62-
"metaKey": false,
63-
"isPrimary": true,
64-
"button": 2,
65-
"target": 1272
66-
}"
63+
"width": 0,
64+
"x": 110,
65+
"y": 165,
66+
}
6767
`;
6868

6969
exports[`Pointer onClick Test onClick reports correct native event properties on left click 1`] = `
70-
"onClick.nativeEvent: {
71-
"pointerId": 1,
72-
"pressure": 0,
73-
"pointerType": "mouse",
70+
{
71+
"altKey": false,
72+
"button": 0,
73+
"buttons": 0,
7474
"clientX": 110,
7575
"clientY": 165,
76-
"x": 110,
77-
"y": 165,
76+
"ctrlKey": false,
77+
"detail": 0,
78+
"height": 0,
79+
"isPrimary": true,
80+
"metaKey": false,
81+
"offsetX": 100,
82+
"offsetY": 99,
7883
"pageX": 110,
7984
"pageY": 165,
85+
"pointerId": 1,
86+
"pointerType": "mouse",
87+
"pressure": 0,
8088
"screenX": 100,
8189
"screenY": 99,
82-
"offsetX": 100,
83-
"offsetY": 99,
84-
"width": 0,
85-
"height": 0,
90+
"shiftKey": false,
91+
"tangentialPressure": 0,
92+
"target": "<target>",
8693
"tiltX": 0,
8794
"tiltY": 0,
88-
"detail": 0,
89-
"buttons": 0,
90-
"tangentialPressure": 0,
9195
"twist": 0,
92-
"ctrlKey": false,
93-
"shiftKey": false,
94-
"altKey": false,
95-
"metaKey": false,
96-
"isPrimary": true,
97-
"button": 0,
98-
"target": 1272
99-
}"
96+
"width": 0,
97+
"x": 110,
98+
"y": 165,
99+
}
100100
`;

0 commit comments

Comments
 (0)