Adobe Experience Platform Data Collection Tags Launch is Adobe’s tag management solution, or TMS. (Sorry, Adobe product folks, you can change the name internally, but not in my brain.) If you’ve worked with Launch for any period of time, you’re likely familiar with how difficult it can be to debug. In this post I’m going to walk through how to use Requestly to ease some of the pain.
Launch (codenamed Reactor) enables quicker deployment of marketing technologies by providing non-technical end users with a means to circumvent common enterprise IT bottlenecks. Its beating heart is a rules engine codenamed Turbine. Users log into Launch, create rules, add tags to those rules, test them (ideally), and then deploy them to the live site. All without a degree from Stack Overflow University (although having one helps).
One feature Launch unfortunately doesn’t include is some kind of intuitive mechanism for validating tagging you’ve set up. There’s no equivalent to Google Tag Manager’s Preview Mode. So how do you make sure your tagging is working as expected on the website you’re trying to tag?
Requestly is a great tool for this.
Why we need to swap environments
What is a Library?
A library in Launch parlance is a collection of tagging changes, sort of like Workspaces in GTM. Putting your changes into libraries makes it easier for Launch to build all your changes to each environment in the publishing workflow. Think of it as a serving tray at a restaurant — it’s easier for the server to bring you all your food when it’s all on one tray.
Libraries also implicitly include the last-published versions of all other assets in a Launch property.
What is an Environment?
Environments are simply endpoint URLs to which libraries can be built. Each environment has an endpoint URL associated with it. When a Launch embed snippet loads on the page, it calls whatever endpoint URL is included in the src attribute. Whichever library is built to that environment will be the library that loads on pages that have the embed snippet that corresponds to that environment.
Launch properties typically have three environments:
- Development
- Staging
- Production
Properties can have multiple Development environments, but only one Staging and one Production environment. These environments correspond to Adobe’s recommended tag management workflow.
Why we need to swap environments
So this is where it gets tricky. There will inevitably be times where you need a different Launch library to load on the page:
- You may not have access to lower environments hosted on a company’s private network, and therefore need to develop and test your tagging changes on a live site
- The site engineering team may not have added embed codes, or they may have added the embed codes incorrectly
- You want to test changes built to a Development environment associated with a different embed snippet/endpoint URL
- A certain tag can only be validated on the live site, but you don’t want to push the tag live yet
- Lower environments are down or otherwise temporarily inaccessible
Whatever the case, there needs to be a way to effectively “swap out” the Launch environment that loads on the site you’re testing.
Traditional methods
Web debugging proxy
Debugging proxy software like Charles or Fiddler allows you to intercept and modify network requests. These are powerful tools that basically create a forward proxy on your device through which all traffic gets routed.
Because of how they work, they require elevated privileges to install, and can have interesting side effects if they’re not configured correctly or the software crashes. They are still a great method for debugging traffic on mobile devices, but on desktop, browser extensions have largely taken over as the preferred method for modifying network requests.
Browser extensions
Browser extensions work differently: they’re contained by the browser, so they don’t need admin privileges to install, and they don’t create a forward proxy on your device. (They are restricted to the browser though, so they don’t work for mobile app debugging.)
Adobe provides a browser extension called Adobe Experience Platform Debugger. This extension is kind of a swiss army knife for debugging Adobe SaaS products, so it’s kind of heavy, but it does allow you to swap out libraries fairly easily. If you also need to debug Analytics or Web SDK requests, this works quite well.
However sometimes it’s a little cumbersome to work with:
- It requires having a separate window open, which can be hard to keep track of
- Many times I forget to click the little lock button at the bottom of the window, then switch tabs, then wonder why my tracking broke all of a sudden
- Sometimes I forget that I’ve swapped out a library using the extension because the library swap feature is somewhat buried in the UI
- About half the time, when I’m done QAing and have disabled the swap, the redirect still happens for … reasons
Getting Started with Requestly
I’ve tried many tools for swapping environments. The tool I keep coming back to is Requestly.
Requestly is a lightweight browser extension which allows you to intercept and modify network requests. It was built by Adobe alumni who needed a quick and easy way to replace Adobe DTM tags, opt into Adobe Target experiences, etc. It does what you need and gets the eff out of your way. That’s important to me.
Step by Step Guide
1. Install browser extension
Head on over to requestly.com and install it in your browser. Requestly offers extensions for Chrome, Edge, and Firefox, so take your pick.
2. Sign up for an account
This is a lifesaver if you’re working on multiple devices — it keeps everything in sync. It also helps Requestly’s incredible team understand better who’s using it so they can make it even better.
3. Set up your first rule (Redirect Request)
Go ahead and click Redirect request from the main screen.
The main screen is a little intimidating the first time you use it, but just focus on the two fields here:
- In the first field, copy & paste the URL of the Launch environment you’re trying to replace.
- In the second, copy & paste the URL of the Launch environment you want to replace it with. You can get this by going into Launch, navigating to Environments, and clicking the little package icon all the way to the right next to the name of the destination environment.
Then click Save Rule. That’s pretty much it. You just created your first rule!
4. Enable the rule
Your new rule should be enabled by default, but if it isn’t, click the toggle to enable it. (You probably guessed already, but you can disable rules by toggling them off.)
5. Navigate to the site
Head on over to any site that loads the Launch environment you’re swapping out.
6. Check that it worked
When a Requestly rule matches, the extension icon turns green (nice) and you’ll even get a little reminder that a rule was applied (super helpful).
Now get to debuggin'!
Advanced Techniques and Use Cases
The only feature you really need for swapping Launch environments is Redirect Requests. The free plan gives you up to 5 rules (up to 3 can be active at a time). If all you’re doing is swapping Launch environments, then you’re set.
However, after using Requestly for a while (and liking it), I checked out all the other things it can do, and I was amazed.
Make Launch debugging easier
Did you know that Launch builds generate not one but two files? One is the minified version that’s smaller and meant for production:
But Launch also builds an un-minified version which is MUCH easier to set breakpoints in:
One of my favorite uses for Requestly is simply swapping out the minified version for the un-minified version. This makes debugging so much easier.
Map local or remote resources
Sometimes I need to swap out a resource on a client’s website with a file on my local machine—like if I want to see how a snippet of data layer code works, or mock up some quick styling changes. If you’re like me, you might have trouble keeping track of your Chrome Devtools overrides across all your Google accounts. Requestly offers local and remote resource mapping so you can keep them all in one place.
Modify headers
Sometimes I need to tweak one (or more) of the HTTP headers passed in a request: to set or modify a cookie server-side, add an authentication token, update CDN caching, or even bypass CORS policies. You can easily add and modify headers with Requestly.
Modify query parameters
There are times when I want to pass in a query parameter to modify a GET request or add a flag to turn on code that only runs when I’m debugging. This is a quick and easy way to automatically add query params to URLs.
Recordings
Ever struggle to explain a bug you’re seeing on the site? Make a recording and send it to your developers.
Check out the example recording to explore this handy feature.
API client
If you need a quick in-browser replacement for Postman, check out Requestly’s built-in API client!
So far I’ve focused on features that are included with the free plan, but if you’re willing to pay a little extra, here are some of the cool things you can do with paid plans:
Team Workspaces (Basic plan)
When I worked at Search Discovery Further, I would share redirects and snippets with my teammates using Team Workspaces. This made it much easier to get colleagues up and running.
Check out this video for a quick overview of Workspaces:
Insert JS (Lite plan)
Sometimes I want to add an event listener on page load that shows some debugging info. This is cumbersome to do with just Chrome devtools alone. Requestly lets you inject JS directly into the page. You can also inject CSS to test basic styling changes. This requires at least the Lite plan.
Conclusion
Adobe Launch properties can be tricky to debug. There are lots of tools out there to help, but in my experience, Requestly is the easiest and most useful. While Requestly lets you easily swap out Launch libraries, this post only scratches the surface of what’s possible with Requestly.
I also want to mention that the Requestly team is just awesome. Sachin, the founder, is a genuinely kind and helpful person. He once spent hours trying to help me get a Playwright test working in an environment that was not friendly to headless browsers. Not related to Requestly, just wanted to help. He’s brilliant, patient, and giving, as is everyone else at Requestly with whom I’ve interacted.