Tracking
Use trackAAEvent to send an Adobe Analytics event directly. Use setupTracking to attach a click listener that sends the event for you.
trackAAEvent()
Fires an Adobe Analytics event via the global s object (Adobe Analytics AppMeasurement).
Signature
trackAAEvent(evar: string, event: string, data: string): voidParameters
| Parameter | Type | Description |
|---|---|---|
evar | string | eVar variable name (e.g. 'eVar26'). |
event | string | Event variable name (e.g. 'event26'). |
data | string | Descriptive label. Appears in Adobe Analytics reporting. |
Usage
import { trackAAEvent } from '@sogody/experiment-framework/framework';
trackAAEvent('eVar26', 'event26', 'my-experiment: v1 cta clicked');Data label convention
The data string should follow this format:
{experimentName}: {variation} {action}Examples:
'samsung-upsell: v1 cta clicked''homepage-banner: v2 cta clicked''product-page: v3 image clicked'
Using one label format makes experiments easier to filter in Adobe Analytics.
How it works
trackAAEvent sets the required AppMeasurement properties and calls s.tl():
s.linkTrackVars = `${evar}, events`;
s.linkTrackEvents = `${event}`;
s.events = `${event}`;
s[evar] = data;
s.tl(true, 'o', data);The s object is a browser global provided by Adobe Analytics. It is declared in biome.json globals so Biome does not flag it as an undeclared variable.
Returns
void
Since
v2.0.0
Related APIs
setupTracking()- attaches a click listener that callstrackAAEventautomatically
setupTracking()
Attaches a click event listener to an element inside the injected container. Calls trackAAEvent when clicked.
Call after render()
setupTracking queries the DOM for the target element. If you call it before render(), the element does not exist yet and setupTracking will exit silently without attaching any listener.
Signature
setupTracking(
container: HTMLElement,
options: {
label: string;
selector?: string;
evar?: string;
event?: string;
}
): voidParameters
| Parameter | Type | Default | Description |
|---|---|---|---|
container | HTMLElement | - | The container returned by mountExperiment(). |
options.label | string | - | Tracking label. Required. Follow the {name}: {variation} {action} convention. |
options.selector | string | 'a' | CSS selector relative to container for the element to track. |
options.evar | string | 'eVar26' | eVar variable name. |
options.event | string | 'event26' | Event variable name. |
Usage with defaults
// Tracks clicks on the first <a> inside container
setupTracking(container, { label: 'my-experiment: v1 cta clicked' });Usage with overrides
// Track a button instead of a link, using eVar30/event30
setupTracking(container, {
label: 'my-experiment: v1 button clicked',
selector: 'button',
evar: 'eVar30',
event: 'event30',
});Call order
runScript(async () => {
// ... setup and fetch ...
// 4. Render first
render(<ExperimentCard ... />, container);
// Track after render so the element exists.
setupTracking(container, { label: 'my-experiment: v1 cta clicked' });
});Returns
void
Since
v2.0.0
Related APIs
trackAAEvent()- fire a raw Adobe Analytics event directlyrunScript()- entry point wrapper;setupTrackingmust be called inside it, afterrender()