RUN-2321-added unit test for date time picker #9100
Conversation
jayas006
changed the title
| it("renders correctly when mounted", async () => { | ||
| const wrapper = await mountDateTimePicker(); | ||
| expect(wrapper.vm.dateString).toBe(moment().format("YYYY-MM-DD")); | ||
| expect(wrapper.vm.time).toBeInstanceOf(Date); | ||
| }); |
There was a problem hiding this comment.
recommend to remove this test
| it("sets initial data correctly", async () => { | ||
| const wrapper = await mountDateTimePicker(); | ||
| expect(wrapper.vm.dateString).toBe(now.format("YYYY-MM-DD")); | ||
| expect(wrapper.vm.time).toBeInstanceOf(Date); | ||
| }); |
There was a problem hiding this comment.
recommend to remove this test
| await wrapper.setData({ dateString: newDateString }); | ||
| expect(moment(wrapper.vm.time).format("YYYY-MM-DD")).toBe(newDateString); | ||
| }); | ||
| it("binds v-model and class correctly to date-picker and time-picker", async () => { |
There was a problem hiding this comment.
if the test checks that the v-model and classes are correctly applied to the data-picker and time-picker, this test should be checking those components have the classes and the v-model, not the wrapper.
| it("applies CSS classes and props correctly", async () => { | ||
| const wrapper = await mountDateTimePicker(); | ||
| expect(wrapper.find(".date-class").exists()).toBe(true); | ||
| expect(wrapper.find(".time-class").exists()).toBe(true); | ||
| expect(wrapper.find(".bs-date-picker").exists()).toBe(true); | ||
| }); | ||
| it("sets correct attributes on date-picker", async () => { | ||
| const wrapper = await mountDateTimePicker(); | ||
| const datePicker = wrapper.findComponent({ name: "date-picker" }); | ||
| expect(datePicker.attributes("modelvalue")).toBe(wrapper.vm.dateString); | ||
| expect(datePicker.attributes("class")).toContain(wrapper.vm.dateClass); | ||
| expect(datePicker.attributes("clear-btn")).toBe("false"); | ||
| }); | ||
| it("sets correct attributes on time-picker", async () => { | ||
| const wrapper = await mountDateTimePicker(); | ||
| const timePicker = wrapper.findComponent({ name: "time-picker" }); | ||
| // Convert both values to ISO string format before comparing them | ||
| const receivedTime = new Date( | ||
| timePicker.attributes("modelvalue") | ||
| ).toISOString(); | ||
| const expectedTime = new Date(wrapper.vm.time).toISOString(); | ||
| expect(receivedTime).toBe(expectedTime); | ||
| expect(timePicker.attributes("class")).toContain(wrapper.vm.timeClass); | ||
| }); |
There was a problem hiding this comment.
recommend to combine the test binds v-model and class correctly to date-picker and time-picker and all the tests from lines 66 to 89 into one single test, avoiding scenarios like checking if the components exist (as mentioned before, if the components don't have a v-if condition attached to it, there's no need to check its existence).
| const wrapper = await mountDateTimePicker(); | ||
| const newTime = new Date(); | ||
| const newTimeFormatted = moment(newTime).format(); | ||
| await wrapper.setData({ time: newTime }); |
There was a problem hiding this comment.
recommend replacing the wrapper.setData with an emit from timePicker (update:modelValue), ie:
timePicker.vm.$emit(update:modelValue, newTime)
| if (emitted) { | ||
| expect(emitted[0]).toEqual([newTimeFormatted]); | ||
| } |
There was a problem hiding this comment.
please remove the if, but keep the line 41.
Is this a bugfix, or an enhancement? Please describe.
This is an enhancement
Describe the solution you've implemented
Describe alternatives you've considered
Additional context