LogoLogo
PlatformsPricingRessources
  • Home
  • Onboarding
  • User documentation
  • Release Notes
  • Help Center
  • User documentation
  • Dashboard
    • Global Experience Dashboard discovery
    • How to filter the Global Experience Dashboard
    • How to customize your Global Experience Dashboard
    • Uplift card
  • Web Experimentation and Personalization
    • Campaign creation and dashboard
      • Types of campaigns
        • Choosing the right type of campaign with Ally, our assistant
      • How to create a campaign
        • Experimentations
          • How to create an A/B Test
          • How to create a Multipage Test
          • How to create a Split Test/Test by Redirection
          • How to create an A/A Test
          • How to create a Patch / Multipage Patch
          • How to create a Multivariate Test
        • Personalizations
          • How to create a Multi-Experience Personalization
          • How to create a Multipage Personalization
          • How to create a Simple Personalization
      • Campaign duplication
        • How to duplicate a campaign
      • How to set-up Main Information step
      • Understanding campaign duration
      • Campaign loading (deferred/ instant)
      • The "Comment" section of the campaign creation flow
      • Campaign statuses
      • How to exclude IP addresses from your campaigns
      • How to use MDE Calculator
      • Campaigns Dashboard
      • Campaign Scheduler
      • Mutually Exclusive Experiments
      • How to use Campaign Prioritization
        • Prioritization of Personalizations
    • Editors and Widget
      • How to create and edit content in the visual editor
      • How to use our Visual Editor - Interactive demo
      • Discovering the Visual Editor
      • Visual editor - History and review of modifications
      • Code Editor
      • Using the Editor Copilot
      • Prompt Inspiration library for Visual Editor Copilot
      • How to create an Action Tracker in the editor
      • How to use redirection option
      • How to create trackers in the editor
      • Widgets
        • Widgets configuration in the visual editor
        • AB Tasty prebuilt Widgets
          • Action Button Widget
          • Banner Widget
          • Before-After Image Widget
          • CSAT Widget
          • Celebrate Widget
          • Countdown widget
          • Drawer Widget
          • Dwell Time Tracking Widget
          • Element Visible Tracking Widget
          • Iframe Click Tracking Widget
          • IFrame Widget
          • Image Pop-in Widget
          • NPS® (Net Promoter Score) Widget
          • Progress Bar Widget
          • Scratch card Widget
          • Scroll Rate Tracking Widget
          • Search & Replace Widget
          • Simple Popin Widget
          • Snowflake Animation Widget
          • Social proof Widget
          • Social Sharing Widget
          • Spotlight Widget
          • Sticky Element Widget
          • Tooltip Widget
          • Video Pop-in Widget
          • Virtual Click Widget
        • Custom widget
          • Custom Widgets: List of propname Fields and Their Specificities
          • Custom widgets: Global usage and information
        • Custom code widget
      • Chrome extension
      • Shadow DOMs & iFrames
        • Understanding Shadow DOM
        • How to edit Shadow DOM in the visual editor
        • Understanding iframes
        • How to edit Iframes in the visual editor
    • Goals step
    • Targeting step
      • How to set up a campaign Targeting
      • How to create a Segment (Who section)
        • Segments Recommendations
        • Inspiration with Engagement Level segmentation
      • How to define Targeted Pages (Where section)
      • How to create a Trigger (How section)
        • Geolocation criterion
        • Device criterion
        • Screen size criterion
        • IP address criterion
        • Weather criterion
        • Landing Page criterion
        • Source & source type criterion
        • Previous Page criterion
        • URL Parameter criterion
        • Minimum Pages viewed criterion
        • Visited Pages criterion
        • Same day visit criterion
        • Browser language criterion
        • Browser criterion
        • Adblocker criterion
        • JS Variable criterion
        • Code-based criterion
        • CSS Selector criterion
        • DataLayer criterion
        • Visitor attributes criterion
      • How to define a Targeting Frequency (When section)
      • How to set-up targeting verifications
      • How to use the replicate targeting option
      • How to use URL operators to build URL patterns
    • Traffic allocation step
      • Campaign flow: Traffic Allocation step
      • Dynamic allocation
      • Even allocation
    • Advanced Options step
      • Sequential Testing Alerts
    • QA step
      • QA Mode & QA Assistant
        • How to use the QA mode
        • How to use the QA Assistant on desktop
        • How to use the QA Assistant on mobile
      • How to use the browser console to QA a campaign
  • Feature Experimentation & Roll-Out
    • How to create server-side A/B tests
    • How to create feature toggles and manage rollouts
    • How to create server-side personalization
    • FE&R Glossary
    • Managing Flags
    • Managing Context Keys
  • Recommendations & Merchandising
    • Recommendations
      • Web recommendation
        • Most popular recommendation filters
        • Variables by placement
        • Placement
        • Products groups
        • Filters
        • Exceptions
        • Options
      • Recommendation Banner
        • Recommendation banner with tag and custom JS
          • Adding Recos Tag to a website
          • Enriching Recommendations Banner HTML to send events to DataLayer through Recos Tag
          • Setting up GTM to send Recos Datalayer Events
          • Connect Tag Assistant from GTM
          • Check that the events arrive correctly in GA
          • Check the display of recommendations
          • Retrieving recos products from a RECO_ID with Recos Tag
        • Deploying a Recommendations Banner Custom Widget
        • Retrieving a Recommendation RECO_ID
        • How to push recommendations with Adobe Campaign
        • How to build recommendations (recommendation builder variant)
      • Mail recommendations
        • How to push recommendations into your Brevo emails
        • Brevo Feed
        • Products groups
        • Filters
        • Products highlights
        • Exceptions
        • Options
        • Parameters
        • Preview
        • Most popular recommendation filters
    • Merchandising
      • Introduction
      • Category
      • Products groups
      • Filters
      • Products highlights
      • Exceptions
      • Result to refine
      • How to deploy a merchandised product list through Algolia
    • Recos & Merch analytics
      • How to track performances
      • Recos Analytics Event format
      • The impact of BigQuery exports in terms of cost
      • Setup analytics retrieve events with Recos Tag
      • Key indicators over the period & Segment
      • Overview data
      • Evolution metrics
    • Recos & Merch API
      • Getting a product list
      • Accessing Recos API (endpoint)
      • Accessing Recommendations API (only specific accounts)
    • Recos & Merch account management
      • How to manage users in Recommandation & Merchandising module
      • How to manage roles
      • How to manage synchronisations
      • How to manage invoices
    • Security and GDPR
      • Procedure for Reporting Personal Data Breaches
      • Backup Policy
      • Security Configuration of Our Servers
      • PSSI
    • Recos & Merch Algorythms
      • How to manage algorithms
      • How to create your algorithms
      • Better understanding
      • Default algorithms
      • Data used to train Algorithms
    • Recos & Merch integrations
      • Integrations with Recos & Merch
      • Brevo Integration
      • Analytic integrations
        • Google Analytics integration
        • Matomo integration
        • Random data integration
      • Recos & Merch CMS integration
        • PrestaShop integration
        • Shopify Integration
        • Custom integration
  • Emotions AI
    • Understand EmotionsAI
      • EmotionsAI in a nutshell
      • Leverage EmotionsAI to get more value from A/B tests
      • Leverage EmotionsAI to get high-potential A/B test ideas
    • First steps with EmotionsAI
      • Onboarding
      • EmotionsAI functioning
      • Navigating the interface
      • FAQ about EmotionsAI
    • Using EmotionsAI
      • How to activate EmotionsAI features
      • EmotionsAI Website Mapping configuration
      • EmotionsAI Journey Analysis
      • EmotionsAI Page Analysis
      • Target EmotionsAI segments
      • QA a campaign on Desktop with EmotionsAI Chrome Extension
      • Use EmotionsAI targeting on hard-coded personalizations
      • Usage of EmotionsAI in some Push integrations
    • Read EmotionsAI campaigns’ report
  • Library
    • How to set-up your libraries
    • Widget library
      • Creating and managing Widgets
      • How to create a preset Widget
      • How to create a Custom Widget
        • How to configure Custom Widgets Custom Forms
      • How to declare your Widget Theme
    • Assets Library
    • Trackers library
      • Action Trackers
        • How to create and manage Action Trackers
      • How to create a Custom Tracker with custom JavaScript code
      • How to create a Custom Tracker via the DataLayer
    • Creating and managing Segments
      • List of Segment criteria
        • CSAT criterion (Customer Satisfaction)
        • NPS® criterion (Customer Satisfaction)
        • Engagement Level criterion
        • EmotionsAI criterion
        • Content Interest criterion
        • Page interest criterion
        • Device criterion
        • Cookie criterion
        • New/Returning visitors criterion
        • Campaign Exposure criterion
        • Number of sessions criterion
        • Day(s) Since Last Session criterion
        • Day(s) Since First Session criterion
        • Action Tracker criterion
        • Cart Abandonment criterion
        • Last Purchase criterion
        • Purchase Frequency criterion
        • Geolocation criterion
        • DMP, CDP, rd party tool criterion
      • Segments Library - Metrics
    • Creating and managing Triggers
      • List of Trigger criteria
    • Creating and managing Saved Pages
  • Integrations
    • Integrations general information
    • Push integrations
      • Adobe Analytics
      • Air
      • Amplitude (analytics browser)
      • Amplitude
      • AT Internet Smart Tag
      • Contentsquare
      • Google Analytics (Audience creation)
      • Google Analytics (UA)
      • Google Analytics (event only)
      • FullStory
      • Heap Analytics
      • Hubspot
      • Matomo
      • Mixpanel
      • Piano Analytics
      • SalesForce Marketing Cloud (Push)
      • Segment
      • Tealium
    • Pull integrations
      • Air
      • Commander Act
      • EmotionsAI
      • Fullstory
      • Google Analytics
      • Heap Analytics
      • Mixpanel
      • mParticle
      • Piano Analytics (Pull)
      • SalesForce Marketing Cloud (Pull)
      • Segment
      • Tealium : Import Audiences
      • Weborama
    • Other integrations
      • Productivity
        • Microsoft Dynamics Commerce
        • Setting up Microsoft Clarity Integration with AB Tasty
        • Didomi
        • How to Set Up the AB Tasty Connector with Notion
        • How to connect AB Tasty to Google Sheets
        • Connect your Slack Workspace to AB Tasty
      • Data Warehouse
        • Data Warehouse integrations: General information
        • Big Query - Daily exports from AB Tasty to Big Query
        • Snowflake - Daily exports from AB Tasty to Snowflake
        • Redshift - Daily exports from AB Tasty to Redshift
    • Custom integrations
      • Universal Data Connector
      • Custom Integration Connector with a rd party tool (Push data)
      • AB Tasty public API
  • Reporting & Performances
    • Data Explorer
      • How to analyze page traffic via Data Explorer
      • How to get metrics breakdown by multiple dimensions via Data Explorer
      • How to get a list of recent hits via Data Explorer
      • Data Explorer - List of Metrics and Dimensions
    • ROI dashboard
    • Performance Center
      • List of Performance Guidelines
    • Reporting
      • Campaign reporting
        • Reporting Copilot
        • Analysis Copilot
      • Data & reports: generalities and definitions
      • AB Tasty reports Metrics
        • Live hits of the reporting
        • Metrics based on tracking widgets
        • Navigation metrics
        • Metrics based on pageviews
        • Metrics based on clicks
        • Metrics based on transactions
      • Reporting Filters
        • General Reporting filters
        • EmotionsAI Reporting filter templates
      • Using the NPS®️ report
        • How does Feedback Analysis Copilot work
      • Sample ratio mismatch
      • Refresh reporting data using Refresh On Demand
      • Data export from the reporting
      • Frequentist Analysis mode
      • Understand the statistics behind your Reports
        • Statistics for the reporting
        • Statistical metrics
        • Avoiding Pitfalls in AOV Analysis for Conversion Rate optimization
        • Conversion mechanisms & concepts
        • Reporting Readiness
  • Account
    • Tag integration
      • All About Tags
      • How to implement the Generic Tag
        • AB Tasty hosted tag implementation
        • Tag Domain Delegation
          • Tag domain delegation implementation
      • How-to QA the Generic Tag
      • How to implement the Generic Tag via Google Tag Manager
      • How-to join the Next tag program
      • AB Tasty integration with Shopify
        • Understanding Shopify App features
        • How to implement the AB Tasty tag via Shopify
        • How to set-up Shopify Custom Pixel App
      • AB Tasty tag compilation
      • How the AB Tasty tag is designed to handle Single Page Apps (SPA)
    • Technical implementation
      • How to choose your cookies deposit method
      • How to declare my Account Domain?
      • JavaScript in AB Tasty
        • How to configure JavaScript
        • Javascript files execution
        • Campaign JavaScript Execution
      • How to configure jQuery loading
      • How to integrate Product hits
      • Product Hits integration principles
        • How to set-up segment criteria "Content Interest" and "Cart Abandonment"
    • Transaction Tag integration
      • How to implement the Transaction tag
      • How to create a Transaction Tracker via DataLayer
      • How to use the Transaction Tag Generator
      • How to QA the Transaction tag
    • Performance and security
      • How to manage visitor identity
      • How to deactivate AB Tasty
      • Consent policy - cookies, storage and privacy
    • Account management
      • The organization page
      • Subscription page
      • How to manage users?
