diff --git a/src/components/ui/__tests__/FetchedTags.spec.js b/src/components/ui/__tests__/FetchedTags.spec.js index f1c14232c..5d23505b7 100644 --- a/src/components/ui/__tests__/FetchedTags.spec.js +++ b/src/components/ui/__tests__/FetchedTags.spec.js @@ -1,10 +1,10 @@ import { describe, expect, it } from 'vitest'; -import { mount } from '@vue/test-utils'; +import { createWrapper } from 'app/test/vitest/helper'; import FetchedTags from 'src/components/ui/FetchedTags.vue'; describe('tags computed property', () => { it('returns an object with the correct keys and values', () => { - const wrapper = mount(FetchedTags, { + const vm = createWrapper(FetchedTags, { props: { item: { tag1: 'JavaScript', @@ -18,7 +18,7 @@ describe('tags computed property', () => { columns: 2, }, }); - expect(wrapper.vm.tags).toEqual({ + expect(vm.vm.tags).toEqual({ JavaScript: 'Programming Language', Vue: 'Framework', EmptyTag: '', @@ -26,19 +26,18 @@ describe('tags computed property', () => { }); it('returns an empty object if the item prop is an empty object', () => { - const wrapper = mount(FetchedTags, { + const vm = createWrapper(FetchedTags, { props: { item: {}, tag: 'tag', value: 'value', }, }); - expect(wrapper.vm.tags).toEqual({}); + expect(vm.vm.tags).toEqual({}); }); - // Test the computed columnStyle with a defined 'columns' prop it('should calculate the correct columnStyle when columns prop is defined', () => { - const wrapper = mount(FetchedTags, { + const vm = createWrapper(FetchedTags, { props: { item: { tag1: 'JavaScript', @@ -54,16 +53,15 @@ describe('tags computed property', () => { }); const expectedStyle = { - 'grid-template-columns': 'repeat(2, 1fr)', // Should be 3 equal columns - 'max-width': '8rem', // Should be 3 * 4rem = 12rem + 'grid-template-columns': 'repeat(2, 1fr)', + 'max-width': '8rem', }; - expect(wrapper.vm.columnStyle).toEqual(expectedStyle); + expect(vm.vm.columnStyle).toEqual(expectedStyle); }); - // Test the computed columnStyle with a falsy 'columns' prop (e.g., null or undefined) it('should return an empty object for columnStyle when columns prop is not defined', () => { - const wrapper = mount(FetchedTags, { + const vm = createWrapper(FetchedTags, { props: { item: { tag1: 'JavaScript', @@ -78,7 +76,6 @@ describe('tags computed property', () => { }, }); - // Should return an empty object as no grid layout is applied - expect(wrapper.vm.columnStyle).toEqual({}); + expect(vm.vm.columnStyle).toEqual({}); }); });