From f2ead45239788815189ee213911ba0635c119d91 Mon Sep 17 00:00:00 2001
From: Sebastian Malton <sebastian@malton.name>
Date: Mon, 30 Nov 2020 08:20:29 -0500
Subject: [PATCH] add rule for checking invalid rel values

---
 docs/rules/jsx-no-invalid-rel.md      |  14 +
 index.js                              |   1 +
 lib/rules/jsx-no-invalid-rel.js       | 190 +++++++++++
 tests/lib/rules/jsx-no-invalid-rel.js | 464 ++++++++++++++++++++++++++
 4 files changed, 669 insertions(+)
 create mode 100644 docs/rules/jsx-no-invalid-rel.md
 create mode 100644 lib/rules/jsx-no-invalid-rel.js
 create mode 100644 tests/lib/rules/jsx-no-invalid-rel.js

diff --git a/docs/rules/jsx-no-invalid-rel.md b/docs/rules/jsx-no-invalid-rel.md
new file mode 100644
index 0000000000..7bdf973fa6
--- /dev/null
+++ b/docs/rules/jsx-no-invalid-rel.md
@@ -0,0 +1,14 @@
+# Prevent usage of invalid `rel` (react/jsx-no-invalid-rel)
+
+The JSX elements: `a`, `area`, `link`, or `form` all have a attribute called `rel`. There is is fixed list of values that have any meaning on these tags (see [MDN](https://developer.mozilla.org/en-US/docs/Web/HTML/Attributes/rel)). To help with minimizing confusion while reading code, only the appropriate values should be on each attribute.
+
+## Rule Details
+
+This rule aims to remove invalid `rel` attribute values.
+
+## Rule Options
+There are no options.
+
+## When Not To Use It
+
+When you don't want to enforce `rel` value correctness.
diff --git a/index.js b/index.js
index 8edb1177f1..bf4c2443c0 100644
--- a/index.js
+++ b/index.js
@@ -54,6 +54,7 @@ const allRules = {
   'jsx-uses-react': require('./lib/rules/jsx-uses-react'),
   'jsx-uses-vars': require('./lib/rules/jsx-uses-vars'),
   'jsx-wrap-multilines': require('./lib/rules/jsx-wrap-multilines'),
+  'jsx-no-invalid-rel': require('./lib/rules/jsx-no-invalid-rel'),
   'no-access-state-in-setstate': require('./lib/rules/no-access-state-in-setstate'),
   'no-adjacent-inline-elements': require('./lib/rules/no-adjacent-inline-elements'),
   'no-array-index-key': require('./lib/rules/no-array-index-key'),
diff --git a/lib/rules/jsx-no-invalid-rel.js b/lib/rules/jsx-no-invalid-rel.js
new file mode 100644
index 0000000000..7c203c2228
--- /dev/null
+++ b/lib/rules/jsx-no-invalid-rel.js
@@ -0,0 +1,190 @@
+/**
+ * @fileoverview Forbid rel attribute to have non-valid value
+ * @author Sebastian Malton
+ */
+
+'use strict';
+
+const docsUrl = require('../util/docsUrl');
+
+// ------------------------------------------------------------------------------
+// Rule Definition
+// ------------------------------------------------------------------------------
+
+const standardValues = new Map(Object.entries({
+  alternate: new Set(['link', 'area', 'a']),
+  author: new Set(['link', 'area', 'a']),
+  bookmark: new Set(['area', 'a']),
+  canonical: new Set(['link']),
+  'dns-prefetch': new Set(['link']),
+  external: new Set(['area', 'a', 'form']),
+  help: new Set(['link', 'area', 'a', 'form']),
+  icon: new Set(['link']),
+  license: new Set(['link', 'area', 'a', 'form']),
+  manifest: new Set(['link']),
+  modulepreload: new Set(['link']),
+  next: new Set(['link', 'area', 'a', 'form']),
+  nofollow: new Set(['area', 'a', 'form']),
+  noopener: new Set(['area', 'a', 'form']),
+  noreferrer: new Set(['area', 'a', 'form']),
+  opener: new Set(['area', 'a', 'form']),
+  pingback: new Set(['link']),
+  preconnect: new Set(['link']),
+  prefetch: new Set(['link']),
+  preload: new Set(['link']),
+  prerender: new Set(['link']),
+  prev: new Set(['link', 'area', 'a', 'form']),
+  search: new Set(['link', 'area', 'a', 'form']),
+  stylesheet: new Set(['link']),
+  tag: new Set(['area', 'a'])
+}));
+const components = new Set(['link', 'a', 'area', 'form']);
+
+function splitIntoRangedParts(node) {
+  const res = [];
+  const regex = /\s*([^\s]+)/g;
+  const valueRangeStart = node.range[0] + 1; // the plus one is for the initial quote
+  let match;
+
+  // eslint-disable-next-line no-cond-assign
+  while ((match = regex.exec(node.value)) !== null) {
+    const start = match.index + valueRangeStart;
+    const end = start + match[0].length;
+    res.push({
+      reportingValue: `"${match[1]}"`,
+      value: match[1],
+      range: [start, end]
+    });
+  }
+
+  return res;
+}
+
+function checkLiteralValueNode(context, node, parentNodeName) {
+  if (typeof node.value !== 'string') {
+    return context.report({
+      node,
+      messageId: 'onlyStrings',
+      fix(fixer) {
+        return fixer.remove(node.parent.parent);
+      }
+    });
+  }
+
+  if (!node.value.trim()) {
+    return context.report({
+      node,
+      messageId: 'emptyRel',
+      fix(fixer) {
+        return fixer.remove(node);
+      }
+    });
+  }
+
+  const parts = splitIntoRangedParts(node);
+  for (const part of parts) {
+    const allowedTags = standardValues.get(part.value);
+    if (!allowedTags) {
+      context.report({
+        node,
+        messageId: 'realRelValues',
+        data: {
+          value: part.reportingValue
+        },
+        fix(fixer) {
+          return fixer.removeRange(part.range);
+        }
+      });
+    } else if (!allowedTags.has(parentNodeName)) {
+      context.report({
+        node,
+        messageId: 'matchingRelValues',
+        data: {
+          value: part.reportingValue,
+          tag: parentNodeName
+        },
+        fix(fixer) {
+          return fixer.removeRange(part.range);
+        }
+      });
+    }
+  }
+}
+
+module.exports = {
+  meta: {
+    fixable: 'code',
+    docs: {
+      description: 'Forbid `rel` attribute with an invalid value`',
+      category: 'Possible Errors',
+      url: docsUrl('jsx-no-invalid-rel')
+    },
+    messages: {
+      relOnlyOnSpecific: 'The "rel" attribute only has meaning on `<link>`, `<a>`, `<area>`, and `<form>` tags.',
+      emptyRel: 'An empty "rel" attribute is meaningless.',
+      onlyStrings: '"rel" attribute only supports strings',
+      realRelValues: '{{ value }} is never a valid "rel" attribute value.',
+      matchingRelValues: '"{{ value }}" is not a valid "rel" attribute value for <{{ tag }}>.'
+    }
+  },
+
+  create(context) {
+    return {
+      JSXAttribute(node) {
+        // ignore attributes that aren't "rel"
+        if (node.type !== 'JSXIdentifier' && node.name.name !== 'rel') {
+          return;
+        }
+
+        const parentNodeName = node.parent.name.name;
+        if (!components.has(parentNodeName)) {
+          return context.report({
+            node,
+            messageId: 'relOnlyOnSpecific',
+            fix(fixer) {
+              return fixer.remove(node);
+            }
+          });
+        }
+
+        if (!node.value) {
+          return context.report({
+            node,
+            messageId: 'emptyRel',
+            fix(fixer) {
+              return fixer.remove(node);
+            }
+          });
+        }
+
+        if (node.value.type === 'Literal') {
+          return checkLiteralValueNode(context, node.value, parentNodeName);
+        }
+
+        if (node.value.expression.type === 'Literal') {
+          return checkLiteralValueNode(context, node.value.expression, parentNodeName);
+        }
+
+        if (node.value.expression.type === 'ObjectExpression') {
+          return context.report({
+            node,
+            messageId: 'onlyStrings',
+            fix(fixer) {
+              return fixer.remove(node);
+            }
+          });
+        }
+
+        if (node.value.expression.type === 'Identifier' && node.value.expression.name === 'undefined') {
+          return context.report({
+            node,
+            messageId: 'onlyStrings',
+            fix(fixer) {
+              return fixer.remove(node);
+            }
+          });
+        }
+      }
+    };
+  }
+};
diff --git a/tests/lib/rules/jsx-no-invalid-rel.js b/tests/lib/rules/jsx-no-invalid-rel.js
new file mode 100644
index 0000000000..accf326bb5
--- /dev/null
+++ b/tests/lib/rules/jsx-no-invalid-rel.js
@@ -0,0 +1,464 @@
+/**
+ * @fileoverview Forbid target='_blank' attribute
+ * @author Kevin Miller
+ */
+
+'use strict';
+
+// ------------------------------------------------------------------------------
+// Requirements
+// ------------------------------------------------------------------------------
+
+const RuleTester = require('eslint').RuleTester;
+const rule = require('../../../lib/rules/jsx-no-invalid-rel');
+
+const parserOptions = {
+  ecmaVersion: 2018,
+  sourceType: 'module',
+  ecmaFeatures: {
+    jsx: true
+  }
+};
+
+// ------------------------------------------------------------------------------
+// Tests
+// ------------------------------------------------------------------------------
+
+const ruleTester = new RuleTester({parserOptions});
+
+ruleTester.run('jsx-no-invalid-rel', rule, {
+  valid: [
+    {code: '<a rel="alternate"></a>'},
+    {code: '<a rel="author"></a>'},
+    {code: '<a rel="bookmark"></a>'},
+    {code: '<a rel="external"></a>'},
+    {code: '<a rel="help"></a>'},
+    {code: '<a rel="license"></a>'},
+    {code: '<a rel="next"></a>'},
+    {code: '<a rel="nofollow"></a>'},
+    {code: '<a rel="noopener"></a>'},
+    {code: '<a rel="noreferrer"></a>'},
+    {code: '<a rel="opener"></a>'},
+    {code: '<a rel="prev"></a>'},
+    {code: '<a rel="search"></a>'},
+    {code: '<a rel="tag"></a>'},
+    {code: '<area rel="alternate"></area>'},
+    {code: '<area rel="author"></area>'},
+    {code: '<area rel="bookmark"></area>'},
+    {code: '<area rel="external"></area>'},
+    {code: '<area rel="help"></area>'},
+    {code: '<area rel="license"></area>'},
+    {code: '<area rel="next"></area>'},
+    {code: '<area rel="nofollow"></area>'},
+    {code: '<area rel="noopener"></area>'},
+    {code: '<area rel="noreferrer"></area>'},
+    {code: '<area rel="opener"></area>'},
+    {code: '<area rel="prev"></area>'},
+    {code: '<area rel="search"></area>'},
+    {code: '<area rel="tag"></area>'},
+    {code: '<link rel="alternate"></link>'},
+    {code: '<link rel="author"></link>'},
+    {code: '<link rel="canonical"></link>'},
+    {code: '<link rel="dns-prefetch"></link>'},
+    {code: '<link rel="help"></link>'},
+    {code: '<link rel="icon"></link>'},
+    {code: '<link rel="license"></link>'},
+    {code: '<link rel="manifest"></link>'},
+    {code: '<link rel="modulepreload"></link>'},
+    {code: '<link rel="next"></link>'},
+    {code: '<link rel="pingback"></link>'},
+    {code: '<link rel="preconnect"></link>'},
+    {code: '<link rel="prefetch"></link>'},
+    {code: '<link rel="preload"></link>'},
+    {code: '<link rel="prerender"></link>'},
+    {code: '<link rel="prev"></link>'},
+    {code: '<link rel="search"></link>'},
+    {code: '<link rel="stylesheet"></link>'},
+    {code: '<form rel="external"></form>'},
+    {code: '<form rel="help"></form>'},
+    {code: '<form rel="license"></form>'},
+    {code: '<form rel="next"></form>'},
+    {code: '<form rel="nofollow"></form>'},
+    {code: '<form rel="noopener"></form>'},
+    {code: '<form rel="noreferrer"></form>'},
+    {code: '<form rel="opener"></form>'},
+    {code: '<form rel="prev"></form>'},
+    {code: '<form rel="search"></form>'},
+    {code: '<form rel={callFoo()}></form>'},
+    {code: '<a rel={{a: "noreferrer"}["a"]}></a>'},
+    {code: '<a rel={{a: "noreferrer"}["b"]}></a>'}
+  ],
+  invalid: [
+    {
+      code: '<html rel></html>',
+      output: '<html ></html>',
+      errors: [{
+        messageId: 'relOnlyOnSpecific'
+      }]
+    },
+    {
+      code: '<a rel={null}></a>',
+      output: '<a ></a>',
+      errors: [{
+        messageId: 'onlyStrings'
+      }]
+    },
+    {
+      code: '<a rel={5}></a>',
+      output: '<a ></a>',
+      errors: [{
+        messageId: 'onlyStrings'
+      }]
+    },
+    {
+      code: '<a rel={true}></a>',
+      output: '<a ></a>',
+      errors: [{
+        messageId: 'onlyStrings'
+      }]
+    },
+    {
+      code: '<a rel={{}}></a>',
+      output: '<a ></a>',
+      errors: [{
+        messageId: 'onlyStrings'
+      }]
+    },
+    {
+      code: '<a rel={undefined}></a>',
+      output: '<a ></a>',
+      errors: [{
+        messageId: 'onlyStrings'
+      }]
+    },
+    {
+      code: '<a rel="noreferrer noopener foobar"></a>',
+      output: '<a rel="noreferrer noopener"></a>',
+      errors: [{
+        messageId: 'realRelValues'
+      }]
+    },
+    {
+      code: '<a rel={"noreferrer noopener foobar"}></a>',
+      output: '<a rel={"noreferrer noopener"}></a>',
+      errors: [{
+        messageId: 'realRelValues'
+      }]
+    },
+    {
+      code: '<a rel={"foobar noreferrer noopener"}></a>',
+      output: '<a rel={" noreferrer noopener"}></a>',
+      errors: [{
+        messageId: 'realRelValues'
+      }]
+    },
+    {
+      code: '<a rel="canonical"></a>',
+      output: '<a rel=""></a>',
+      errors: [{
+        messageId: 'matchingRelValues'
+      }]
+    },
+    {
+      code: '<a rel="dns-prefetch"></a>',
+      output: '<a rel=""></a>',
+      errors: [{
+        messageId: 'matchingRelValues'
+      }]
+    },
+    {
+      code: '<a rel="icon"></a>',
+      output: '<a rel=""></a>',
+      errors: [{
+        messageId: 'matchingRelValues'
+      }]
+    },
+    {
+      code: '<a rel="manifest"></a>',
+      output: '<a rel=""></a>',
+      errors: [{
+        messageId: 'matchingRelValues'
+      }]
+    },
+    {
+      code: '<a rel="modulepreload"></a>',
+      output: '<a rel=""></a>',
+      errors: [{
+        messageId: 'matchingRelValues'
+      }]
+    },
+    {
+      code: '<a rel="pingback"></a>',
+      output: '<a rel=""></a>',
+      errors: [{
+        messageId: 'matchingRelValues'
+      }]
+    },
+    {
+      code: '<a rel="preconnect"></a>',
+      output: '<a rel=""></a>',
+      errors: [{
+        messageId: 'matchingRelValues'
+      }]
+    },
+    {
+      code: '<a rel="prefetch"></a>',
+      output: '<a rel=""></a>',
+      errors: [{
+        messageId: 'matchingRelValues'
+      }]
+    },
+    {
+      code: '<a rel="preload"></a>',
+      output: '<a rel=""></a>',
+      errors: [{
+        messageId: 'matchingRelValues'
+      }]
+    },
+    {
+      code: '<a rel="prerender"></a>',
+      output: '<a rel=""></a>',
+      errors: [{
+        messageId: 'matchingRelValues'
+      }]
+    },
+    {
+      code: '<a rel="stylesheet"></a>',
+      output: '<a rel=""></a>',
+      errors: [{
+        messageId: 'matchingRelValues'
+      }]
+    },
+    {
+      code: '<area rel="canonical"></area>',
+      output: '<area rel=""></area>',
+      errors: [{
+        messageId: 'matchingRelValues'
+      }]
+    },
+    {
+      code: '<area rel="dns-prefetch"></area>',
+      output: '<area rel=""></area>',
+      errors: [{
+        messageId: 'matchingRelValues'
+      }]
+    },
+    {
+      code: '<area rel="icon"></area>',
+      output: '<area rel=""></area>',
+      errors: [{
+        messageId: 'matchingRelValues'
+      }]
+    },
+    {
+      code: '<area rel="manifest"></area>',
+      output: '<area rel=""></area>',
+      errors: [{
+        messageId: 'matchingRelValues'
+      }]
+    },
+    {
+      code: '<area rel="modulepreload"></area>',
+      output: '<area rel=""></area>',
+      errors: [{
+        messageId: 'matchingRelValues'
+      }]
+    },
+    {
+      code: '<area rel="pingback"></area>',
+      output: '<area rel=""></area>',
+      errors: [{
+        messageId: 'matchingRelValues'
+      }]
+    },
+    {
+      code: '<area rel="preconnect"></area>',
+      output: '<area rel=""></area>',
+      errors: [{
+        messageId: 'matchingRelValues'
+      }]
+    },
+    {
+      code: '<area rel="prefetch"></area>',
+      output: '<area rel=""></area>',
+      errors: [{
+        messageId: 'matchingRelValues'
+      }]
+    },
+    {
+      code: '<area rel="preload"></area>',
+      output: '<area rel=""></area>',
+      errors: [{
+        messageId: 'matchingRelValues'
+      }]
+    },
+    {
+      code: '<area rel="prerender"></area>',
+      output: '<area rel=""></area>',
+      errors: [{
+        messageId: 'matchingRelValues'
+      }]
+    },
+    {
+      code: '<area rel="stylesheet"></area>',
+      output: '<area rel=""></area>',
+      errors: [{
+        messageId: 'matchingRelValues'
+      }]
+    },
+    {
+      code: '<link rel="bookmark"></link>',
+      output: '<link rel=""></link>',
+      errors: [{
+        messageId: 'matchingRelValues'
+      }]
+    },
+    {
+      code: '<link rel="external"></link>',
+      output: '<link rel=""></link>',
+      errors: [{
+        messageId: 'matchingRelValues'
+      }]
+    },
+    {
+      code: '<link rel="nofollow"></link>',
+      output: '<link rel=""></link>',
+      errors: [{
+        messageId: 'matchingRelValues'
+      }]
+    },
+    {
+      code: '<link rel="noopener"></link>',
+      output: '<link rel=""></link>',
+      errors: [{
+        messageId: 'matchingRelValues'
+      }]
+    },
+    {
+      code: '<link rel="noreferrer"></link>',
+      output: '<link rel=""></link>',
+      errors: [{
+        messageId: 'matchingRelValues'
+      }]
+    },
+    {
+      code: '<link rel="opener"></link>',
+      output: '<link rel=""></link>',
+      errors: [{
+        messageId: 'matchingRelValues'
+      }]
+    },
+    {
+      code: '<link rel="tag"></link>',
+      output: '<link rel=""></link>',
+      errors: [{
+        messageId: 'matchingRelValues'
+      }]
+    },
+    {
+      code: '<form rel="alternate"></form>',
+      output: '<form rel=""></form>',
+      errors: [{
+        messageId: 'matchingRelValues'
+      }]
+    },
+    {
+      code: '<form rel="author"></form>',
+      output: '<form rel=""></form>',
+      errors: [{
+        messageId: 'matchingRelValues'
+      }]
+    },
+    {
+      code: '<form rel="bookmark"></form>',
+      output: '<form rel=""></form>',
+      errors: [{
+        messageId: 'matchingRelValues'
+      }]
+    },
+    {
+      code: '<form rel="canonical"></form>',
+      output: '<form rel=""></form>',
+      errors: [{
+        messageId: 'matchingRelValues'
+      }]
+    },
+    {
+      code: '<form rel="dns-prefetch"></form>',
+      output: '<form rel=""></form>',
+      errors: [{
+        messageId: 'matchingRelValues'
+      }]
+    },
+    {
+      code: '<form rel="icon"></form>',
+      output: '<form rel=""></form>',
+      errors: [{
+        messageId: 'matchingRelValues'
+      }]
+    },
+    {
+      code: '<form rel="manifest"></form>',
+      output: '<form rel=""></form>',
+      errors: [{
+        messageId: 'matchingRelValues'
+      }]
+    },
+    {
+      code: '<form rel="modulepreload"></form>',
+      output: '<form rel=""></form>',
+      errors: [{
+        messageId: 'matchingRelValues'
+      }]
+    },
+    {
+      code: '<form rel="pingback"></form>',
+      output: '<form rel=""></form>',
+      errors: [{
+        messageId: 'matchingRelValues'
+      }]
+    },
+    {
+      code: '<form rel="preconnect"></form>',
+      output: '<form rel=""></form>',
+      errors: [{
+        messageId: 'matchingRelValues'
+      }]
+    },
+    {
+      code: '<form rel="prefetch"></form>',
+      output: '<form rel=""></form>',
+      errors: [{
+        messageId: 'matchingRelValues'
+      }]
+    },
+    {
+      code: '<form rel="preload"></form>',
+      output: '<form rel=""></form>',
+      errors: [{
+        messageId: 'matchingRelValues'
+      }]
+    },
+    {
+      code: '<form rel="prerender"></form>',
+      output: '<form rel=""></form>',
+      errors: [{
+        messageId: 'matchingRelValues'
+      }]
+    },
+    {
+      code: '<form rel="stylesheet"></form>',
+      output: '<form rel=""></form>',
+      errors: [{
+        messageId: 'matchingRelValues'
+      }]
+    },
+    {
+      code: '<form rel="tag"></form>',
+      output: '<form rel=""></form>',
+      errors: [{
+        messageId: 'matchingRelValues'
+      }]
+    }
+  ]
+});