{"id":567,"date":"2019-06-07T20:54:00","date_gmt":"2019-06-07T20:54:00","guid":{"rendered":"https:\/\/www.digitaldatatactics.com\/?p=567"},"modified":"2020-09-17T21:15:19","modified_gmt":"2020-09-17T21:15:19","slug":"enhanced-logging-for-direct-call-rules-and-custom-events-for-launch-dtm","status":"publish","type":"post","link":"https:\/\/www.digitaldatatactics.com\/index.php\/2019\/06\/07\/enhanced-logging-for-direct-call-rules-and-custom-events-for-launch-dtm\/","title":{"rendered":"Enhanced logging for Direct Call Rules and Custom Events for Launch\/DTM"},"content":{"rendered":"\n
\"33<\/figure><\/div>\n\n\n\n

(This is cross-posted from the 33 Sticks blog<\/a>)<\/p>\n\n\n\n

UPDATE: The wonderful devs behind Adobe Launch have seen this and may be willing to build it in natively to the product. Please go upvote the idea in the Launch Forums<\/a>!<\/p>\n\n\n\n

As discussed previously on this blog<\/a>, Direct Call Rules have gained some new abilities so you can send additional info with the _satellite.track method, but unfortunately, this can be difficult to troubleshoot. When you enabled _satellite.setDebug (which should really probably just be called \u201clogging\u201d since it isn\u2019t exactly debugging) in DTM or Launch, your console will show you logs about which rules fire. For instance, if I run this JavaScript from our earlier blog post<\/a>:<\/p>\n\n\n\n

_satellite.track(\"add to cart\",{name:\"wug\",price:\"12.99\",color:\"red\"})<\/code><\/pre>\n\n\n\n
I see this in my console:<\/p>\n\n\n\n
\"\"<\/figure>\n\n\n\n
Or, if I fire a DCR that doesn\u2019t exist, it will tell me there is no match:<\/p>\n\n\n\n
\"\"<\/figure>\n\n\n\n
Unfortunately, this doesn\u2019t tell me much about the parameters that were passed (especially if I haven\u2019t yet set up a rule in Launch), and relies on having _satellite debugging turned on.<\/p>\n\n\n\n
Improved Logging for Direct Call Rules<\/h2>\n\n\n\n
If you want to see what extra parameters are passed, try running this in your console before the DCR fires:<\/p>\n\n\n\n
var satelliteTrackPlaceholder=_satellite.track \/\/hold on to the original .track function\n_satellite.track=function(name,details){ \/\/rewrite it so you can make it extra special\n   if(details){\n      console.log(\"DCR NAME: '\"+name+\"' fired with the following additional params: \", details)\n   }else{\n      console.log(\"DCR NAME: '\"+name+\"' fired without any additional params\")\n   }\n   \/\/console.log(\"Data layer at this time:\" + JSON.stringify(digitalData))\n   satelliteTrackPlaceholder(name,details) \/\/fire the original .track functionality\n}<\/code><\/pre>\n\n\n\n
Now, if I fire my \u201cadd to cart\u201d DCR, I can see that additional info, and Launch is still able to run the Direct Call Rule:<\/p>\n\n\n\n
\"\"<\/figure>\n\n\n\n
You may notice this commented-out line:<\/p>\n\n\n\n
\/\/console.log(\"Data layer at this time:\" + JSON.stringify(digitalData))<\/code><\/pre>\n\n\n\n
This is for if you want to see the contents of your data layer at the time the DCR fires- you can uncomment it if that\u2019d also be helpful to you. I find \u201cstringifying\u201d a JavaScript object in console logs is a good way of seeing the content of that object at that point in time- otherwise, sometimes what you see in the console reflects changes to that object over time.<\/p>\n\n\n\n
Improved Logging for \u201cCustom Event\u201d-Based Rules<\/h2>\n\n\n\n
If you\u2019re using \u201cCustom Event\u201d rules in DTM or Launch, you may have had some of the same debugging\/logging frustrations. Logs from _satellite.setDebug<\/em> will tell you a rule fired, but not what extra details were attached, and it really only tells you anything if you already have a rule set up in Launch.<\/p>\n\n\n\n
For example, let\u2019s say I have a link on my site for adding to cart:<\/p>\n\n\n\n
Add To Cart!<\/a><\/p>\n\n\n\n
My developers have attached a custom event to this link:<\/p>\n\n\n\n
var addToCartButton = document.getElementById(\"cartAddButton\"); \naddToCartButton.addEventListener(\"click\", fireMyEvent, false); \nfunction fireMyEvent(e) { \n   e.preventDefault(); \n   var myCustomEvent = new CustomEvent(\"cartAdd\", { detail: { name:\"wug\", price:\"12.99\", color:\"red\" }, bubbles: true, cancelable: true }); \n   e.currentTarget.dispatchEvent(myCustomEvent)\n}<\/code><\/pre>\n\n\n\n
And I\u2019ve set up a rule in Launch to listen to it:<\/p>\n\n\n\n
\"\"<\/figure>\n\n\n\n
With my rule and _satellite.setDebug<\/em> in place, I see this in my console when I click that link:<\/p>\n\n\n\n
\"\"<\/figure>\n\n\n\n
But if this debugging doesn\u2019t show up (for instance, if my rule doesn\u2019t work for some reason), or if I don\u2019t know what details the developers put on the custom event for me to work with, then I can put this script into my console:<\/p>\n\n\n\n
var elem=document.getElementById(\"cartAddButton\")\nelem.addEventListener('cartAdd', function (e) { \n  console.log(\"'CUSTOM EVENT 'cartAdd' fired with these details:\",e.detail)\n}, false);<\/code><\/pre>\n\n\n\n
Note, you do need to know what element the custom event fires on (an element with the ID of \u201ccartAddButton\u201d), and the name of the event (\u201ccartAdd\u201d in this case)- you can\u2019t be as generic as you can with the Direct Call Rules.<\/strong><\/p>\n\n\n\n
With that in place, it will show me this in my console:<\/p>\n\n\n\n
\"\"<\/figure>\n\n\n\n
Note, any rule set up in Launch for that custom event will still fire, but now I can also see those additional details, so I could now know I can reference the product color in my rule by referencing \u201cevent.detail.color\u201d in my Launch rule:<\/p>\n\n\n\n
\"\"<\/figure>\n\n\n\n
Other tips<\/h2>\n\n\n\n
Either of these snippets will, of course, only last until the DOM changes (like if you navigate to a new page or refresh the page). You might consider adding them as code within Launch, particularly if you need them to fire on things that happen early in the page load, before you have a chance to put code into the console, but I\u2019d say that should only be a temporary measure- I would not deploy that to a production library.<\/p>\n\n\n\n
What other tricks do you use to troubleshoot Direct Call Rules and Custom Events?<\/p>\n","protected":false},"excerpt":{"rendered":"
(This is cross-posted from the 33 Sticks blog) UPDATE: The wonderful devs behind Adobe Launch have seen this and may be willing to build it in natively to the product. Please go upvote the idea in the Launch Forums! As discussed previously on this blog, Direct Call Rules have gained some new abilities so you can send … Read more<\/a><\/p>\n","protected":false},"author":1,"featured_media":0,"comment_status":"open","ping_status":"open","sticky":false,"template":"","format":"standard","meta":{"footnotes":""},"categories":[23],"tags":[57,37,56,45],"_links":{"self":[{"href":"https:\/\/www.digitaldatatactics.com\/index.php\/wp-json\/wp\/v2\/posts\/567"}],"collection":[{"href":"https:\/\/www.digitaldatatactics.com\/index.php\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/www.digitaldatatactics.com\/index.php\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/www.digitaldatatactics.com\/index.php\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/www.digitaldatatactics.com\/index.php\/wp-json\/wp\/v2\/comments?post=567"}],"version-history":[{"count":3,"href":"https:\/\/www.digitaldatatactics.com\/index.php\/wp-json\/wp\/v2\/posts\/567\/revisions"}],"predecessor-version":[{"id":583,"href":"https:\/\/www.digitaldatatactics.com\/index.php\/wp-json\/wp\/v2\/posts\/567\/revisions\/583"}],"wp:attachment":[{"href":"https:\/\/www.digitaldatatactics.com\/index.php\/wp-json\/wp\/v2\/media?parent=567"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/www.digitaldatatactics.com\/index.php\/wp-json\/wp\/v2\/categories?post=567"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/www.digitaldatatactics.com\/index.php\/wp-json\/wp\/v2\/tags?post=567"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}