From 991683049864947366e3ea36ff6c025a64710bc0 Mon Sep 17 00:00:00 2001 From: AshGDS <8880610+AshGDS@users.noreply.github.com> Date: Thu, 24 Nov 2022 10:39:48 +0000 Subject: [PATCH] Rename data-ga4 to data-ga4-event --- .../components/step-by-step-nav.js | 6 +++--- .../components/_step_by_step_nav.html.erb | 2 +- .../components/docs/step_by_step_nav.yml | 4 ++-- 3 files changed, 6 insertions(+), 6 deletions(-) diff --git a/app/assets/javascripts/govuk_publishing_components/components/step-by-step-nav.js b/app/assets/javascripts/govuk_publishing_components/components/step-by-step-nav.js index 472a2fdd49..4a58dea4b5 100644 --- a/app/assets/javascripts/govuk_publishing_components/components/step-by-step-nav.js +++ b/app/assets/javascripts/govuk_publishing_components/components/step-by-step-nav.js @@ -81,7 +81,7 @@ window.GOVUK.Modules = window.GOVUK.Modules || {}; this.$module.showOrHideAllButton = this.$module.querySelectorAll('.js-step-controls-button')[0] if (showAllGa4Data) { - this.$module.showOrHideAllButton.setAttribute('data-ga4', showAllGa4Data) + this.$module.showOrHideAllButton.setAttribute('data-ga4-event', showAllGa4Data) this.$module.showOrHideAllButton.setAttribute('data-ga4-expandable', '') // Enables tracking of aria-expanded in ga4-event-tracker. this.$module.removeAttribute('data-ga4-show-all-attributes') // Remove it to prevent repetition. The JSON lives there temporarily until the HTML it is needed on is rendered by this JS. } @@ -176,9 +176,9 @@ window.GOVUK.Modules = window.GOVUK.Modules || {}; var title = thisel.querySelectorAll('.js-step-title')[0] var contentId = thisel.querySelectorAll('.js-panel')[0].getAttribute('id') var titleText = title.textContent || title.innerText // IE8 fallback - var ga4Data = title.getAttribute('data-ga4') + var ga4Data = title.getAttribute('data-ga4-event') - ga4Data = ga4Data ? "data-ga4-expandable data-ga4='" + ga4Data + "'" : '' // Construct GA4 data-attributes for ga4-event-tracker. + ga4Data = ga4Data ? "data-ga4-expandable data-ga4-event='" + ga4Data + "'" : '' // Construct GA4 data-attributes for ga4-event-tracker. title.outerHTML = '' + diff --git a/app/views/govuk_publishing_components/components/_step_by_step_nav.html.erb b/app/views/govuk_publishing_components/components/_step_by_step_nav.html.erb index 1b70154059..472cb245fb 100644 --- a/app/views/govuk_publishing_components/components/_step_by_step_nav.html.erb +++ b/app/views/govuk_publishing_components/components/_step_by_step_nav.html.erb @@ -83,7 +83,7 @@ index: step_index + 1, index_total: steps.length }.to_json %> - data-ga4="<%= ga4_data %>" + data-ga4-event="<%= ga4_data %>" <% end %> > <%= step[:title] %> diff --git a/app/views/govuk_publishing_components/components/docs/step_by_step_nav.yml b/app/views/govuk_publishing_components/components/docs/step_by_step_nav.yml index 8eebd10cd3..08c7bcec4c 100644 --- a/app/views/govuk_publishing_components/components/docs/step_by_step_nav.yml +++ b/app/views/govuk_publishing_components/components/docs/step_by_step_nav.yml @@ -75,9 +75,9 @@ examples: with_google_analytics_4_tracking: description: | The ga4_tracking boolean allows you to add Google Analytics 4 (GA4) tracking to your component. - Setting this to true will add a data-ga4 attribute and data-ga4-expandable attribute to the "Show all steps" button, and each clickable Step heading. + Setting this to true will add a data-ga4-event attribute and data-ga4-expandable attribute to the "Show all steps" button, and each clickable Step heading. GA4 will then track these elements when they are expanded or collapsed. - data-ga4 contains a JSON with event data relevant to our tracking. data-ga4-expandable enables the value of aria-expanded to be captured. + data-ga4-event contains a JSON with event data relevant to our tracking. data-ga4-expandable enables the value of aria-expanded to be captured. See the ga4-event-tracker docs for more information. data: ga4_tracking: true