diff --git a/azure-pipelines.yml b/azure-pipelines.yml index 0e5753e06..d2a61a5d3 100644 --- a/azure-pipelines.yml +++ b/azure-pipelines.yml @@ -1,303 +1,305 @@ trigger: - branches: - include: [develop, release/*] - paths: - exclude: - - deployment/* - include: - - "*" + branches: + include: [develop, release/*] + paths: + exclude: + - deployment/* + include: + - "*" pr: - branches: - include: ["*"] - paths: - exclude: - - deployment/* - include: - - "*" + branches: + include: ["*"] + paths: + exclude: + - deployment/* + include: + - "*" resources: - containers: - - container: node - image: packagerepository.sagaws.net:8082/safelite/node-build:15 - - container: awscli - image: packagerepository.sagaws.net:8082/safelite/awscli2-build:3.9 - - container: prettier-node - image: packagerepository.sagaws.net:8082/safelite/prettier-node-build:18 - repositories: - - repository: AzureDevOps - type: github - name: Safelite/AzureDevOps - endpoint: Safelite - ref: refs/tags/t5.5.40 + containers: + - container: node + image: packagerepository.sagaws.net:8082/safelite/node-build:15 + - container: awscli + image: packagerepository.sagaws.net:8082/safelite/awscli2-build:3.9 + - container: prettier-node + image: packagerepository.sagaws.net:8082/safelite/prettier-node-build:18 + repositories: + - repository: AzureDevOps + type: github + name: Safelite/AzureDevOps + endpoint: Safelite + ref: refs/tags/t5.5.40 variables: - - group: Digital-Infrastructure - - group: FixMyGlass-BuildBranches + - group: Digital-Infrastructure + - group: FixMyGlass-BuildBranches stages: - # PR's - - ${{ if eq(variables['Build.Reason'], 'PullRequest') }}: - - stage: TestFormat - displayName: Test Code Format - jobs: - - job: checkFormatting - displayName: Check formatting - container: prettier-node - steps: - - bash: prettier --check "$(Build.SourcesDirectory)/src/**/*.(js|vue)" - displayName: Run Prettier check - - - stage: TestPr - displayName: Run Unit Tests For PullRequest - jobs: - - template: templates/digital/vue-jest-run-unit-tests.yml@AzureDevOps - parameters: - nodeContainer: node - npmLocation: $(Build.SourcesDirectory) - testResultsFile: junit.xml - summaryFileLocation: $(Build.SourcesDirectory)/coverage/cobertura-coverage.xml - - ${{ else }}: - # Dev Build/Deploy - - stage: Dev - condition: eq(variables['Build.SourceBranch'], variables['dev-branch'] ) - variables: - - group: FixMyGlassDev - jobs: - - deployment: devBuildDeployment - displayName: Build and Deploy FMG - Dev - environment: digitalCloud-dev - container: node - workspace: - clean: all - strategy: - runOnce: - deploy: + # PR's + - ${{ if eq(variables['Build.Reason'], 'PullRequest') }}: + - stage: TestFormat + displayName: Test Code Format + jobs: + - job: checkFormatting + displayName: Check formatting + container: prettier-node steps: - - checkout: self - clean: true - - template: templates/digital/step-build-vue.yml@AzureDevOps - parameters: - buildOutputDir: dist - environment: Dev - - template: templates/digital/step-deploy-vue.yml@AzureDevOps - parameters: - artifactName: vueDistDev - awsProfile: $(devDeploymentProfile) - outputPath: /fmg/ - deployBuckets: - safelite-dev-fmg-us-east-1: - clearFolder: true - deployFolder: "" - region: us-east-1 - safelite-dev-fmg-us-east-2: - clearFolder: true - deployFolder: "" - region: us-east-2 - appDeployVariables: - __VUE_APP_CONSUMER_CF_DISTRO__: $(__VUE_APP_CONSUMER_CF_DISTRO__) - __VUE_APP_GOOGLE_PLACES_API_KEY__: $(__VUE_APP_GOOGLE_PLACES_API_KEY__) - __VUE_APP_HERITAGE_FUNNEL__: $(__VUE_APP_HERITAGE_FUNNEL__) - __VUE_APP_SAFELITE_HOP___: $(__VUE_APP_SAFELITE_HOP__) - __VUE_APP_PAYPAL_SUCCESS_URL__: $(__VUE_APP_PAYPAL_SUCCESS_URL__) - __VUE_APP_PAYPAL_CANCEL_URL__: $(__VUE_APP_PAYPAL_CANCEL_URL__) - __VUE_APP_CURRENT_ENVIRONMENT__: $(__VUE_APP_CURRENT_ENVIRONMENT__) - indexDeployVariables: - __VUE_APP_GOOGLE_TAG_MANAGER_SCRIPT_BODY__: $(__VUE_APP_GOOGLE_TAG_MANAGER_SCRIPT_BODY__) - __VUE_APP_GOOGLE_TAG_MANAGER_NOSCRIPT_FRAME_SRC__: $(__VUE_APP_GOOGLE_TAG_MANAGER_NOSCRIPT_FRAME_SRC__) - - template: templates/digital/invalidate-cloudfront-cache.yml@AzureDevOps - parameters: - awsCliContainer: awscli - distributionId: $(apiCfDistributionId) - paths: /* - awsProfile: $(devDeploymentProfile) - - template: templates/digital/invalidate-cloudfront-cache.yml@AzureDevOps - parameters: - awsCliContainer: awscli - distributionId: $(cfDistributionId) - paths: /fmg/* - awsProfile: $(devDeploymentProfile) + - bash: prettier --check "$(Build.SourcesDirectory)/src/**/*.(js|vue)" + displayName: Run Prettier check - # Test Build/Deploy - - stage: Test - condition: eq(variables['Build.SourceBranch'], variables['test-branch'] ) - variables: - - group: FixMyGlassTest - jobs: - - deployment: testBuildDeployment - displayName: Build and Deploy FMG - Test - environment: NoApproval-All - container: node - workspace: - clean: all - strategy: - runOnce: - deploy: - steps: - - checkout: self - clean: true - - template: templates/digital/step-build-vue.yml@AzureDevOps - parameters: - buildOutputDir: dist - environment: Test - - template: templates/digital/step-deploy-vue.yml@AzureDevOps - parameters: - artifactName: vueDistTest - awsProfile: $(sysDeploymentProfile) - outputPath: /fmg/ - deployBuckets: - safelite-sys-fmg-us-east-1: - clearFolder: true - deployFolder: "" - region: us-east-1 - safelite-sys-fmg-us-east-2: - clearFolder: true - deployFolder: "" - region: us-east-2 - appDeployVariables: - __VUE_APP_CONSUMER_CF_DISTRO__: $(__VUE_APP_CONSUMER_CF_DISTRO__) - __VUE_APP_GOOGLE_PLACES_API_KEY__: $(__VUE_APP_GOOGLE_PLACES_API_KEY__) - __VUE_APP_HERITAGE_FUNNEL__: $(__VUE_APP_HERITAGE_FUNNEL__) - __VUE_APP_SAFELITE_HOP___: $(__VUE_APP_SAFELITE_HOP__) - __VUE_APP_PAYPAL_SUCCESS_URL__: $(__VUE_APP_PAYPAL_SUCCESS_URL__) - __VUE_APP_PAYPAL_CANCEL_URL__: $(__VUE_APP_PAYPAL_CANCEL_URL__) - __VUE_APP_CURRENT_ENVIRONMENT__: $(__VUE_APP_CURRENT_ENVIRONMENT__) - indexDeployVariables: - __VUE_APP_GOOGLE_TAG_MANAGER_SCRIPT_BODY__: $(__VUE_APP_GOOGLE_TAG_MANAGER_SCRIPT_BODY__) - __VUE_APP_GOOGLE_TAG_MANAGER_NOSCRIPT_FRAME_SRC__: $(__VUE_APP_GOOGLE_TAG_MANAGER_NOSCRIPT_FRAME_SRC__) - - template: templates/digital/invalidate-cloudfront-cache.yml@AzureDevOps - parameters: - awsCliContainer: awscli - distributionId: $(apiCfDistributionId) - paths: /* - awsProfile: $(sysDeploymentProfile) - - template: templates/digital/invalidate-cloudfront-cache.yml@AzureDevOps - parameters: - awsCliContainer: awscli - distributionId: $(cfDistributionId) - paths: /fmg/* - awsProfile: $(sysDeploymentProfile) - - # QA Build/Deploy - - stage: Qa - condition: eq(variables['Build.SourceBranch'], variables['qa-branch'] ) - variables: - - group: FixMyGlassQa - jobs: - - deployment: qaBuildDeployment - displayName: Build and Deploy FMG - QA - environment: NoApproval-All - container: node - workspace: - clean: all - strategy: - runOnce: - deploy: - steps: - - checkout: self - clean: true - - template: templates/digital/step-build-vue.yml@AzureDevOps - parameters: - buildOutputDir: dist - environment: Qa - - template: templates/digital/step-deploy-vue.yml@AzureDevOps - parameters: - artifactName: vueDistQa - awsProfile: $(qaDeploymentProfile) - outputPath: /fmg/ - deployBuckets: - safelite-qa-fmg-us-east-1: - clearFolder: true - deployFolder: "" - region: us-east-1 - safelite-qa-fmg-us-east-2: - clearFolder: true - deployFolder: "" - region: us-east-2 - appDeployVariables: - __VUE_APP_CONSUMER_CF_DISTRO__: $(__VUE_APP_CONSUMER_CF_DISTRO__) - __VUE_APP_GOOGLE_PLACES_API_KEY__: $(__VUE_APP_GOOGLE_PLACES_API_KEY__) - __VUE_APP_HERITAGE_FUNNEL__: $(__VUE_APP_HERITAGE_FUNNEL__) - __VUE_APP_SAFELITE_HOP___: $(__VUE_APP_SAFELITE_HOP__) - __VUE_APP_PAYPAL_SUCCESS_URL__: $(__VUE_APP_PAYPAL_SUCCESS_URL__) - __VUE_APP_PAYPAL_CANCEL_URL__: $(__VUE_APP_PAYPAL_CANCEL_URL__) - __VUE_APP_CURRENT_ENVIRONMENT__: $(__VUE_APP_CURRENT_ENVIRONMENT__) - indexDeployVariables: - __VUE_APP_GOOGLE_TAG_MANAGER_SCRIPT_BODY__: $(__VUE_APP_GOOGLE_TAG_MANAGER_SCRIPT_BODY__) - __VUE_APP_GOOGLE_TAG_MANAGER_NOSCRIPT_FRAME_SRC__: $(__VUE_APP_GOOGLE_TAG_MANAGER_NOSCRIPT_FRAME_SRC__) - - template: templates/digital/invalidate-cloudfront-cache.yml@AzureDevOps - parameters: - awsCliContainer: awscli - distributionId: $(apiCfDistributionId) - paths: /* - awsProfile: $(qaDeploymentProfile) - - template: templates/digital/invalidate-cloudfront-cache.yml@AzureDevOps - parameters: - awsCliContainer: awscli - distributionId: $(cfDistributionId) - paths: /fmg/* - awsProfile: $(qaDeploymentProfile) + - stage: TestPr + displayName: Run Unit Tests For PullRequest + jobs: + - template: templates/digital/vue-jest-run-unit-tests.yml@AzureDevOps + parameters: + nodeContainer: node + npmLocation: $(Build.SourcesDirectory) + testResultsFile: junit.xml + summaryFileLocation: $(Build.SourcesDirectory)/coverage/cobertura-coverage.xml + - ${{ else }}: + # Dev Build/Deploy + - stage: Dev + condition: eq(variables['Build.SourceBranch'], variables['dev-branch'] ) + variables: + - group: FixMyGlassDev + jobs: + - deployment: devBuildDeployment + displayName: Build and Deploy FMG - Dev + environment: digitalCloud-dev + container: node + workspace: + clean: all + strategy: + runOnce: + deploy: + steps: + - checkout: self + clean: true + - template: templates/digital/step-build-vue.yml@AzureDevOps + parameters: + buildOutputDir: dist + environment: Dev + - template: templates/digital/step-deploy-vue.yml@AzureDevOps + parameters: + artifactName: vueDistDev + awsProfile: $(devDeploymentProfile) + outputPath: /fmg/ + deployBuckets: + safelite-dev-fmg-us-east-1: + clearFolder: true + deployFolder: "" + region: us-east-1 + safelite-dev-fmg-us-east-2: + clearFolder: true + deployFolder: "" + region: us-east-2 + appDeployVariables: + __VUE_APP_CONSUMER_CF_DISTRO__: $(__VUE_APP_CONSUMER_CF_DISTRO__) + __VUE_APP_GOOGLE_PLACES_API_KEY__: $(__VUE_APP_GOOGLE_PLACES_API_KEY__) + __VUE_APP_HERITAGE_FUNNEL__: $(__VUE_APP_HERITAGE_FUNNEL__) + __VUE_APP_SAFELITE_HOP___: $(__VUE_APP_SAFELITE_HOP__) + __VUE_APP_PAYPAL_SUCCESS_URL__: $(__VUE_APP_PAYPAL_SUCCESS_URL__) + __VUE_APP_PAYPAL_CANCEL_URL__: $(__VUE_APP_PAYPAL_CANCEL_URL__) + __VUE_APP_CURRENT_ENVIRONMENT__: $(__VUE_APP_CURRENT_ENVIRONMENT__) + __VUE_APP_MY_ACCOUNT__: $(__VUE_APP_MY_ACCOUNT__) + indexDeployVariables: + __VUE_APP_GOOGLE_TAG_MANAGER_SCRIPT_BODY__: $(__VUE_APP_GOOGLE_TAG_MANAGER_SCRIPT_BODY__) + __VUE_APP_GOOGLE_TAG_MANAGER_NOSCRIPT_FRAME_SRC__: $(__VUE_APP_GOOGLE_TAG_MANAGER_NOSCRIPT_FRAME_SRC__) + - template: templates/digital/invalidate-cloudfront-cache.yml@AzureDevOps + parameters: + awsCliContainer: awscli + distributionId: $(apiCfDistributionId) + paths: /* + awsProfile: $(devDeploymentProfile) + - template: templates/digital/invalidate-cloudfront-cache.yml@AzureDevOps + parameters: + awsCliContainer: awscli + distributionId: $(cfDistributionId) + paths: /fmg/* + awsProfile: $(devDeploymentProfile) - # Prod Build/Deploy - - stage: Prod - condition: succeeded('Qa') - variables: - - group: FixMyGlassProd - jobs: - - deployment: prodBuildDeployment - displayName: Build and Deploy FMG - Prod - environment: digitalCloud-prod - container: node - workspace: - clean: all - strategy: - runOnce: - deploy: - steps: - - checkout: self - clean: true - - template: templates/digital/step-build-vue.yml@AzureDevOps - parameters: - buildOutputDir: dist - environment: Prod - - template: templates/digital/step-deploy-vue.yml@AzureDevOps - parameters: - artifactName: vueDistProd - awsProfile: $(prodDeploymentProfile) - outputPath: /fmg/ - deployBuckets: - safelite-prod-fmg-us-east-1: - clearFolder: true - deployFolder: "" - region: us-east-1 - safelite-prod-fmg-us-east-2: - clearFolder: true - deployFolder: "" - region: us-east-2 - appDeployVariables: - __VUE_APP_CONSUMER_CF_DISTRO__: $(__VUE_APP_CONSUMER_CF_DISTRO__) - __VUE_APP_GOOGLE_PLACES_API_KEY__: $(__VUE_APP_GOOGLE_PLACES_API_KEY__) - __VUE_APP_HERITAGE_FUNNEL__: $(__VUE_APP_HERITAGE_FUNNEL__) - __VUE_APP_SAFELITE_HOP___: $(__VUE_APP_SAFELITE_HOP__) - __VUE_APP_PAYPAL_SUCCESS_URL__: $(__VUE_APP_PAYPAL_SUCCESS_URL__) - __VUE_APP_PAYPAL_CANCEL_URL__: $(__VUE_APP_PAYPAL_CANCEL_URL__) - __VUE_APP_CURRENT_ENVIRONMENT__: $(__VUE_APP_CURRENT_ENVIRONMENT__) - indexDeployVariables: - __VUE_APP_GOOGLE_TAG_MANAGER_SCRIPT_BODY__: $(__VUE_APP_GOOGLE_TAG_MANAGER_SCRIPT_BODY__) - __VUE_APP_GOOGLE_TAG_MANAGER_NOSCRIPT_FRAME_SRC__: $(__VUE_APP_GOOGLE_TAG_MANAGER_NOSCRIPT_FRAME_SRC__) - - template: templates/digital/invalidate-cloudfront-cache.yml@AzureDevOps - parameters: - awsCliContainer: awscli - distributionId: $(apiCfDistributionId) - paths: /* - awsProfile: $(prodDeploymentProfile) - - template: templates/digital/invalidate-cloudfront-cache.yml@AzureDevOps - parameters: - awsCliContainer: awscli - distributionId: $(cfDistributionId) - paths: /fmg/* - awsProfile: $(prodDeploymentProfile) - - template: templates/digital/auto-tag.yml@AzureDevOps - parameters: - dependsOn: prodBuildDeployment - userName: SafeliteAzureDevops - userEmail: githubazuredevops@safelite.com + # Test Build/Deploy + - stage: Test + condition: eq(variables['Build.SourceBranch'], variables['test-branch'] ) + variables: + - group: FixMyGlassTest + jobs: + - deployment: testBuildDeployment + displayName: Build and Deploy FMG - Test + environment: NoApproval-All + container: node + workspace: + clean: all + strategy: + runOnce: + deploy: + steps: + - checkout: self + clean: true + - template: templates/digital/step-build-vue.yml@AzureDevOps + parameters: + buildOutputDir: dist + environment: Test + - template: templates/digital/step-deploy-vue.yml@AzureDevOps + parameters: + artifactName: vueDistTest + awsProfile: $(sysDeploymentProfile) + outputPath: /fmg/ + deployBuckets: + safelite-sys-fmg-us-east-1: + clearFolder: true + deployFolder: "" + region: us-east-1 + safelite-sys-fmg-us-east-2: + clearFolder: true + deployFolder: "" + region: us-east-2 + appDeployVariables: + __VUE_APP_CONSUMER_CF_DISTRO__: $(__VUE_APP_CONSUMER_CF_DISTRO__) + __VUE_APP_GOOGLE_PLACES_API_KEY__: $(__VUE_APP_GOOGLE_PLACES_API_KEY__) + __VUE_APP_HERITAGE_FUNNEL__: $(__VUE_APP_HERITAGE_FUNNEL__) + __VUE_APP_SAFELITE_HOP___: $(__VUE_APP_SAFELITE_HOP__) + __VUE_APP_PAYPAL_SUCCESS_URL__: $(__VUE_APP_PAYPAL_SUCCESS_URL__) + __VUE_APP_PAYPAL_CANCEL_URL__: $(__VUE_APP_PAYPAL_CANCEL_URL__) + __VUE_APP_CURRENT_ENVIRONMENT__: $(__VUE_APP_CURRENT_ENVIRONMENT__) + __VUE_APP_MY_ACCOUNT__: $(__VUE_APP_MY_ACCOUNT__) + indexDeployVariables: + __VUE_APP_GOOGLE_TAG_MANAGER_SCRIPT_BODY__: $(__VUE_APP_GOOGLE_TAG_MANAGER_SCRIPT_BODY__) + __VUE_APP_GOOGLE_TAG_MANAGER_NOSCRIPT_FRAME_SRC__: $(__VUE_APP_GOOGLE_TAG_MANAGER_NOSCRIPT_FRAME_SRC__) + - template: templates/digital/invalidate-cloudfront-cache.yml@AzureDevOps + parameters: + awsCliContainer: awscli + distributionId: $(apiCfDistributionId) + paths: /* + awsProfile: $(sysDeploymentProfile) + - template: templates/digital/invalidate-cloudfront-cache.yml@AzureDevOps + parameters: + awsCliContainer: awscli + distributionId: $(cfDistributionId) + paths: /fmg/* + awsProfile: $(sysDeploymentProfile) + + # QA Build/Deploy + - stage: Qa + condition: eq(variables['Build.SourceBranch'], variables['qa-branch'] ) + variables: + - group: FixMyGlassQa + jobs: + - deployment: qaBuildDeployment + displayName: Build and Deploy FMG - QA + environment: NoApproval-All + container: node + workspace: + clean: all + strategy: + runOnce: + deploy: + steps: + - checkout: self + clean: true + - template: templates/digital/step-build-vue.yml@AzureDevOps + parameters: + buildOutputDir: dist + environment: Qa + - template: templates/digital/step-deploy-vue.yml@AzureDevOps + parameters: + artifactName: vueDistQa + awsProfile: $(qaDeploymentProfile) + outputPath: /fmg/ + deployBuckets: + safelite-qa-fmg-us-east-1: + clearFolder: true + deployFolder: "" + region: us-east-1 + safelite-qa-fmg-us-east-2: + clearFolder: true + deployFolder: "" + region: us-east-2 + appDeployVariables: + __VUE_APP_CONSUMER_CF_DISTRO__: $(__VUE_APP_CONSUMER_CF_DISTRO__) + __VUE_APP_GOOGLE_PLACES_API_KEY__: $(__VUE_APP_GOOGLE_PLACES_API_KEY__) + __VUE_APP_HERITAGE_FUNNEL__: $(__VUE_APP_HERITAGE_FUNNEL__) + __VUE_APP_SAFELITE_HOP___: $(__VUE_APP_SAFELITE_HOP__) + __VUE_APP_PAYPAL_SUCCESS_URL__: $(__VUE_APP_PAYPAL_SUCCESS_URL__) + __VUE_APP_PAYPAL_CANCEL_URL__: $(__VUE_APP_PAYPAL_CANCEL_URL__) + __VUE_APP_CURRENT_ENVIRONMENT__: $(__VUE_APP_CURRENT_ENVIRONMENT__) + indexDeployVariables: + __VUE_APP_GOOGLE_TAG_MANAGER_SCRIPT_BODY__: $(__VUE_APP_GOOGLE_TAG_MANAGER_SCRIPT_BODY__) + __VUE_APP_GOOGLE_TAG_MANAGER_NOSCRIPT_FRAME_SRC__: $(__VUE_APP_GOOGLE_TAG_MANAGER_NOSCRIPT_FRAME_SRC__) + - template: templates/digital/invalidate-cloudfront-cache.yml@AzureDevOps + parameters: + awsCliContainer: awscli + distributionId: $(apiCfDistributionId) + paths: /* + awsProfile: $(qaDeploymentProfile) + - template: templates/digital/invalidate-cloudfront-cache.yml@AzureDevOps + parameters: + awsCliContainer: awscli + distributionId: $(cfDistributionId) + paths: /fmg/* + awsProfile: $(qaDeploymentProfile) + + # Prod Build/Deploy + - stage: Prod + condition: succeeded('Qa') + variables: + - group: FixMyGlassProd + jobs: + - deployment: prodBuildDeployment + displayName: Build and Deploy FMG - Prod + environment: digitalCloud-prod + container: node + workspace: + clean: all + strategy: + runOnce: + deploy: + steps: + - checkout: self + clean: true + - template: templates/digital/step-build-vue.yml@AzureDevOps + parameters: + buildOutputDir: dist + environment: Prod + - template: templates/digital/step-deploy-vue.yml@AzureDevOps + parameters: + artifactName: vueDistProd + awsProfile: $(prodDeploymentProfile) + outputPath: /fmg/ + deployBuckets: + safelite-prod-fmg-us-east-1: + clearFolder: true + deployFolder: "" + region: us-east-1 + safelite-prod-fmg-us-east-2: + clearFolder: true + deployFolder: "" + region: us-east-2 + appDeployVariables: + __VUE_APP_CONSUMER_CF_DISTRO__: $(__VUE_APP_CONSUMER_CF_DISTRO__) + __VUE_APP_GOOGLE_PLACES_API_KEY__: $(__VUE_APP_GOOGLE_PLACES_API_KEY__) + __VUE_APP_HERITAGE_FUNNEL__: $(__VUE_APP_HERITAGE_FUNNEL__) + __VUE_APP_SAFELITE_HOP___: $(__VUE_APP_SAFELITE_HOP__) + __VUE_APP_PAYPAL_SUCCESS_URL__: $(__VUE_APP_PAYPAL_SUCCESS_URL__) + __VUE_APP_PAYPAL_CANCEL_URL__: $(__VUE_APP_PAYPAL_CANCEL_URL__) + __VUE_APP_CURRENT_ENVIRONMENT__: $(__VUE_APP_CURRENT_ENVIRONMENT__) + indexDeployVariables: + __VUE_APP_GOOGLE_TAG_MANAGER_SCRIPT_BODY__: $(__VUE_APP_GOOGLE_TAG_MANAGER_SCRIPT_BODY__) + __VUE_APP_GOOGLE_TAG_MANAGER_NOSCRIPT_FRAME_SRC__: $(__VUE_APP_GOOGLE_TAG_MANAGER_NOSCRIPT_FRAME_SRC__) + - template: templates/digital/invalidate-cloudfront-cache.yml@AzureDevOps + parameters: + awsCliContainer: awscli + distributionId: $(apiCfDistributionId) + paths: /* + awsProfile: $(prodDeploymentProfile) + - template: templates/digital/invalidate-cloudfront-cache.yml@AzureDevOps + parameters: + awsCliContainer: awscli + distributionId: $(cfDistributionId) + paths: /fmg/* + awsProfile: $(prodDeploymentProfile) + - template: templates/digital/auto-tag.yml@AzureDevOps + parameters: + dependsOn: prodBuildDeployment + userName: SafeliteAzureDevops + userEmail: githubazuredevops@safelite.com diff --git a/src/assets/img/icons/add-to-calendar.svg b/src/assets/img/icons/add-to-calendar.svg new file mode 100644 index 000000000..fd621c5c5 --- /dev/null +++ b/src/assets/img/icons/add-to-calendar.svg @@ -0,0 +1,11 @@ + + + + + + + + + + + diff --git a/src/constants/application-config.js b/src/constants/application-config.js index 4c5305783..808acfe0a 100644 --- a/src/constants/application-config.js +++ b/src/constants/application-config.js @@ -10,6 +10,7 @@ const applicationConfig = { PAGE_QUERYSTRING: "fmgPage", SITE_ENTRY_TRIGGER_VALUE: "FixMyGlass", CASH_PARENT_ACCOUNT_NUMBER: 167132, + MY_ACCOUNT: process.env.VUE_APP_MY_ACCOUNT, }; export { applicationConfig }; diff --git a/src/helpers/date-helper.js b/src/helpers/date-helper.js index dce497231..48b3122ab 100644 --- a/src/helpers/date-helper.js +++ b/src/helpers/date-helper.js @@ -8,3 +8,57 @@ export function getDateDifferenceInDays(startDate, endDate) { // To calculate the no. of days between two dates return Difference_In_Time / (1000 * 3600 * 24); } + +export function getFullDayName(date) { + if (date instanceof Date !== true) return; + const days = ["Sunday", "Monday", "Tuesday", "Wednesday", "Thursday", "Friday", "Saturday"]; + return days[date.getDay()]; +} +export function getFullMonthName(date) { + if (date instanceof Date !== true) return; + const monthNames = [ + "January", + "February", + "March", + "April", + "May", + "June", + "July", + "August", + "September", + "October", + "November", + "December", + ]; + return monthNames[date.getMonth()]; +} +export function get12HourTimeFormat(time) { + // Check correct time format and split into components + time = time.toString().match(/^([01]\d|2[0-3])(:)([0-5]\d)?$/) || [time]; + + if (time.length > 1) { + // If time format correct + time = time.slice(1); // Remove full string match value + time[5] = +time[0] < 12 ? " AM" : " PM"; // Set AM/PM + time[0] = +time[0] % 12 || 12; // Adjust hours + } + return time.join(""); // return adjusted time or original string +} +export function get12HourTimeMobileFormat(time) { + // Check correct time format and split into components + time = time.toString().match(/^([01]\d|2[0-3])(:)([0-5]\d)?$/) || [time]; + + if (time.length > 1) { + // If time format correct + const min = time[3]; + time = time.slice(1); // Remove full string match value + if (Number(min) == 0) { + time = time.slice(0, 1); // Remove minute value + time[1] = +time[0] < 12 ? " AM" : " PM"; // Set AM/PM + } else { + time[5] = +time[0] < 12 ? " AM" : " PM"; // Set AM/PM + } + time[0] = +time[0] % 12 || 12; // Adjust hours + } + return time.join(""); // return adjusted time or original string +} diff --git a/src/layouts/confirmation/confirmation.spec.js b/src/layouts/confirmation/confirmation.spec.js index 1f71aa033..c60b19c26 100644 --- a/src/layouts/confirmation/confirmation.spec.js +++ b/src/layouts/confirmation/confirmation.spec.js @@ -6,6 +6,7 @@ import { shallowMount } from "@vue/test-utils"; import { nextTick } from "vue"; import { getMountOptions } from "@/helpers/unit-test-helper.js"; import store from "@/store"; +import router from "@/router"; // Mock our module for promises. jest.mock("@/helpers/layout-helper.js", () => ({ @@ -54,6 +55,14 @@ beforeEach(() => { isRepair: false, }, referralNumber: "1234567", + vehicle: { + year: "2004", + make: "Ford", + model: "F Series F250", + }, + customer: { + emailAddress: "test@test.com", + }, }, payment: { isInsurance: true, @@ -71,9 +80,19 @@ afterEach(() => { }); describe("confirmation.vue", () => { + const realLocation = window.location; + + beforeAll(() => { + delete window.location; + window.location = { ...realLocation, assign: jest.fn() }; + }); + + afterAll(() => { + window.location = realLocation; + }); test("arePagePrerequisitesValid should be true ", async () => { //Arrange - const { wrapper } = setupMocks(); + const { wrapper } = setupMocks({}); //Act let arePagePrerequisitesValid = wrapper.vm.arePagePrerequisitesValid(); @@ -82,20 +101,33 @@ describe("confirmation.vue", () => { //Assert expect(arePagePrerequisitesValid).toBe(true); }); + test("'Back to safelite.com' button should take user back to safelite.com", async () => { + //Arrange + const { wrapper } = setupMocks({}); + + //Act + await wrapper.vm.forwardButtonAction(); + + //Assert + expect(window.location.assign).toHaveBeenCalled(); + }); }); -function setupMocks() { - const wrapper = shallowMount( - confirmation, - getMountOptions({ - router: { - navigate: jest.fn(), - navigate: jest.fn(), - navigateWithSaving: jest.fn(), - navigateWithoutSaving: jest.fn(), - }, - }) - ); +const wordingText = "wording Text"; +function setupMocks({ customMountOptions }) { + const mountOptions = getMountOptions({ + ...customMountOptions, + }); + mountOptions.mixins = [ + { + methods: { + getCmsContent: jest.fn().mockImplementation(() => { + return wordingText; + }), + }, + }, + ]; + const wrapper = shallowMount(confirmation, mountOptions); return { wrapper }; } diff --git a/src/layouts/confirmation/confirmation.vue b/src/layouts/confirmation/confirmation.vue index eb2c692fd..80532c6a7 100644 --- a/src/layouts/confirmation/confirmation.vue +++ b/src/layouts/confirmation/confirmation.vue @@ -6,6 +6,40 @@
+
+ + +
+
+
+ +
+
+

{{ this.getScheduleDate() }}

+

{{ this.getScheduleTime() }}

+
+ +
+
+ +
+
+
+
+
// Components import funnelHeader from "@/fmg-components/funnel-header/funnel-header"; +import vehicleBanner from "@/fmg-components/vehicle-banner/vehicle-banner"; import navbar from "@/fmg-components/nav-bar/nav-bar"; //Supporting files import { fetchCmsContentForPage } from "@/helpers/cms-content-helper"; import { AppointmentTypeStrings } from "@/constants/schedule-constants"; import { settleAllPromises } from "@/helpers/layout-helper"; +import { applicationConfig } from "@/constants/application-config.js"; import store from "@/store"; + +import { + getFullDayName, + getFullMonthName, + get12HourTimeFormat, + get12HourTimeMobileFormat, +} from "@/helpers/date-helper"; export default { name: "confirmation", async beforeRouteEnter(to, from, next) { @@ -47,6 +90,77 @@ export default { vm.setCmsContent(resultMap.cmsContent); }); }, + computed: { + ScheduleConfirmationText() { + return this.getCmsContent("ScheduleConfirmationWidget", "BodyText"); + }, + ScheduleConfirmationImage() { + return this.getCmsContent("ScheduleConfirmationWidget", "Image"); + }, + ConfirmationEmailText() { + return this.getCmsContent("ConfirmationEmailWidget", "BodyText"); + }, + ScheduleDate() { + return store.getters.order.schedule.date; + }, + AppointmentType() { + return store.getters.order.serviceLocation.appointmentType; + }, + ScheduleStartTime() { + return store.getters.order.schedule.startTime; + }, + ScheduleEndTime() { + return store.getters.order.schedule.endTime; + }, + InShopWordingText() { + return this.getCmsContent("InShopWordingWidget", "BodyText"); + }, + MobileWordingText() { + return this.getCmsContent("MobileWordingWidget", "BodyText"); + }, + DropOffWordingText() { + return this.getCmsContent("DropOffWordingWidget", "BodyText"); + }, + ServiceLocationAddress() { + return store.getters.order.serviceLocation.address; + }, + ServiceLocationAddress2() { + return store.getters.order.serviceLocation.address2; + }, + ServiceLocationCity() { + return store.getters.order.serviceLocation.city; + }, + ServiceLocationState() { + return store.getters.order.serviceLocation.state; + }, + ServiceLocationZipCode() { + return store.getters.order.serviceLocation.zipCode; + }, + ProviderAddress() { + return store.getters.order.serviceLocation.provider.address.streetAddress; + }, + ProviderCity() { + return store.getters.order.serviceLocation.provider.address.city; + }, + ProviderState() { + return store.getters.order.serviceLocation.provider.address.state; + }, + ProviderZipCode() { + return store.getters.order.serviceLocation.provider.address.zipCode; + }, + Year() { + return store.getters.order.vehicle.year; + }, + Make() { + return store.getters.order.vehicle.make; + }, + Model() { + return store.getters.order.vehicle.model; + }, + Email() { + return store.getters.order.customer.emailAddress; + }, + }, data() { return { workOrderNumber: store.getters.order.workOrderNumber, @@ -83,12 +197,136 @@ export default { return serviceLocationReqs && scheduleReqs; }, forwardButtonAction() { - window.location.replace("https://safelite.com"); + window.location.assign("//www.safelite.com/"); + }, + getScheduleDate() { + const scheduleDate = new Date(this.ScheduleDate); + return `${getFullDayName(scheduleDate)}, ${getFullMonthName( + scheduleDate + )} ${scheduleDate.getDate()}`; + }, + getScheduleTime() { + if (this.AppointmentType == AppointmentTypeStrings.MOBILE) { + return `Between ${get12HourTimeMobileFormat( + this.ScheduleStartTime + )} - ${get12HourTimeMobileFormat(this.ScheduleEndTime)}`; + } else if (this.AppointmentType == AppointmentTypeStrings.DROP_OFF) { + return `Drop off before 9:30 AM`; + } else { + return `at ${get12HourTimeFormat(this.ScheduleStartTime)}`; + } + }, + + getAppointmentWordingText() { + const ymm = `${this.Year} ${this.Make} ${this.Model}`; + if (this.AppointmentType == AppointmentTypeStrings.MOBILE) { + const address = `${ + this.ServiceLocationAddress2 ? this.ServiceLocationAddress2 + "," : "" + } ${this.ServiceLocationAddress},
${this.ServiceLocationCity}, ${ + this.ServiceLocationState + } ${this.ServiceLocationZipCode}`; + return this.MobileWordingText.replace("#ADDRESS", address).replace("#YMM", ymm); + } else if (this.AppointmentType == AppointmentTypeStrings.DROP_OFF) { + const address = `${this.ProviderAddress},
${this.ProviderCity}, ${this.ProviderState} ${this.ProviderZipCode}`; + return this.DropOffWordingText.replace("#ADDRESS", address).replace("#YMM", ymm); + } else { + const address = `${this.ProviderAddress},
${this.ProviderCity}, ${this.ProviderState} ${this.ProviderZipCode}`; + return this.InShopWordingText.replace("#ADDRESS", address).replace("#YMM", ymm); + } + }, + getConfirmationEmailText() { + return this.ConfirmationEmailText.replace("#EMAIL", this.Email) + .replace("#MY_ACCOUNT_URL", applicationConfig.MY_ACCOUNT) + .replace(/</g, "<") + .replace(/>/g, ">"); }, }, components: { funnelHeader, navbar, + vehicleBanner, }, }; + + diff --git a/vue.config.js b/vue.config.js index 906772a27..1a402ced1 100644 --- a/vue.config.js +++ b/vue.config.js @@ -1,10 +1,8 @@ -process.env.VUE_APP_CONSUMER_CF_DISTRO = - "https://digitalapi.dev.safelite.io"; -process.env.VUE_APP_HERITAGE_FUNNEL = - "http://localhost:38000/default.aspx"; -process.env.VUE_APP_GOOGLE_PLACES_API_KEY = - "AIzaSyDptGCkOPgN2uWJOy4ou4M33phRD4MAoJo"; +process.env.VUE_APP_CONSUMER_CF_DISTRO = "https://digitalapi.dev.safelite.io"; +process.env.VUE_APP_HERITAGE_FUNNEL = "http://localhost:38000/default.aspx"; +process.env.VUE_APP_GOOGLE_PLACES_API_KEY = "AIzaSyDptGCkOPgN2uWJOy4ou4M33phRD4MAoJo"; process.env.VUE_APP_CURRENT_ENVIRONMENT = "Localhost"; +process.env.VUE_APP_MY_ACCOUNT = "https://myaccountdev.safelite.com/"; //process.env.VUE_APP_SAFELITE_HOP = "http://localhost:60966/fmgCheckoutEmbedded.aspx"; process.env.VUE_APP_SAFELITE_HOP = "https://sv2-safelitehop-sys.safelite.com/fmgCheckoutEmbedded.aspx"; @@ -12,30 +10,31 @@ process.env.VUE_APP_PAYPAL_SUCCESS_URL = "http://localhost:8080/fmg/?fmgPage=pay process.env.VUE_APP_PAYPAL_CANCEL_URL = "http://localhost:8080/fmg/?fmgPage=payment-method&src=concept-funnel"; // GA & GTM -process.env.VUE_APP_GOOGLE_TAG_MANAGER_SCRIPT_BODY = "(function(w,d,s,l,i){w[l]=w[l]||[];w[l].push({'gtm.start':new Date().getTime(),event:'gtm.js'});var f=d.getElementsByTagName(s)[0],j=d.createElement(s),dl=l!='dataLayer'?'&l='+l:'';j.async=true;j.src='https://www.googletagmanager.com/gtm.js?id='+i+dl+ '>m_auth=amlAYNhxUxuskQo7jmjadg>m_preview=env-38>m_cookies_win=x';f.parentNode.insertBefore(j,f);})(window,document,'script','dataLayer','GTM-M6XCRH');"; - -process.env.VUE_APP_GOOGLE_TAG_MANAGER_NOSCRIPT_FRAME_SRC = "https://www.googletagmanager.com/ns.html?id=GTM-M6XCRH>m_auth=amlAYNhxUxuskQo7jmjadg>m_preview=env-38>m_cookies_win=x"; +process.env.VUE_APP_GOOGLE_TAG_MANAGER_SCRIPT_BODY = + "(function(w,d,s,l,i){w[l]=w[l]||[];w[l].push({'gtm.start':new Date().getTime(),event:'gtm.js'});var f=d.getElementsByTagName(s)[0],j=d.createElement(s),dl=l!='dataLayer'?'&l='+l:'';j.async=true;j.src='https://www.googletagmanager.com/gtm.js?id='+i+dl+ '>m_auth=amlAYNhxUxuskQo7jmjadg>m_preview=env-38>m_cookies_win=x';f.parentNode.insertBefore(j,f);})(window,document,'script','dataLayer','GTM-M6XCRH');"; +process.env.VUE_APP_GOOGLE_TAG_MANAGER_NOSCRIPT_FRAME_SRC = + "https://www.googletagmanager.com/ns.html?id=GTM-M6XCRH>m_auth=amlAYNhxUxuskQo7jmjadg>m_preview=env-38>m_cookies_win=x"; module.exports = { - outputDir: "dist/fmg", - publicPath: "/fmg", - css: { - loaderOptions: { - sass: { - // Load Order Matters!!! - // Note: only include functions, variables and mixins here - prependData: ` + outputDir: "dist/fmg", + publicPath: "/fmg", + css: { + loaderOptions: { + sass: { + // Load Order Matters!!! + // Note: only include functions, variables and mixins here + prependData: ` @import "./node_modules/bootstrap/scss/functions"; @import "@/styles/ux-variables.scss"; @import "./node_modules/bootstrap/scss/variables"; @import "./node_modules/bootstrap/scss/mixins"; @import "@/styles/mixins/customMixins"; `, - }, + }, + }, + }, + configureWebpack: { + devtool: "source-map", }, - }, - configureWebpack: { - devtool: 'source-map' - }, }; diff --git a/vue.release.config.js b/vue.release.config.js index a9ddd5a5c..4cad6611a 100644 --- a/vue.release.config.js +++ b/vue.release.config.js @@ -2,6 +2,7 @@ process.env.VUE_APP_CONSUMER_CF_DISTRO = "__VUE_APP_CONSUMER_CF_DISTRO__"; process.env.VUE_APP_GOOGLE_PLACES_API_KEY = "__VUE_APP_GOOGLE_PLACES_API_KEY__"; process.env.VUE_APP_HERITAGE_FUNNEL = "__VUE_APP_HERITAGE_FUNNEL__"; process.env.VUE_APP_CURRENT_ENVIRONMENT = "__VUE_APP_CURRENT_ENVIRONMENT__"; +process.env.VUE_APP_MY_ACCOUNT = "__VUE_APP_MY_ACCOUNT__"; process.env.VUE_APP_SAFELITE_HOP = "__VUE_APP_SAFELITE_HOP__"; process.env.VUE_APP_PAYPAL_SUCCESS_URL = "__VUE_APP_PAYPAL_SUCCESS_URL__"; @@ -9,24 +10,25 @@ process.env.VUE_APP_PAYPAL_CANCEL_URL = "__VUE_APP_PAYPAL_CANCEL_URL__"; // GA & GTM process.env.VUE_APP_GOOGLE_TAG_MANAGER_SCRIPT_BODY = "__VUE_APP_GOOGLE_TAG_MANAGER_SCRIPT_BODY__"; -process.env.VUE_APP_GOOGLE_TAG_MANAGER_NOSCRIPT_FRAME_SRC = "__VUE_APP_GOOGLE_TAG_MANAGER_NOSCRIPT_FRAME_SRC__" +process.env.VUE_APP_GOOGLE_TAG_MANAGER_NOSCRIPT_FRAME_SRC = + "__VUE_APP_GOOGLE_TAG_MANAGER_NOSCRIPT_FRAME_SRC__"; module.exports = { - outputDir: "dist/fmg", - publicPath: "/fmg", - css: { - loaderOptions: { - sass: { - // Load Order Matters!!! - // Note: only include functions, variables and mixins here - prependData: ` + outputDir: "dist/fmg", + publicPath: "/fmg", + css: { + loaderOptions: { + sass: { + // Load Order Matters!!! + // Note: only include functions, variables and mixins here + prependData: ` @import "./node_modules/bootstrap/scss/functions"; @import "@/styles/ux-variables.scss"; @import "./node_modules/bootstrap/scss/variables"; @import "./node_modules/bootstrap/scss/mixins"; @import "@/styles/mixins/customMixins"; `, - }, + }, + }, }, - }, };