Added a default value of link's rel, when the link's target it "_blank"

lib/ast-to-react.js

@@ -97,6 +97,7 @@
  * @property {null|false|TransformLink} [transformLinkUri]
  * @property {TransformImage} [transformImageUri]
  * @property {TransformLinkTargetType|TransformLinkTarget} [linkTarget]
+ * @property {string} [linkRel]
  * @property {Components} [components]
  */
 
@@ -232,6 +233,10 @@ function toReact(context, node, index, parent) {
             typeof properties.title === 'string' ? properties.title : null
           )
         : options.linkTarget
+
+    properties.rel =
+      options.linkRel ||
+      (properties.target === '_blank' ? 'noopener noreferrer' : undefined)
   }
 
   if (name === 'a' && transform) {

lib/react-markdown.js

@@ -179,6 +179,7 @@ ReactMarkdown.propTypes = {
   includeElementIndex: PropTypes.bool,
   transformLinkUri: PropTypes.oneOfType([PropTypes.func, PropTypes.bool]),
   linkTarget: PropTypes.oneOfType([PropTypes.func, PropTypes.string]),
+  linkRel: PropTypes.string,
   transformImageUri: PropTypes.func,
   components: PropTypes.object
 }

readme.md

@@ -205,6 +205,9 @@ The default export is `ReactMarkdown`.
     `unwrapDisallowed` the element itself is replaced by its children
 *   `linkTarget` (`string` or `(href, children, title) => string`, optional)\
     target to use on links (such as `_blank` for `<a target="_blank"…`)
+*   `linkRel` (`string`, optional)\
+    rel to use on links (will be set to `noopener noreferrer` by default,
+    if `linkTarget` is set to `_blank`)
 *   `transformLinkUri` (`(href, children, title) => string`, default:
     [`uriTransformer`][uri-transformer], optional)\
     change URLs on links, pass `null` to allow all URLs, see [security][]
@@ -634,6 +637,8 @@ Optionally, components will also receive:
     — see `includeElementIndex` option
 *   `target` on `a` (`string`)
     — see `linkTarget` option
+*   `rel` on `a` (`string`)
+    — see `linkRel` option
 
 ## Security
 

test/test.jsx

@@ -236,7 +236,27 @@ test('should use target attribute for links if specified', () => {
   const actual = asHtml(<Markdown children={input} linkTarget="_blank" />)
   assert.equal(
     actual,
-    '<p>This is <a href="https://espen.codes/" target="_blank">a link</a> to Espen.Codes.</p>'
+    '<p>This is <a href="https://espen.codes/" target="_blank" rel="noopener noreferrer">a link</a> to Espen.Codes.</p>'
+  )
+})
+
+test('should use custom default rel attribute for links if specified, when target is _blank', () => {
+  const input = 'This is [a link](https://espen.codes/) to Espen.Codes.'
+  const actual = asHtml(
+    <Markdown children={input} linkTarget="_blank" linkRel="foo" />
+  )
+  assert.equal(
+    actual,
+    '<p>This is <a href="https://espen.codes/" target="_blank" rel="foo">a link</a> to Espen.Codes.</p>'
+  )
+})
+
+test('should not use default rel attribute for links if specified, when target is not _blank', () => {
+  const input = 'This is [a link](https://espen.codes/) to Espen.Codes.'
+  const actual = asHtml(<Markdown children={input} linkTarget="_top" />)
+  assert.equal(
+    actual,
+    '<p>This is <a href="https://espen.codes/" target="_top">a link</a> to Espen.Codes.</p>'
   )
 })
 
@@ -250,7 +270,7 @@ test('should call function to get target attribute for links if specified', () =
   )
   assert.equal(
     actual,
-    '<p>This is <a href="https://espen.codes/" target="_blank">a link</a> to Espen.Codes.</p>'
+    '<p>This is <a href="https://espen.codes/" target="_blank" rel="noopener noreferrer">a link</a> to Espen.Codes.</p>'
   )
 })