Skip to content

Open external links using rel="noopener"#293

Open
laurentpellegrino wants to merge 1 commit into
jonschlinkert:masterfrom
laurentpellegrino:master
Open

Open external links using rel="noopener"#293
laurentpellegrino wants to merge 1 commit into
jonschlinkert:masterfrom
laurentpellegrino:master

Conversation

@laurentpellegrino

Copy link
Copy Markdown

For performance and security reasons, this patch opens external links using rel="noopener" when target is defined and other than _self.

More details about the reason for this patch are available below:

https://developers.google.com/web/tools/lighthouse/audits/noopener

@laurentpellegrino

Copy link
Copy Markdown
Author

@jonschlinkert Do you think it is possible to merge and create a new release for this PR that is about performance and security?

Please note I tried to run tests but there are missing dependencies and the --reset option no longer exists for the version of es-lint that is fetched. Once that fixed, tests run but fail, with or without changes from this PR.

@doowb doowb left a comment

Copy link
Copy Markdown
Collaborator

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

There's a typo, but other than that, I think this might be okay. The one question I have, is how would someone that expects to be able to use window.opener for an internal link be able to do that? This might need to be handled with an option so users have more control over when noopener is set.

Comment thread lib/rules.js Outdated
var title = tokens[idx].title ? (' title="' + escapeHtml(replaceEntities(tokens[idx].title)) + '"') : '';
var target = options.linkTarget ? (' target="' + options.linkTarget + '"') : '';
return '<a href="' + escapeHtml(tokens[idx].href) + '"' + title + target + '>';
var rel = options.linkTarget && options.linkTarget !== '_self' ? (' ref="noopener"') : '';

Copy link
Copy Markdown
Collaborator

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

This should be rel="noopener".

For performance and security reasons, this patch opens external links using `rel="noopener"` when target is defined and other than `_self`.

More details about the reason for this patch are available below:

https://developers.google.com/web/tools/lighthouse/audits/noopener
@laurentpellegrino

laurentpellegrino commented Feb 15, 2018

Copy link
Copy Markdown
Author

@doowb Thanks, the typo is fixed.

how would someone that expects to be able to use window.opener for an internal link be able to do that?

In that case, people can set the existing linkTarget option to value _self or leave it empty? The rel attribute is added if the target is different from previously mentioned values.

The fact that we do not have fine grain control over link attributes per link seems to be another problem that is not even yet addressed for the target. I have opened an issue about this point: #291.

@doowb

doowb commented Feb 15, 2018

Copy link
Copy Markdown
Collaborator

@lpellegr thanks! I'll leave this open for a few days to see if anyone else has any comments or suggestions about this change.

@shockey

shockey commented Aug 3, 2018

Copy link
Copy Markdown
Collaborator

@doowb @lpellegr, any updates on this PR? Is there anything I can do to help get it merged?

@doowb

doowb commented Aug 3, 2018

Copy link
Copy Markdown
Collaborator

I'll merge this and try to get it published this weekend. I think some other things have been merged since the last published version so I might have to backport the changes if this should be a patch bump.

@doowb

doowb commented Aug 7, 2018

Copy link
Copy Markdown
Collaborator

I didn't forget about this. There are some things that need to be done with the repository before this can be merged.

@larsnystrom

Copy link
Copy Markdown

rel="noopener" is not supported in Edge, IE11 or older versions of Firefox. It would be better to use rel="noopener noreferrer", in order to solve this security issue for more browsers. See https://mathiasbynens.github.io/rel-noopener/

@rankida

rankida commented Nov 8, 2018

Copy link
Copy Markdown

Is there any update on this PR?

@shockey

shockey commented Nov 8, 2018

Copy link
Copy Markdown
Collaborator

FYI: since Remarkable doesn't support this, we've started using DomPurify to handle attaching noopener noreferrer to anchor links.

Here's the plugin we wrote: https://github.com/swagger-api/swagger-ui/blob/59bd9f4988007a0e561a62831f444787b84f6f2c/src/core/components/providers/markdown.jsx#L7-L16

If you're handling user generated Markdown, you should be sanitizing your output anyway! DomPurify is by far the best sanitization library that I've come across 😄

@laurentpellegrino

Copy link
Copy Markdown
Author

@doowb any news?

@richard-smartbear

Copy link
Copy Markdown

@doowb any news on this? 😸

Repository owner deleted a comment from laurentpellegrino Nov 27, 2019
@jonschlinkert jonschlinkert reopened this Nov 27, 2019
Repository owner locked as resolved and limited conversation to collaborators Nov 27, 2019
Sign up for free to subscribe to this conversation on GitHub. Already have an account? Sign in.

Labels

None yet

Projects

None yet

Development

Successfully merging this pull request may close these issues.

7 participants