Powered by GitBook
LogoLogo

AB Tasty Website

  • Home page AB Tasty
  • Blog
  • Sample size calculator
  • Release note

AB Tasty Plateform

  • Login

© Copyright 2025 AB Tasty, Inc, All rights reserved

On this page
  • DOM ready principles
  • Campaign Javascript and DOM ready
  • Configuring Campaign JavaScript Execution
  • At the Account’s Level (anytime)
  • At a Campaign Level (for a specific campaign)

Was this helpful?

Edit on GitLab
Export as PDF
  1. Account
  2. Technical implementation
  3. JavaScript in AB Tasty

Campaign JavaScript Execution

PreviousJavascript files executionNextHow to configure jQuery loading

Last updated 12 days ago

Was this helpful?

DOM ready principles

In order to fine-tune when your custom JavaScript is executed within your campaigns, you have the option to choose between two options: when the DOM is ready or before.

When a webpage is loaded, the browser goes through the process of reading the code and creating a representation of the page called the Document Object Model (DOM). The DOM-ready point is when the browser has finished this process and the page is fully loaded and ready to be interacted with.

It makes sure that the page is ready to be used and that all elements can be accessed before the code is executed.

This option can be set up:

  • on a campaign level

  • or globally in your account.

By default, the JavaScript code is set to execute when the DOM is ready, but if you have controls in place and you want to avoid flickering, you can choose to execute the code before the DOM is ready. This feature is available for you to use and you can access it in your advanced setting in the "Javascript Execution" subsection.

