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

Update field name + unit tests

Browse source
This commit is contained in:
Chloe Herd 2026-07-30 13:12:15 -04:00
parent ff5b6b0ad2
commit 63382362d2
6 changed files with 24 additions and 12 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

4
src/layouts/scheduling/available-appointment-date-chips/available-appointment-date-chips.spec.js
View file

@ -5,7 +5,7 @@ describe("available-appointment-date-chips.vue", () => {
test("renders a button for each date", () => { test("renders a button for each date", () => {
const wrapper = shallowMount(availableAppointmentDateChips, { const wrapper = shallowMount(availableAppointmentDateChips, {
props: { props: {
dates: ["2026-06-11", "2026-06-16"], displayedDates: ["2026-06-11", "2026-06-16"],
label: "Available appointments:", label: "Available appointments:",
}, },
}); });
@ -21,7 +21,7 @@ describe("available-appointment-date-chips.vue", () => {
test("emits date-selected when a chip is clicked", async () => { test("emits date-selected when a chip is clicked", async () => {
const wrapper = shallowMount(availableAppointmentDateChips, { const wrapper = shallowMount(availableAppointmentDateChips, {
props: { props: {
dates: ["2026-06-11"], displayedDates: ["2026-06-11"],
}, },
}); });

4
src/layouts/scheduling/available-appointment-date-chips/available-appointment-date-chips.vue
View file

@ -22,7 +22,7 @@ export default {
name: "availableAppointmentDateChips", name: "availableAppointmentDateChips",
emits: ["date-selected"], emits: ["date-selected"],
props: { props: {
dates: { displayedDates: {
type: Array, type: Array,
default: () => [], default: () => [],
}, },
@ -33,7 +33,7 @@ export default {
}, },
computed: { computed: {
formattedDates() { formattedDates() {
return this.dates.map(formatSchedulingDateChip); return this.displayedDates.map(formatSchedulingDateChip);
}, },
}, },
}; };

12
src/layouts/scheduling/inshop-scheduling-card/inshop-scheduling-card.spec.js
View file

@ -140,8 +140,14 @@ describe("inshop-scheduling-card.vue", () => {
availableDateChips: ["2026-06-11", "2026-06-14", "2026-06-16"], availableDateChips: ["2026-06-11", "2026-06-14", "2026-06-16"],
}); });
await wrapper.find(".inshop-scheduling-card__header").trigger("click"); await wrapper.find(".inshop-scheduling-card__header").trigger("click");
expect(wrapper.text()).toContain("Available appointments:"); const chipsComponent = wrapper.findComponent({ name: "availableAppointmentDateChips" });
expect(wrapper.find("available-appointment-date-chips-stub").exists()).toBe(true); expect(chipsComponent.exists()).toBe(true);
expect(chipsComponent.props("label")).toBe("Available appointments:");
expect(chipsComponent.props("displayedDates")).toEqual([
"2026-06-11",
"2026-06-14",
"2026-06-16",
]);
expect(wrapper.find(".inshop-scheduling-card__time-slots").exists()).toBe(false); expect(wrapper.find(".inshop-scheduling-card__time-slots").exists()).toBe(false);
wrapper.unmount(); wrapper.unmount();
}); });
@ -153,7 +159,7 @@ describe("inshop-scheduling-card.vue", () => {
}); });
await wrapper.find(".inshop-scheduling-card__header").trigger("click"); await wrapper.find(".inshop-scheduling-card__header").trigger("click");
await wrapper await wrapper
.find("available-appointment-date-chips-stub") .findComponent({ name: "availableAppointmentDateChips" })
.vm.$emit("date-selected", "2026-06-11"); .vm.$emit("date-selected", "2026-06-11");
expect(wrapper.emitted("date-selected")[0]).toEqual(["2026-06-11"]); expect(wrapper.emitted("date-selected")[0]).toEqual(["2026-06-11"]);
wrapper.unmount(); wrapper.unmount();

2
src/layouts/scheduling/inshop-scheduling-card/inshop-scheduling-card.vue
View file

@ -39,7 +39,7 @@
<div v-show="isExpanded" class="inshop-scheduling-card__body"> <div v-show="isExpanded" class="inshop-scheduling-card__body">
<availableAppointmentDateChips <availableAppointmentDateChips
v-if="showAvailableDateChips" v-if="showAvailableDateChips"
:dates="availableDateChips" :displayedDates="availableDateChips"
:label="availableDatesLabel" :label="availableDatesLabel"
@date-selected="$emit('date-selected', $event)" /> @date-selected="$emit('date-selected', $event)" />
<template v-else> <template v-else>

12
src/layouts/scheduling/mobile-scheduling-card/mobile-scheduling-card.spec.js
View file

@ -88,8 +88,14 @@ describe("mobile-scheduling-card.vue", () => {
timeSlots: [], timeSlots: [],
availableDateChips: ["2026-06-11", "2026-06-14", "2026-06-16"], availableDateChips: ["2026-06-11", "2026-06-14", "2026-06-16"],
}); });
expect(wrapper.text()).toContain("Available appointments:"); const chipsComponent = wrapper.findComponent({ name: "availableAppointmentDateChips" });
expect(wrapper.find("available-appointment-date-chips-stub").exists()).toBe(true); expect(chipsComponent.exists()).toBe(true);
expect(chipsComponent.props("label")).toBe("Available appointments:");
expect(chipsComponent.props("displayedDates")).toEqual([
"2026-06-11",
"2026-06-14",
"2026-06-16",
]);
expect(wrapper.find(".mobile-scheduling-card__time-slots").exists()).toBe(false); expect(wrapper.find(".mobile-scheduling-card__time-slots").exists()).toBe(false);
wrapper.unmount(); wrapper.unmount();
}); });
@ -100,7 +106,7 @@ describe("mobile-scheduling-card.vue", () => {
availableDateChips: ["2026-06-11"], availableDateChips: ["2026-06-11"],
}); });
await wrapper await wrapper
.find("available-appointment-date-chips-stub") .findComponent({ name: "availableAppointmentDateChips" })
.vm.$emit("date-selected", "2026-06-11"); .vm.$emit("date-selected", "2026-06-11");
expect(wrapper.emitted("date-selected")[0]).toEqual(["2026-06-11"]); expect(wrapper.emitted("date-selected")[0]).toEqual(["2026-06-11"]);
wrapper.unmount(); wrapper.unmount();

2
src/layouts/scheduling/mobile-scheduling-card/mobile-scheduling-card.vue
View file

@ -53,7 +53,7 @@
<div v-show="isExpanded" class="mobile-scheduling-card__body"> <div v-show="isExpanded" class="mobile-scheduling-card__body">
<availableAppointmentDateChips <availableAppointmentDateChips
v-if="showAvailableDateChips" v-if="showAvailableDateChips"
:dates="availableDateChips" :displayedDates="availableDateChips"
:label="availableDatesLabel" :label="availableDatesLabel"
@date-selected="$emit('date-selected', $event)" /> @date-selected="$emit('date-selected', $event)" />
<fieldset v-else class="mobile-scheduling-card__time-slots"> <fieldset v-else class="mobile-scheduling-card__time-slots">