Skip to content

Commit

Permalink
PXBF-1548-update-gtm-e2e-tests: comment test suite for dataLayer values
Browse files Browse the repository at this point in the history
  • Loading branch information
@scottqueen-bixal
scottqueen-bixal committed Jul 23, 2024
1 parent b19d4b5 commit ec86afa
Showing 1 changed file with 22 additions and 52 deletions.
74 changes: 22 additions & 52 deletions benefit-finder/cypress/e2e/storybook/dataLayer.cy.js
View file
Original file line number Diff line number Diff line change
Expand Up @@ -6,16 +6,16 @@ import * as EN_LOCALE_DATA from '../../../../benefit-finder/src/shared/locales/e
import * as BENEFITS_ELIBILITY_DATA from '../../fixtures/benefits-eligibility.json'
import content from '../../../src/shared/api/mock-data/current.json'

// establish some common data points from our mock values and scenarios
const { intro, lifeEventSection, resultsView, openAllBenefitAccordions } =
dataLayerUtils.dataLayerStructure

const { lifeEventForm } = content.data

const selectedData = BENEFITS_ELIBILITY_DATA.scenario_1_covid.en.param
const enResults = BENEFITS_ELIBILITY_DATA.scenario_1_covid.en.results
const zero_benefit_view = BENEFITS_ELIBILITY_DATA.zero_benefit_view.en.results
const scenario = utils.encodeURIFromObject(selectedData)

