Replace proxy redirect with rel=noreferrer (#12780)

* Replace proxy redirect with rel=noreferrer

* Add noopener

* Restore action=redirect for non-Matomo links

* Wrap referring URLs

* NO target on download link

* Fix Github links

* Fix whitespace

* Fix tests

* Revert change

* Revert changes

* Fix tests

* Add noreferrer shim for MSIE 10

* Remove all action=redirect links

* Restore noreferrer

* Restore test

* Fix one more occurrence

* Update changelog

* Combine if's

* Fix changelog wording

* Fix stray whitespace

2 files changed, 38 insertions, 35 deletions

diff --git a/plugins/Transitions/javascripts/transitions.js b/plugins/Transitions/javascripts/transitions.js
index e4efbe2def..944fb0c765 100644
--- a/plugins/Transitions/javascripts/transitions.js
+++ b/plugins/Transitions/javascripts/transitions.js
@@ -249,18 +249,22 @@ Piwik_Transitions.prototype.preparePopover = function () {
     if (self.actionType == 'url') {
         title = Piwik_Transitions_Util.shortenUrl(title, true);
     }
-    title = self.centerBox.find('h2')
-        .addClass('Transitions_ApplyTextAndTruncate')
-        .data('text', title)
-        .data('maxLines', 3);
-
+    var h2 = self.centerBox.find('h2');
+    var textContainer = h2;
     if (self.actionType == 'url') {
-        title.click(function () {
-            self.openExternalUrl(self.actionName);
-        }).css('cursor', 'pointer');
+        var a = $(document.createElement('a'));
+        a.attr('href', self.actionName);
+        a.attr('rel', 'noreferrer noopener');
+        a.attr('target', '_blank');
+        h2.append(a);
+        textContainer = a;
     }
 
-    var element = title.add(self.popover.find('p.Transitions_Pageviews'));
+    textContainer.addClass('Transitions_ApplyTextAndTruncate')
+        .data('text', title)
+        .data('maxLines', 3);
+
+    var element = textContainer.add(self.popover.find('p.Transitions_Pageviews'));
 
     element.tooltip({
         track:        true,
@@ -564,15 +568,11 @@ Piwik_Transitions.prototype.renderOpenGroup = function (groupName, side, onlyBg)
         if (!isOthers && (groupName == 'previousPages' || groupName == 'followingPages')) {
             onClick = (function (url) {
                 return function () {
-                    self.reloadPopover(url);
+                    self.reloadPopover(url.replace(/^(?!http)/, 'http://'));
                 };
             })(label);
         } else if (!isOthers && (groupName == 'outlinks' || groupName == 'websites' || groupName == 'downloads')) {
-            onClick = (function (url) {
-                return function () {
-                    self.openExternalUrl(url);
-                };
-            })(label);
+            onClick = label
         }
 
         var tooltip = Piwik_Transitions_Translations.XOfY;
@@ -742,17 +742,6 @@ Piwik_Transitions.prototype.unHighlightGroup = function (groupName, side) {
     this.renderLoops();
 };
 
-/** Open a link in a new tab */
-Piwik_Transitions.prototype.openExternalUrl = function (url) {
-    if (url.substring(0, 4) != 'http') {
-        // internal pages don't have the protocol
-        // external links / downloads have the protocol
-        url = 'http://' + url;
-    }
-    url = piwik.piwik_url + '?module=Proxy&action=redirect&url=' + encodeURIComponent(url);
-    window.open(url, '_newtab');
-};
-
 // --------------------------------------
 // CANVAS
 // --------------------------------------
@@ -906,17 +895,27 @@ Piwik_Transitions_Canvas.prototype.renderText = function (text, x, y, cssClass,
             div.addClass('Transitions_' + cssClass);
         }
     }
+    var textContainer = div;
     if (onClick) {
-        div.css('cursor', 'pointer').hover(function () {
-            $(this).addClass('Transitions_Hover');
-        },function () {
-            $(this).removeClass('Transitions_Hover');
-        }).click(onClick);
+        if (typeof onClick == 'function') {
+            div.css('cursor', 'pointer').hover(function () {
+                $(this).addClass('Transitions_Hover');
+            },function () {
+                $(this).removeClass('Transitions_Hover');
+            }).click(onClick);
+        } else {
+            var a = $(document.createElement('a'));
+            a.attr('href', onClick);
+            a.attr('rel', 'noreferrer noopener');
+            a.attr('target', '_blank');
+            div.append(a);
+            textContainer = a;
+        }
     }
     if (maxLines) {
-        div.addClass('Transitions_ApplyTextAndTruncate').data('text', text);
+        textContainer.addClass('Transitions_ApplyTextAndTruncate').data('text', text);
     } else {
-        div.html(text);
+        textContainer.html(text);
     }
     return div;
 };
@@ -1025,7 +1024,7 @@ Piwik_Transitions_Canvas.prototype.renderBox = function (params) {
 
     // text inside the box
     if (params.boxText && !params.onlyBg) {
-        var onClick = typeof params.onClick == 'function' ? params.onClick : false;
+        var onClick = params.onClick;
         var boxTextLeft, boxTextTop, el;
         if (params.side == 'left') {
             boxTextLeft = this.leftBoxBeginX + 10;
diff --git a/plugins/Transitions/stylesheets/transitions.less b/plugins/Transitions/stylesheets/transitions.less
index bc5f8fe0a3..3ddbe1d12d 100644
--- a/plugins/Transitions/stylesheets/transitions.less
+++ b/plugins/Transitions/stylesheets/transitions.less
@@ -66,6 +66,10 @@
     overflow: hidden;
     color: #255792;
     margin: 0;
+
+    a {
+        color: inherit;
+    }
 }
 
 .Transitions_Pageviews {
@@ -195,4 +199,4 @@ body .ui-tooltip.Transitions_Tooltip_Small {
 .Transitions_SingleLine {
     font-size: 12px;
     height: 21px;
-}
\ No newline at end of file
+}