0
0
Fork 0

test: refs #8061 #8061 updates

This commit is contained in:
Javier Segarra 2024-11-16 14:30:16 +01:00
parent c7c9c13944
commit 1a0a2d9442
4 changed files with 42 additions and 110 deletions

View File

@ -1,24 +1,13 @@
// tests/CreateNewCityForm.spec.js // tests/CreateNewCityForm.spec.js
import { mount } from '@vue/test-utils'; import { mount } from '@vue/test-utils';
import { describe, it, expect, vi } from 'vitest'; import { describe, it, expect, vi } from 'vitest';
import CreateNewCityForm from 'path/to/CreateNewCityForm.vue'; import CreateNewCityForm from 'src/components/CreateNewCityForm.vue';
import { useI18n } from 'vue-i18n';
import { Quasar } from 'quasar'; import { Quasar } from 'quasar';
import { createTestingPinia } from '@pinia/testing'; import { createWrapper, axios } from 'app/test/vitest/helper';
vi.mock('vue-i18n', () => ({
useI18n: () => ({
t: (key) => key,
}),
}));
describe('CreateNewCityForm.vue', () => { describe('CreateNewCityForm.vue', () => {
it('renders the form correctly', () => { it('renders the form correctly', () => {
const wrapper = mount(CreateNewCityForm, { const wrapper = createWrapper(CreateNewCityForm);
global: {
plugins: [Quasar, createTestingPinia()],
},
});
expect(wrapper.find('form').exists()).toBe(true); expect(wrapper.find('form').exists()).toBe(true);
expect(wrapper.find('input[name="cityName"]').exists()).toBe(true); expect(wrapper.find('input[name="cityName"]').exists()).toBe(true);
@ -27,11 +16,7 @@ describe('CreateNewCityForm.vue', () => {
}); });
it('emits onDataSaved when form is submitted', async () => { it('emits onDataSaved when form is submitted', async () => {
const wrapper = mount(CreateNewCityForm, { const wrapper = createWrapper(CreateNewCityForm);
global: {
plugins: [Quasar, createTestingPinia()],
},
});
const form = wrapper.find('form'); const form = wrapper.find('form');
await form.trigger('submit.prevent'); await form.trigger('submit.prevent');
@ -40,21 +25,13 @@ describe('CreateNewCityForm.vue', () => {
}); });
it('calls t function from useI18n', () => { it('calls t function from useI18n', () => {
const wrapper = mount(CreateNewCityForm, { const wrapper = createWrapper(CreateNewCityForm);
global: {
plugins: [Quasar, createTestingPinia()],
},
});
expect(wrapper.vm.t).toBeDefined(); expect(wrapper.vm.t).toBeDefined();
}); });
it('updates city data correctly', async () => { it('updates city data correctly', async () => {
const wrapper = mount(CreateNewCityForm, { const wrapper = createWrapper(CreateNewCityForm);
global: {
plugins: [Quasar, createTestingPinia()],
},
});
const cityNameInput = wrapper.find('input[name="cityName"]'); const cityNameInput = wrapper.find('input[name="cityName"]');
await cityNameInput.setValue('New City'); await cityNameInput.setValue('New City');

View File

@ -1,24 +1,13 @@
// tests/CreateNewPostcodeForm.spec.js // tests/CreateNewPostcodeForm.spec.js
import { mount } from '@vue/test-utils'; import { mount } from '@vue/test-utils';
import { describe, it, expect, vi } from 'vitest'; import { describe, it, expect, vi } from 'vitest';
import CreateNewPostcodeForm from 'path/to/CreateNewPostcodeForm.vue'; import CreateNewPostcodeForm from 'src/components/CreateNewPostcodeForm.vue';
import { useI18n } from 'vue-i18n';
import { Quasar } from 'quasar'; import { Quasar } from 'quasar';
import { createTestingPinia } from '@pinia/testing'; import { createWrapper, axios } from 'app/test/vitest/helper';
vi.mock('vue-i18n', () => ({
useI18n: () => ({
t: (key) => key,
}),
}));
describe('CreateNewPostcodeForm.vue', () => { describe('CreateNewPostcodeForm.vue', () => {
it('renders the form correctly', () => { it('renders the form correctly', () => {
const wrapper = mount(CreateNewPostcodeForm, { const wrapper = createWrapper(CreateNewPostcodeForm);
global: {
plugins: [Quasar, createTestingPinia()],
},
});
expect(wrapper.find('form').exists()).toBe(true); expect(wrapper.find('form').exists()).toBe(true);
expect(wrapper.find('input[label="Postcode"]').exists()).toBe(true); expect(wrapper.find('input[label="Postcode"]').exists()).toBe(true);
@ -28,11 +17,7 @@ describe('CreateNewPostcodeForm.vue', () => {
}); });
it('calls onDataSaved when form is submitted', async () => { it('calls onDataSaved when form is submitted', async () => {
const wrapper = mount(CreateNewPostcodeForm, { const wrapper = createWrapper(CreateNewPostcodeForm);
global: {
plugins: [Quasar, createTestingPinia()],
},
});
const formModelPopup = wrapper.findComponent({ name: 'FormModelPopup' }); const formModelPopup = wrapper.findComponent({ name: 'FormModelPopup' });
await formModelPopup.vm.$emit('onDataSaved', { code: '12345' }); await formModelPopup.vm.$emit('onDataSaved', { code: '12345' });
@ -42,11 +27,7 @@ describe('CreateNewPostcodeForm.vue', () => {
}); });
it('updates town when a new city is created', async () => { it('updates town when a new city is created', async () => {
const wrapper = mount(CreateNewPostcodeForm, { const wrapper = createWrapper(CreateNewPostcodeForm);
global: {
plugins: [Quasar, createTestingPinia()],
},
});
const createNewCityForm = wrapper.findComponent({ name: 'CreateNewCityForm' }); const createNewCityForm = wrapper.findComponent({ name: 'CreateNewCityForm' });
const newTown = { id: 1, name: 'New Town', provinceFk: 2 }; const newTown = { id: 1, name: 'New Town', provinceFk: 2 };
@ -56,11 +37,7 @@ describe('CreateNewPostcodeForm.vue', () => {
}); });
it('fetches provinces and towns when country changes', async () => { it('fetches provinces and towns when country changes', async () => {
const wrapper = mount(CreateNewPostcodeForm, { const wrapper = createWrapper(CreateNewPostcodeForm);
global: {
plugins: [Quasar, createTestingPinia()],
},
});
wrapper.vm.postcodeFormData.countryFk = 1; wrapper.vm.postcodeFormData.countryFk = 1;
await wrapper.vm.$nextTick(); await wrapper.vm.$nextTick();

View File

@ -1,24 +1,13 @@
// tests/CreateNewProvinceForm.spec.js // tests/CreateNewProvinceForm.spec.js
import { mount } from '@vue/test-utils'; import { mount } from '@vue/test-utils';
import { describe, it, expect, vi } from 'vitest'; import { describe, it, expect, vi } from 'vitest';
import CreateNewProvinceForm from 'path/to/CreateNewProvinceForm.vue'; import CreateNewProvinceForm from 'src/components/CreateNewProvinceForm.vue';
import { useI18n } from 'vue-i18n';
import { Quasar } from 'quasar'; import { Quasar } from 'quasar';
import { createTestingPinia } from '@pinia/testing'; import { createWrapper, axios } from 'app/test/vitest/helper';
vi.mock('vue-i18n', () => ({
useI18n: () => ({
t: (key) => key,
}),
}));
describe('CreateNewProvinceForm.vue', () => { describe('CreateNewProvinceForm.vue', () => {
it('renders the form correctly', () => { it('renders the form correctly', () => {
const wrapper = mount(CreateNewProvinceForm, { const wrapper = createWrapper(CreateNewProvinceForm);
global: {
plugins: [Quasar, createTestingPinia()],
},
});
expect(wrapper.find('form').exists()).toBe(true); expect(wrapper.find('form').exists()).toBe(true);
expect(wrapper.findComponent({ name: 'VnInput' }).exists()).toBe(true); expect(wrapper.findComponent({ name: 'VnInput' }).exists()).toBe(true);
@ -26,11 +15,7 @@ describe('CreateNewProvinceForm.vue', () => {
}); });
it('emits onDataSaved when form is submitted', async () => { it('emits onDataSaved when form is submitted', async () => {
const wrapper = mount(CreateNewProvinceForm, { const wrapper = createWrapper(CreateNewProvinceForm);
global: {
plugins: [Quasar, createTestingPinia()],
},
});
const formModelPopup = wrapper.findComponent({ name: 'FormModelPopup' }); const formModelPopup = wrapper.findComponent({ name: 'FormModelPopup' });
await formModelPopup.vm.$emit('onDataSaved', { name: 'New Province' }); await formModelPopup.vm.$emit('onDataSaved', { name: 'New Province' });
@ -40,21 +25,13 @@ describe('CreateNewProvinceForm.vue', () => {
}); });
it('calls t function from useI18n', () => { it('calls t function from useI18n', () => {
const wrapper = mount(CreateNewProvinceForm, { const wrapper = createWrapper(CreateNewProvinceForm);
global: {
plugins: [Quasar, createTestingPinia()],
},
});
expect(wrapper.vm.t).toBeDefined(); expect(wrapper.vm.t).toBeDefined();
}); });
it('updates province data correctly', async () => { it('updates province data correctly', async () => {
const wrapper = mount(CreateNewProvinceForm, { const wrapper = createWrapper(CreateNewProvinceForm);
global: {
plugins: [Quasar, createTestingPinia()],
},
});
const provinceNameInput = wrapper.findComponent({ name: 'VnInput' }); const provinceNameInput = wrapper.findComponent({ name: 'VnInput' });
await provinceNameInput.setValue('New Province'); await provinceNameInput.setValue('New Province');

View File

@ -1,34 +1,35 @@
import { mount } from '@vue/test-utils'; import { mount } from '@vue/test-utils';
import { describe, it, expect, vi } from 'vitest'; import { describe, it, expect, vi } from 'vitest';
import VnSelectProvince from './VnSelectProvince.vue'; import VnSelectProvince from 'src/components/VnSelectProvince.vue';
import FetchData from 'components/FetchData.vue'; import FetchData from 'components/FetchData.vue';
import VnSelectDialog from 'components/common/VnSelectDialog.vue'; import VnSelectDialog from 'components/common/VnSelectDialog.vue';
import CreateNewProvinceForm from './CreateNewProvinceForm.vue'; import CreateNewProvinceForm from './CreateNewProvinceForm.vue';
import { createWrapper, axios } from 'app/test/vitest/helper';
vi.mock('components/FetchData.vue', () => ({ // vi.mock('components/FetchData.vue', () => ({
default: { // default: {
name: 'FetchData', // name: 'FetchData',
template: '<div><slot></slot></div>', // template: '<div><slot></slot></div>',
}, // },
})); // }));
vi.mock('components/common/VnSelectDialog.vue', () => ({ // vi.mock('components/common/VnSelectDialog.vue', () => ({
default: { // default: {
name: 'VnSelectDialog', // name: 'VnSelectDialog',
template: '<div><slot></slot><slot name="form"></slot></div>', // template: '<div><slot></slot><slot name="form"></slot></div>',
}, // },
})); // }));
vi.mock('./CreateNewProvinceForm.vue', () => ({ // vi.mock('./CreateNewProvinceForm.vue', () => ({
default: { // default: {
name: 'CreateNewProvinceForm', // name: 'CreateNewProvinceForm',
template: '<div></div>', // template: '<div></div>',
}, // },
})); // }));
describe('VnSelectProvince.vue', () => { describe('VnSelectProvince.vue', () => {
it('renders correctly with default props', () => { it('renders correctly with default props', () => {
const wrapper = mount(VnSelectProvince, { const wrapper = createWrapper(VnSelectProvince, {
props: { props: {
countryFk: 1, countryFk: 1,
provinceSelected: 2, provinceSelected: 2,
@ -39,7 +40,7 @@ describe('VnSelectProvince.vue', () => {
it('calls fetch method on countryFk change', async () => { it('calls fetch method on countryFk change', async () => {
const fetchMock = vi.fn(); const fetchMock = vi.fn();
const wrapper = mount(VnSelectProvince, { const wrapper = createWrapper(VnSelectProvince, {
props: { props: {
countryFk: 1, countryFk: 1,
provinceSelected: 2, provinceSelected: 2,
@ -58,7 +59,7 @@ describe('VnSelectProvince.vue', () => {
}); });
it('emits onProvinceCreated event when a new province is created', async () => { it('emits onProvinceCreated event when a new province is created', async () => {
const wrapper = mount(VnSelectProvince, { const wrapper = createWrapper(VnSelectProvince, {
props: { props: {
countryFk: 1, countryFk: 1,
provinceSelected: 2, provinceSelected: 2,
@ -71,7 +72,7 @@ describe('VnSelectProvince.vue', () => {
}); });
it('updates provincesOptions when handleProvinces is called', async () => { it('updates provincesOptions when handleProvinces is called', async () => {
const wrapper = mount(VnSelectProvince, { const wrapper = createWrapper(VnSelectProvince, {
props: { props: {
countryFk: 1, countryFk: 1,
provinceSelected: 2, provinceSelected: 2,