Skip to content

Commit f2377a4

Browse files
chirokaschirokas
authored
fix: Avoid duplicate capture events (#8917)
1 parent d422ece commit f2377a4

File tree

8 files changed

+22
-8
lines changed

8 files changed

+22
-8
lines changed

‎packages/@react-aria/utils/src/filterDOMProps.ts‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -114,7 +114,7 @@ export function filterDOMProps(props: DOMProps & AriaLabelingProps & LinkDOMProp
114114
(labelable && labelablePropNames.has(prop)) ||
115115
(isLink && linkPropNames.has(prop)) ||
116116
(global && globalAttrs.has(prop)) ||
117-
(events && globalEvents.has(prop) || (prop.endsWith('Capture') && globalEvents.has(prop.slice(0, -7)))) ||
117+
(events && (globalEvents.has(prop) || (prop.endsWith('Capture') && globalEvents.has(prop.slice(0, -7))))) ||
118118
propNames?.has(prop) ||
119119
propRe.test(prop)
120120
)

‎packages/react-aria-components/test/Button.test.js‎

Lines changed: 3 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -124,7 +124,8 @@ describe('Button', () => {
124124
it('should support press state', async () => {
125125
let onPress = jest.fn();
126126
let onClick = jest.fn();
127-
let {getByRole} = render(<Button className={({isPressed}) => isPressed ? 'pressed' : ''} onPress={onPress} onClick={onClick}>Test</Button>);
127+
let onClickCapture = jest.fn();
128+
let {getByRole} = render(<Button className={({isPressed}) => isPressed ? 'pressed' : ''} onPress={onPress} onClick={onClick} onClickCapture={onClickCapture}>Test</Button>);
128129
let button = getByRole('button');
129130

130131
expect(button).not.toHaveAttribute('data-pressed');
@@ -140,6 +141,7 @@ describe('Button', () => {
140141

141142
expect(onPress).toHaveBeenCalledTimes(1);
142143
expect(onClick).toHaveBeenCalledTimes(1);
144+
expect(onClickCapture).toHaveBeenCalledTimes(1);
143145
});
144146

145147
it('should support disabled state', () => {

‎packages/react-aria-components/test/Checkbox.test.js‎

Lines changed: 3 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -125,7 +125,8 @@ describe('Checkbox', () => {
125125
it('should support press state', async () => {
126126
let onPress = jest.fn();
127127
let onClick = jest.fn();
128-
let {getByRole} = render(<Checkbox className={({isPressed}) => isPressed ? 'pressed' : ''} onPress={onPress} onClick={onClick}>Test</Checkbox>);
128+
let onClickCapture = jest.fn();
129+
let {getByRole} = render(<Checkbox className={({isPressed}) => isPressed ? 'pressed' : ''} onPress={onPress} onClick={onClick} onClickCapture={onClickCapture}>Test</Checkbox>);
129130
let checkbox = getByRole('checkbox').closest('label');
130131

131132
expect(checkbox).not.toHaveAttribute('data-pressed');
@@ -141,6 +142,7 @@ describe('Checkbox', () => {
141142

142143
expect(onPress).toHaveBeenCalledTimes(1);
143144
expect(onClick).toHaveBeenCalledTimes(1);
145+
expect(onClickCapture).toHaveBeenCalledTimes(1);
144146
});
145147

146148
it('should support press state with keyboard', async () => {

‎packages/react-aria-components/test/Link.test.js‎

Lines changed: 3 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -110,7 +110,8 @@ describe('Link', () => {
110110
it('should support press state', async () => {
111111
let onPress = jest.fn();
112112
let onClick = jest.fn();
113-
let {getByRole} = render(<Link className={({isPressed}) => isPressed ? 'pressed' : ''} onPress={onPress} onClick={onClick}>Test</Link>);
113+
let onClickCapture = jest.fn();
114+
let {getByRole} = render(<Link className={({isPressed}) => isPressed ? 'pressed' : ''} onPress={onPress} onClick={onClick} onClickCapture={onClickCapture}>Test</Link>);
114115
let link = getByRole('link');
115116

116117
expect(link).not.toHaveAttribute('data-pressed');
@@ -126,6 +127,7 @@ describe('Link', () => {
126127

127128
expect(onPress).toHaveBeenCalledTimes(1);
128129
expect(onClick).toHaveBeenCalledTimes(1);
130+
expect(onClickCapture).toHaveBeenCalledTimes(1);
129131
});
130132

131133
it('should support disabled state', () => {

‎packages/react-aria-components/test/Menu.test.tsx‎

Lines changed: 3 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -1449,11 +1449,12 @@ describe('Menu', () => {
14491449
let onPressEnd = jest.fn();
14501450
let onPress = jest.fn();
14511451
let onClick = jest.fn();
1452+
let onClickCapture = jest.fn();
14521453
let tree = render(
14531454
<MenuTrigger>
14541455
<Button>Menu Button</Button>
14551456
<Popover>
1456-
<TestMenu itemProps={{onAction, onPressStart, onPressEnd, onPress, onClick}} />
1457+
<TestMenu itemProps={{onAction, onPressStart, onPressEnd, onPress, onClick, onClickCapture}} />
14571458
</Popover>
14581459
</MenuTrigger>
14591460
);
@@ -1467,6 +1468,7 @@ describe('Menu', () => {
14671468
expect(onPressEnd).toHaveBeenCalledTimes(1);
14681469
expect(onPress).toHaveBeenCalledTimes(1);
14691470
expect(onClick).toHaveBeenCalledTimes(1);
1471+
expect(onClickCapture).toHaveBeenCalledTimes(1);
14701472
});
14711473

14721474
it('should support press events on menu items with closeOnSelect: false', async function () {

‎packages/react-aria-components/test/RadioGroup.test.js‎

Lines changed: 3 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -169,7 +169,8 @@ describe('RadioGroup', () => {
169169
it('should support press state', async () => {
170170
let onPress = jest.fn();
171171
let onClick = jest.fn();
172-
let {getAllByRole} = renderGroup({}, {className: ({isPressed}) => isPressed ? 'pressed' : '', onClick, onPress});
172+
let onClickCapture = jest.fn();
173+
let {getAllByRole} = renderGroup({}, {className: ({isPressed}) => isPressed ? 'pressed' : '', onClick, onPress, onClickCapture});
173174
let radio = getAllByRole('radio')[0].closest('label');
174175

175176
expect(radio).not.toHaveAttribute('data-pressed');
@@ -185,6 +186,7 @@ describe('RadioGroup', () => {
185186

186187
expect(onPress).toHaveBeenCalledTimes(1);
187188
expect(onClick).toHaveBeenCalledTimes(1);
189+
expect(onClickCapture).toHaveBeenCalledTimes(1);
188190
});
189191

190192
it('should support press state with keyboard', async () => {

‎packages/react-aria-components/test/Switch.test.js‎

Lines changed: 3 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -141,7 +141,8 @@ describe('Switch', () => {
141141
it('should support press state', async () => {
142142
let onPress = jest.fn();
143143
let onClick = jest.fn();
144-
let {getByRole} = render(<Switch className={({isPressed}) => isPressed ? 'pressed' : ''} onPress={onPress} onClick={onClick}>Test</Switch>);
144+
let onClickCapture = jest.fn();
145+
let {getByRole} = render(<Switch className={({isPressed}) => isPressed ? 'pressed' : ''} onPress={onPress} onClick={onClick} onClickCapture={onClickCapture}>Test</Switch>);
145146
let s = getByRole('switch').closest('label');
146147

147148
expect(s).not.toHaveAttribute('data-pressed');
@@ -157,6 +158,7 @@ describe('Switch', () => {
157158

158159
expect(onPress).toHaveBeenCalledTimes(1);
159160
expect(onClick).toHaveBeenCalledTimes(1);
161+
expect(onClickCapture).toHaveBeenCalledTimes(1);
160162
});
161163

162164
it('should support press state with keyboard', async () => {

‎packages/react-aria-components/test/ToggleButton.test.js‎

Lines changed: 3 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -96,7 +96,8 @@ describe('ToggleButton', () => {
9696
it('should support press state', async () => {
9797
let onPress = jest.fn();
9898
let onClick = jest.fn();
99-
let {getByRole} = render(<ToggleButton className={({isPressed}) => isPressed ? 'pressed' : ''} onPress={onPress} onClick={onClick}>Test</ToggleButton>);
99+
let onClickCapture = jest.fn();
100+
let {getByRole} = render(<ToggleButton className={({isPressed}) => isPressed ? 'pressed' : ''} onPress={onPress} onClick={onClick} onClickCapture={onClickCapture}>Test</ToggleButton>);
100101
let button = getByRole('button');
101102

102103
expect(button).not.toHaveAttribute('data-pressed');
@@ -112,6 +113,7 @@ describe('ToggleButton', () => {
112113

113114
expect(onPress).toHaveBeenCalledTimes(1);
114115
expect(onClick).toHaveBeenCalledTimes(1);
116+
expect(onClickCapture).toHaveBeenCalledTimes(1);
115117
});
116118

117119
it('should support disabled state', () => {

0 commit comments

Comments
 (0)