// calculate out elibibility counts we expect for our event values
const eligibilityCount = {
eligibleBenefitCount: {
number: enResults.eligible.length,
Expand Down Expand Up @@ -58,6 +58,7 @@ const zeroBenefitsEligibilityCount = {
},
}

// create an object for each of our dataLayer assertions
const dataLayerValueIntro = {
event: intro.event,
bfData: {
Expand Down Expand Up @@ -155,6 +156,7 @@ const dataLayerValueZeroResultsViewNotEligible = {
},
}

// create a combined dataLayer assertions array, this is what we might expect to see for a user journey value that triggers all the events expected
const dataLayerValues = [
dataLayerValueIntro,
dataLayerValueFormStepOne,
Expand All @@ -171,9 +173,7 @@ const dataLayerValues = [

const removeID = item => delete item['gtm.uniqueEventId']

// confirm full user journey
// no eligible results events

// check to make sure our data layer exists
describe('Basic Data Layer Checks', () => {
it('has a dataLayer and loads GTM', () => {
cy.visit(utils.storybookUri)
Expand Down Expand Up @@ -202,7 +202,6 @@ describe('Calls to Google Analytics Object', function () {
// get the last pushed event
const ev = { ...window.dataLayer[window.dataLayer.length - 1] }
removeID(ev)
// delete ev['gtm.uniqueEventId']

expect(ev).to.deep.equal(dataLayerValueIntro)
})
Expand All @@ -222,7 +221,6 @@ describe('Calls to Google Analytics Object', function () {
.then(() => {
// get the last pushed event
const ev = { ...window.dataLayer[window.dataLayer.length - 1] }
// delete ev['gtm.uniqueEventId']
removeID(ev)

expect(ev).to.deep.equal(dataLayerValueFormStepOne)
Expand All @@ -243,7 +241,6 @@ describe('Calls to Google Analytics Object', function () {
.then(() => {
// get the last pushed event
const ev = { ...window.dataLayer[window.dataLayer.length - 1] }
// delete ev['gtm.uniqueEventId']
removeID(ev)

expect(ev).to.deep.equal(dataLayerValueFormStepOne)
Expand Down Expand Up @@ -276,15 +273,13 @@ describe('Calls to Google Analytics Object', function () {
.contains(EN_LOCALE_DATA.buttonGroup[1].value)
.click()
.then(() => {
// get the last pushed event
// get all the events in our layer that matches the event value
const ev = [
...window.dataLayer.filter(
x => x?.event === dataLayerValueFormStepTwo.event
),
]

removeID(ev[2])
// delete ev[2]['gtm.uniqueEventId']

expect(ev[2]).to.deep.equal(dataLayerValueFormStepTwo)
})
Expand All @@ -305,7 +300,6 @@ describe('Calls to Google Analytics Object', function () {
.then(() => {
// get the last pushed event
const ev = { ...window.dataLayer[window.dataLayer.length - 1] }
// delete ev['gtm.uniqueEventId']
removeID(ev)

expect(ev).to.deep.equal(dataLayerValueFormStepOne)
Expand Down Expand Up @@ -338,14 +332,12 @@ describe('Calls to Google Analytics Object', function () {
.contains(EN_LOCALE_DATA.buttonGroup[1].value)
.click()
.then(() => {
// get the last pushed event
// get all the events in our layer that matches the event value
const ev = [
...window.dataLayer.filter(
x => x?.event === dataLayerValueFormStepTwo.event
),
]

// delete ev[2]['gtm.uniqueEventId']
removeID(ev[2])

expect(ev[2]).to.deep.equal(dataLayerValueFormStepTwo)
Expand All @@ -363,13 +355,12 @@ describe('Calls to Google Analytics Object', function () {
.contains(EN_LOCALE_DATA.buttonGroup[1].value)
.click()
.then(() => {
// get all the events in our layer that matches the event value
const ev = [
...window.dataLayer.filter(
x => x?.event === dataLayerValueFormCompletionModal.event
),
]

// delete ev[3]['gtm.uniqueEventId']
removeID(ev[3])

expect(ev[3]).to.deep.equal(dataLayerValueFormCompletionModal)
Expand All @@ -396,7 +387,7 @@ describe('Calls to Google Analytics Object', function () {
// we wait for the last event to fire
// eslint-disable-next-line cypress/no-unnecessary-waiting
cy.wait(100).then(() => {
// check last page change event
// get all the events in our layer that matches the event value
const ev = {
...window.dataLayer.filter(
x => x?.event === dataLayerValueResultsViewEligible.event
Expand Down Expand Up @@ -428,13 +419,12 @@ describe('Calls to Google Analytics Object', function () {
// we wait for the last event to fire
// eslint-disable-next-line cypress/no-unnecessary-waiting
cy.wait(100).then(() => {
// check last page change event
// get all the events in our layer that matches the event value
const ev = [
...window.dataLayer.filter(
x => x?.event === dataLayerValueAccordionOpen.event
),
]
// delete ev[0]['gtm.uniqueEventId']
removeID(ev[0])

expect(ev[0]).to.deep.equal(dataLayerValueAccordionOpen)
Expand All @@ -461,13 +451,12 @@ describe('Calls to Google Analytics Object', function () {
// we wait for the last event to fire
// eslint-disable-next-line cypress/no-unnecessary-waiting
cy.wait(100).then(() => {
// check last page change event
// get all the events in our layer that matches the event value
const ev = [
...window.dataLayer.filter(
x => x?.event === dataLayerValueAccordionOpen.event
),
]
// delete ev[0]['gtm.uniqueEventId']
removeID(ev[0])

expect(ev[0]).to.deep.equal(dataLayerValueAccordionOpen)
Expand All @@ -478,13 +467,14 @@ describe('Calls to Google Analytics Object', function () {
.invoke('removeAttr', 'href')
.click()
.then(() => {
// get all the events in our layer that matches the event value
const ev = [
...window.dataLayer.filter(
x => x?.event === dataLayerValueBenefitLink.event
),
]
// delete ev[0]['gtm.uniqueEventId']
removeID(ev[0])

expect(ev[0]).to.deep.equal(dataLayerValueBenefitLink)
})
})
Expand Down Expand Up @@ -514,13 +504,12 @@ describe('Calls to Google Analytics Object', function () {
// we wait for the last event to fire
// eslint-disable-next-line cypress/no-unnecessary-waiting
cy.wait(100).then(() => {
// check last page change event
// get all the events in our layer that matches the event value
const ev = [
...window.dataLayer.filter(
x => x?.event === dataLayerValueResultsViewNotEligible.event
),
]
// delete ev[1]['gtm.uniqueEventId']
removeID(ev[1])

expect(ev[1]).to.deep.equal(dataLayerValueResultsViewNotEligible)
Expand All @@ -542,7 +531,6 @@ describe('Calls to Google Analytics Object', function () {
.then(() => {
// get the last pushed event
const ev = { ...window.dataLayer[window.dataLayer.length - 1] }
// delete ev['gtm.uniqueEventId']
removeID(ev)

expect(ev).to.deep.equal(dataLayerValueFormStepOne)
Expand Down Expand Up @@ -575,14 +563,12 @@ describe('Calls to Google Analytics Object', function () {
.contains(EN_LOCALE_DATA.buttonGroup[1].value)
.click()
.then(() => {
// get the last pushed event
// get all the events in our layer that matches the event value
const ev = [
...window.dataLayer.filter(
x => x?.event === dataLayerValueFormStepTwo.event
),
]

// delete ev[2]['gtm.uniqueEventId']
removeID(ev[2])

expect(ev[2]).to.deep.equal(dataLayerValueFormStepTwo)
Expand All @@ -600,13 +586,12 @@ describe('Calls to Google Analytics Object', function () {
.contains(EN_LOCALE_DATA.buttonGroup[1].value)
.click()
.then(() => {
// get all the events in our layer that matches the event value
const ev = [
...window.dataLayer.filter(
x => x?.event === dataLayerValueFormCompletionModal.event
),
]

// delete ev[3]['gtm.uniqueEventId']
removeID(ev[3])

expect(ev[3]).to.deep.equal(dataLayerValueFormCompletionModal)
Expand All @@ -616,13 +601,12 @@ describe('Calls to Google Analytics Object', function () {
.contains('Review selections')
.click()
.then(() => {
// get all the events in our layer that matches the event value
const ev = [
...window.dataLayer.filter(
x => x?.event === dataLayerValueVerifySecletions.event
),
]

// delete ev[4]['gtm.uniqueEventId']
removeID(ev[4])

expect(ev[4]).to.deep.equal(
Expand Down Expand Up @@ -651,8 +635,6 @@ describe('Calls to Google Analytics Object', function () {
x => x?.event === dataLayerValueOpenAllAccordions.event
),
]

// delete ev[0]['gtm.uniqueEventId']
removeID(ev[0])

expect(ev[0]).to.deep.equal(dataLayerValueOpenAllAccordions)
Expand All @@ -662,15 +644,12 @@ describe('Calls to Google Analytics Object', function () {
.expandAll()
.click()
.then(() => {
// check last page change event
// get all the events in our layer that matches the event value
const ev = [
...window.dataLayer.filter(
x => x?.event === dataLayerValueOpenAllAccordions.event
),
]

// we ignore dedup here so there can be multiple fires
// delete ev[1]['gtm.uniqueEventId']
removeID(ev[1])

expect(ev[1].bfData.accordionsOpen).to.equal(
Expand All @@ -693,7 +672,6 @@ describe('Calls to Google Analytics Object', function () {
.then(() => {
// get the last pushed event
const ev = { ...window.dataLayer[window.dataLayer.length - 1] }
// delete ev['gtm.uniqueEventId']
removeID(ev)

expect(ev).to.deep.equal(dataLayerValueFormStepOne)
Expand Down Expand Up @@ -726,14 +704,12 @@ describe('Calls to Google Analytics Object', function () {
.contains(EN_LOCALE_DATA.buttonGroup[1].value)
.click()
.then(() => {
// get the last pushed event
// get all the events in our layer that matches the event value
const ev = [
...window.dataLayer.filter(
x => x?.event === dataLayerValueFormStepTwo.event
),
]

// delete ev[2]['gtm.uniqueEventId']
removeID(ev[2])

expect(ev[2]).to.deep.equal(dataLayerValueFormStepTwo)
Expand All @@ -756,8 +732,6 @@ describe('Calls to Google Analytics Object', function () {
x => x?.event === dataLayerValueFormCompletionModal.event
),
]

// delete ev[3]['gtm.uniqueEventId']
removeID(ev[3])

expect(ev[3]).to.deep.equal(dataLayerValueFormCompletionModal)
Expand All @@ -767,13 +741,12 @@ describe('Calls to Google Analytics Object', function () {
.contains('Review selections')
.click()
.then(() => {
// get all the events in our layer that matches the event value
const ev = [
...window.dataLayer.filter(
x => x?.event === dataLayerValueVerifySecletions.event
),
]

// delete ev[4]['gtm.uniqueEventId']
removeID(ev[4])

expect(ev[4]).to.deep.equal(
Expand All @@ -785,16 +758,14 @@ describe('Calls to Google Analytics Object', function () {
.contains(EN_LOCALE_DATA.buttonGroup[1].value)
.click()
.then(() => {
// cy.wait(200)
// get all the events in our layer that matches the event value
const ev = [
...window.dataLayer.filter(
x =>
x?.event ===
dataLayerValueZeroResultsViewEligible.event
),
]

// delete ev[5]['gtm.uniqueEventId']
removeID(ev[5])

expect(ev[5]).to.deep.equal(
Expand All @@ -805,15 +776,14 @@ describe('Calls to Google Analytics Object', function () {
.seeAllBenefitsButton()
.click()
.then(() => {
// get all the events in our layer that matches the event value
const ev = [
...window.dataLayer.filter(
x =>
x?.event ===
dataLayerValueZeroResultsViewNotEligible.event
),
]

delete ev[6]['gtm.uniqueEventId']
removeID(ev[6])

expect(ev[6]).to.deep.equal(
Expand Down

0 comments on commit ec86afa

Please sign in to comment.