adobe.target.triggerView (viewName, options) - at.js 2.x
This function can be called whenever a new page is loaded or when a component on a page is re-rendered. adobe.target.triggerView() should be implemented for single page applications (SPAs) to use the Visual Experience Composer (VEC) to create A/B Test and Experience Targeting (XT) activities. If adobe.target.triggerView() is not implemented on the site, the VEC cannot be used for SPAs. For more information, see Single Page Application implementation.
NOTE| Parameter | Type | Required? | Description |
|---|---|---|---|
| viewName | String | Yes | Pass in any name as a string type that you want to represent your view. This view name appears in the Modifications panel of the VEC for marketers to create actions and run their A/B Test and Experience Targeting XT activities. |
| options | Object | No | |
| options > page | Boolean | No |
TRUE: Default value of page is true. When page=true, notifications are sent to the Target backend for incrementing impression count. A notification is always sent by default when a FALSE: When page=false, notifications are not sent for incrementing impression count. This approach should be used when you want to only re-render a component on a page with an offer. Note: Custom Code offers in the VEC are not re-rendered when |
Example: True
triggerView() call to send a notification to the Target backend for incrementing activity impressions and other metrics.
adobe.target.triggerView("homeView")
Example: False
triggerView() call to not have notifications sent to the Target backend for impression counting.
adobe.target.triggerView("homeView", {page: false})
Example: Promise chaining with getoffers() and applyOffers()
To execute triggerView() when the getOffers() promise is resolved, it is important to execute triggerView() on the final block, as shown in the example below. This is necessary for the VEC to detect Views in authoring mode.
adobe.target.getOffers({
'request': {
'prefetch': {
'views': [{
'parameters': {}
}]
}
}
}).then(function(response) {
// Apply Offers
adobe.target.applyOffers({
response: response
});
}).catch(function(error) {
console.log("AT: getOffers failed - Error", error);
}).finally(() => {
// Trigger View call, assuming pageView is defined elsewhere
adobe.target.triggerView(pageView, {
page: true
});
console.log('AT: View triggered on : ' + pageView);
});
Example: Best compatibility for triggerView() with the Adobe Visual Editing Helper extension
Consider the following when using the Adobe Visual Editing Helper extension:
Due to Google’s new V3 Manifest policies for Chrome extensions, the Visual Editing Helper extension must wait for the DOMContentLoaded event before loading the Target libraries in the VEC. This delay might cause web pages to fire the triggerView() call before the authoring libraries are ready, resulting in the view not being populated on load.
To mitigate this issue, use a listener for the page load event.
Here’s an example implementation:
function triggerViewIfLoaded() {
adobe.target.triggerView("homeView");
}
if (document.readyState === "complete") {
// If the page is already loaded
triggerViewIfLoaded();
} else {
// If the page is not yet loaded, set up an event listener
window.addEventListener("load", triggerViewIfLoaded);
}