#7058 LeftMenu vitest #1153

Merged
jsegarra merged 26 commits from 7058_leftMenu_vitest into dev 2025-02-06 21:45:16 +00:00
2 changed files with 50 additions and 82 deletions
Showing only changes of commit 3c5b8d4fbf - Show all commits

View File

@ -33,18 +33,13 @@ const pinnedModules = computed(() => {
const search = ref(null);
const filteredItems = computed(() => {
console.error('filterItems');
return filterItems();
});
function filterItems() {
console.error('filterItems');
if (!search.value) return items.value;
const normalizedSearch = normalize(search.value);
return items.value.filter((item) => {
jsegarra marked this conversation as resolved Outdated

Solo se usa 1 vez

Solo se usa 1 vez

Lo sé, era la manera mas simple de probar la lógica de esa función.
Esto no debería haber subido así porque no haría falta poner las llaves y el return

Lo sé, era la manera mas simple de probar la lógica de esa función. Esto no debería haber subido así porque no haría falta poner las llaves y el return

Si no hay manera de poder testearlo vale, pero si se puede mejor poner dentro de computed, si se vuelve muy complicado quizá sería mejor testearlo con test unitario con cypress

Si no hay manera de poder testearlo vale, pero si se puede mejor poner dentro de computed, si se vuelve muy complicado quizá sería mejor testearlo con test unitario con cypress

Yo haría el test en un unitario con cypress. Queda feo crear una fn que solo vas a usar 1 vez y es simple.

Yo haría el test en un unitario con cypress. Queda feo crear una fn que solo vas a usar 1 vez y es simple.

He vuelto a probar y me ha funcionado dejandolo dentro del computed.
No se que pasó

He vuelto a probar y me ha funcionado dejandolo dentro del computed. No se que pasó
const locale = normalize(t(item.title));
return locale.includes(normalizedSearch);
});
}
});
const filteredPinnedModules = computed(() => {
if (!search.value) return pinnedModules.value;
@ -108,14 +103,7 @@ function addChildren(module, route, parent) {
}
function getRoutes() {
const handleRoutes = {
main: getMainRoutes,
card: getCardRoutes,
};
console.log(props.source);
handleRoutes[props.source]();
}
function getMainRoutes() {
if (props.source === 'main') {
const modules = Object.assign([], navigation.getModules().value);
for (const item of modules) {
@ -131,16 +119,18 @@ function getMainRoutes() {
items.value = modules;
}
function getCardRoutes() {
console.log('getCardRoutes');
if (props.source === 'card') {
const currentRoute = route.matched[1];
const currentModule = toLowerCamel(currentRoute.name);
let moduleDef = routes.find((route) => toLowerCamel(route.name) === currentModule);
let moduleDef = routes.find(
(route) => toLowerCamel(route.name) === currentModule
);
if (!moduleDef) return;
if (!moduleDef?.menus) moduleDef = betaGetRoutes();
addChildren(currentModule, moduleDef, items.value);
}
}
function betaGetRoutes() {
let menuRoute;

View File

@ -132,37 +132,40 @@ function mount(source) {
return wrapper;
}
describe('getRoutes', () => {
afterEach(() => vi.clearAllMocks());
const getRoutes = vi
.fn()
.mockImplementation((props, getMainRoutes, getCardRoutes) => {
const handleRoutes = {
main: getMainRoutes,
card: getCardRoutes,
};
console.log(props.source);
handleRoutes[props.source]();
});
describe.only('getRoutes', () => {
beforeEach(() => {});
// afterEach(() => vi.clearAllMocks());
// const getRoutes = vi
// .fn()
// .mockImplementation((props, getMainRoutes, getCardRoutes) => {
// const handleRoutes = {
// main: getMainRoutes,
// card: getCardRoutes,
// };
// console.log(props.source);
// handleRoutes[props.source]();
// });
const getMainRoutes = vi.fn();
const getCardRoutes = vi.fn();
// const getMainRoutes = vi.fn();
// const getCardRoutes = vi.fn();
it('should call getCardRoutes when source is card', () => {
vm = mount('card').vm;
let props = { source: 'card' };
vi.spyOn(vm, 'getCardRoutes');
vm.getRoutes();
// getRoutes(props, getMainRoutes, getCardRoutes);
getRoutes(props, getMainRoutes, getCardRoutes);
expect(getCardRoutes).toHaveBeenCalled();
expect(getMainRoutes).not.toHaveBeenCalled();
expect(vm.getCardRoutes).toHaveBeenCalled();
// expect(vm.getMainRoutes).not.toHaveBeenCalled();
});
it('should call getMainRoutes when source is main', () => {
let props = { source: 'main' };
// it.skip('should call getMainRoutes when source is main', () => {
// let props = { source: 'main' };
getRoutes(props, getMainRoutes, getCardRoutes);
// getRoutes(props, getMainRoutes, getCardRoutes);
expect(getMainRoutes).toHaveBeenCalled();
expect(getCardRoutes).not.toHaveBeenCalled();
});
// expect(getMainRoutes).toHaveBeenCalled();
// expect(getCardRoutes).not.toHaveBeenCalled();
// });
});
jsegarra marked this conversation as resolved Outdated

Poner otro nombre, está repetido.

Poner otro nombre, está repetido.

oh vaya

oh vaya

should not call getMethodA when method is undefined por ej.

should not call getMethodA when method is undefined por ej.
describe.skip('Leftmenu as card', () => {
beforeAll(() => {
@ -372,11 +375,6 @@ describe.only('addChildren', () => {
vm.addChildren(module, route, parent);
expect(useNavigationStore().addMenuItem).toHaveBeenCalled();
// expect(useNavigationStore().addMenuItem).toHaveBeenCalledWith(
// module,
// { name: 'child1' },
// parent
// );
});
it.only('should not add menu items if no matches are found', () => {
@ -389,24 +387,14 @@ describe.only('addChildren', () => {
vm.addChildren(module, route, parent);
expect(useNavigationStore().addMenuItem).toHaveBeenCalled();
// expect(useNavigationStore().addMenuItem).not.toHaveBeenCalled();
});
it('should handle routes with no meta menu', () => {
const module = 'testModule';
// const route = {
// menus: { main: 'child1' },
// children: [{ name: 'child1' }, { name: 'child2' }],
// };
const parent = [];
vm.addChildren(module, route, parent);
expect(useNavigationStore().addMenuItem).toHaveBeenCalled();
// expect(useNavigationStore().addMenuItem).toHaveBeenCalledWith(
// module,
// { name: 'child1' },
// parent
// );
});
it('should handle routes with no matches', () => {
@ -419,23 +407,13 @@ describe.only('addChildren', () => {
vm.addChildren(module, route, parent);
expect(useNavigationStore().addMenuItem).toHaveBeenCalled();
// expect(useNavigationStore().addMenuItem).not.toHaveBeenCalled();
});
it('should handle empty parent array', () => {
const module = 'testModule';
// const route = {
// meta: { menu: 'child1' },
// children: [{ name: 'child1' }, { name: 'child2' }],
// };
const parent = [];
vm.addChildren(module, route, parent);
expect(useNavigationStore().addMenuItem).toHaveBeenCalled();
// expect(useNavigationStore().addMenuItem).toHaveBeenCalledWith(
// module,
// { name: 'child1' },
// parent
// );
});
});