From 6b9f10e2c6cf67cf6114867c7282a810491e0043 Mon Sep 17 00:00:00 2001 From: Yi Zhan Date: Sun, 6 Sep 2026 17:44:19 +0000 Subject: [PATCH] fix: treat mailto/tel as external markdown links Signed-off-by: Yi Zhan --- .../CustomComponents/ReactRouterLink.spec.tsx | 15 +++++++++++++++ .../CustomComponents/ReactRouterLink.tsx | 2 +- 2 files changed, 16 insertions(+), 1 deletion(-) create mode 100644 packages/elements-core/src/components/MarkdownViewer/CustomComponents/ReactRouterLink.spec.tsx diff --git a/packages/elements-core/src/components/MarkdownViewer/CustomComponents/ReactRouterLink.spec.tsx b/packages/elements-core/src/components/MarkdownViewer/CustomComponents/ReactRouterLink.spec.tsx new file mode 100644 index 000000000..a0fa5ecc3 --- /dev/null +++ b/packages/elements-core/src/components/MarkdownViewer/CustomComponents/ReactRouterLink.spec.tsx @@ -0,0 +1,15 @@ +import { render, screen } from '@testing-library/react'; +import * as React from 'react'; + +import { ReactRouterMarkdownLink } from './ReactRouterLink'; + +describe('ReactRouterMarkdownLink', () => { + it('renders a mailto href as an external link', () => { + render(Contact); + + const link = screen.getByRole('link', { name: 'Contact' }); + expect(link).toHaveAttribute('href', 'mailto:team@example.com'); + expect(link).toHaveAttribute('target', '_blank'); + expect(link).toHaveAttribute('rel', 'noreferrer noopener'); + }); +}); diff --git a/packages/elements-core/src/components/MarkdownViewer/CustomComponents/ReactRouterLink.tsx b/packages/elements-core/src/components/MarkdownViewer/CustomComponents/ReactRouterLink.tsx index d9a3560c8..8453bc917 100644 --- a/packages/elements-core/src/components/MarkdownViewer/CustomComponents/ReactRouterLink.tsx +++ b/packages/elements-core/src/components/MarkdownViewer/CustomComponents/ReactRouterLink.tsx @@ -1,7 +1,7 @@ import type { LinkProps } from '@stoplight/mosaic'; import React from 'react'; -const externalRegex = new RegExp('^(?:[a-z]+:)?//', 'i'); +const externalRegex = new RegExp('^(?:[a-z][a-z0-9+.-]*:|//)', 'i'); export const ReactRouterMarkdownLink = ({ title,