Merge pull request #2724 from Safelite/feature/CASH-1182

Feature/cash 1182

playwright-tests/pages/SchedulePage.ts

@@ -17,7 +17,7 @@ export class SchedulePage extends BasePage {
     readonly militaryWarningMessage: Locator;
     readonly changeZipButton: Locator;
     readonly updateZipTextBox: Locator;
-    readonly saveZipButton: Locator;
+    readonly saveLocationButton: Locator;
     readonly changeShopLocationLink: Locator;
     readonly selectAShopOptions: Locator;
     readonly yourSafeliteShop: Locator;
@@ -37,14 +37,14 @@ export class SchedulePage extends BasePage {
         super(page);
         this.page = page;
         
-        this.inShopButton = this.page.getByText(/In-shop/);
+        this.inShopButton = this.page.locator('label[buttonlabel="You come to our store"]');
-        this.mobileButton = this.page.locator('label[buttonlabel="Mobile"]');
+        this.mobileButton = this.page.locator('label[buttonlabel="Our mobile shop comes to you"]');
         this.RecalWarningMessage1 = this.page.getByText(/We're not able to provide mobile service/);
         this.RecalWarningMessage2 = this.page.getByText(/advanced safety system recalibration needs to be done in our shop./);
         this.militaryWarningMessage = this.page.locator('[class*="widget-name-AlertMilitaryBaseZipWidget"]');
         this.changeZipButton = this.page.locator('a:has(span.sr-only:has-text("edit zip code"))');
         this.updateZipTextBox = this.page.locator('#serviceZipCode').filter({ visible: true });
-        this.saveZipButton = this.page.getByText('Save ZIP code', { exact: true });
+        this.saveLocationButton = this.page.getByText('Save location', { exact: true });
         this.changeShopLocationLink = this.page.locator(".shop-question a").filter({ hasText: "Change shop location " });
         this.selectAShopOptions = this.page.locator('[class="shop-question"]');
         this.yourSafeliteShop = this.page.locator("fieldset:has(#chooseShop) label");
@@ -82,10 +82,11 @@ export class SchedulePage extends BasePage {
             if (zipCodeMatch) {
                 const zipCode = zipCodeMatch[0];
                 // Enter the ZIP code into the updateZipTextBox
-                await this.changeZipButton.click();
+                await this.changeShopLocationLink.click();
                 await this.page.waitForTimeout(500);
                 await this.updateZipTextBox.fill(zipCode);
-                await this.saveZipButton.click();
+                // Click the save location button
+                await this.saveLocationButton.click();
             }
 
             await this.inShopButton.click();

playwright-tests/tests/CashReplaceGlassPromoInshop.ts

@@ -60,7 +60,7 @@ const cashReplaceGlassPromoInshopTests: ITestCase[] = [];
 
 const tc = {
     name: `CashReplaceGlassPromoInshop`,
-    tags: ['@E2E','@CashReplaceGlassPromoInshop', '@test_report', '@CASH'],
+    tags: ['@E2E','@CashReplaceGlassPromoInshop', '@test_report', '@CASH', '@CASH-1182'],
     testData: cashReplaceGlassPromoInshopData
 };
 cashReplaceGlassPromoInshopTests.push(tc);

playwright-tests/tests/CashReplaceMultiGlassPromoInshop.ts

@@ -101,7 +101,7 @@ const cashReplaceMultiGlassPromoInshopTests: ITestCase[] = [];
 
 const tc = {
     name: `CashReplaceMultiGlassPromoInshop`,
-    tags: ['@E2E','@CashReplaceMultiGlassPromoInshop', '@test_report', '@CASH'],
+    tags: ['@E2E','@CashReplaceMultiGlassPromoInshop', '@test_report', '@CASH', '@CASH-1182'],
     testData: cashReplaceMultiGlassPromoInshopData
 };
 cashReplaceMultiGlassPromoInshopTests.push(tc);

src/digital-components/date-picker/date-picker.vue

@@ -1108,10 +1108,11 @@ export default {
 
         .month-year {
             grid-area: 1 / 1 / 2 / 5;
-            font-family: UrbanistBold;
+            font-family: UrbanistSemiBold;
             color: $black;
             justify-content: left;
             margin-bottom: 0.5rem;
+            font-weight: 500;
         }
         .legend {
             grid-area: 1 / 5 / 2 / 8;

src/layouts/schedule/schedule.vue

@@ -46,7 +46,7 @@
             </div>
             <div class="row appointment-type">
                 <div class="col-12 col-md-10 col-lg-8 col-xl-7">
-                    <funnelSubHeader cmsWidgetName="ScheduleYourServiceWidget" class="mt-4" />
+                    <funnelSubHeader cmsWidgetName="ScheduleYourServiceWidget" class="my-5" />
                     <appointmentTypeQuestion
                         v-model="appointmentTypeFromAppointmentTypeQuestion"
                         v-show="isAppointmentTypeDisplayed"
@@ -1789,4 +1789,29 @@ export default {
     color: $black;
     font-weight: 600;
 }
+
+.funnel-sub-header h5 {
+    font-weight: 500;
+    font-size: 1rem;
+    font-family: UrbanistSemibold;
+    span {
+        letter-spacing: 0;
+    }
+}
+
+.appointment-type .funnel-sub-header h5 {
+    font-family: UrbanistRegular;
+}
+
+.funnel-sub-header.my-5 h5 {
+    font-weight: 400;
+    font-size: 1.25rem;
+}
+
+.col-12 a {
+    font-family: UrbanistSemibold;
+    font-weight: 500;
+    line-height: 26px;
+    text-underline-offset: 4px;
+}
 </style>

src/layouts/service-location/appointment-type-question/appointment-type-question.vue

@@ -7,7 +7,6 @@
                 :questionText="questionText"
                 :answers="answersToDisplay"
                 :groupName="groupName"
-                buttonTypeString="listCard"
                 v-model="selectedValue"
                 :suppressError="suppressError"
                 :validationRules="validationRules"
@@ -134,4 +133,11 @@ export default {
         width: auto;
     }
 }
+div.appointment-type-question div.button-question div.col div.button-content {
+    padding-left: 0.5rem;
+    padding-right: 0.5rem;
+}
+div.appointment-type-question div.button-question div.question-text span {
+    font-weight: 500;
+}
 </style>