The documentation for the 'Link' component discusses its use for internal links only and suggests that 'a' is rendered differently than it is

[simonbates]

📚 Documentation

The documentation for the Link component discusses the use of the Link component for internal links only and suggests that a be used for external links.

It contains the following comment in the example source code: "Note that external links still use 'a' tags, but automatically opens in new tab." When I tried using a in a React component for an external link, I found that it was rendered without attributes to open the target in a new tab.

Looking at the source code for the Link component, it supports both internal and external links, and will render external links with attributes to open in a new tab.

I think that the documentation could be updated to reflect that Link can be used for both internal and external links (and its behavior of adding attributes to open external links in a new tab). If that is the intended end-user accessible behavior. And I believe that the a tag is not behaving as described in the comment quoted above.

Steps to reproduce:

• Create a Docusaurus rendered JS page with the following links:

<a href="https://docusaurus.io/">Docusaurus</a>
<Link to="https://docusaurus.io/">Docusaurus</Link>

These are rendered as:

<a href="https://docusaurus.io/">Docusaurus</a>
<a href="https://docusaurus.io/" target="_blank" rel="noopener noreferrer">Docusaurus</a>

Have you read the Contributing Guidelines on issues?

Yes

[simonbates]

I've done a little more experimenting with links and this is what I am seeing on Docusaurus 2.0.0-beta.3.

Rendered with React in a JavaScript file

Source:

<a href="https://docusaurus.io/">Docusaurus</a>
<Link to="https://docusaurus.io/">Docusaurus</Link>

Rendered:

<a href="https://docusaurus.io/">Docusaurus</a>
<a href="https://docusaurus.io/" target="_blank" rel="noopener noreferrer">Docusaurus</a>

Rendered with Markdown

Source:

[Docusaurus](https://docusaurus.io/)
<a href="https://docusaurus.io/">Docusaurus</a>

Rendered:

<a href="https://docusaurus.io/" target="_blank" rel="noopener noreferrer">Docusaurus</a>
<a href="https://docusaurus.io/" target="_blank" rel="noopener noreferrer">Docusaurus</a>

Summary

All of the external links are rendered with target="_blank" rel="noopener noreferrer" except for a links in React.

[simonbates]

The Docusaurus homepage uses Link for external links (such as <Link to="https://v1.docusaurus.io/">) in a JavaScript rendered page.

[slorber]

Thanks, agree, will be fixed in #5212