Testing & Debugging Adobe Target Campaigns
Adobe Target is one of the solutions under Adobe Experience Cloud that enables user-testing (like A/B tests) & personalization on your web & mobile apps. Adobe Target can be implemented on Single-page apps through JS library, Server-side apps through Delivery API and on Mobile apps through Native SDKs. You can integrate Adobe Target on your site either by directly integrating Adobe Target JS snippet or through Adobe Launch (DTM aka satellite). This article focuses on testing & debugging of Adobe Target campaigns (included with Adobe Launch).
Who’s this article for: Whether you are Adobe Target developer, Solutions consultant, Customer Success Engineer, or a Product Manager the following tips are going to help you in debugging Target campaigns.
Source & Credits: This wouldn’t have been possible without talking to lots of solution consultants who use Requestly everyday to develop, test & debug Adobe Target campaigns on their customers’ sites.
Outline
Here is a list of a few things that we will cover in detail one by one:
- Loading an unminified version of the Adobe Launch tag for faster debugging
- Test your solution on live Customer Sites without deploying the changes
- Automatically loading sites in Target debug mode
- Identifying when the Adobe Target tag is loaded on the page
- Injecting Adobe Target (or DTM) tag on sites where the tag isn’t present
- Blocking Adobe Launch/Target call to check original experience
- Sharing the recording of Adobe Target campaign delivery along with video, campaign information & console logs.
Prerequisite
You can go through the content of this article with no prerequisites but if you have Requestly Installed then you can also follow along and repeat the steps on your machine easily. You can get Requestly from Chrome Store for Chrome or from the Downloads Page for Other Platforms.
Loading unminified version of Adobe Launch Tag 🚀
Debugging minified scripts on production sites is a nightmare. Fortunately, Adobe publishes an unminified version of its Adobe Launch tag which can be accessed by removing .min from the URL.
You can use Requestly to automatically load the unminified version on live production sites.
This enables you to inspect/read all the code & Put breakpoints in Chrome DevTools Sources Tab.
If you have Requestly Installed, then you can import the Requestly Rule using this link.
Testing dev changes directly on live customer sites without deployment 🔥
When you implement a new feature or fix a bug, you can directly test the changes on live production sites without having to deploy them. Here’s a blog post that explains how you can redirect the Adobe Launch prod tag to the dev/staging/local version of the tag in Chrome, Firefox & Safari.
The way it works is when the browser tries to load the production version of the Adobe Launch tag, Requestly intercepts it and instead loads the development/staging version of the tag as you configure in the Redirect Rule.
💡 Bonus Tip — You can use Requestly File Server to upload/host your JS code and use in the Redirect Rule configuration.
Automatically loading sites in Debug Mode (Add mboxDebug query parameter) ⚡️
Adobe Target prints a lot of information in the browser console when the page URL has the mboxDebug query parameter. For example — If you load a site that is running an Adobe Target campaign (e.g. https://some-adobe-target-customer.com/?mboxDebug=1), you will see the following information in the console logs
- Request & Response of Target campaign
- Important Information like marketingCloudVisitorId, tntId, etc.
- Campaign Information like ActivityName, ExperienceName, & Different page actions that are part of experience/variation
- When an Adobe Target action is trying to be applied & when successfully applied
- Eventually, if any target action failed to apply
Of course, you can add this parameter manually to the page URL and reload the page but Requestly can automate it for you. You can use the Requestly QueryParams Rule to automatically add the parameter to some or all pages that you open.
Here’s the Rule definition that you can Import in a Single Click!
Get an Alert when the Adobe Target tag is loaded on the page ⏰
You may want to be notified when Adobe Target is loaded on the page so that you can test whether the campaign is delivered fine and do other validations. There can be multiple solutions to this but here’s a simple one that can be customized with simple knowledge of JS.
Basically, we are using the Requestly Insert Script feature to run a script on the page after 5 seconds of page load to check for adobe & adobe target fields on the global window object. As mentioned earlier, this can be customized to do a more aggressive & more robust check depending on the use-case.
Here’s the Rule definition that you can import in a Single Click!
💡 Bonus Tip — You can use Insert Script feature to Inject Adobe DTM tag on sites where the tag isn’t present and use the setup in a demo or pre-integration testing purposes.
Blocking Adobe Launch Tags to test default experience/performance 🛑
One of the Requestly users compared site performance with & without the Adobe Launch tag present when her client complained that the site is getting slow because of the tag. She used the Requestly Block Requests rule to block the loading of the Adobe Launch tag and then she calculated the performance report. It was very helpful for her to convince the client that it’s not the tag that is impacting the performance.
It’s very simple to block the script (or any script or API) using Requestly Block/Cancel Requests Rule & check the default experience or performance of the site.
Here’s the rule definition that you can import in a single click!
Sharing the Adobe Target campaign Info along with video, campaign information & console logs. 📒
Requestly provides a feature called Session Recording that allows users to configure a list of domains for which sessions should be auto-recorded. You can use session recording along with the mboxDebug parameter combination to pass the campaign context (campaign delivery Info, video & console logs) to the campaign implementation manager when something goes wrong. It’d fasten the entire process of launching & debugging the campaign.
Here’s a screenshot from the session that shows the campaign Information being captured along with the video & console logs on the customer site.
Check out the recording of a sample session!
If you have Requestly Installed, you can configure the domains and sessions will be auto-recorded when you browse those pages and you can share them with your colleagues for faster debugging.
Conclusion ❤️️
We compiled a few tips & tricks for debugging Adobe Target (& Launch) and we’re barely scratching the surface. With the power of Requestly, you can achieve a lot of debugging superpowers. Here’s a link to import all the rules in a single click!
Happy Campaigning!
SJ- Founder & CEO, Requestly.
That’s it for now! Hope you enjoyed reading it. Feel free to connect if you have any questions!
Originally published at https://requestly.com.