From c288a3e61ff8e82482925e7f57f11f0c973a78f7 Mon Sep 17 00:00:00 2001 From: irisfaraway Date: Tue, 17 Oct 2023 10:35:58 +0100 Subject: [PATCH 1/5] Insert Google Tag Manager snippet in template https://eaflood.atlassian.net/browse/IWTF-3732 This PR adds the snippet for Google Tag Manager to the default layout. This snippet should only be inserted when the container ID is present. From 4a06d763601b2c26f6ad2aa97f9fc005bd0c7120 Mon Sep 17 00:00:00 2001 From: irisfaraway Date: Tue, 17 Oct 2023 11:20:35 +0100 Subject: [PATCH 2/5] Only insert snippet if container ID is present --- docker/env/gafl_webapp.env.example | 1 + .../__snapshots__/page-handler.spec.js.snap | 2 ++ .../handlers/__tests__/page-handler.spec.js | 19 +++++++++++++++++++ .../src/handlers/page-handler.js | 1 + .../src/pages/layout/layout.njk | 3 +++ .../__tests__/misc-routes-handlers.spec.js | 19 +++++++++++++++++++ .../src/routes/misc-routes.js | 8 ++++++++ 7 files changed, 53 insertions(+) diff --git a/docker/env/gafl_webapp.env.example b/docker/env/gafl_webapp.env.example index ba7290e83f..c06893878f 100644 --- a/docker/env/gafl_webapp.env.example +++ b/docker/env/gafl_webapp.env.example @@ -27,6 +27,7 @@ DEBUG=webapp:* # Tracking #ANALYTICS_PRIMARY_PROPERTY=G-DJMSHRPMW8 // this is the non-prod tracking update as required +#GTM_CONTAINER_ID=GTM-ABC1234 # Welsh language feature switch SHOW_WELSH_CONTENT=true diff --git a/packages/gafl-webapp-service/src/handlers/__tests__/__snapshots__/page-handler.spec.js.snap b/packages/gafl-webapp-service/src/handlers/__tests__/__snapshots__/page-handler.spec.js.snap index 6b58fda164..b1dd97c6e2 100644 --- a/packages/gafl-webapp-service/src/handlers/__tests__/__snapshots__/page-handler.spec.js.snap +++ b/packages/gafl-webapp-service/src/handlers/__tests__/__snapshots__/page-handler.spec.js.snap @@ -12,6 +12,7 @@ exports[`The page handler function sets the value of pageData with displayAnalyt "analyticsSelected": false, "backRef": null, "displayAnalytics": false, + "gtmContainerId": null, "mssgs": undefined, "pageLanguageSetToWelsh": false, "uri": Object { @@ -41,6 +42,7 @@ exports[`The page handler function sets the value of pageData with displayAnalyt "analyticsSelected": false, "backRef": null, "displayAnalytics": true, + "gtmContainerId": null, "mssgs": undefined, "pageLanguageSetToWelsh": false, "uri": Object { diff --git a/packages/gafl-webapp-service/src/handlers/__tests__/page-handler.spec.js b/packages/gafl-webapp-service/src/handlers/__tests__/page-handler.spec.js index 7411943aae..8e12a68638 100644 --- a/packages/gafl-webapp-service/src/handlers/__tests__/page-handler.spec.js +++ b/packages/gafl-webapp-service/src/handlers/__tests__/page-handler.spec.js @@ -156,6 +156,25 @@ describe('The page handler function', () => { expect(toolkit.view).toMatchSnapshot() }) + it('sets the value of gtmContainerId to the GTM_CONTAINER_ID env var', async () => { + const expectedValue = 'expected' + process.env.GTM_CONTAINER_ID = expectedValue + + const { get } = pageHandler('', 'view', '/next/page') + const toolkit = getMockToolkit() + + await get(getMockRequest(), toolkit) + + expect(toolkit.view).toHaveBeenCalledWith( + expect.any(String), + expect.objectContaining({ + gtmContainerId: expectedValue + }) + ) + + delete process.env.GTM_CONTAINER_ID + }) + it.each([ ['payment cancelled', PAYMENT_CANCELLED.uri], ['payment failed', PAYMENT_FAILED.uri], diff --git a/packages/gafl-webapp-service/src/handlers/page-handler.js b/packages/gafl-webapp-service/src/handlers/page-handler.js index a0f86ce43b..9f743dd3ee 100644 --- a/packages/gafl-webapp-service/src/handlers/page-handler.js +++ b/packages/gafl-webapp-service/src/handlers/page-handler.js @@ -130,6 +130,7 @@ export default (path, view, completion, getData) => ({ pageData.analyticsMessageDisplayed = analytics ? analytics[ANALYTICS.seenMessage] : false pageData.analyticsSelected = analytics ? analytics[ANALYTICS.selected] : false pageData.acceptedTracking = analytics ? analytics[ANALYTICS.acceptTracking] : false + pageData.gtmContainerId = process.env.GTM_CONTAINER_ID || null pageData.displayAnalytics = displayAnalytics(request) diff --git a/packages/gafl-webapp-service/src/pages/layout/layout.njk b/packages/gafl-webapp-service/src/pages/layout/layout.njk index 8ab18eb601..f2f5961e22 100644 --- a/packages/gafl-webapp-service/src/pages/layout/layout.njk +++ b/packages/gafl-webapp-service/src/pages/layout/layout.njk @@ -24,6 +24,9 @@ +{% if gtmContainerId %} + +{% endif %} {% endblock %} {% block header %} diff --git a/packages/gafl-webapp-service/src/routes/__tests__/misc-routes-handlers.spec.js b/packages/gafl-webapp-service/src/routes/__tests__/misc-routes-handlers.spec.js index 8ac694baf3..e36c688af1 100644 --- a/packages/gafl-webapp-service/src/routes/__tests__/misc-routes-handlers.spec.js +++ b/packages/gafl-webapp-service/src/routes/__tests__/misc-routes-handlers.spec.js @@ -205,6 +205,7 @@ describe('guidance page handlers', () => { expect(mockToolkit.view).toHaveBeenCalledWith(uri.NEW_PRICES.page, { altLang: ['that-locale'], + gtmContainerId: null, mssgs: catalog, uri: { back: mockUri @@ -262,6 +263,24 @@ describe('guidance page handlers', () => { }) ) }) + + it('sets the value of gtmContainerId to the GTM_CONTAINER_ID env var', async () => { + const expectedValue = 'expected' + process.env.GTM_CONTAINER_ID = expectedValue + + const toolkit = getMockToolkit() + const request = getMockRequest() + await pageHandler(request, toolkit) + + expect(toolkit.view).toHaveBeenCalledWith( + expect.any(String), + expect.objectContaining({ + gtmContainerId: expectedValue + }) + ) + + delete process.env.GTM_CONTAINER_ID + }) }) const getMockRequest = (i18nValues, search = '') => { diff --git a/packages/gafl-webapp-service/src/routes/misc-routes.js b/packages/gafl-webapp-service/src/routes/misc-routes.js index 3fa37ae8e4..4d53b0287b 100644 --- a/packages/gafl-webapp-service/src/routes/misc-routes.js +++ b/packages/gafl-webapp-service/src/routes/misc-routes.js @@ -26,16 +26,20 @@ import { addLanguageCodeToUri } from '../processors/uri-helper.js' import analytics from '../handlers/analytics-handler.js' import { welshEnabledAndApplied } from '../processors/page-language-helper.js' +const gtmContainerIdOrNull = () => process.env.GTM_CONTAINER_ID || null + const simpleView = view => ({ method: 'GET', path: view.uri, handler: async (request, h) => { const mssgs = request.i18n.getCatalog() const altLang = request.i18n.getLocales().filter(locale => locale !== request.i18n.getLocale()) + const gtmContainerId = gtmContainerIdOrNull() const pageLanguageSetToWelsh = welshEnabledAndApplied(request) return h.view(view.page, { mssgs, altLang, + gtmContainerId, pageLanguageSetToWelsh, uri: { back: addLanguageCodeToUri(request, CONTROLLER.uri) @@ -95,10 +99,12 @@ export default [ path: COOKIES.uri, handler: async (request, h) => { const altLang = request.i18n.getLocales().filter(locale => locale !== request.i18n.getLocale()) + const gtmContainerId = gtmContainerIdOrNull() const pageLanguageSetToWelsh = welshEnabledAndApplied(request) return h.view(COOKIES.page, { altLang, + gtmContainerId, pageLanguageSetToWelsh, mssgs: request.i18n.getCatalog(), cookie: { @@ -118,10 +124,12 @@ export default [ path: NEW_PRICES.uri, handler: async (request, h) => { const altLang = request.i18n.getLocales().filter(locale => locale !== request.i18n.getLocale()) + const gtmContainerId = gtmContainerIdOrNull() const pageLanguageSetToWelsh = welshEnabledAndApplied(request) return h.view(NEW_PRICES.page, { altLang, + gtmContainerId, pageLanguageSetToWelsh, mssgs: request.i18n.getCatalog(), uri: { From 7f1032714d336a461663b0141480f63cdd392d1f Mon Sep 17 00:00:00 2001 From: irisfaraway Date: Thu, 26 Oct 2023 12:50:21 +0100 Subject: [PATCH 3/5] Add GTM snippets --- .../gafl-webapp-service/src/pages/layout/layout.njk | 12 ++++++++++-- 1 file changed, 10 insertions(+), 2 deletions(-) diff --git a/packages/gafl-webapp-service/src/pages/layout/layout.njk b/packages/gafl-webapp-service/src/pages/layout/layout.njk index f2f5961e22..4263f8c487 100644 --- a/packages/gafl-webapp-service/src/pages/layout/layout.njk +++ b/packages/gafl-webapp-service/src/pages/layout/layout.njk @@ -25,7 +25,9 @@ {% if gtmContainerId %} - + + + {% endif %} {% endblock %} @@ -173,7 +175,13 @@ {% endif %} {% endblock %} -{% block bodyStart %}{% endblock %} +{% block bodyStart %} +{% if gtmContainerId %} + + + +{% endif %} +{% endblock %} {% set footerHtml %}
From f373d0b98f0ff989e76225727ad7bc970c240c82 Mon Sep 17 00:00:00 2001 From: irisfaraway Date: Thu, 2 Nov 2023 14:17:06 +0000 Subject: [PATCH 4/5] Default to false instead of null --- .../__tests__/__snapshots__/page-handler.spec.js.snap | 4 ++-- packages/gafl-webapp-service/src/handlers/page-handler.js | 2 +- .../src/routes/__tests__/misc-routes-handlers.spec.js | 2 +- packages/gafl-webapp-service/src/routes/misc-routes.js | 2 +- 4 files changed, 5 insertions(+), 5 deletions(-) diff --git a/packages/gafl-webapp-service/src/handlers/__tests__/__snapshots__/page-handler.spec.js.snap b/packages/gafl-webapp-service/src/handlers/__tests__/__snapshots__/page-handler.spec.js.snap index b1dd97c6e2..c94703341c 100644 --- a/packages/gafl-webapp-service/src/handlers/__tests__/__snapshots__/page-handler.spec.js.snap +++ b/packages/gafl-webapp-service/src/handlers/__tests__/__snapshots__/page-handler.spec.js.snap @@ -12,7 +12,7 @@ exports[`The page handler function sets the value of pageData with displayAnalyt "analyticsSelected": false, "backRef": null, "displayAnalytics": false, - "gtmContainerId": null, + "gtmContainerId": false, "mssgs": undefined, "pageLanguageSetToWelsh": false, "uri": Object { @@ -42,7 +42,7 @@ exports[`The page handler function sets the value of pageData with displayAnalyt "analyticsSelected": false, "backRef": null, "displayAnalytics": true, - "gtmContainerId": null, + "gtmContainerId": false, "mssgs": undefined, "pageLanguageSetToWelsh": false, "uri": Object { diff --git a/packages/gafl-webapp-service/src/handlers/page-handler.js b/packages/gafl-webapp-service/src/handlers/page-handler.js index 9f743dd3ee..bfc58b3182 100644 --- a/packages/gafl-webapp-service/src/handlers/page-handler.js +++ b/packages/gafl-webapp-service/src/handlers/page-handler.js @@ -130,7 +130,7 @@ export default (path, view, completion, getData) => ({ pageData.analyticsMessageDisplayed = analytics ? analytics[ANALYTICS.seenMessage] : false pageData.analyticsSelected = analytics ? analytics[ANALYTICS.selected] : false pageData.acceptedTracking = analytics ? analytics[ANALYTICS.acceptTracking] : false - pageData.gtmContainerId = process.env.GTM_CONTAINER_ID || null + pageData.gtmContainerId = process.env.GTM_CONTAINER_ID || false pageData.displayAnalytics = displayAnalytics(request) diff --git a/packages/gafl-webapp-service/src/routes/__tests__/misc-routes-handlers.spec.js b/packages/gafl-webapp-service/src/routes/__tests__/misc-routes-handlers.spec.js index e36c688af1..846eaa7196 100644 --- a/packages/gafl-webapp-service/src/routes/__tests__/misc-routes-handlers.spec.js +++ b/packages/gafl-webapp-service/src/routes/__tests__/misc-routes-handlers.spec.js @@ -205,7 +205,7 @@ describe('guidance page handlers', () => { expect(mockToolkit.view).toHaveBeenCalledWith(uri.NEW_PRICES.page, { altLang: ['that-locale'], - gtmContainerId: null, + gtmContainerId: false, mssgs: catalog, uri: { back: mockUri diff --git a/packages/gafl-webapp-service/src/routes/misc-routes.js b/packages/gafl-webapp-service/src/routes/misc-routes.js index 4d53b0287b..40bd95e71c 100644 --- a/packages/gafl-webapp-service/src/routes/misc-routes.js +++ b/packages/gafl-webapp-service/src/routes/misc-routes.js @@ -26,7 +26,7 @@ import { addLanguageCodeToUri } from '../processors/uri-helper.js' import analytics from '../handlers/analytics-handler.js' import { welshEnabledAndApplied } from '../processors/page-language-helper.js' -const gtmContainerIdOrNull = () => process.env.GTM_CONTAINER_ID || null +const gtmContainerIdOrNull = () => process.env.GTM_CONTAINER_ID || false const simpleView = view => ({ method: 'GET', From 234ad291f88336f6c2455f977e42e6de02860657 Mon Sep 17 00:00:00 2001 From: irisfaraway Date: Thu, 2 Nov 2023 14:40:21 +0000 Subject: [PATCH 5/5] Log container ID status on startup --- .../src/__tests__/server.spec.js | 22 +++++++++++++++++++ packages/gafl-webapp-service/src/server.js | 10 +++++++++ 2 files changed, 32 insertions(+) diff --git a/packages/gafl-webapp-service/src/__tests__/server.spec.js b/packages/gafl-webapp-service/src/__tests__/server.spec.js index d7ebdee57a..d5e7c473a2 100644 --- a/packages/gafl-webapp-service/src/__tests__/server.spec.js +++ b/packages/gafl-webapp-service/src/__tests__/server.spec.js @@ -150,6 +150,28 @@ describe('The server', () => { expect(request.response.source.context._uri[element]).toEqual(expect.stringMatching(regexMatch)) }) + describe('logGtmConfig', () => { + it('should log the gtmContainerId value if it is set', async () => { + const expectedId = 'GTM-ABC1234' + process.env.GTM_CONTAINER_ID = expectedId + const consoleLogSpy = jest.spyOn(console, 'log').mockImplementation(jest.fn()) + createServer(catboxOptions) + await init() + expect(consoleLogSpy).toHaveBeenCalledWith(`gtmContainerId is set to ${expectedId}`) + await server.stop() + delete process.env.GTM_CONTAINER_ID + }) + + it('should log that gtmContainerId is not set if it is not set', async () => { + delete process.env.GTM_CONTAINER_ID + const consoleLogSpy = jest.spyOn(console, 'log').mockImplementation(jest.fn()) + createServer(catboxOptions) + await init() + expect(consoleLogSpy).toHaveBeenCalledWith('gtmContainerId is not set') + await server.stop() + }) + }) + const getSampleRequest = (overrides = {}) => ({ auth: {}, method: 'get', diff --git a/packages/gafl-webapp-service/src/server.js b/packages/gafl-webapp-service/src/server.js index 90896cb472..c8e7527d6f 100644 --- a/packages/gafl-webapp-service/src/server.js +++ b/packages/gafl-webapp-service/src/server.js @@ -109,6 +109,14 @@ const addDefaultHeaders = (request, h) => { return h.continue } +const logGtmConfig = gtmContainerId => { + if (gtmContainerId) { + console.log(`gtmContainerId is set to ${gtmContainerId}`) + } else { + console.log('gtmContainerId is not set') + } +} + const init = async () => { await server.register(getPlugins()) const viewPaths = [...new Set(find.fileSync(/\.njk$/, path.join(Dirname, './src/pages')).map(f => path.dirname(f)))] @@ -194,6 +202,8 @@ const init = async () => { server.route(routes) await server.start() + logGtmConfig(process.env.GTM_CONTAINER_ID) + console.log('Server running on %s', server.info.uri) }