diff --git a/site/gatsby-site/gatsby-config.js b/site/gatsby-site/gatsby-config.js index d3ac502d00..7d1f5ec68c 100755 --- a/site/gatsby-site/gatsby-config.js +++ b/site/gatsby-site/gatsby-config.js @@ -11,6 +11,12 @@ cloudinary.config({ cloud_name: config.cloudinary.cloudName }); const adapter = require('gatsby-adapter-netlify').default; +let googleTrackingIds = []; + +if (process.env.SITE_URL === config.gatsby.siteUrl) { + googleTrackingIds.push(config.gatsby.gaTrackingId); +} + const plugins = [ 'layout', { @@ -65,7 +71,7 @@ const plugins = [ { resolve: `gatsby-plugin-google-gtag`, options: { - trackingIds: [config.gatsby.gaTrackingId], + trackingIds: googleTrackingIds, }, }, { diff --git a/site/gatsby-site/playwright/config.ts b/site/gatsby-site/playwright/config.ts index 2440f27287..730f9eeaab 100644 --- a/site/gatsby-site/playwright/config.ts +++ b/site/gatsby-site/playwright/config.ts @@ -4,6 +4,7 @@ type ConfigType = { IS_EMPTY_ENVIRONMENT: string; AVAILABLE_LANGUAGES?: string; [key: string]: string; + SITE_URL?: string; }; const config: ConfigType = { @@ -11,6 +12,7 @@ const config: ConfigType = { E2E_ADMIN_USERNAME: process.env.E2E_ADMIN_USERNAME!, IS_EMPTY_ENVIRONMENT: process.env.IS_EMPTY_ENVIRONMENT ?? '', AVAILABLE_LANGUAGES: process.env.GATSBY_AVAILABLE_LANGUAGES ?? '', + SITE_URL: process.env.SITE_URL ?? '', } Object.keys(config).forEach((key) => { diff --git a/site/gatsby-site/playwright/e2e/unit/gtag.spec.ts b/site/gatsby-site/playwright/e2e/unit/gtag.spec.ts new file mode 100644 index 0000000000..9ec3b96187 --- /dev/null +++ b/site/gatsby-site/playwright/e2e/unit/gtag.spec.ts @@ -0,0 +1,40 @@ +import { expect } from '@playwright/test'; +import config from '../../../config'; +import { test } from '../../utils'; + +const googleTrackingId = config.gatsby.gaTrackingId; + +test.describe('Google Analytics Tracking', () => { + test('Should track gtag only on production', async ({ page, runOnlyInProduction }) => { + await page.goto('/'); + + const hasGoogleTracking = await page.locator(`script[src*="https://www.googletagmanager.com/gtag/js?id=${googleTrackingId}"]`).count(); + + expect(hasGoogleTracking).toBeGreaterThan(0); + + const [trackingRequest] = await Promise.all([ + page.waitForRequest((request) => request.url().includes(`https://www.google-analytics.com`) && request.method() === 'POST'), + + ]); + + expect(trackingRequest).toBeTruthy(); + }); + + + test('Should not track gtag outside production', async ({ page, runAnywhereExceptProduction }) => { + await page.goto('/'); + + const hasGoogleTracking = await page.locator(`script[src*="https://www.googletagmanager.com/gtag/js?id=${googleTrackingId}"]`).count(); + expect(hasGoogleTracking).toBe(0); + + let trackingRequestMade = false; + page.on('request', (request) => { + if (request.url().includes(`https://www.google-analytics.com`) && request.method() === 'POST') { + trackingRequestMade = true; + } + }); + + await page.reload(); + expect(trackingRequestMade).toBe(false); + }); +}); diff --git a/site/gatsby-site/playwright/utils.ts b/site/gatsby-site/playwright/utils.ts index a85fa88ddf..9be1405f27 100644 --- a/site/gatsby-site/playwright/utils.ts +++ b/site/gatsby-site/playwright/utils.ts @@ -6,6 +6,7 @@ import assert from 'node:assert'; import fs from 'fs'; import path from 'path'; import * as memoryMongo from './memory-mongo'; +import siteConfig from '../config'; declare module '@playwright/test' { interface Request { @@ -20,6 +21,8 @@ type TestFixtures = { runOnlyOnEmptyEnvironment: () => Promise, login: (username: string, password: string, options?: { customData?: Record }) => Promise, retryDelay?: [({ }: {}, use: () => Promise, testInfo: { retry: number }) => Promise, { auto: true }], + runOnlyInProduction: () => Promise, + runAnywhereExceptProduction: () => Promise, }; const getUserIdFromLocalStorage = async (page: Page) => { @@ -117,6 +120,22 @@ export const test = base.extend({ await use(); }, { auto: true }], + + runOnlyInProduction: async ({ }, use, testInfo) => { + if (config.SITE_URL !== siteConfig.gatsby.siteUrl) { + testInfo.skip(); + } + + await use(null); + }, + + runAnywhereExceptProduction: async ({ }, use, testInfo) => { + if (config.SITE_URL === siteConfig.gatsby.siteUrl) { + testInfo.skip(); + } + + await use(null); + } }); // SEE: https://playwright.dev/docs/api/class-page#page-wait-for-request