-
Notifications
You must be signed in to change notification settings - Fork 70
Commit
This commit does not belong to any branch on this repository, and may belong to a fork outside of the repository.
Merge pull request #398 from woocommerce/update/separate-site-tag-set…
…up-and-event-tracking Separate the global site tag setup and event tracking
- Loading branch information
Showing
13 changed files
with
314 additions
and
180 deletions.
There are no files selected for viewing
This file was deleted.
Oops, something went wrong.
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -1,6 +1,32 @@ | ||
| // Initialize tracking for classic WooCommerce pages | ||
| import { trackClassicPages } from './integrations/classic'; | ||
| window.wcgai.trackClassicPages = trackClassicPages; | ||
| import { setupEventHandlers } from './tracker'; | ||
| import { classicTracking } from './integrations/classic'; | ||
| import { blocksTracking } from './integrations/blocks'; | ||
|
|
||
| // Initialize tracking for Block based WooCommerce pages | ||
| import './integrations/blocks'; | ||
| // Wait for 'ga4w:ready' event if `window.ga4w` is not there yet. | ||
| if ( window.ga4w ) { | ||
| initializeTracking(); | ||
| } else { | ||
| document.addEventListener( 'ga4w:ready', initializeTracking ); | ||
|
|
||
| // Warn if there is still nothing after the document is fully loded. | ||
| if ( document.readyState === 'complete' ) { | ||
| warnIfDataMissing(); | ||
| } else { | ||
| window.addEventListener( 'load', warnIfDataMissing ); | ||
| } | ||
| } | ||
| function initializeTracking() { | ||
| const getEventHandler = setupEventHandlers( window.ga4w.settings ); | ||
|
|
||
| classicTracking( getEventHandler, window.ga4w.data ); | ||
| blocksTracking( getEventHandler ); | ||
| } | ||
|
|
||
| function warnIfDataMissing() { | ||
| if ( ! window.ga4w ) { | ||
| // eslint-disable-next-line no-console -- It's not an error, as one may load the script later, but we'd like to warn developers if it's about to be missing. | ||
| console.warn( | ||
| 'Google Analytics for WooCommerce: Configuration and tracking data not found after the page was fully loaded. Make sure the `woocommerce-google-analytics-integration-data` script gets eventually loaded.' | ||
| ); | ||
| } | ||
| } |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -1,75 +1,37 @@ | ||
| import { config } from '../config'; | ||
| import * as formatters from './data-formatting'; | ||
|
|
||
| let instance; | ||
|
|
||
| /** | ||
| * A tracking utility for initializing a GA4 and tracking accepted events. | ||
| * Get a new event handler constructing function, based on given settings. | ||
| * | ||
| * @class | ||
| * @param {Object} settings - The settings object. | ||
| * @param {Array} settings.events - The list of supported events. | ||
| * @param {string} settings.tracker_function_name - The name of the global function to call for tracking. | ||
| * @return {function(string): Function} - A function to get event handlers for specific events. | ||
| */ | ||
| class Tracker { | ||
| export function setupEventHandlers( { | ||
| events, | ||
| tracker_function_name: trackerFunctionName, | ||
| } ) { | ||
| /** | ||
| * Constructs a new instance of the Tracker class. | ||
| * Returns an event handler for a specified event name. | ||
| * | ||
| * @throws {Error} If an instance of the Tracker already exists. | ||
| */ | ||
| constructor() { | ||
| if ( instance ) { | ||
| throw new Error( 'Cannot instantiate more than one Tracker' ); | ||
| } | ||
| instance = this; | ||
|
|
||
| window.dataLayer = window.dataLayer || []; | ||
|
|
||
| function gtag() { | ||
| window.dataLayer.push( arguments ); | ||
| } | ||
|
|
||
| window[ config.tracker_function_name ] = gtag; | ||
|
|
||
| // Set up default consent state, denying all for EEA visitors. | ||
| for ( const mode of config.consent_modes || [] ) { | ||
| gtag( 'consent', 'default', mode ); | ||
| } | ||
|
|
||
| gtag( 'js', new Date() ); | ||
| gtag( 'set', `developer_id.${ config.developer_id }`, true ); | ||
| gtag( 'config', config.gtag_id, { | ||
| allow_google_signals: config.allow_google_signals, | ||
| link_attribution: config.link_attribution, | ||
| anonymize_ip: config.anonymize_ip, | ||
| logged_in: config.logged_in, | ||
| linker: config.linker, | ||
| custom_map: config.custom_map, | ||
| } ); | ||
| } | ||
|
|
||
| /** | ||
| * Creates and returns an event handler for a specified event name. | ||
| * | ||
| * @param {string} name The name of the event. | ||
| * @param {string} eventName The name of the event. | ||
| * @return {function(*): void} Function for processing and tracking the event. | ||
| * @throws {Error} If the event name is not supported. | ||
| */ | ||
| eventHandler( name ) { | ||
| function getEventHandler( eventName ) { | ||
| /* eslint import/namespace: [ 'error', { allowComputed: true } ] */ | ||
| const formatter = formatters[ name ]; | ||
| const formatter = formatters[ eventName ]; | ||
| if ( typeof formatter !== 'function' ) { | ||
| throw new Error( `Event ${ name } is not supported.` ); | ||
| throw new Error( `Event ${ eventName } is not supported.` ); | ||
| } | ||
|
|
||
| return function trackerEventHandler( data ) { | ||
| return function eventHandler( data ) { | ||
| const eventData = formatter( data ); | ||
| if ( config.events.includes( name ) && eventData ) { | ||
| window[ config.tracker_function_name ]( | ||
| 'event', | ||
| name, | ||
| eventData | ||
| ); | ||
| if ( events.includes( eventName ) && eventData ) { | ||
| window[ trackerFunctionName ]( 'event', eventName, eventData ); | ||
| } | ||
| }; | ||
| } | ||
| return getEventHandler; | ||
| } | ||
|
|
||
| export const tracker = Object.freeze( new Tracker() ); |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Oops, something went wrong.