133 lines
4.6 KiB
JavaScript
133 lines
4.6 KiB
JavaScript
import { vi, describe, it, expect, beforeEach } from 'vitest';
|
|
import { createWrapper, axios } from 'app/test/vitest/helper';
|
|
|
|
import VnLocation from 'src/components/common/VnLocation.vue'; // Ajusta la ruta según tu estructura de proyecto
|
|
|
|
describe('VnLocation', () => {
|
|
let wrapper, vm;
|
|
|
|
beforeEach(() => {
|
|
vi.spyOn(axios, 'get').mockResolvedValue({
|
|
data: [
|
|
{
|
|
townFk: 1,
|
|
provinceFk: 1,
|
|
countryFk: 1,
|
|
code: '46000',
|
|
town: 'Valencia',
|
|
province: 'Province one',
|
|
country: 'España',
|
|
},
|
|
{
|
|
townFk: 1,
|
|
provinceFk: 1,
|
|
countryFk: 1,
|
|
code: '46600',
|
|
town: 'Valencia',
|
|
province: 'Province one',
|
|
country: 'España',
|
|
},
|
|
{
|
|
townFk: 2,
|
|
provinceFk: 1,
|
|
countryFk: 1,
|
|
code: '46460',
|
|
town: 'Gotham',
|
|
province: 'Province one',
|
|
country: 'España',
|
|
},
|
|
{
|
|
townFk: 3,
|
|
provinceFk: 1,
|
|
countryFk: 1,
|
|
code: '46680',
|
|
town: 'Algemesi',
|
|
province: 'Province one',
|
|
country: 'España',
|
|
},
|
|
{
|
|
townFk: 4,
|
|
provinceFk: 1,
|
|
countryFk: 1,
|
|
code: '46600',
|
|
town: 'Alzira',
|
|
province: 'Province one',
|
|
country: 'España',
|
|
},
|
|
{
|
|
townFk: 5,
|
|
provinceFk: 5,
|
|
countryFk: 13,
|
|
code: 'EC170150',
|
|
town: 'Quito',
|
|
province: 'Province five',
|
|
country: 'Ecuador',
|
|
},
|
|
],
|
|
});
|
|
const cmp = createWrapper(VnLocation, {
|
|
global: {
|
|
stubs: [
|
|
'vnPaginate',
|
|
'useState',
|
|
'arrayData',
|
|
'useStateStore',
|
|
'vue-i18n',
|
|
],
|
|
},
|
|
});
|
|
wrapper = cmp.wrapper;
|
|
vm = cmp.vm;
|
|
});
|
|
|
|
it.only('should handle click on input', async () => {
|
|
// Simula el clic en el input de ubicación
|
|
await wrapper.get('input[aria-label="Location"]').trigger('click');
|
|
const labelFormatted = vm.showLabel({
|
|
townFk: 5,
|
|
provinceFk: 5,
|
|
countryFk: 13,
|
|
code: 'EC170150',
|
|
town: 'Quito',
|
|
province: 'Province five',
|
|
country: 'Ecuador',
|
|
});
|
|
expect(labelFormatted).toBe('EC170150, Quito(Province five), Ecuador');
|
|
// Verifica que los datos se hayan cargado correctamente
|
|
await wrapper.vm.$nextTick(); // Espera a que se actualice el DOM
|
|
const options = wrapper.findAll('select[name="town"] option');
|
|
expect(options).toHaveLength(6); // Verifica que las opciones se hayan cargado
|
|
});
|
|
it('should filter provinces based on selected country', async () => {
|
|
// Simula la selección de un país
|
|
const element = await wrapper.get('input[aria-label="Location"]');
|
|
element.setValue('Ecuador');
|
|
await vm.$nextTick();
|
|
|
|
// Verifica que las provincias se filtren
|
|
const provinces = wrapper.findAll('select[name="province"] option');
|
|
expect(provinces).toHaveLength(1);
|
|
});
|
|
|
|
it('should filter towns based on selected province', async () => {
|
|
// Simula la selección de una provincia
|
|
await wrapper.find('select[name="province"]').setValue('Ecuador');
|
|
|
|
// Verifica que los pueblos se filtren
|
|
const towns = wrapper.findAll('select[name="town"] option');
|
|
expect(towns).toHaveLength(1);
|
|
});
|
|
|
|
it('should pass selected country', async () => {
|
|
const country = 'Ecuador';
|
|
const province = 'Province five';
|
|
|
|
// Simula la selección de un país y una provincia
|
|
await wrapper.find('select[name="country"]').setValue(country);
|
|
await wrapper.find('select[name="province"]').setValue(province);
|
|
|
|
// Verifica que el valor seleccionado se pase correctamente
|
|
expect(wrapper.find('select[name="province"]').element.value).toBe(province);
|
|
});
|
|
});
|