A tiny Adobe Analytics debugging helper to be used as bookmarklet

adobeAnalyticsDebugger.js

/**
 * A tiny Adobe Analytics debugging helper to be used as bookmarklet. Compared to
 * Adobe's own debugging helper this one simply dumps JSON objects to the console,
 * which I personally prefer over fancy HTML tables. This one also supports POST
 * requests as sometimes used by s.t and s.tl which is quite useful if you need to 
 * debug asynchronous tracking requests.
 */
(function () {
  // create a nice JSON representation of a query string
  function jsonifyRequestUrl(url) {
    let o = {};
    if (!url) {
      return o;
    }
    let chunks = url.split('&');
    for (let i = 0; i < chunks.length; i += 1) {
      let tmp = chunks[i].split('=');
      let key = decodeURIComponent(tmp[0]);
      o[key] = decodeURIComponent(tmp[1]);
      // split "lists" into array for better readability (@FIXME: might do more prettifying here)
      if (['products', 'events'].indexOf(key) > -1) {
        o[key] = o[key].split(',');
      }
    }
    return o;
  }

  function isOMTRUrl(url) {
    return url.match(/^https?:\/\/(.*)\.sc\.omtrdc.net/gi);
  }

  function logRequest(message, url) {
    console.log(`%c ${message}:`, 'background: #222; color: #bada55', jsonifyRequestUrl(url), url);
  }

  if (!window.isOMTRWrapped) {
    // wrap XHR open to check for AA requests
    const oldXHROpen = XMLHttpRequest.prototype.open;
    XMLHttpRequest.prototype.open = function(method, url) {
      if (isOMTRUrl(url)) {
        this.isOMTRRequest = true;
      }
      oldXHROpen.apply(this, arguments);
    }

    // wrap XHR send to handle AA requests
    const oldXHRSend = XMLHttpRequest.prototype.send;
    XMLHttpRequest.prototype.send = function(data) {
      if (this.isOMTRRequest) {
        logRequest('Adobe Analytics async call detected:', data);
      }
      oldXHRSend.apply(this, arguments);
    }

    // wrapped, remember that
    window.isOMTRWrapped = true;
  }


  // increase resource timing API's buffer (Chrome's limit is 150)
  performance.setResourceTimingBufferSize(10000);

  // find already available resources (usually Image requests, XHR POSTs don't work via RTA since we have no access to data)
  const resources = performance.getEntriesByType('resource').filter(r => isOMTRUrl(r.name));
  if (resources) {
    for (let i = 0; i < resources.length; i += 1) {
      const resource = resources[i];
      if (resource.name.indexOf('?') > -1) {
        logRequest('Adobe Analytics call detected', resource.name.split('?')[1]);
      } else {
        logRequest('Adobe Analytics call detected but no data due to POST request (try running debugger before request is sent)', '');
      }
    }
  }

  // @TODO: install polling function to find new requests
}());

Currently just a small hack to get better debugging of Adobe Analytics requests that are sent via POST and don't show up in their own debugger. Might still be of use to someone out there, leave any feedback in the comments.

I guess it is worth mentioning that this is partly using ES6 code and is only tested in the Chrome Developer Console. I will fix that as soon as I have tested it a little more.