test: front and e2e

src/pages/Claim/Card/ClaimCard.vue

@@ -11,20 +11,6 @@ const state = useState();
             <claim-descriptor />
             <q-separator />
             <left-menu source="card" />
-            <q-separator />
-            <q-list>
-                <q-item
-                    active-class="text-primary"
-                    href="http://localhost:5000/#!/claim/1/detail"
-                    clickable
-                    v-ripple
-                >
-                    <q-item-section avatar>
-                        <q-icon name="disabled_by_default" />
-                    </q-item-section>
-                    <q-item-section> Detalles </q-item-section>
-                </q-item>
-            </q-list>
         </q-scroll-area>
     </q-drawer>
     <q-page-container>

src/pages/Claim/Card/ClaimPhoto.vue

@@ -13,6 +13,7 @@ import FetchData from 'components/FetchData.vue';
 
 const router = useRouter();
 const { t } = useI18n();
+
 const session = useSession();
 const token = session.getToken();
 const quasar = useQuasar();
@@ -131,7 +132,7 @@ async function create() {
         type: 'positive',
         icon: 'check',
     });
-    console.log(claimDmsRef);
+
     claimDmsRef.value.fetch();
 }
 
@@ -269,7 +270,17 @@ function onDrag() {
                 @click="inputFile.nativeEl.click()"
                 icon="add_circle"
                 :label="t('globals.add')"
-            />
+            >
+                <q-input
+                    ref="inputFile"
+                    type="file"
+                    style="display: none"
+                    multiple
+                    v-model="files"
+                    @update:model-value="create()"
+                />
+                <q-tooltip bottom> {{ t('globals.add') }} </q-tooltip>
+            </q-tab>
         </q-tabs>
     </teleport-slot>
 

test/cypress/integration/claimPhoto.spec.js

@@ -2,10 +2,8 @@
 describe('ClaimPhoto', () => {
     beforeEach(() => {
         const claimId = 1;
-        cy.viewport(1280, 720);
+        cy.login('developer');
-        cy.login('developer').then(() => {
+        cy.visit(`/#/claim/${claimId}/photos`);
-            cy.visit(`/#/claim/${claimId}/photos`);
-        });
     });
 
     it('should add new file', () => {
@@ -41,9 +39,15 @@ describe('ClaimPhoto', () => {
         );
     });
 
-    it('should remove first file', () => {
+    it('should remove third and fourth file', () => {
         cy.get(
-            '.multimediaParent > :nth-child(1) > .q-btn > .q-btn__content > .q-icon'
+            '.multimediaParent > :nth-child(3) > .q-btn > .q-btn__content > .q-icon'
+        ).click();
+        cy.get('.q-btn--standard > .q-btn__content > .block').click();
+        cy.get('.q-notification__message').should('have.text', 'Data deleted');
+
+        cy.get(
+            '.multimediaParent > :nth-child(3) > .q-btn > .q-btn__content > .q-icon'
         ).click();
         cy.get('.q-btn--standard > .q-btn__content > .block').click();
         cy.get('.q-notification__message').should('have.text', 'Data deleted');

test/cypress/support/commands.js

@@ -28,7 +28,7 @@
 // Imports Quasar Cypress AE predefined commands
 // import { registerCommands } from '@quasar/quasar-app-extension-testing-e2e-cypress';
 Cypress.Commands.add('login', (user) => {
-    cy.visit('/#/login');
+    //cy.visit('/#/login');
     cy.request({
         method: 'POST',
         url: '/api/accounts/login',

test/vitest/__tests__/pages/Claims/ClaimPhoto.spec.js

@@ -21,10 +21,9 @@ describe('ClaimPhoto', () => {
     beforeAll(() => {
         vm = createWrapper(ClaimPhoto, {
             global: {
-                stubs: ['FetchData', 'TeleportSlot'],
+                stubs: ['FetchData', 'TeleportSlot', 'vue-i18n'],
                 mocks: {
-                    claimDms: [{ dmsFk: 1 }],
+                    fetch: vi.fn(),
-                    claimDmsRef: { hola: 'hola' },
                 },
             },
         }).vm;
@@ -91,18 +90,24 @@ describe('ClaimPhoto', () => {
         it('should upload file and call quasar notify', async () => {
             const files = [{ name: 'firstFile' }];
 
-            vi.mock('claimDmsRef', {});
             vi.spyOn(axios, 'post').mockResolvedValue({ data: true });
             vi.spyOn(vm.quasar, 'notify');
+            vi.spyOn(vm.claimDmsRef, 'fetch');
 
             await vm.create(files);
 
             expect(axios.post).toHaveBeenCalledWith(
-                expect.objectContaining({ type: 'positive' })
+                'claims/1/uploadFile',
+                new FormData(),
+                expect.objectContaining({
+                    params: expect.objectContaining({ hasFile: false }),
+                })
             );
             expect(vm.quasar.notify).toHaveBeenCalledWith(
                 expect.objectContaining({ type: 'positive' })
             );
+
+            expect(vm.claimDmsRef.fetch).toHaveBeenCalledOnce();
         });
     });
 });