Prevent default clicking on markdown preview links when using `openLi…

…nksInNewTab` (#2718)

* useLinkInterception to preventDefault after opening in new tabs

* Add noopener noreferrer to window.open during link interception

* Add changeset

* Fix linting error

Co-authored-by: Josh Black <joshblack@github.com>

.changeset/empty-pots-cheer.md

@@ -0,0 +1,5 @@
+---
+'@primer/react': patch
+---
+
+Prevent default when clicking on MarkdownViewer links with openLinksInNewTab

src/drafts/MarkdownEditor/MarkdownEditor.test.tsx

@@ -789,8 +789,6 @@ describe('MarkdownEditor', () => {
       })
 
       it('forces links to open in a new tab', async () => {
-        const spy = jest.spyOn(console, 'error').mockImplementation(() => {})
-
         // eslint-disable-next-line github/unescaped-html-literal
         const html = '<a href="https://example.com">Link</a>'
         const user = userEvent.setup()
@@ -800,19 +798,7 @@ describe('MarkdownEditor', () => {
         const link = await waitFor(() => within(getPreview()).getByText('Link'))
 
         await user.click(link)
-        // Note: navigation is not implemented in JSDOM and will log out an
-        // error when clicking the link above. The spy here captures this error
-        // and will assert that it is called only once, otherwise another error
-        // in this test has occurred
-        expect(spy).toHaveBeenCalledTimes(1)
-        expect(spy).toHaveBeenCalledWith(
-          expect.objectContaining({
-            message: 'Not implemented: navigation (except hash changes)',
-          }),
-        )
-        expect(windowOpenSpy).toHaveBeenCalledWith('https://example.com/', '_blank')
-
-        spy.mockRestore()
+        expect(windowOpenSpy).toHaveBeenCalledWith('https://example.com/', '_blank', 'noopener noreferrer')
       })
     })
   })

src/drafts/MarkdownViewer/MarkdownViewer.test.tsx

@@ -103,7 +103,7 @@ text after list`
       )
       const link = getByRole('link') as HTMLAnchorElement
       await user.click(link)
-      expect(windowOpenSpy).toHaveBeenCalledWith('https://example.com/', '_blank')
+      expect(windowOpenSpy).toHaveBeenCalledWith('https://example.com/', '_blank', 'noopener noreferrer')
     })
 
     it('calls onLinkClick on link click', async () => {

src/drafts/MarkdownViewer/_useLinkInterception.ts

@@ -18,7 +18,8 @@ export const useLinkInterception = ({htmlContainer, onLinkClick, openLinksInNewT
       onLinkClick?.(event)
 
       if (!event.defaultPrevented && openLinksInNewTab && link.href) {
-        window.open(link.href, '_blank')
+        window.open(link.href, '_blank', 'noopener noreferrer')
+        event.preventDefault()
       }
     }