Information about at.js custom events, which lets you know when an mbox request or offer fails or succeeds.
Historically, mbox.js (now deprecated) didn’t let other JavaScript code that runs on the page know what happens behind the scenes. With the advancement of at.js, we had a unique opportunity to fix this issue.
According to our customers there are several scenarios that they would like to be notified of, including:
An mbox request failed due to timeout, wrong status code, JSON parse error, etc.
An mbox request succeeded.
Offer rendering failed due to wrapping mbox element missing, selector can not be found, etc.
Offer rendering succeeded. DOM changes have been applied.
Pre-defined events have a structure that allows you to extract the required data, based on event type.
To make sure that events can be used in different scenarios, the custom events have a payload object that is assigned to the detail property of the event object (that is passed to the handler). Also to avoid passing strings as event names, the events are exposed as constants using adobe.target.event namespace.
Structure
Key
Type
Description
type
String
There are several scenarios in which you would like to be notified to help in tracing, debugging, and customizing interaction with at.js.
Each custom event listed below has two formats: a “constant” and a “string value.”
Constants: Prepended with adobe.target.event., presented in all caps, and contain underscore characters. To subscribe to custom events after at.js loads but before the mbox response has been received, use the constant.
String Values: Lowercase and contain dashes. To subscribe to custom events before at.js loads, use the string value.
Request Failed
Constant: adobe.target.event.REQUEST_FAILED
String value: at-request-failed
Description: An mbox request failed due to timeout, wrong status code, JSON parse error, etc.
Description: Offer rendering was successful. DOM changes have been applied.
Library Loaded
Constant: adobe.target.event.LIBRARY_LOADED
String Value: at-library-loaded
Description: This event is ideal to track when at.js has been fully loaded. You can use this event to customize global mbox execution. You can also use this event to disable the global mbox and then listen for this event to fire the global mbox later.
Request Start
Constant: adobe.target.event.REQUEST_START
String Value: at-request-start
Description: This event is fired before an HTTP request is executed. You can use this event for performance measurements using the Resource Timing API.
Description: This event is fired before selector polling is started and content is rendered to the page. You can use this event to track the content rendering progress.