Skip to content

linter: react/jsx-no-target-blank false positive with compound boolean condition #23240

Description

@jeanne-cai

What version of Oxlint are you using?

1.68.0

What command did you run?

yarn oxlint -c oxlint.config.mjs

What does your .oxlintrc.json (or oxlint.config.ts) config file look like?

import { defineConfig } from 'oxlint';

export default defineConfig({
    categories: {
        correctness: 'off',
    },
    plugins: ['react'],
    rules: {
        'react/jsx-no-target-blank': 'error',
    },
});

What happened?

The rule reports an error when target and rel are guarded by a compound boolean condition (isEnabledA && isEnabledB), even though rel="noreferrer" is present whenever target="_blank" is present. The same pattern works correctly when only a single boolean condition is used.

test.tsx:

// Reported as an error
<a
    href={href}
    target={isEnabledA && isEnabledB ? '_blank' : undefined}
    rel={isEnabledA && isEnabledB ? 'noreferrer' : undefined}
/>;

// No error
<a
    href={href}
    target={isEnabled ? '_blank' : undefined}
    rel={isEnabled ? 'noreferrer' : undefined}
/>;

Output:

  × react(jsx-no-target-blank): Using target=`_blank` without rel=`noreferrer` (which implies rel=`noopener`) is a security risk in older browsers: see https://mathiasbynens.github.io/rel-noopener/#recommendations
   ╭─[test.tsx:4:12]
 3 │     href={href}
 4 │     target={isEnabledA && isEnabledB ? '_blank' : undefined}
   ·            ─────────────────────────────────────────────────
 5 │     rel={isEnabledA && isEnabledB ? 'noreferrer' : undefined}
   ╰────
  help: add rel=`noreferrer` to the element

Metadata

Metadata

Assignees

Labels

Type

Fields

Priority

None yet

Effort

None yet

Projects

No projects

Milestone

No milestone

Relationships

None yet

Development

No branches or pull requests

Issue actions