From 20102a89abbe03649e617d180255276e5519b434 Mon Sep 17 00:00:00 2001 From: jorgep Date: Wed, 27 Mar 2024 11:14:54 +0100 Subject: [PATCH] feat: refs #6893 improve VnSearchbar & create tests --- CHANGELOG.md | 3 ++ src/components/ui/VnSearchbar.vue | 12 ++--- test/cypress/integration/vnSearchBar.spec.js | 45 ++++++++++++++----- .../components/common/VnSearchBar.spec.js | 43 +++++++++++------- 4 files changed, 69 insertions(+), 34 deletions(-) diff --git a/CHANGELOG.md b/CHANGELOG.md index 51dd2010c..d15ad787d 100644 --- a/CHANGELOG.md +++ b/CHANGELOG.md @@ -10,11 +10,14 @@ and this project adheres to [Semantic Versioning](https://semver.org/spec/v2.0.0 ### Added - (Tickets) => Se añade la opción de clonar ticket. #6951 +- (Parking) => Se añade la sección Parking. #5186 ### Changed ### Fixed +- (General) => Se corrige la redirección cuando hay 1 solo registro y cuando se aplica un filtro diferente al id al hacer una búsqueda general. #6893 + ## [2400.01] - 2024-01-04 ### Added diff --git a/src/components/ui/VnSearchbar.vue b/src/components/ui/VnSearchbar.vue index 34da7cbf5..ddf520d0f 100644 --- a/src/components/ui/VnSearchbar.vue +++ b/src/components/ui/VnSearchbar.vue @@ -65,9 +65,9 @@ const props = defineProps({ }, }); -const { currentRoute, push } = useRouter(); +const router = useRouter(); const arrayData = useArrayData(props.dataKey, { ...props }); -const store = arrayData.store; +const { store } = arrayData; const searchText = ref(''); onMounted(() => { @@ -90,17 +90,17 @@ async function search() { if (!props.redirect) return; if (props.customRouteRedirectName) - return push({ + return router.push({ name: props.customRouteRedirectName, params: { id: searchText.value }, }); - const { matched: matches } = currentRoute.value; + const { matched: matches } = router.currentRoute.value; const { path } = matches.at(-1); const [, moduleName] = path.split('/'); if (!store.data.length || store.data.length > 1) - return push({ path: `/${moduleName}/list` }); + return router.push({ path: `/${moduleName}/list` }); const targetId = store.data[0].id; let targetUrl; @@ -108,7 +108,7 @@ async function search() { if (path.endsWith('/list')) targetUrl = path.replace('/list', `/${targetId}/summary`); else if (path.includes(':id')) targetUrl = path.replace(':id', targetId); - await push({ path: targetUrl }); + await router.push({ path: targetUrl }); } diff --git a/test/cypress/integration/vnSearchBar.spec.js b/test/cypress/integration/vnSearchBar.spec.js index d6dea0780..3db789773 100644 --- a/test/cypress/integration/vnSearchBar.spec.js +++ b/test/cypress/integration/vnSearchBar.spec.js @@ -1,19 +1,42 @@ /// describe('VnSearchBar', () => { + const employeeId = ' #1'; + const salesPersonId = ' #18'; + const idGap = '.q-item > .q-item__label'; + const cardList = '.vn-card-list'; + + let url; beforeEach(() => { cy.login('developer'); - cy.visit('/'); + cy.visit('#/customer/list'); + cy.url().then((currentUrl) => (url = currentUrl)); }); - it('should redirect to new customer', () => { - cy.visit('#/customer/1112/basic-data') - cy.openLeftMenu(); - cy.get('.q-item > .q-item__label').should('have.text',' #1112') - cy.closeLeftMenu(); - cy.clearSearchbar(); - cy.writeSearchbar('1{enter}'); - cy.openLeftMenu(); - cy.get('.q-item > .q-item__label').should('have.text',' #1') - cy.closeLeftMenu(); + it('should redirect to customer summary page', () => { + searchAndCheck('1', employeeId); + searchAndCheck('salesPerson', salesPersonId); + }); + + it('should stay on the list page if there are several results or none', () => { + cy.writeSearchbar('salesA{enter}'); + checkCardListAndUrl(2); + + cy.clearSearchbar(); + + cy.writeSearchbar('0{enter}'); + checkCardListAndUrl(0); + }); + + const searchAndCheck = (searchTerm, expectedText) => { + cy.clearSearchbar(); + cy.writeSearchbar(`${searchTerm}{enter}`); + cy.get(idGap).should('have.text', expectedText); + }; + + const checkCardListAndUrl = (expectedLength) => { + cy.get(cardList).then(($cardList) => { + expect($cardList.find('.q-card').length).to.equal(expectedLength); + cy.url().then((currentUrl) => expect(currentUrl).to.equal(url)); }); + }; }); diff --git a/test/vitest/__tests__/components/common/VnSearchBar.spec.js b/test/vitest/__tests__/components/common/VnSearchBar.spec.js index fd0a026ef..0938ae9c0 100644 --- a/test/vitest/__tests__/components/common/VnSearchBar.spec.js +++ b/test/vitest/__tests__/components/common/VnSearchBar.spec.js @@ -1,11 +1,11 @@ -import { vi, describe, expect, it, beforeAll, beforeEach, afterEach } from 'vitest'; -import { createWrapper, axios } from 'app/test/vitest/helper'; +import { vi, describe, expect, it, beforeAll, afterEach, beforeEach } from 'vitest'; +import { createWrapper } from 'app/test/vitest/helper'; import VnSearchbar from 'components/ui/VnSearchbar.vue'; - - +// Probar a importar como plugin vue-router en archivo helper describe('VnSearchBar', () => { let vm; let wrapper; + let pushSpy; beforeAll(() => { wrapper = createWrapper(VnSearchbar, { @@ -16,7 +16,7 @@ describe('VnSearchBar', () => { }, }); vm = wrapper.vm; - vm.route.matched = [ + vm.router.currentRoute.value.matched = [ { path: '/', }, @@ -30,24 +30,33 @@ describe('VnSearchBar', () => { path: '/customer/:id/basic-data', }, ]; + + pushSpy = vi.spyOn(vm.router, 'push'); + vi.spyOn(vm.arrayData, 'applyFilter'); }); - afterEach(() => { - vi.clearAllMocks(); - }); + beforeEach(() => (vm.store.data = [{ id: 1112, name: 'Trash' }])); + afterEach(() => vi.clearAllMocks()); + it('should be defined', async () => { expect(vm.searchText).toBeDefined(); expect(vm.searchText).toEqual(''); }); - it('should redirect', async () => { - vi.spyOn(vm.router,'push'); - vm.searchText = '1'; + + it('should redirect to list page if there are several results', async () => { + vm.store.data.push({ id: 1, name: 'employee' }); await vm.search(); - expect(vm.router.push).toHaveBeenCalledWith('/customer/1/basic-data'); - vm.searchText = '1112'; - expect(vm.searchText).toEqual('1112'); - vi.spyOn(vm.router,'push'); + expect(pushSpy).toHaveBeenCalledWith({ path: '/customer/list' }); + }); + + it('should redirect to list page if there is no results', async () => { + vm.store.data.pop(); await vm.search(); - expect(vm.router.push).toHaveBeenCalledWith('/customer/1112/basic-data'); - }); + expect(pushSpy).toHaveBeenCalledWith({ path: '/customer/list' }); + }); + + it('should redirect to basic-data page if there is only one result', async () => { + await vm.search(); + expect(pushSpy).toHaveBeenCalledWith({ path: '/customer/1112/basic-data' }); + }); });