From 117aeec66727abd6b2b4a6f6ef8dd86d4c19283f Mon Sep 17 00:00:00 2001
From: Suguru Hirahara <luixxiul@gmail.com>
Date: Fri, 11 Aug 2017 02:16:42 +0900
Subject: [PATCH] Reorganize rel='noopener'

Follow-up to #10290

Also:
- Add rel='noopener' to brave.com (as the site also may be hacked, which of course should not happen)
- Fix a typo
- Always rel='noopener' first, target='_blank' second on the same line (to make it easy to search it with regex)

Auditors:

Test Plan:
1. Search your repo for target='_blank'
2. Make sure external anchor links with target='_blank' have rel='noopener'
---
 .../components/preferences/helpfulHints.js    |  5 ++--
 .../preferences/payment/bitcoinDashboard.js   | 26 +++++++++----------
 .../preferences/payment/enabledContent.js     |  2 +-
 .../components/preferences/paymentsTab.js     |  2 +-
 js/about/about.js                             |  2 +-
 js/about/brave.js                             |  8 ++++--
 js/about/contributionStatement.js             |  2 +-
 js/about/newTabComponents/footerInfo.js       |  2 +-
 js/webtorrent/components/torrentViewer.js     |  3 +--
 9 files changed, 28 insertions(+), 24 deletions(-)

diff --git a/app/renderer/components/preferences/helpfulHints.js b/app/renderer/components/preferences/helpfulHints.js
index b1155a06a08..693a360ae51 100644
--- a/app/renderer/components/preferences/helpfulHints.js
+++ b/app/renderer/components/preferences/helpfulHints.js
@@ -22,8 +22,9 @@ class HelpfulHints extends ImmutableComponent {
       <div className={css(styles.hints, styles.white)} data-l10n-id={`hint${this.props.hintNumber}`} />
       <div className={css(styles.helpfulHintsBottom)}>
         <a className={css(styles.white)}
-          target='_blank' href='https://community.brave.com/'
-          data-l10n-id='submitFeedback' />
+          href='https://community.brave.com/'
+          data-l10n-id='submitFeedback'
+          rel='noopener' target='_blank' />
       </div>
     </div>
   }
