Why is rel='noopener noreferrer' needed on target='_blank' links?

Without it, the opened site can use window.opener.location to silently redirect the original tab to a phishing page, so a user switching back sees a fake login screen that appears to be on the site's domain.

Do modern browsers still need this attribute?

Chrome 88+ and Firefox 79+ implicitly add noopener for cross-origin _blank links, but explicit markup is still required for older browsers and same-origin links.

External Link Security

SkillDev tools

New-tab is a skill for AI agents that reviews HTML and JSX for anchor elements using target='_blank' and checks that rel='noopener noreferrer' is present. It addresses the reverse tabnapping risk where an opened site can use window.opener to redirect the original tab to a phishing page. The skill explains the attack, flags missing attributes, and suggests fixes.

Available today. Use it from your connected AI after setup.

No other account needed.

Have the HTML or JSX source of the project available for review.

Then ask your AI: use the External Link Security skill

What your AI can do with it

Find anchor elements with target='_blank' in HTML and JSX source
Verify each link includes rel='noopener noreferrer' or at minimum rel='noopener'
Flag external links opening in a new tab that are missing the attribute
Add rel='noopener noreferrer' to <a target='_blank'> elements, including in React/JSX
Explain reverse tabnapping via window.opener and the difference between noopener and noref
Recommend ESLint rules such as jsx-a11y/anchor-is-valid and eslint-plugin-security to enfo

Getting started

Have the HTML or JSX source of the project available for review.
Add the new-tab skill to the agent so it can be invoked during code review.
Ask the agent to review the markup for anchor elements with target='_blank'.
Review flagged links and add rel='noopener noreferrer' where missing.
Optionally configure an ESLint rule to prevent the issue from recurring.

What this skill tells your AI

The instructions your AI receives, as published by thedaviddias/front-end-checklist in skills/new-tab/SKILL.md and read by ahel’s review.

A malicious site opened via target='_blank' can use window.opener.location to silently redirect your original tab to a phishing page — the user switches back and sees a fake login screen on what appears to be your domain.

Quick Reference

Always add rel="noopener noreferrer" to any <a target="_blank"> link
noopener prevents the new tab from accessing window.opener and redirecting your page
noreferrer additionally suppresses the Referer header sent to the destination site
Modern browsers (Chrome 88+, Firefox 79+) implicitly add noopener for cross-origin _blank links, but explicit markup is required for older browsers and same-origin links
ESLint rule jsx-a11y/anchor-is-valid and eslint-plugin-security can enforce this automatically

Check

Find all anchor elements with target='_blank' in the HTML and JSX source. Verify each one includes rel='noopener noreferrer' (or at minimum rel='noopener'). Flag any external links opening in a new tab that are missing this attribute.

Fix

Add rel='noopener noreferrer' to all elements. In React/JSX this is rel="noopener noreferrer". Configure an ESLint rule to prevent this from recurring.

Explain

Explain the reverse tabnapping attack enabled by window.opener, how rel='noopener' and rel='noreferrer' prevent it, and the difference between the two values.

Code Review

Review server config, headers, forms, and integration points related to External Link Security. Flag exact responses, cookies, or browser behaviors that violate the rule, and verify them against the effective production-like response.

For full implementation details, code examples, and framework-specific guidance, see references/rule.md.

Rule page: https://frontendchecklist.io/en/rules/security/new-tab

Signals

GitHub stars: 74k
Forks: 7k
Last commit: Aug 2026

ahel review

K1binfo
installs-packages (in references/rule.md)

Automated review, not a security audit. Ruleset v1+k2.

Questions

Why is rel='noopener noreferrer' needed on target='_blank' links?: Without it, the opened site can use window.opener.location to silently redirect the original tab to a phishing page, so a user switching back sees a fake login screen that appears to be on the site's domain.
Do modern browsers still need this attribute?: Chrome 88+ and Firefox 79+ implicitly add noopener for cross-origin _blank links, but explicit markup is still required for older browsers and same-origin links.

Advanced

Item type: skill
Key: new-tab
Source: github.com/thedaviddias/front-end-checklist

github.com/thedaviddias/front-end-checklist

More in Dev tools

teach
Skill · mattpocock ponytail
Skill · dietrichgebert implement
Skill · mattpocock caveman
Skill · juliusbrussee shadcn
Skill · shadcn benchmark
Skill · affaan-m