src/components/common/__tests__/VnInputDate.spec.js

@@ -0,0 +1,72 @@
+import { createWrapper } from 'app/test/vitest/helper.js';
+import { describe, it, expect } from 'vitest';
+import VnInputDate from 'components/common/VnInputDate.vue';
+
+let vm;
+let wrapper;
+
+function generateWrapper(date, outlined, required) {
+    wrapper = createWrapper(VnInputDate, {
+        props: {
+            modelValue: date,
+        },
+        attrs: {
+            isOutlined: outlined,
+            required: required
+        },
+    });
+    wrapper = wrapper.wrapper;
+    vm = wrapper.vm;
+};
+
+describe('VnInputDate', () => {
+
+    describe('formattedDate', () => {     
+        it('formats a valid date correctly', async () => {
+            generateWrapper('2023-12-25', false, false);
+            await vm.$nextTick();
+            expect(vm.formattedDate).toBe('25/12/2023');
+        });
+
+        it('updates the model value when a new date is set', async () => {
+            const input = wrapper.find('input');
+            await input.setValue('31/12/2023');
+            expect(wrapper.emitted()['update:modelValue']).toBeTruthy();
+            expect(wrapper.emitted()['update:modelValue'][0][0]).toBe('2023-12-31T00:00:00.000Z');
+        });
+
+        it('should not update the model value when an invalid date is set', async () => {
+            const input = wrapper.find('input');
+            await input.setValue('invalid-date');
+            expect(wrapper.emitted()['update:modelValue'][0][0]).toBe('2023-12-31T00:00:00.000Z');
+        }); 
+    });
+
+    describe('styleAttrs', () => {
+        it('should return empty styleAttrs when isOutlined is false', async () => {
+            generateWrapper('2023-12-25', false, false);
+            await vm.$nextTick();
+            expect(vm.styleAttrs).toEqual({}); 
+        });
+
+        it('should set styleAttrs when isOutlined is true', async () => {        
+            generateWrapper('2023-12-25', true, false);
+            await vm.$nextTick();
+            expect(vm.styleAttrs.outlined).toBe(true);
+        });
+    });
+
+    describe('required', () => {
+        it('should not applies required class when isRequired is false', async () => {
+            generateWrapper('2023-12-25', false, false);
+            await vm.$nextTick();
+            expect(wrapper.find('.vn-input-date').classes()).not.toContain('required');
+        });
+        
+        it('should applies required class when isRequired is true', async () => {
+            generateWrapper('2023-12-25', false, true);
+            await vm.$nextTick();
+            expect(wrapper.find('.vn-input-date').classes()).toContain('required');
+        });
+    });
+});