diff --git a/app/renderer/components/preferences/payment/bitcoinDashboard.js b/app/renderer/components/preferences/payment/bitcoinDashboard.js
index c4519e49110..695f356c5cb 100644
--- a/app/renderer/components/preferences/payment/bitcoinDashboard.js
+++ b/app/renderer/components/preferences/payment/bitcoinDashboard.js
@@ -140,7 +140,7 @@ class BitcoinDashboard extends ImmutableComponent {
             <div data-l10n-id='fundingDisabled1' />
             <div>
               <span data-l10n-id='fundingDisabled2' />&nbsp;
-              <a href='https://community.brave.com/c/payments' target='_blank' data-l10n-id='fundingDisabled3' />
+              <a href='https://community.brave.com/c/payments' data-l10n-id='fundingDisabled3' rel='noopener' target='_blank' />
             </div>
           </div>
           : <div className={css(
@@ -194,7 +194,7 @@ class BitcoinDashboard extends ImmutableComponent {
           </div>
         </div>
         <div className={css(styles.panel__divider, styles.panel__divider_right)}>
-          <a target='_blank' rel='noopener' href={url}>
+          <a href={url} rel='noopener' target='_blank'>
             <BrowserButton
               primaryColor
               panelItem
@@ -219,7 +219,7 @@ class BitcoinDashboard extends ImmutableComponent {
         </div>
       </div>
       <div className={css(styles.panel__divider, styles.panel__divider_right)}>
-        <a target='_blank' rel='noopener' href='https://www.buybitcoinworldwide.com/'>
+        <a href='https://www.buybitcoinworldwide.com/' rel='noopener' target='_blank'>
           <BrowserButton
             primaryColor
             panelItem
@@ -325,19 +325,19 @@ class BitcoinDashboard extends ImmutableComponent {
     if (coinbaseCountries.indexOf(this.props.ledgerData.get('countryCode')) > -1) {
       return <section className={css(styles.modalOverlay__qrcodeOverlay__footerWrapper__footer)}>
         <div className={css(styles.coinbaseLogo)} />
-        <a rel='noopener' target='_blank'
-          className={css(
-            styles.modalOverlay__qrcodeOverlay__footerWrapper__footer__qrcodeLogo,
-            styles.modalOverlay__qrcodeOverlay__footerWrapper__footer__appstoreLogo
-          )}
+        <a className={css(
+          styles.modalOverlay__qrcodeOverlay__footerWrapper__footer__qrcodeLogo,
+          styles.modalOverlay__qrcodeOverlay__footerWrapper__footer__appstoreLogo
+        )}
           href='https://itunes.apple.com/us/app/coinbase-bitcoin-wallet/id886427730?mt=8'
+          rel='noopener' target='_blank'
         />
-        <a rel='noopener' target='_blank'
-          className={css(
-            styles.modalOverlay__qrcodeOverlay__footerWrapper__footer__qrcodeLogo,
-            styles.modalOverlay__qrcodeOverlay__footerWrapper__footer__playstoreLogo
-          )}
+        <a className={css(
+          styles.modalOverlay__qrcodeOverlay__footerWrapper__footer__qrcodeLogo,
+          styles.modalOverlay__qrcodeOverlay__footerWrapper__footer__playstoreLogo
+        )}
           href='https://play.google.com/store/apps/details?id=com.coinbase.android'
+          rel='noopener' target='_blank'
         />
       </section>
     }
diff --git a/app/renderer/components/preferences/payment/enabledContent.js b/app/renderer/components/preferences/payment/enabledContent.js
index 9f92682cb1d..d78a6c4f0ab 100644
--- a/app/renderer/components/preferences/payment/enabledContent.js
+++ b/app/renderer/components/preferences/payment/enabledContent.js
@@ -84,7 +84,7 @@ class EnabledContent extends ImmutableComponent {
 
     return <section className={css(styles.balance)}>
       <FormTextbox data-test-id='fundsAmount' readOnly value={btcToCurrencyString(value, ledgerData)} />
-      <a className={css(styles.iconLink)} href='https://brave.com/Payments_FAQ.html' target='_blank'>
+      <a className={css(styles.iconLink)} href='https://brave.com/Payments_FAQ.html' rel='noopener' target='_blank'>
         <span className={cx({
           fa: true,
           'fa-question-circle': true,
diff --git a/app/renderer/components/preferences/paymentsTab.js b/app/renderer/components/preferences/paymentsTab.js
index 55ab4c71535..7b8660716a1 100644
--- a/app/renderer/components/preferences/paymentsTab.js
+++ b/app/renderer/components/preferences/paymentsTab.js
@@ -214,8 +214,8 @@ class PaymentsTab extends ImmutableComponent {
               [css(styles.autoSuggestSwitch__moreInfoBtnSuggest)]: true
             })}
               href='https://brave.com/Payments_FAQ.html'
-              target='_blank'
               data-l10n-id='paymentsFAQLink'
+              rel='noopener' target='_blank'
             />
           </div>
           {
diff --git a/js/about/about.js b/js/about/about.js
index 5dbde03b4ab..d52037b6222 100644
--- a/js/about/about.js
+++ b/js/about/about.js
@@ -36,7 +36,7 @@ class AboutAbout extends ImmutableComponent {
           {
             aboutUrls.keySeq().sort().filter((aboutSourceUrl) => isNavigatableAboutPage(aboutSourceUrl)).map((aboutSourceUrl) =>
               <li>
-                <a href={aboutUrls.get(aboutSourceUrl)} target='_blank'>
+                <a href={aboutUrls.get(aboutSourceUrl)} rel='noopener' target='_blank'>
                   {aboutSourceUrl}
                 </a>
               </li>)
diff --git a/js/about/brave.js b/js/about/brave.js
index 46085afe5ba..af09050f711 100644
--- a/js/about/brave.js
+++ b/js/about/brave.js
@@ -60,7 +60,11 @@ class AboutBrave extends React.Component {
         <div>
           <span data-l10n-id='relNotesInfo1' />
           &nbsp;
-          <a className={css(commonStyles.linkText)} href={`https://github.com/brave/browser-laptop/releases/tag/v${this.state.versionInformation.get('Brave')}dev`} rel='noopener' target='_blank' data-l10n-id='relNotesInfo2' />
+          <a className={css(commonStyles.linkText)}
+            href={`https://github.com/brave/browser-laptop/releases/tag/v${this.state.versionInformation.get('Brave')}dev`}
+            data-l10n-id='relNotesInfo2'
+            rel='noopener' target='_blank'
+          />
           &nbsp;
           <span data-l10n-id='relNotesInfo3' />
         </div>
@@ -83,7 +87,7 @@ class AboutBrave extends React.Component {
             },
             {
               html: name === 'rev'
-                ? <a rel='noopener' target='_blank' className={css(commonStyles.linkText)} href={`https://github.com/brave/browser-laptop/commit/${version}`}>{(version && version.substring(0, 7)) || ''}</a>
+                ? <a className={css(commonStyles.linkText)} href={`https://github.com/brave/browser-laptop/commit/${version}`} rel='noopener' target='_blank'>{(version && version.substring(0, 7)) || ''}</a>
                 : version,
               value: version
             }
diff --git a/js/about/contributionStatement.js b/js/about/contributionStatement.js
index bc901083f7c..355b4c35b2f 100644
--- a/js/about/contributionStatement.js
+++ b/js/about/contributionStatement.js
@@ -451,7 +451,7 @@ class ContributionStatement extends React.Component {
                 transactions.map(function (tx) {
                   return (
                     <li>
-                      <a className={css(styles.list__anchor)} href={aboutContributionsUrl + '#' + tx.get('viewingId')} target='_blank'>
+                      <a className={css(styles.list__anchor)} href={aboutContributionsUrl + '#' + tx.get('viewingId')} rel='noopener' target='_blank'>
                         {this.receiptFileName(tx)}
                       </a>
                     </li>
diff --git a/js/about/newTabComponents/footerInfo.js b/js/about/newTabComponents/footerInfo.js
index 6937e5b28c9..182e4a059e9 100644
--- a/js/about/newTabComponents/footerInfo.js
+++ b/js/about/newTabComponents/footerInfo.js
@@ -15,7 +15,7 @@ class FooterInfo extends ImmutableComponent {
           this.props.backgroundImage && this.props.backgroundImage.name
           ? <div>
             <div className='copyrightCredits'>
-              <span className='photoBy' data-l10n-id='photoBy' /> <a className='copyrightOwner' href={this.props.backgroundImage.link} rel='noopner' target='_blank'>{this.props.backgroundImage.author}</a>
+              <span className='photoBy' data-l10n-id='photoBy' /> <a className='copyrightOwner' href={this.props.backgroundImage.link} rel='noopener' target='_blank'>{this.props.backgroundImage.author}</a>
             </div>
             <span className='photoName'>{this.props.backgroundImage.name}</span>
           </div>
diff --git a/js/webtorrent/components/torrentViewer.js b/js/webtorrent/components/torrentViewer.js
index ffdcb40b912..5909505540a 100644
--- a/js/webtorrent/components/torrentViewer.js
+++ b/js/webtorrent/components/torrentViewer.js
@@ -54,8 +54,7 @@ class TorrentViewer extends React.Component {
         })}
           data-l10n-id='poweredByWebTorrent'
           href='https://webtorrent.io'
-          rel='noopener'
-          target='_blank'
+          rel='noopener' target='_blank'
         />
       )
     } else {