From 80bbc414b8e102c640bfbaea4018b2649aa5d3dd Mon Sep 17 00:00:00 2001 From: Amit Dahan Date: Mon, 17 Jun 2024 11:14:56 +0300 Subject: [PATCH 1/2] chore: [#1464] Add failing test --- packages/jest-environment/test/react/React.test.tsx | 10 ++++++++++ 1 file changed, 10 insertions(+) diff --git a/packages/jest-environment/test/react/React.test.tsx b/packages/jest-environment/test/react/React.test.tsx index 9b44f6d7d..f28f1ba8b 100644 --- a/packages/jest-environment/test/react/React.test.tsx +++ b/packages/jest-environment/test/react/React.test.tsx @@ -110,4 +110,14 @@ describe('React', () => { await TESTING_LIBRARY_USER.click(button); expect(document.querySelector('p span').textContent).toBe('test'); }); + + it('Can `preventDefault` to prevent navigation with React click listener on an anchor tag', async () => { + location.href = 'http://localhost/'; + const { getByRole } = ReactTestingLibrary.render( + ev.preventDefault()} /> + ); + expect(document.location.href).toBe('http://localhost/'); + await TESTING_LIBRARY_USER.click(getByRole('link')); + expect(document.location.href).toBe('http://localhost/'); + }); }); From a3b6d86cb3e97efa3a1b141108012f673b4f4ce6 Mon Sep 17 00:00:00 2001 From: Amit Dahan Date: Mon, 17 Jun 2024 11:15:44 +0300 Subject: [PATCH 2/2] fix: [#1464] Fix React click handler with `preventDefault` not preventing navigation --- .../src/nodes/html-anchor-element/HTMLAnchorElement.ts | 3 +-- 1 file changed, 1 insertion(+), 2 deletions(-) diff --git a/packages/happy-dom/src/nodes/html-anchor-element/HTMLAnchorElement.ts b/packages/happy-dom/src/nodes/html-anchor-element/HTMLAnchorElement.ts index 42146e045..452f71e29 100644 --- a/packages/happy-dom/src/nodes/html-anchor-element/HTMLAnchorElement.ts +++ b/packages/happy-dom/src/nodes/html-anchor-element/HTMLAnchorElement.ts @@ -500,8 +500,7 @@ export default class HTMLAnchorElement extends HTMLElement implements IHTMLHyper if ( event.type === 'click' && event instanceof MouseEvent && - (event.eventPhase === EventPhaseEnum.atTarget || - event.eventPhase === EventPhaseEnum.bubbling) && + event.eventPhase === EventPhaseEnum.none && !event.defaultPrevented ) { const href = this.href;