Campaign Javascript and DOM ready

By default, the custom campaign JavaScript (JS) will be executed when the DOM is ready. This is because the custom JS may interact with elements of the DOM that may not be present before the document fully loads.

It is safer to execute the JS only when there is the highest chance of reaching the targeted element, otherwise, the campaign may not be displayed.

However, this can result in a potential and avoidable delay in the application of the campaign. Since the controls for checking the presence of a DOM element can be fully developed within the custom JavaScript, AB Tasty allows you to change the default JS execution behavior for one campaign or for all upcoming campaigns. This enables the execution of the custom JavaScript before the DOM is ready.

Configuring the execution of the campaign JavaScript before DOM-Ready does not mean that the JavaScript will systematically be executed before DOM-Ready. Indeed, there are many reasons why the AB Tasty tag may be executed after DOM-Ready (bad implementation, network problems, asynchronous targeting…).

The code a user can set up on his account JavaScript is a . In this case, AB Tasty already has a setting to decide whether the JavaScript should be executed before DOM-ready or not. Both features are not linked.

The Element JS option is available in the visual editor and enables a user to add JavaScript to a specific element. In this case, the AB Tasty tag will add a watcher on the concerned element in order to wait for the element to be loaded before executing the JavaScript, without waiting for DOM-ready. More information in this .

Configuring Campaign JavaScript Execution

We enable you to specify whether the JavaScript should be executed on or before DOM-Ready, at the account's level (anytime) or at the campaign level (for a specific campaign).

At the Account’s Level (anytime)

Custom JS execution can be configured at the account’s level, for all upcoming campaigns of the account.

To configure the custom JS execution for upcoming campaigns, follow the steps below:

  1. In the Settings click Advanced Settings.

  2. Click JavaScript execution.

  3. On the Campaign JavaScript Execution page, disable the Wait for DOM-ready to execute JavaScript option if you want the custom JavaScript to be executed before DOM-ready.

The newly configured behavior will apply immediately to all upcoming campaigns.

Existing campaigns associated with the account will not be affected by this configuration.

At a Campaign Level (for a specific campaign)

Custom JS execution can be configured at a campaign’s level in the visual editor or in the code editor. This way, the default behavior of the execution of the campaign's JavaScript will not be affected.

To configure the custom JS execution at a campaign’s level, follow the steps below:

  1. From the Campaign dashboard, open the Visual editor page or the Code editor page.

  2. From the menu bar, open the Campaign JavaScript editor.

  3. Click Save.

On the JavaScript editor page, uncheck the Wait for DOM-ready to execute JavaScript option.

different feature
article