Data Element Viewer for Adobe Launch

Last Updated: 9/6/2023 – Added improvements suggested by Guillaume Hermans

View all of the values of all of your Data Elements with the Data Element Viewer for Launch, by Adobe. The Data Element Viewer is a bookmarklet that returns an object in your console. The basis of this was to mitigate the amount of tedium that it takes to find the name of your Data Element, open your console, then type _satellite.getVar(). It’s not difficult to type… but when you’re testing a lot of these it gets annoying. The intent of this bookmarklet is to save you a few minutes each time you want to check a Data Element value.

Here’s how you add it to your browser.

1. Right-click on your bookmarks bar
2. Click “Add Page…” in Chrome or “New Bookmark…” in Firefox
3. Name the bookmark whatever you want – maybe Data Element Viewer
4. Replace the URL with the JavaScript below and save (Page field in Chrome and Location field in Firefox

javascript:(function(){if("undefined"!=typeof _satellite)if(void 0!==_satellite._container){var dataElementValue,dataElementNames=[],dataElementObject={},cleanElementObject={};function checkDataElements(){for(var e in _satellite._container.dataElements)dataElementValue=_satellite.getVar(e),dataElementNames.push(e),""===dataElementValue&&(dataElementValue=" "),dataElementObject[e]=JSON.stringify(dataElementValue),""!==_satellite.getVar(e)&&_satellite.getVar(e)!==_satellite._container.dataElements[e].defaultValue&&(cleanElementObject[e]=JSON.stringify(dataElementValue));return{everything:dataElementObject,clean:cleanElementObject}}function displayDataElements(e,t){console.group("RAW Data Elements - Data Element Viewer by Jimalytics - https://jimalytics.com"),console.table(e,["Value"]),console.groupEnd(),console.group("CLEAN Data Elements - Data Element Viewer by Jimalytics - https://jimalytics.com"),console.table(t,["Value"]),console.groupEnd()}function returnData(){var e=checkDataElements();displayDataElements(e.everything,e.clean)}returnData(),window._satellite=window._satellite||{},window._satellite._monitors=window._satellite._monitors||[],window._satellite._monitors.push({ruleTriggered:function(e){returnData()}})}else console.log("Adobe Launch is not present.");else console.log("Adobe Launch is not present.");})();

 

Your bookmark should look like this:

Now open up your console on a site with Adobe Launch and click it! Here’s what it looks like:

As an added bonus, this displays the Data Element object every time a rule has been completed using the Adobe Launch monitoring hooks.

Here’s the base code for you to play with:

if(typeof(_satellite)!=='undefined'){
  if(typeof(_satellite._container)!=='undefined'){
    var dataElementNames = [];
    var dataElementObject = {};
    var cleanElementObject = {};
    var dataElementValue;
    
    
    function checkDataElements(){
      //Cycles through the Data Elements and builds the object.
      for(var elementName in _satellite._container.dataElements){
        dataElementValue = _satellite.getVar(elementName);
        dataElementNames.push(elementName);
        if(dataElementValue === ""){
          //Added a space so it would actually show up as a line item in the console table.
          dataElementValue = " ";
        }
        dataElementObject[elementName] = JSON.stringify(dataElementValue);
        if(_satellite.getVar(elementName)!==''){
          if(_satellite.getVar(elementName)!==_satellite._container.dataElements[elementName].defaultValue){
            cleanElementObject[elementName] = JSON.stringify(dataElementValue);
          }
        }
      }
      //Returns both the scrubbed and raw objects
      return {
        everything: dataElementObject,
        clean: cleanElementObject
      };
    }
    
    function displayDataElements(everything,clean){
      //Drop drop it all in the console.
      console.group("RAW Data Elements - Data Element Viewer by Jimalytics - https://jimalytics.com");
      console.table(everything, ["Value"]);
      console.groupEnd();
      console.group("CLEAN Data Elements - Data Element Viewer by Jimalytics - https://jimalytics.com");
      console.table(clean, ["Value"]);
      console.groupEnd();
    }
    
    function returnData(){
      var dataElementInfo = checkDataElements();
      displayDataElements(dataElementInfo.everything,dataElementInfo.clean);	
    }
    
    returnData()
    
    window._satellite = window._satellite || {};
    window._satellite._monitors = window._satellite._monitors || [];
    window._satellite._monitors.push({
      ruleTriggered: function (event) {
        returnData()
      }
    });
  }
  else{
    console.log("Adobe Launch is not present.");
  }
}
else{
  console.log("Adobe Launch is not present.");
}

 

 

Chrome Live Expressions

Jan Exner recently pointed out that Chrome released an update to its browser to support a feature called Live Expressions. Live Expressions allow you to actively monitor the output of any JavaScript that you might type in the console. For instance, if I want to monitor the time, I could type a script to get the current time and you can see it evaluating continuously:

This is what it looks like in the console when you click on the eye icon in the top-right and then type the code above the moving numbers. Okay, so now how might this be useful for DTM/Launch and Data Elements? Simply put: you can monitor them in realtime! It even supports monitoring of multiple expressions. Here’s how that looks:

Try out both the bookmarklet and live expressions and let me know what you think!