refs #5056 added front tests

src/pages/Wagon/Type/WagonTypeCreate.vue

@@ -25,7 +25,7 @@ const wagon = ref([]);
 const divisible = ref(false);
 const name = ref('');
 const colorPickerActive = ref(false);
-const originalData = { trays: [] };
+let originalData = { trays: [] };
 let wagonConfig;
 let wagonTypeColors;
 let currentTrayColorPicked;
@@ -150,7 +150,7 @@ async function onSubmit() {
     }
 }
 
-async function onReset() {
+function onReset() {
     name.value = entityId.value ? originalData.name : null;
     divisible.value = entityId.value ? originalData.divisible : false;
     wagon.value = entityId.value
@@ -198,7 +198,7 @@ function onPositionBlur(tray) {
         wagon.value.sort((a, b) => b.position - a.position);
         reorderIds();
         for (let index = wagon.value.length - 1; index > 0; index--) {
-            checkMaxHeight(index - 1);
+            if (exceedMaxHeight(index - 1)) continue;
             if (
                 wagon.value[index - 1].position - wagon.value[index].position >=
                 wagonConfig.minHeightBetweenTrays
@@ -217,13 +217,13 @@ function onPositionBlur(tray) {
                     type: 'warning',
                 });
 
-                checkMaxHeight(index - 1);
+                exceedMaxHeight(index - 1);
             }
         }
     }
 }
 
