External link component: Add a check for on page anchor links

[carolinan]

What?

This is an attempt to solve an issue where clicking an anchor link inside the link control modal opens the editor in a new tab.
Please see #10117.

This PR prevents following the anchor link by checking if the href starts with # and then using event.preventDefault on click. There is also a valid suggestion in the issue, to open the link but with a front view, not editor view. I was unsure of how to make that change, so I went with this smaller change.

While I believe that this PR works, it feels like treating the symptoms rather than the cause.
Does anyone have insight in why the external link component is not only used for, well, external links?

Testing Instructions

1. Open the editor and create a new post or page.
2. Next add a block with a link control like a paragraph block or button block. Add an anchor link (#test).
3. Click the link in the link control modal. Nothing should happen.
4. Please also test an internal content link (I mean a link to a post or page on the same install) and an external link to see that they still open correctly.

Screenshots or screencast

[getdave]

Thanks for this PR. It makes sense to catch this situation and will be a good improvement.

Left a few ideas.

[getdave]

Can we guarantee href is always a String? For example is it possible for it to be undefined? If it is then we should guard here and also coerce to Boolean.

Suggested change

	const shouldPreventDefault = href.startsWith( '#' );
	const shouldPreventDefault = !! href?.startsWith( '#' );

[carolinan]

I am not sure how to backtrace it to see if it can be undefined for some reason, so I believe it is easier to add the check :)

[carolinan]

Though the type for href is set to string in types.ts. I think @walbo would be able to answer how to best handle the check.

[carolinan]

Do I also need to add an entry to packages/components/CHANGELOG.md?

[getdave]

Do I also need to add an entry to packages/components/CHANGELOG.md?

Based on this I'd say you have to maintain that file manually. So add this PR under the Unreleased section.

[getdave]

I think this is ready to 🚢