diff --git a/cypress.config.js b/cypress.config.js index 59276f815..31aad6a86 100644 --- a/cypress.config.js +++ b/cypress.config.js @@ -2,7 +2,7 @@ const { defineConfig } = require('cypress'); module.exports = defineConfig({ e2e: { - baseUrl: 'http://localhost:8080/', + baseUrl: 'http://localhost:9000/', fixturesFolder: 'test/cypress/fixtures', screenshotsFolder: 'test/cypress/screenshots', supportFile: 'test/cypress/support/index.js', diff --git a/src/components/common/SendEmailDialog.vue b/src/components/common/SendEmailDialog.vue index f8d80ac06..0db0af056 100644 --- a/src/components/common/SendEmailDialog.vue +++ b/src/components/common/SendEmailDialog.vue @@ -34,19 +34,26 @@ async function confirm() { - {{ t('sendEmailNotification') }} + {{ + t('Send email notification: Send email notification') + }} - {{ t('notifyAddress') }} + {{ t('The notification will be sent to the following address') }} - + @@ -59,14 +66,7 @@ async function confirm() { -{ - "en": { - "sendEmailNotification": "Send email notification", - "notifyAddress": "The notification will be sent to the following address" - }, - "es": { - "sendEmailNotification": "Enviar notificación por correo", - "notifyAddress": "La notificación se enviará a la siguiente dirección" - } -} + es: + Send email notification: Enviar notificación por correo, + The notification will be sent to the following address: La notificación se enviará a la siguiente dirección diff --git a/src/pages/Claim/Card/ClaimPhoto.vue b/src/pages/Claim/Card/ClaimPhoto.vue index cdf139971..354787878 100644 --- a/src/pages/Claim/Card/ClaimPhoto.vue +++ b/src/pages/Claim/Card/ClaimPhoto.vue @@ -17,11 +17,13 @@ const session = useSession(); const token = session.getToken(); const quasar = useQuasar(); -const claimId = computed(function () { - return 1; -}); +const claimId = computed(() => router.currentRoute.value.params.id); -const claimDms = ref([]); +const claimDms = ref([ + { + dmsFk: 1, + }, +]); const client = ref({}); const claimDmsRef = ref(); const dmsType = ref({}); @@ -52,13 +54,11 @@ const claimDmsFilter = ref({ }); const multimediaDialog = ref(); -const multimediaMaximizedDialog = ref(); const multimediaSlide = ref(); function openDialog(dmsId) { multimediaSlide.value = dmsId; multimediaDialog.value = true; - multimediaMaximizedDialog.value = false; } function viewDeleteDms(dmsId) { @@ -66,7 +66,7 @@ function viewDeleteDms(dmsId) { .dialog({ component: VnConfirm, componentProps: { - message: t('message'), + message: t('This file will be deleted'), icon: 'delete', }, }) @@ -75,16 +75,19 @@ function viewDeleteDms(dmsId) { async function deleteDms(index) { const dmsId = claimDms.value[index].dmsFk; - // await axios.post(`ClaimDms/${dmsId}/removeFile`); + await axios.post(`ClaimDms/${dmsId}/removeFile`); + + claimDms.value.splice(index, 1); quasar.notify({ message: t('globals.dataDeleted'), type: 'positive', icon: 'delete', }); - claimDms.value.splice(index, 1); } function setClaimDms(data) { + if (!data) return; + claimDms.value = data.claimDms.map((media) => { media.isVideo = media.dms.contentType == 'video/mp4'; media.url = `${window.location.origin}/api/Claims/${media.dmsFk}/downloadFile?access_token=${token}`; @@ -94,7 +97,6 @@ function setClaimDms(data) { } async function uploadFile() { - claimDmsRef.value.fetch(); const element = document.createElement('input'); element.setAttribute('type', 'file'); element.setAttribute('multiple', true); @@ -182,7 +184,7 @@ function onDrag() { >
- + {{ t('claim.photo.dragDrop') }}
- + {{ t('claim.photo.noData') }}
@@ -241,20 +243,20 @@ function onDrag() {
- + - + - "en": { - "message": "This file will be deleted" - } - - "es": { - "message": "Este archivo va a ser borrado" - } + es: + This file will be deleted: Este archivo va a ser borrado diff --git a/test/cypress/fixtures/image.jpg b/test/cypress/fixtures/image.jpg new file mode 100644 index 000000000..83052dea6 Binary files /dev/null and b/test/cypress/fixtures/image.jpg differ diff --git a/test/cypress/integration/claimPhoto.spec.js b/test/cypress/integration/claimPhoto.spec.js new file mode 100755 index 000000000..a11f7208b --- /dev/null +++ b/test/cypress/integration/claimPhoto.spec.js @@ -0,0 +1,50 @@ +/// +describe('ClaimPhoto', () => { + beforeEach(() => { + const claimId = 1; + cy.viewport(1280, 720); + cy.login('developer'); + cy.visit(`/#/claim/${claimId}/photos`); + }); + + xit('should add new file', () => { + cy.get('.q-gutter-x-sm > .q-btn > .q-btn__content > .q-icon').click(); + cy.get('.container').selectFile('test/cypress/fixtures/image.jpg', { + force: true, + }); + cy.get('.q-notification__message').should('have.text', 'Data saved'); + }); + + it('should add new file with drag and drop', () => { + cy.get('.container').selectFile('test/cypress/fixtures/image.jpg', { + action: 'drag-drop', + }); + cy.get('.q-notification__message').should('have.text', 'Data saved'); + }); + + it('should open first image dialog change to second and close', () => { + cy.get( + ':nth-child(1) > .q-card > .q-img > .q-img__container > .q-img__image' + ).click(); + cy.get('.q-carousel__slide > .q-img > .q-img__container > .q-img__image').should( + 'be.visible' + ); + + cy.get('.q-carousel__control > .q-btn > .q-btn__content > .q-icon').click(); + + cy.get( + '.q-dialog__inner > .q-toolbar > .q-btn > .q-btn__content > .q-icon' + ).click(); + cy.get('.q-carousel__slide > .q-img > .q-img__container > .q-img__image').should( + 'not.be.visible' + ); + }); + + it('should remove first file', () => { + cy.get( + '.multimediaParent > :nth-child(1) > .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'); + }); +}); diff --git a/test/vitest/__tests__/pages/Claims/ClaimDescriptorMenu.spec.js b/test/vitest/__tests__/pages/Claims/ClaimDescriptorMenu.spec.js index 3a2ec46d7..a1c3a38ed 100644 --- a/test/vitest/__tests__/pages/Claims/ClaimDescriptorMenu.spec.js +++ b/test/vitest/__tests__/pages/Claims/ClaimDescriptorMenu.spec.js @@ -25,7 +25,9 @@ describe('ClaimDescriptorMenu', () => { await vm.deleteClaim(); - expect(vm.quasar.notify).toHaveBeenCalledWith(expect.objectContaining({ type: 'positive' })); + expect(vm.quasar.notify).toHaveBeenCalledWith( + expect.objectContaining({ type: 'positive' }) + ); }); }); }); diff --git a/test/vitest/__tests__/pages/Claims/ClaimPhoto.spec.js b/test/vitest/__tests__/pages/Claims/ClaimPhoto.spec.js index a383a494c..4aba572c7 100644 --- a/test/vitest/__tests__/pages/Claims/ClaimPhoto.spec.js +++ b/test/vitest/__tests__/pages/Claims/ClaimPhoto.spec.js @@ -1,32 +1,105 @@ import { vi, describe, expect, it, beforeAll, afterEach } from 'vitest'; import { ref } from 'vue'; +import { mount } from '@vue/test-utils'; import { createWrapper, axios } from 'app/test/vitest/helper'; import ClaimPhoto from 'pages/Claim/Card/ClaimPhoto.vue'; +import * as FormData from 'form-data'; describe('ClaimPhoto', () => { let vm; - beforeAll(() => { - vm = createWrapper(ClaimPhoto).vm; - //setup: () => { claimDms: ref([]) + const claimMock = { + claimDms: [ + { + dmsFk: 1, + dms: { + contentType: 'contentType', + }, + }, + ], + client: { + id: '1', + }, + }; + beforeAll(() => { + vm = createWrapper(ClaimPhoto, { + global: { + stubs: ['FetchData', 'TeleportSlot'], + mocks: { + claimDms: [{ dmsFk: 1 }], + }, + }, + }).vm; }); afterEach(() => { - //vi.clearAllMocks(); + vi.clearAllMocks(); + }); + + describe('deleteDms()', () => { + it('should delete dms and call quasar notify', async () => { + vi.spyOn(axios, 'post').mockResolvedValue({ data: true }); + vi.spyOn(vm.quasar, 'notify'); + + await vm.deleteDms(0); + + expect(vm.quasar.notify).toHaveBeenCalledWith( + expect.objectContaining({ type: 'positive' }) + ); + expect(vm.claimDms).toEqual([]); + }); }); describe('viewDeleteDms()', () => { it('should call quasar dialog', async () => { - console.log(vm.quasar); - vi.spyOn(axios, 'get').mockResolvedValue(); - vi.spyOn(axios, 'post').mockResolvedValue(); + vi.spyOn(vm.quasar, 'dialog'); + + await vm.viewDeleteDms(1); + + expect(vm.quasar.dialog).toHaveBeenCalledWith( + expect.objectContaining({ + componentProps: { + message: 'This file will be deleted', + icon: 'delete', + }, + }) + ); + }); + }); + + describe('setClaimDms()', () => { + it('should assign claimDms and client from data', async () => { + await vm.setClaimDms(claimMock); + + expect(vm.claimDms).toEqual([ + { + dmsFk: 1, + dms: { + contentType: 'contentType', + }, + isVideo: false, + url: '///api/Claims/1/downloadFile?access_token=', + }, + ]); + + expect(vm.client).toEqual(claimMock.client); + }); + }); + + describe.skip('create()', () => { + it('should upload file and call quasar notify', async () => { + const files = [{ name: 'firstFile' }]; + vi.spyOn(axios, 'post').mockResolvedValue({ data: true }); vi.spyOn(vm.quasar, 'notify'); - // await vm.viewDeleteDms(); + await vm.create(files); - // expect(vm.quasar.notify).toHaveBeenCalledWith( - // expect.objectContaining({ type: 'positive' }) - // ); + expect(axios).toHaveBeenCalledWith( + expect.objectContaining({ type: 'positive' }) + ); + expect(vm.quasar.notify).toHaveBeenCalledWith( + expect.objectContaining({ type: 'positive' }) + ); }); }); }); diff --git a/test/vitest/helper.js b/test/vitest/helper.js index 13987080d..795879ebd 100644 --- a/test/vitest/helper.js +++ b/test/vitest/helper.js @@ -17,18 +17,49 @@ const mockPush = vi.fn(); vi.mock('vue-router', () => ({ useRouter: () => ({ push: mockPush, - currentRoute: { value: 'myCurrentRoute' }, + currentRoute: { + value: { + params: { + id: 1, + }, + }, + }, }), useRoute: () => ({ matched: [], }), })); +// class FormDataMock { +// append() { +// vi.fn(); +// } +// delete() { +// vi.fn(); +// } +// get() { +// vi.fn(); +// } +// getAll() { +// vi.fn(); +// } +// has() { +// vi.fn(); +// } +// set() { +// vi.fn(); +// } +// forEach() { +// vi.fn(); +// } +// } + export function createWrapper(component, options) { const pinia = createTestingPinia({ createSpy: vi.fn, stubActions: false }); const defaultOptions = { global: { + // FormData: FormDataMock, plugins: [i18n, pinia], }, };