jason/DigitalConsumer.FixMyGlass
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

Merge branch 'release/2023.12.14' into feature/CSR-1871

Browse source
This commit is contained in:
CarlNation 2023-12-07 12:37:26 -05:00
commit db9853bca0
10 changed files with 522 additions and 68 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

2
public/css/hop-styling.css
View file

@ -73,6 +73,8 @@ body select {
background-position: 95% 50%;
background-size: 15px 9px;
appearance: none;
font-size: 16px;
color: #000;
}
body .creditCardSpecific div {
padding: 8px 0;

2
public/scss/hop-styling.scss
View file

@ -85,6 +85,8 @@ body {
background-position: 95% 50%;
background-size: 15px 9px;
appearance: none;
font-size: 16px;
color: #000;
}
.creditCardSpecific {

53
src/digital-components/textarea-question/textarea-question.vue
View file

@ -1,29 +1,31 @@
<template>
<div class="textarea-question">
<div class="label-wrapper mb-1" :aria-label="questionText">
<div class="label-wrapper d-flex flex-column mb-1" :aria-label="questionText">
<!-- Wrap label and span because v-html prevents v-if from displaying if v-if <span> is inside <label>-->
<label for="textarea-question" class="fw-bold" v-html="questionText"></label>
<span v-if="!isRequired" class="fw-normal ms-1">(Optional)</span>
<div class="d-flex mb-1">
<label :for="textAreaLabelCopy" class="fw-bold" v-html="questionText"></label>
<span v-if="!isRequired" class="fw-normal ms-1">(Optional)</span>
</div>
<textarea
:id="textAreaLabelCopy"
ref="textarea"
v-model="value"
v-maska="mask"
@keyup="updateCount"
class="p-4"
:maxlength="maxLength"
role="textbox"
aria-multiline="true"
:aria-required="isRequired">
</textarea>
<p
tabindex="-1"
class="caption mt-2 mb-0 w-100"
id="charactersRemaining"
:class="[urgentCountdown ? 'urgent-countdown' : '']">
{{ remainingCount }}/{{ maxLength }} characters remaining
</p>
</div>
<textarea
id="textareaQuestion"
ref="textarea"
v-model="value"
v-maska="mask"
@keyup="updateCount"
class="p-4"
:maxlength="maxLength"
role="textbox"
aria-multiline="true"
:aria-required="isRequired">
</textarea>
<p
tabindex="-1"
class="caption mt-2 mb-0"
id="charactersRemaining"
:class="[urgentCountdown ? 'urgent-countdown' : '']">
{{ remainingCount }}/{{ maxLength }} characters remaining
</p>
</div>
</template>
@ -38,6 +40,10 @@ export default {
default: 150,
},
modelValue: String,
textAreaLabelCopy: {
type: String,
default: "text area",
},
},
// TODO: At some point in the future we should probably add the tie in to validation here in case the field must be populated for some other use cases
setup() {},
@ -74,7 +80,7 @@ export default {
};
</script>
<style lang="scss">
<style lang="scss" scoped>
.textarea-question {
display: flex;
flex-direction: column;
@ -83,7 +89,6 @@ export default {
}
.label-wrapper {
display: flex;
align-items: center;
label {
span {
color: $gray-500;

301
src/helpers/heritage-integration/cookie-helper.spec.js
View file

@ -3,10 +3,25 @@ import {
getDeviceIdValue,
getSessionKeyValue,
getSessionIdValue,
setCookieProperties,
regenerateDeviceId,
getUserIdValue,
regenerateUserId,
setSessionKeyIfUnset,
setSessionIdIfUnset,
isCookieSet,
refreshCookieExpiration,
} from "@/helpers/heritage-integration/cookie-helper.js";
import { removeAllTestCookies, setupCookies } from "@/helpers/unit-test-helper";
import { cookieNames } from "@/constants/cookie-names";
import { removeAllTestCookies, setupCookies, setupCrypto } from "@/helpers/unit-test-helper";
const randomUUID = "68d89736-c277-46f1-8fee-c3dacdb23c08";
describe("cookies", () => {
beforeEach(() => {
setupCrypto(randomUUID);
});
afterEach(() => {
removeAllTestCookies();
});
@ -106,40 +121,284 @@ describe("cookies", () => {
});
});
describe("getDeviceIdValue", () => {
test("getDeviceIdValue, should return GUID", () => {
// Arrange
setupCookies({});
describe("Device Id", () => {
describe("getDeviceIdValue", () => {
test("getDeviceIdValue, should return GUID", () => {
// Arrange
setupCookies({});
// Act
const result = getDeviceIdValue();
// Act
const result = getDeviceIdValue();
//Assert
expect(result).toBe("21b9b94a-ec23-42c1-aaac-e2ae4e4dbffe");
//Assert
expect(result).toBe("21b9b94a-ec23-42c1-aaac-e2ae4e4dbffe");
});
test("Should return 0s if unset", () => {
//Arrange
//Act
const result = getDeviceIdValue();
//Assert
expect(result).toBe("00000000-0000-0000-0000-000000000000");
});
test("Should return id even if cookie contains other data", () => {
//Arrange
setCookieProperties(
{
[cookieNames.DXDEV]:
"did=f4a1a9e8-b3f3-4936-8c30-2f06a98644af&tz=-300&tzd=1",
},
{}
);
//Act
const result = getDeviceIdValue();
//Assert
expect(result).toBe("f4a1a9e8-b3f3-4936-8c30-2f06a98644af");
});
});
test("getSessionKeyValue, should return session key int", () => {
// Arrange
setupCookies({});
describe("regenerateDeviceId", () => {
test("Generates a new id if unset", () => {
// Arrange
// Act
regenerateDeviceId();
const result = getDeviceIdValue();
// Act
const result = getSessionKeyValue();
// Assert
expect(result).not.toBe("00000000-0000-0000-0000-000000000000");
expect(global.crypto.randomUUID).toBeCalled();
});
//Assert
expect(result).toBe("12345");
test("Does not create a new id if already set", () => {
// Arrange
setupCookies({});
// Act
regenerateDeviceId();
const result = getDeviceIdValue();
// Assert
expect(result).toBe("21b9b94a-ec23-42c1-aaac-e2ae4e4dbffe");
expect(global.crypto.randomUUID).not.toBeCalled();
});
});
});
describe("getSessionIdValue", () => {
test("getSessionIdValue, should return GUID", () => {
describe("User Id", () => {
describe("getUserIdValue", () => {
test("Should return GUID", () => {
// Arrange
setupCookies({});
// Act
const result = getUserIdValue();
//Assert
expect(result).toBe("11aec5e8-92ba-4dc9-a8b6-179a916d8d7a");
});
test("Should return 0s if unset", () => {
//Arrange
//Act
const result = getUserIdValue();
//Assert
expect(result).toBe("00000000-0000-0000-0000-000000000000");
});
});
describe("regenerateUserId", () => {
test("Generates a new id if unset", () => {
// Arrange
// Act
regenerateUserId();
const result = getUserIdValue();
// Assert
expect(result).not.toBe("00000000-0000-0000-0000-000000000000");
expect(global.crypto.randomUUID).toBeCalled();
});
test("Does not create a new id if already set", () => {
// Arrange
setupCookies({});
// Act
regenerateUserId();
const result = getUserIdValue();
// Assert
expect(result).toBe("11aec5e8-92ba-4dc9-a8b6-179a916d8d7a");
expect(global.crypto.randomUUID).not.toBeCalled();
});
});
});
describe("Session Key", () => {
describe("getSessionKeyValue", () => {
test("Should return session key int", () => {
// Arrange
setupCookies({});
// Act
const result = getSessionKeyValue();
//Assert
expect(result).toBe("12345");
});
test("Should return 0 if unset", () => {
// Arrange
// Act
const result = getSessionKeyValue();
//Assert
expect(result).toBe(0);
});
});
describe("setSessionKeyIfUnset", () => {
test("Should set the cookie if not previously set", () => {
// Arrange
// Act
setSessionKeyIfUnset("54321");
const result = getSessionKeyValue();
// Assert
expect(result).toBe("54321");
});
test("Should not set the cookie if previously set", () => {
// Arrange
setupCookies({});
// Act
setSessionKeyIfUnset("54321");
const result = getSessionKeyValue();
// Assert
expect(result).toBe("12345");
});
});
});
describe("Session Id", () => {
describe("getSessionIdValue", () => {
test("Should return session id", () => {
// Arrange
setupCookies({});
// Act
const result = getSessionIdValue();
//Assert
expect(result).toBe("cba0c3d1-3c1b-4305-bb56-31aa50f58e27");
});
test("Should return 0s if unset", () => {
// Arrange
// Act
const result = getSessionIdValue();
//Assert
expect(result).toBe("00000000-0000-0000-0000-000000000000");
});
});
describe("setSessionIdIfUnset", () => {
test("Should set the cookie if not previously set", () => {
// Arrange
// Act
setSessionIdIfUnset("f01f463a-a02c-4d1a-8aaf-6ca920ae5f02");
const result = getSessionIdValue();
// Assert
expect(result).toBe("f01f463a-a02c-4d1a-8aaf-6ca920ae5f02");
});
test("Should not set the cookie if previously set", () => {
// Arrange
setupCookies({});
// Act
setSessionIdIfUnset("f01f463a-a02c-4d1a-8aaf-6ca920ae5f02");
const result = getSessionIdValue();
// Assert
expect(result).toBe("cba0c3d1-3c1b-4305-bb56-31aa50f58e27");
});
});
});
describe("isCookieSet", () => {
test("Returns true if cookie is set and unexpired", () => {
// Arrange
setupCookies({});
// Act
const result = getSessionIdValue();
const result = isCookieSet(cookieNames.SESSION_ID);
//Assert
expect(result).toBe("cba0c3d1-3c1b-4305-bb56-31aa50f58e27");
// Assert
expect(result).toBe(true);
});
test("Returns false if never set", () => {
// Arrange
// Act
const result = isCookieSet(cookieNames.SESSION_ID);
// Assert
expect(result).toBe(false);
});
test("Returns false if cookie is expired", () => {
// Arrange
setupCookies({});
// Act
setCookieProperties(
{
[cookieNames.SESSION_ID]: "test",
},
{ maxAge: 0 }
);
const result = isCookieSet(cookieNames.SESSION_ID);
// Assert
expect(result).toBe(false);
});
});
describe("refreshCookieExpiration", () => {
test("Preserves value", () => {
// Arrange
setupCookies({});
// Act
const result1 = getSessionIdValue();
refreshCookieExpiration(cookieNames.SESSION_ID, 1000000);
const result2 = getSessionIdValue();
// Assert
expect(result1).toBe(result2);
});
test("Does not set cookie if not already set", () => {
// Arrange
// Act
refreshCookieExpiration(cookieNames.SESSION_ID, 1000000);
const result = isCookieSet(cookieNames.SESSION_ID);
expect(result).toBe(false);
});
});
});

8
src/helpers/unit-test-helper.js
View file

@ -139,6 +139,14 @@ export function setupCookies({ funnelCookieValue = "", includeHeritageCookie = t
});
}
export function setupCrypto(mockValue) {
global.crypto = {
randomUUID: jest.fn(),
};
global.crypto.randomUUID.mockImplementation(() => mockValue);
}
// Private methods
function setupBaseMixinDispatchStoreAction(mockData) {
if (mockData.actionList !== undefined) {

1
src/layouts/customer-details/customer-details.vue
View file

@ -48,6 +48,7 @@
class="mb-4"
v-model="techNotes"
cmsWidgetName="TextAreaContentWidget"
textAreaLabelCopy="Notes for your technician"
maxLength="150" />
<textBlock cmsWidgetName="DisclaimerCopyWidget" typeStyle="caption" />

146
src/mixins/analytics-mixin.spec.js
View file

@ -1,5 +1,10 @@
import analyticsMixin from "@/mixins/analytics-mixin";
import { setupMocksForJsFiles, setupCookies } from "@/helpers/unit-test-helper.js";
import {
setupMocksForJsFiles,
setupCookies,
setupCrypto,
removeAllTestCookies,
} from "@/helpers/unit-test-helper.js";
import { storeActions } from "@/constants/store-actions";
import {
analyticsPageEvents,
@ -10,20 +15,19 @@ import {
ValueToLogTypes,
} from "@/constants/analytics";
import store from "@/store";
// Mock only the regenerate functions; window.crypto is not available in testing.
jest.mock("@/helpers/heritage-integration/cookie-helper", () => {
const originalModule = jest.requireActual("@/helpers/heritage-integration/cookie-helper");
return {
__esModule: true,
...originalModule,
regenerateDeviceId: jest.fn(),
regenerateUserId: jest.fn(),
};
});
import {
getDeviceIdValue,
getSessionIdValue,
getSessionKeyValue,
getUserIdValue,
} from "@/helpers/heritage-integration/cookie-helper";
describe("analyticsMixin.js", () => {
beforeEach(() => {
removeAllTestCookies();
setupCrypto("7e4727f3-9a3d-4c59-9cb3-6f4121b5ea94");
});
test("logPageView: calls dispatch with type and payload", async () => {
const type = "";
const payload = {};
@ -348,4 +352,120 @@ describe("analyticsMixin.js", () => {
//Assert
expect(gaLabels).toEqual(GaLabels);
});
describe("initSession", () => {
test("Generates random values for userId and deviceId if not present", async () => {
// Arrange
const mockData = {
actionList: [
{
actionName: storeActions.LOG_CUSTOM_EVENT,
},
{
actionName: storeActions.INITIALIZE_SESSION,
data: {
sessionKey: "12345",
sessionId: "4f1eba4a-4dd5-4144-9a6b-1363c1e5e54f",
},
},
],
};
const mocks = setupMocksForJsFiles(mockData);
// Act
await analyticsMixin.methods.initSession();
const userId = getUserIdValue();
const deviceId = getDeviceIdValue();
// Assert
expect(userId).not.toBe("00000000-0000-0000-0000-000000000000");
expect(deviceId).not.toBe("00000000-0000-0000-0000-000000000000");
});
test("Pulls sessionId and sessionKey from api if not set", async () => {
// Arrange
const mockData = {
actionList: [
{
actionName: storeActions.LOG_CUSTOM_EVENT,
},
{
actionName: storeActions.INITIALIZE_SESSION,
data: {
sessionKey: "54321",
sessionId: "4f1eba4a-4dd5-4144-9a6b-1363c1e5e54f",
},
},
],
};
const mocks = setupMocksForJsFiles(mockData);
// Act
await analyticsMixin.methods.initSession();
const sessionId = getSessionIdValue();
const sessionKey = getSessionKeyValue();
// Assert
expect(sessionId).toBe("4f1eba4a-4dd5-4144-9a6b-1363c1e5e54f");
expect(sessionKey).toBe("54321");
});
test("Does not overwrite values that are already set", async () => {
// Arrange
const mockData = {
actionList: [
{
actionName: storeActions.LOG_CUSTOM_EVENT,
},
{
actionName: storeActions.INITIALIZE_SESSION,
data: {
sessionKey: "54321",
sessionId: "4f1eba4a-4dd5-4144-9a6b-1363c1e5e54f",
},
},
],
};
const mocks = setupMocksForJsFiles(mockData);
setupCookies({});
// Act
await analyticsMixin.methods.initSession();
const userId = getUserIdValue();
const deviceId = getDeviceIdValue();
const sessionId = getSessionIdValue();
const sessionKey = getSessionKeyValue();
// Assert
expect(userId).toBe("11aec5e8-92ba-4dc9-a8b6-179a916d8d7a");
expect(deviceId).toBe("21b9b94a-ec23-42c1-aaac-e2ae4e4dbffe");
expect(sessionId).toBe("cba0c3d1-3c1b-4305-bb56-31aa50f58e27");
expect(sessionKey).toBe("12345");
});
test("Calls dispatchStoreAction", async () => {
// Arrange
const mockData = {
actionList: [
{
actionName: storeActions.LOG_CUSTOM_EVENT,
},
{
actionName: storeActions.INITIALIZE_SESSION,
data: {
sessionKey: "12345",
sessionId: "4f1eba4a-4dd5-4144-9a6b-1363c1e5e54f",
},
},
],
};
const mocks = setupMocksForJsFiles(mockData);
// Act
await analyticsMixin.methods.initSession();
// Assert
expect(mocks.baseMixin.methods.dispatchStoreAction).toBeCalled();
});
});
});

21
src/store/index.js
View file

@ -2130,6 +2130,17 @@ export const actions = {
},
// Manage promo saving to ensure a promoCode never ends up in both active and inactive
saveActiveAndOrInactivePromos(context, { activePromos = null, inactivePromos = null }) {
if (inactivePromos) {
// Clean up inactivePromos
// Remove bundle identifier
inactivePromos = inactivePromos.map((promoCode) =>
getPromoCodeWithoutBundleIdentifier(promoCode)
);
// Remove duplicates
inactivePromos = inactivePromos.filter(
(promoCode, index) => inactivePromos.indexOf(promoCode) === index
);
}
activePromos = activePromos?.slice(0);
inactivePromos = inactivePromos?.slice(0);
let activePromosToSave;
@ -2484,15 +2495,7 @@ export const actions = {
isVinOptionalVehicle(context) {
//Optional for carIds with only a single windshield
if (
singleWindshieldCarIds.find((item) => item === context.state.order.vehicle.carId) &&
context.state.order.damage.glassToReplace.length == 1 &&
context.state.order.damage.glassToReplace.find(
(glassToReplace) =>
glassToReplace.glassLocation.toLowerCase() ===
damageLocationsSelected.WINDSHIELD.toLowerCase()
)
) {
if (singleWindshieldCarIds.find((item) => item === context.state.order.vehicle.carId)) {
return true;
}
//Optional for specific YMMSs

2
src/store/store.spec.js
View file

@ -3329,7 +3329,7 @@ describe("isVinOptionalVehicle", () => {
"CR00062396",
"make3",
[{ glassLocation: "windshield" }, { glassLocation: "driver" }],
false,
true,
],
["CR00066428", "make4", [{ glassLocation: "rear" }], false],
];

54
src/ux-components/loader/loader.spec.js
View file

@ -28,4 +28,58 @@ describe("loader.vue", () => {
loaderPosition: "left",
});
});
describe("Blocking interaction on page", () => {
test("Does capture clicks if enabled (default)", async () => {
// Arrange
const div = document.createElement("div");
div.id = "parent";
document.body.appendChild(div);
const parentClickFn = jest.fn();
div.addEventListener("click", parentClickFn);
const wrapper = shallowMount(loader, {
props: {},
attachTo: "#parent",
});
// Act
await wrapper.trigger("click");
// Assert
expect(parentClickFn).not.toBeCalled();
// Cleanup
document.body.removeChild(div);
});
test("Does not capture clicks if disabled", async () => {
// Arrange
const div = document.createElement("div");
div.id = "parent";
document.body.appendChild(div);
const parentClickFn = jest.fn();
div.addEventListener("click", parentClickFn);
const wrapper = shallowMount(loader, {
props: {
allowPageInteraction: true,
},
attachTo: "#parent",
});
// Act
await wrapper.trigger("click");
// Assert
expect(parentClickFn).toBeCalled();
// Cleanup
document.body.removeChild(div);
});
});
});