commit
bf99739e98
4 changed files with 108 additions and 11 deletions
10
src/layouts/quote/quote.vue
Normal file
10
src/layouts/quote/quote.vue
Normal file
|
|
@ -0,0 +1,10 @@
|
|||
<script>
|
||||
export default {
|
||||
name: "quote",
|
||||
methods: {
|
||||
arePagePrerequisitesValid() {
|
||||
return true;
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
|
@ -108,9 +108,87 @@ describe("glass-part-question.vue", () => {
|
|||
expect(wrapper.vm.selectedPartNumber).toEqual(null);
|
||||
});
|
||||
|
||||
test("default is selected if only one option", async () => {
|
||||
// Arrange
|
||||
store.getters.pageData.mockReset();
|
||||
store.getters.pageData.mockReturnValueOnce({ partsOrQuestions: [{glassName: "Stationary", glassLocation: "Rear", parts: [{ partNumber: "DB12209GTYN", color: "Green Tint"}]}] });
|
||||
const { wrapper } = setupMocks(featureListData);
|
||||
|
||||
// Act
|
||||
await wrapper.vm.$nextTick();
|
||||
await wrapper.setData({ selectedTint: "Green Tint" });
|
||||
// take emitted value, pass down as modelValue
|
||||
// yes, yes, it's not ideal
|
||||
await wrapper.setProps({ modelValue: wrapper.emitted()["update:modelValue"][0][0] })
|
||||
await wrapper.vm.$nextTick();
|
||||
|
||||
// Assert
|
||||
expect(wrapper.vm.selectedPartNumber).toBe("DB12209GTYN");
|
||||
});
|
||||
|
||||
test("default is not selected if more than one option", async () => {
|
||||
// Arrange
|
||||
store.getters.pageData.mockReset();
|
||||
store.getters.pageData.mockReturnValueOnce({ partsOrQuestions: [{glassName: "Stationary", glassLocation: "Rear", parts: [{ partNumber: "DB12209GTYN", color: "Green Tint"}, { partNumber: "DB12209GTYNXXX", color: "Green Tint"}]}] });
|
||||
const { wrapper } = setupMocks(featureListData);
|
||||
|
||||
// Act
|
||||
await wrapper.vm.$nextTick();
|
||||
await wrapper.setData({ selectedTint: "Green Tint" });
|
||||
await wrapper.vm.$nextTick();
|
||||
|
||||
// Assert
|
||||
expect(wrapper.emitted()["update:modelValue"]).toBeFalsy();
|
||||
expect(wrapper.vm.selectedPartNumber).toBeFalsy();
|
||||
})
|
||||
|
||||
const partsForSelectedTintTestCases = [
|
||||
["Rear", "Stationary", "Green Tint", [{ partNumber: "Glass1", color: "Green Tint"}, { partNumber: "Glass3", color: "Green Tint"}, { partNumber: "Glass4", color: "Green Tint"}, { partNumber: "Glass6", color: "Green Tint"} ]],
|
||||
["Rear", "Stationary", "Blue Tint", [{ partNumber: "Glass2", color: "Blue Tint"}, { partNumber: "Glass5", color: "Blue Tint"}]],
|
||||
["Rear", "Stationary", "Red Tint", [{ partNumber: "Glass7", color: "Red Tint"}]],
|
||||
["Windshield", "Single", "Green Tint", [{ partNumber: "Windshield1", color: "Green Tint"}, { partNumber: "Windshield2", color: "Green Tint"}]],
|
||||
["Windshield", "Single", "Blue Tint", []],
|
||||
["Driver", "Quarter", "Green Tint", []]
|
||||
];
|
||||
test.each(partsForSelectedTintTestCases)("partsForSelectedTint returns correct parts", async (glassLocation, glassName, selectedTint, expectedResults) => {
|
||||
// Arrange
|
||||
store.getters.pageData.mockReset();
|
||||
store.getters.pageData.mockReturnValueOnce({ partsOrQuestions: [
|
||||
{
|
||||
glassName: "Stationary",
|
||||
glassLocation: "Rear",
|
||||
parts: [
|
||||
{ partNumber: "Glass1", color: "Green Tint"},
|
||||
{ partNumber: "Glass2", color: "Blue Tint"},
|
||||
{ partNumber: "Glass3", color: "Green Tint"},
|
||||
{ partNumber: "Glass4", color: "Green Tint"},
|
||||
{ partNumber: "Glass5", color: "Blue Tint"},
|
||||
{ partNumber: "Glass6", color: "Green Tint"},
|
||||
{ partNumber: "Glass7", color: "Red Tint"}
|
||||
]
|
||||
},
|
||||
{
|
||||
glassName: "Single",
|
||||
glassLocation: "Windshield",
|
||||
parts: [{ partNumber: "Windshield1", color: "Green Tint"}, { partNumber: "Windshield2", color: "Green Tint"}]
|
||||
}
|
||||
]});
|
||||
const { wrapper } = setupMocks({
|
||||
glassLocationProp: glassLocation,
|
||||
glassNameProp: glassName,
|
||||
colorAnswersProp: [],
|
||||
});
|
||||
|
||||
// Act
|
||||
await wrapper.setData({ selectedTint: selectedTint });
|
||||
|
||||
// Assert
|
||||
expect(expectedResults).toEqual(wrapper.vm.partsForSelectedTint);
|
||||
});
|
||||
});
|
||||
|
||||
|
||||
|
||||
function setupMocks({ glassNameProp, glassLocationProp, colorAnswersProp, modelValueProp }) {
|
||||
//Mock store
|
||||
store.getters.pageData.mockReturnValueOnce({ partsOrQuestions: [{glassName: "Stationary", glassLocation: "Rear", parts: []}] });
|
||||
|
|
|
|||
|
|
@ -116,10 +116,11 @@ export default {
|
|||
},
|
||||
|
||||
partsForSelectedTint() {
|
||||
return this.PartDataFromApi.partsOrQuestions?.filter(dataForGlassLocationAndName =>
|
||||
const matchingGlass = this.PartDataFromApi.partsOrQuestions?.filter(dataForGlassLocationAndName =>
|
||||
dataForGlassLocationAndName.glassName == this.glassName &&
|
||||
dataForGlassLocationAndName.glassLocation == this.glassLocation)[0]
|
||||
.parts?.filter(part => part.color == this.selectedTint) ?? [];
|
||||
dataForGlassLocationAndName.glassLocation == this.glassLocation);
|
||||
const matchingGlassParts = matchingGlass?.length == 1 ? matchingGlass[0].parts : [];
|
||||
return matchingGlassParts.filter(part => part.color == this.selectedTint) ?? [];
|
||||
},
|
||||
|
||||
// Creates a map of the feature list data in the correct Name/Value
|
||||
|
|
|
|||
|
|
@ -223,18 +223,26 @@ export default {
|
|||
span {
|
||||
font-size: .875rem;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.col {
|
||||
&:first-of-type {
|
||||
label {
|
||||
border-bottom-left-radius: 0.5rem;
|
||||
border-top-left-radius: 0.5rem;
|
||||
z-index: 2;
|
||||
.list-button-horizontal {
|
||||
label {
|
||||
border-bottom-left-radius: 0.5rem;
|
||||
border-top-left-radius: 0.5rem;
|
||||
z-index: 2;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
&:last-of-type {
|
||||
label {
|
||||
border-bottom-right-radius: 0.5rem;
|
||||
border-top-right-radius: 0.5rem;
|
||||
.list-button-horizontal {
|
||||
label {
|
||||
border-bottom-right-radius: 0.5rem;
|
||||
border-top-right-radius: 0.5rem;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
|
|
|||
Loading…
Reference in a new issue