Allows middle-click and ctrl+click outbound clicks to properly open as user intended (#494)

* Initial fix

* Filesize optimizations

* Changelog

* Only redirects current tab on correct conditions

Does nothing special on middle or mod-click

CHANGELOG.md

@@ -23,6 +23,7 @@ All notable changes to this project will be documented in this file.
 - Improve settings UX and design plausible/analytics#412
 - Improve site listing UX and design plausible/analytics#438
 - Improve onboarding UX and design plausible/analytics#441
+- Allows outbound link tracking script to use new tab redirection plausible/analytics#494
 
 ### Fixed
 - Do not error when activating an already activated account plausible/analytics#370

tracker/src/plausible.js

@@ -56,23 +56,33 @@
   }
 
   {{#if outboundLinks}}
-  function registerOutboundLinkEvents() {
-    document.addEventListener('click', function (event) {
-      var link = event.target;
+  function handleOutbound(event) {
+    var link = event.target;
+    var middle = event.type == "auxclick" && event.which == 2;
+    var click = event.type == "click";
       while(link && (typeof link.tagName == 'undefined' || link.tagName.toLowerCase() != 'a' || !link.href)) {
         link = link.parentNode
       }
 
       if (link && link.href && link.host && link.host !== location.host) {
+        if (middle || click)
         plausible('Outbound Link: Click', {props: {url: link.href}})
 
         // Delay navigation so that Plausible is notified of the click
         if(!link.target || link.target.match(/^_(self|parent|top)$/i)) {
-          setTimeout(function() { location.href = link.href; }, 150);
-          event.preventDefault();
+          if (!(event.ctrlKey || event.metaKey || event.shiftKey) && click) {
+            setTimeout(function() {
+              location.href = link.href;
+            }, 150);
+            event.preventDefault();
+          }
         }
       }
-    })
+  }
+
+  function registerOutboundLinkEvents() {
+    document.addEventListener('click', handleOutbound)
+    document.addEventListener('auxclick', handleOutbound)
   }
   {{/if}}