diff --git a/packages/@react-aria/utils/src/filterDOMProps.ts b/packages/@react-aria/utils/src/filterDOMProps.ts index 61918d421ca..0a3ebd5a903 100644 --- a/packages/@react-aria/utils/src/filterDOMProps.ts +++ b/packages/@react-aria/utils/src/filterDOMProps.ts @@ -114,7 +114,7 @@ export function filterDOMProps(props: DOMProps & AriaLabelingProps & LinkDOMProp (labelable && labelablePropNames.has(prop)) || (isLink && linkPropNames.has(prop)) || (global && globalAttrs.has(prop)) || - (events && globalEvents.has(prop) || (prop.endsWith('Capture') && globalEvents.has(prop.slice(0, -7)))) || + (events && (globalEvents.has(prop) || (prop.endsWith('Capture') && globalEvents.has(prop.slice(0, -7))))) || propNames?.has(prop) || propRe.test(prop) ) diff --git a/packages/react-aria-components/test/Button.test.js b/packages/react-aria-components/test/Button.test.js index 3e95d797c58..08dda75820f 100644 --- a/packages/react-aria-components/test/Button.test.js +++ b/packages/react-aria-components/test/Button.test.js @@ -124,7 +124,8 @@ describe('Button', () => { it('should support press state', async () => { let onPress = jest.fn(); let onClick = jest.fn(); - let {getByRole} = render(); + let onClickCapture = jest.fn(); + let {getByRole} = render(); let button = getByRole('button'); expect(button).not.toHaveAttribute('data-pressed'); @@ -140,6 +141,7 @@ describe('Button', () => { expect(onPress).toHaveBeenCalledTimes(1); expect(onClick).toHaveBeenCalledTimes(1); + expect(onClickCapture).toHaveBeenCalledTimes(1); }); it('should support disabled state', () => { diff --git a/packages/react-aria-components/test/Checkbox.test.js b/packages/react-aria-components/test/Checkbox.test.js index 4cff9c94e1d..e3983a196d5 100644 --- a/packages/react-aria-components/test/Checkbox.test.js +++ b/packages/react-aria-components/test/Checkbox.test.js @@ -125,7 +125,8 @@ describe('Checkbox', () => { it('should support press state', async () => { let onPress = jest.fn(); let onClick = jest.fn(); - let {getByRole} = render( isPressed ? 'pressed' : ''} onPress={onPress} onClick={onClick}>Test); + let onClickCapture = jest.fn(); + let {getByRole} = render( isPressed ? 'pressed' : ''} onPress={onPress} onClick={onClick} onClickCapture={onClickCapture}>Test); let checkbox = getByRole('checkbox').closest('label'); expect(checkbox).not.toHaveAttribute('data-pressed'); @@ -141,6 +142,7 @@ describe('Checkbox', () => { expect(onPress).toHaveBeenCalledTimes(1); expect(onClick).toHaveBeenCalledTimes(1); + expect(onClickCapture).toHaveBeenCalledTimes(1); }); it('should support press state with keyboard', async () => { diff --git a/packages/react-aria-components/test/Link.test.js b/packages/react-aria-components/test/Link.test.js index c16a30e1489..d2defeabf52 100644 --- a/packages/react-aria-components/test/Link.test.js +++ b/packages/react-aria-components/test/Link.test.js @@ -110,7 +110,8 @@ describe('Link', () => { it('should support press state', async () => { let onPress = jest.fn(); let onClick = jest.fn(); - let {getByRole} = render( isPressed ? 'pressed' : ''} onPress={onPress} onClick={onClick}>Test); + let onClickCapture = jest.fn(); + let {getByRole} = render( isPressed ? 'pressed' : ''} onPress={onPress} onClick={onClick} onClickCapture={onClickCapture}>Test); let link = getByRole('link'); expect(link).not.toHaveAttribute('data-pressed'); @@ -126,6 +127,7 @@ describe('Link', () => { expect(onPress).toHaveBeenCalledTimes(1); expect(onClick).toHaveBeenCalledTimes(1); + expect(onClickCapture).toHaveBeenCalledTimes(1); }); it('should support disabled state', () => { diff --git a/packages/react-aria-components/test/Menu.test.tsx b/packages/react-aria-components/test/Menu.test.tsx index e3a3de3c6c4..4ff56edafbf 100644 --- a/packages/react-aria-components/test/Menu.test.tsx +++ b/packages/react-aria-components/test/Menu.test.tsx @@ -1449,11 +1449,12 @@ describe('Menu', () => { let onPressEnd = jest.fn(); let onPress = jest.fn(); let onClick = jest.fn(); + let onClickCapture = jest.fn(); let tree = render( - + ); @@ -1467,6 +1468,7 @@ describe('Menu', () => { expect(onPressEnd).toHaveBeenCalledTimes(1); expect(onPress).toHaveBeenCalledTimes(1); expect(onClick).toHaveBeenCalledTimes(1); + expect(onClickCapture).toHaveBeenCalledTimes(1); }); it('should support press events on menu items with closeOnSelect: false', async function () { diff --git a/packages/react-aria-components/test/RadioGroup.test.js b/packages/react-aria-components/test/RadioGroup.test.js index 06dfeeafcb9..706a32e8e88 100644 --- a/packages/react-aria-components/test/RadioGroup.test.js +++ b/packages/react-aria-components/test/RadioGroup.test.js @@ -169,7 +169,8 @@ describe('RadioGroup', () => { it('should support press state', async () => { let onPress = jest.fn(); let onClick = jest.fn(); - let {getAllByRole} = renderGroup({}, {className: ({isPressed}) => isPressed ? 'pressed' : '', onClick, onPress}); + let onClickCapture = jest.fn(); + let {getAllByRole} = renderGroup({}, {className: ({isPressed}) => isPressed ? 'pressed' : '', onClick, onPress, onClickCapture}); let radio = getAllByRole('radio')[0].closest('label'); expect(radio).not.toHaveAttribute('data-pressed'); @@ -185,6 +186,7 @@ describe('RadioGroup', () => { expect(onPress).toHaveBeenCalledTimes(1); expect(onClick).toHaveBeenCalledTimes(1); + expect(onClickCapture).toHaveBeenCalledTimes(1); }); it('should support press state with keyboard', async () => { diff --git a/packages/react-aria-components/test/Switch.test.js b/packages/react-aria-components/test/Switch.test.js index 41389f2fb86..c93098a1fec 100644 --- a/packages/react-aria-components/test/Switch.test.js +++ b/packages/react-aria-components/test/Switch.test.js @@ -141,7 +141,8 @@ describe('Switch', () => { it('should support press state', async () => { let onPress = jest.fn(); let onClick = jest.fn(); - let {getByRole} = render( isPressed ? 'pressed' : ''} onPress={onPress} onClick={onClick}>Test); + let onClickCapture = jest.fn(); + let {getByRole} = render( isPressed ? 'pressed' : ''} onPress={onPress} onClick={onClick} onClickCapture={onClickCapture}>Test); let s = getByRole('switch').closest('label'); expect(s).not.toHaveAttribute('data-pressed'); @@ -157,6 +158,7 @@ describe('Switch', () => { expect(onPress).toHaveBeenCalledTimes(1); expect(onClick).toHaveBeenCalledTimes(1); + expect(onClickCapture).toHaveBeenCalledTimes(1); }); it('should support press state with keyboard', async () => { diff --git a/packages/react-aria-components/test/ToggleButton.test.js b/packages/react-aria-components/test/ToggleButton.test.js index 0dd9fa26510..985ed15916e 100644 --- a/packages/react-aria-components/test/ToggleButton.test.js +++ b/packages/react-aria-components/test/ToggleButton.test.js @@ -96,7 +96,8 @@ describe('ToggleButton', () => { it('should support press state', async () => { let onPress = jest.fn(); let onClick = jest.fn(); - let {getByRole} = render( isPressed ? 'pressed' : ''} onPress={onPress} onClick={onClick}>Test); + let onClickCapture = jest.fn(); + let {getByRole} = render( isPressed ? 'pressed' : ''} onPress={onPress} onClick={onClick} onClickCapture={onClickCapture}>Test); let button = getByRole('button'); expect(button).not.toHaveAttribute('data-pressed'); @@ -112,6 +113,7 @@ describe('ToggleButton', () => { expect(onPress).toHaveBeenCalledTimes(1); expect(onClick).toHaveBeenCalledTimes(1); + expect(onClickCapture).toHaveBeenCalledTimes(1); }); it('should support disabled state', () => {