-function checkMaxHeight(pos) {
+function exceedMaxHeight(pos) {
     if (wagon.value[pos].position > wagonConfig.maxWagonHeight) {
         wagon.value.splice(pos, 1);
         quasar.notify({
@@ -231,7 +231,9 @@ function checkMaxHeight(pos) {
                 t('wagon.warnings.maxWagonHeight') + wagonConfig.maxWagonHeight + ' cm',
             type: 'warning',
         });
+        return true;
     }
+    return false;
 }
 </script>
 
@@ -239,6 +241,7 @@ function checkMaxHeight(pos) {
     <q-page class="q-pa-sm q-mx-xl">
         <q-card class="q-pa-sm">
             <q-form @submit="onSubmit()" @reset="onReset()" class="q-pa-md">
+                <!-- <div v-for="tray in wagon" :key="tray.id">{{ tray }}</div> -->
                 <q-input
                     filled
                     v-model="name"

test/vitest/__tests__/pages/Wagons/WagonCreate.spec.js

@@ -3,12 +3,14 @@ import { createWrapper, axios } from 'app/test/vitest/helper';
 import WagonCreate from 'pages/Wagon/WagonCreate.vue';
 
 describe('WagonCreate', () => {
-    let vm;
+    let vmEdit, vmCreate;
+    const entityId = 1;
 
     beforeAll(() => {
-        vm = createWrapper(WagonCreate, {propsData: {
+        vmEdit = createWrapper(WagonCreate, {propsData: {
-                id: 1,
+                id: entityId,
             }}).vm;
+        vmCreate = createWrapper(WagonCreate).vm;
     });
 
     afterEach(() => {
@@ -16,42 +18,71 @@ describe('WagonCreate', () => {
     });
 
     describe('onSubmit()', () => {
-        it('should create or update a wagon', async () => {
+        it('should create a wagon', async () => {
             vi.spyOn(axios, 'patch').mockResolvedValue({ data: true });
-            vm.wagon = {
+            vmCreate.wagon = {
-                id: vm.entityId,
                 label: 1234,
                 plate: 'MOCK PLATE',
                 volume: 50,
                 typeFk: 1,
             };
 
-            await vm.onSubmit();
+            await vmCreate.onSubmit();
 
             expect(axios.patch).toHaveBeenCalledWith(
-                `Wagons`, vm.wagon
+                `Wagons`, vmCreate.wagon
+            );
+        });
+
+        it('should update a wagon', async () => {
+            vi.spyOn(axios, 'patch').mockResolvedValue({ data: true });
+            vmEdit.wagon = {
+                id: entityId,
+                label: 1234,
+                plate: 'MOCK PLATE',
+                volume: 50,
+                typeFk: 1,
+            };
+
+            await vmEdit.onSubmit();
+
+            expect(axios.patch).toHaveBeenCalledWith(
+                `Wagons`, vmEdit.wagon
             );
         });
     });
 
     describe('onReset()', () => {
-        it('should reset wagon', async () => {
+        it('should reset wagon if have id', async () => {
-            vm.originalData = {
+            vmEdit.originalData = {
                 label: 1234,
                 plate: 'Original',
                 volume: 200,
                 typeFk: 1,
             };
-            vm.wagon = {
+            vmEdit.wagon = {
                 label: 4321,
                 plate: 'Edited',
                 volume: 50,
                 typeFk: 2,
             };
 
-            await vm.onReset();
+            await vmEdit.onReset();
 
-            expect(vm.wagon).toEqual(vm.originalData);
+            expect(vmEdit.wagon).toEqual(vmEdit.originalData);
+        });
+
+        it('should reset wagon if not have id', async () => {
+            vmCreate.wagon = {
+                label: 4321,
+                plate: 'Edited',
+                volume: 50,
+                typeFk: 2,
+            };
+
+            await vmCreate.onReset();
+
+            expect(vmCreate.wagon).toEqual({});
         });
     });
 
@@ -59,13 +90,13 @@ describe('WagonCreate', () => {
         it('should fetch data', async () => {
             vi.spyOn(axios, 'get').mockResolvedValue({ data: true });
 
-            await vm.fetch();
+            await vmEdit.fetch();
 
             expect(axios.get).toHaveBeenCalledWith(
                 `WagonTypes`
             );
             expect(axios.get).toHaveBeenCalledWith(
-                `Wagons/1`
+                `Wagons/${entityId}`
             );
         });
     });

test/vitest/__tests__/pages/Wagons/WagonTypeCreate.spec.js

@@ -1,14 +1,18 @@
-import { createWrapper } from 'app/test/vitest/helper';
+import { axios, createWrapper } from 'app/test/vitest/helper';
 import WagonTypeCreate from 'pages/Wagon/Type/WagonTypeCreate.vue';
 import { afterEach, beforeAll, describe, expect, it, vi } from 'vitest';
 
 describe('WagonTypeCreate', () => {
-    let vm;
+    let vmCreate, vmEdit;
+    const entityId = 1;
 
     beforeAll(() => {
-        vm = createWrapper(WagonTypeCreate, {propsData: {
+        vmEdit = createWrapper(WagonTypeCreate, {propsData: {
-                id: 1,
+                id: entityId,
             }}).vm;
+        vmCreate = createWrapper(WagonTypeCreate).vm;
+        vmEdit.wagonConfig = vmCreate.wagonConfig = {maxTrays: 2 ,minHeightBetweenTrays: 50, maxWagonHeight: 200 };
+        vmEdit.wagonTypeColors = vmCreate.wagonTypeColors = [{id: 1, color:'white', rgb:'#000000'}];
     });
 
     afterEach(() => {
@@ -16,22 +20,252 @@ describe('WagonTypeCreate', () => {
     });
 
     describe('addTray()', () => {
-        it('should throw message if there are uncompleteTrays', async () => {
+        it('should throw message if there are uncomplete trays', async () => {
-            vi.spyOn(vm.quasar, 'notify');
+            vi.spyOn(vmEdit.quasar, 'notify');
-            vm.wagon = [{
+            vmEdit.wagon = [{
                 id: 1,
                 position: null,
-                color: {id: 1, color:'white', rgb:'#000000'}
+                color: vmEdit.wagonTypeColors[0]
             }];
 
-            await vm.addTray();
+            await vmEdit.addTray();
 
-            expect(vm.quasar.notify).toHaveBeenCalledWith(
+            expect(vmEdit.quasar.notify).toHaveBeenCalledWith(
-                expect.objectContaining({ type: 'warning' })
+                expect.objectContaining({
+                    type: 'warning',
+                })
             );
         });
+
         it('should create a new tray if the limit has not been reached', async () => {
-            //
+            vmEdit.wagon = [{
+                id: 1,
+                position: 0,
+                color: vmEdit.wagonTypeColors[0]
+            }];
+
+            await vmEdit.addTray();
+            expect(vmEdit.wagon.length).toEqual(2);
+        });
+
+        it('should throw message if there are uncomplete trays', async () => {
+            vi.spyOn(vmEdit.quasar, 'notify');
+            vmEdit.wagon = [{
+                id: 1,
+                position: 0,
+                color: vmEdit.wagonTypeColors[0]
+            },{
+                id: 2,
+                position: 50,
+                color: vmEdit.wagonTypeColors[0]
+            }];
+
+            await vmEdit.addTray();
+
+            expect(vmEdit.quasar.notify).toHaveBeenCalledWith(
+                expect.objectContaining({
+                    type: 'warning',
+                })
+            );
+        });
+    });
+
+    describe('deleteTray() reorderIds()', () => {
+        it('should delete a tray and reorder the ids', async () => {
+            const trayToDelete = {
+                id: 1,
+                position: 0,
+                color: vmEdit.wagonTypeColors[0]
+            };
+            const trayMaintained = {
+                id: 2,
+                position: 50,
+                color: vmEdit.wagonTypeColors[0]
+            };
+            vmEdit.wagon = [trayToDelete,trayMaintained];
+
+            await vmEdit.deleteTray(trayToDelete);
+
+            expect(vmEdit.wagon.length).toEqual(1);
+            expect(vmEdit.wagon[0].id).toEqual(0);
+            expect(vmEdit.wagon[0].position).toEqual(50);
+
+        });
+    });
+
+    describe('onSubmit()', () => {
+        it('should make a patch to editWagonType if have id', async () => {
+            vi.spyOn(axios, 'patch').mockResolvedValue({ data: true });
+            const wagon = {
+                id: entityId,
+                name: "Mock name",
+                divisible: true,
+                trays: [{
+                    id: 1,
+                    position: 0,
+                    color: vmEdit.wagonTypeColors[0]
+                }]
+            }
+            vmEdit.name = wagon.name;
+            vmEdit.divisible = wagon.divisible;
+            vmEdit.wagon = wagon.trays;
+
+            await vmEdit.onSubmit();
+
+            expect(axios.patch).toHaveBeenCalledWith(
+                `WagonTypes/editWagonType`, wagon
+            );
+        });
+
+        it('should make a patch to createtWagonType if not have id', async () => {
+            vi.spyOn(axios, 'patch').mockResolvedValue({ data: true });
+            const wagon = {
+                name: "Mock name",
+                divisible: true,
+                trays: [{
+                    id: 1,
+                    position: 0,
+                    color: vmCreate.wagonTypeColors[0]
+                }]
+            }
+            vmCreate.name = wagon.name;
+            vmCreate.divisible = wagon.divisible;
+            vmCreate.wagon = wagon.trays;
+
+            await vmCreate.onSubmit();
+
+            expect(axios.patch).toHaveBeenCalledWith(
+                `WagonTypes/createWagonType`, wagon
+            );
+        });
+    });
+
+    describe('onReset()', () => {
+        it('should reset if have id', async () => {
+            vmEdit.name = 'Changed name';
+            vmEdit.divisible = false;
+            vmEdit.wagon = [];
+            vmEdit.originalData = {
+                name: 'Original name',
+                divisible: true,
+                trays: [{
+                    id: 1,
+                    position: 0,
+                    color: vmEdit.wagonTypeColors[0]
+                },{
+                    id: 2,
+                    position: 50,
+                    color: vmEdit.wagonTypeColors[0]
+                }]
+            };
+
+            vmEdit.onReset();
+
+            expect(vmEdit.name).toEqual(vmEdit.originalData.name);
+            expect(vmEdit.divisible).toEqual(vmEdit.originalData.divisible);
+            expect(vmEdit.wagon).toEqual(vmEdit.originalData.trays);
+        });
+
+        it('should reset if not have id', async () => {
+            vmCreate.name = 'Changed name';
+            vmCreate.divisible = false;
+            vmCreate.wagon = [];
+
+            vmCreate.onReset();
+
+            expect(vmCreate.name).toEqual(null);
+            expect(vmCreate.divisible).toEqual(false);
+            expect(vmCreate.wagon.length).toEqual(1);
+        });
+    });
+
+    describe('onPositionBlur()', () => {
+        it('should set position null if position is negative', async () => {
+            const negativeTray = {
+                id: 1,
+                position: -1,
+                color: vmCreate.wagonTypeColors[0]
+            };
+
+            vmCreate.onPositionBlur(negativeTray);
+
+            expect(negativeTray.position).toEqual(null);
+        });
+
+        it('should set position and reorder array', async () => {
+            const trays = [{
+                id: 0,
+                position: 100,
+                color: vmCreate.wagonTypeColors[0]
+            },{
+                id: 1,
+                position: 0,
+                color: vmCreate.wagonTypeColors[0]
+            }];
+            const newTray = {
+                id: 2,
+                position: 50,
+                color: vmCreate.wagonTypeColors[0]
+            };
+            trays.push(newTray);
+            vmCreate.wagon = trays;
+
+            vmCreate.onPositionBlur(newTray);
+
+            expect(vmCreate.wagon[0].position).toEqual(100);
+            expect(vmCreate.wagon[1].position).toEqual(50);
+            expect(vmCreate.wagon[2].position).toEqual(0);
+        });
+
+        it('should throw message if not have min height between trays and should set new adequate positions', async () => {
+            vi.spyOn(vmCreate.quasar, 'notify');
+            const trays = [{
+                id: 0,
+                position: 0,
+                color: vmCreate.wagonTypeColors[0]
+            }];
+            const newTray = {
+                id: 1,
+                position: 20,
+                color: vmCreate.wagonTypeColors[0]
+            };
+            trays.push(newTray);
+            vmCreate.wagon = trays;
+
+            vmCreate.onPositionBlur(newTray);
+
+            expect(vmCreate.wagon[0].position).toEqual(50);
+            expect(vmCreate.wagon[1].position).toEqual(0);
+            expect(vmCreate.quasar.notify).toHaveBeenCalledWith(
+                expect.objectContaining({
+                    type: 'warning',
+                })
+            );
+        });
+
+        it('should throw message if max height has been exceed', async () => {
+            vi.spyOn(vmCreate.quasar, 'notify');
+            const trays = [{
+                id: 0,
+                position: 0,
+                color: vmCreate.wagonTypeColors[0]
+            }];
+            const newTray = {
+                id: 1,
+                position: 210,
+                color: vmCreate.wagonTypeColors[0]
+            };
+            trays.push(newTray);
+            vmCreate.wagon = trays;
+
+            vmCreate.onPositionBlur(newTray);
+
+            expect(vmCreate.wagon.length).toEqual(1);
+            expect(vmCreate.quasar.notify).toHaveBeenCalledWith(
+                expect.objectContaining({
+                    type: 'warning',
+                })
+            );
         });
     });
 });