feat: CMD-193 custom links for findLinksAndSetTargets (#902)

* feat: CMD-193 moreLinks for findLinksAndSetTargets

* feat: CMD-193 override findLinksAndSetTargets

Allow user of findLinksAndSetTargets to:
- override default links
- access default links

This lets user handle links themselves intuitively.

* test: CMD-193 deug findLinksAndSetTargets

* fix!: findLinksAndSetTargets SHOULD_DEBUG ?

Replace SHOULD_DEBUG with param option shouldDebug.

* fix: findLinksAndSetTargets link filtering

Control whether to filter linsk via new option not magic.

* refactor: findLinksAndSetTargets shouldFilterLinks → shouldFilter

* test: findLinksAndSetTargets debug options

* fix: findLinksAndSetTargets options not defined

* fix: findLinksAndSetTargets shouldDebug not defined

* fix: findLinksAndSetTargets shouldDebug still not defined

* docs: comment typos, debug only if should

* style: whitespace

* style: whitespace & docs: quotes

* style: whitespace

taccsite_cms/static/site_cms/js/modules/setTargetForExternalLinks.js

@@ -1,20 +1,30 @@
 /**
- * Whether to log debug info to console
+ * The standard links that should open in a new tab
  * @const {string}
  */
-const SHOULD_DEBUG = window.DEBUG;
+export const DEFAULT_LINKS = document.querySelectorAll('body > :is(header, main, footer) a');
 
 /**
  * Make links with absolute URLs open in new tab, and:
  * - add accessible markup
  * - fix absolute URLs that should be relative paths
+ * @param {NodeList} links - Custom links to open in new tab
+ * @param {object} opts
+ * @param {boolean} [opts.shouldDebug=false] - Whether to log debug statements
+ * @param {boolean} [opts.shouldFilter=true] - Whether to filter which links to adjust
  */
-export default function findLinksAndSetTargets() {
-  const links = document.querySelectorAll('body > :is(header, main, footer) a');
+export default function findLinksAndSetTargets( links = DEFAULT_LINKS, opts = {
+  shouldDebug: false,
+  shouldFilter: true,
+}) {
   const baseDocHost = document.location.host;
-  const baseDocHostWithSubdomain= `www.${baseDocHost}`;
+  const baseDocHostWithSubdomain= `www.${ baseDocHost }`;
 
-  [ ...links ].forEach( function setTarget(link) {
+  if ( opts.shouldDebug ) {
+    console.log({ links, opts });
+  }
+
+  links.forEach( function setTarget( link ) {
     const linkHref = link.getAttribute('href');
 
     if ( ! linkHref ) {
@@ -23,26 +33,27 @@ export default function findLinksAndSetTargets() {
 
     const isMailto = ( linkHref.indexOf('mailto:') === 0 );
     const isAbsolute = ( linkHref.indexOf('http') === 0 );
-    const isSameHost = link.host === baseDocHost || link.host === baseDocHostWithSubdomain
+    const isSameHost = ( link.host === baseDocHost || link.host === baseDocHostWithSubdomain );
+    const shouldOpenInNewTab = ( ! isSameHost || isMailto );
 
-    if (SHOULD_DEBUG) {
-      console.debug({ isMailto, isAbsolute, isSameHost, linkHref });
+    if (opts.shouldDebug) {
+      console.debug({ isMailto, isAbsolute, isSameHost, linkHref, shouldOpenInNewTab });
     }
 
-    // Links to pages at different host should open in new tab
-    if ( ! isSameHost || isMailto ) {
+    // So either all or some links open in new tab
+    if ( ! opts.shouldFilter || ( opts.shouldFilter && shouldOpenInNewTab )) {
       if ( link.target !== '_blank') {
         link.target = '_blank';
-        if (SHOULD_DEBUG) {
-          console.debug(`Link ${linkHref} now opens in new tab`);
+        if ( opts.shouldDebug ) {
+          console.debug(`Link "${ linkHref }" now opens in new tab`);
         }
       }
       if ( link.target === '_blank') {
         link.setAttribute('aria-label', 'Opens in new window.');
       }
     }
 
-    // Links w/ absolute URL to page on same domain should use relative path
+    // So links w/ absolute URL to page on same domain use relative path
     if ( isAbsolute && isSameHost ) {
       link.href = link.pathname;
     }