diff --git a/packages/x-components/src/composables/__tests__/use-getter.spec.ts b/packages/x-components/src/composables/__tests__/use-getter.spec.ts index 804fbbd5e0..3c103d9160 100644 --- a/packages/x-components/src/composables/__tests__/use-getter.spec.ts +++ b/packages/x-components/src/composables/__tests__/use-getter.spec.ts @@ -1,72 +1,49 @@ -import { ComputedRef, defineComponent } from 'vue'; -import Vuex, { Store } from 'vuex'; -import { createLocalVue, mount } from '@vue/test-utils'; -import { Dictionary } from '@empathyco/x-utils'; +import { defineComponent } from 'vue'; +import { mount } from '@vue/test-utils'; import { installNewXPlugin } from '../../__tests__/utils'; import { useGetter } from '../use-getter'; -import { historyQueriesXStoreModule } from '../../x-modules/history-queries'; -import { AnyXStoreModule } from '../../store/index'; +import { useRegisterXModule } from '../use-register-x-module'; import { ExtractGetters } from '../../x-modules/x-modules.types'; - -const renderUseGetterTest = (getters: string[]): renderUseGetterTestAPI => { - const testComponent = defineComponent({ - setup() { - const historyQueriesGetter = useGetter( - 'historyQueries', - getters as (keyof ExtractGetters<'historyQueries'>)[] - ); - return { - historyQueriesGetter - }; - } - }); - - const localVue = createLocalVue(); - localVue.use(Vuex); - - const store = new Store({ - modules: { - x: { - namespaced: true, - modules: { - historyQueries: { namespaced: true, ...historyQueriesXStoreModule } as AnyXStoreModule - } - } - } +import { useStore } from '../use-store'; +import { XPlugin } from '../../plugins'; +import { historyQueriesXModule } from '../../x-modules/history-queries/x-module'; + +jest.mock('../use-store'); + +function render(modulePaths: (keyof ExtractGetters<'historyQueries'>)[]) { + installNewXPlugin(); + (useStore as jest.Mock).mockReturnValue(XPlugin.store); + + const component = defineComponent({ + xModule: 'historyQueries', + setup: () => { + useRegisterXModule(historyQueriesXModule); + const historyQueriesGetter = useGetter('historyQueries', modulePaths); + return { historyQueriesGetter }; + }, + template: `
` }); - installNewXPlugin({ store }, localVue); - const wrapper = mount(testComponent, { - localVue, - store - }); + const wrapper = mount(component); - return { - store, - historyQueriesGetter: (wrapper.vm as any).historyQueriesGetter - }; -}; + return (wrapper as any).vm.historyQueriesGetter; +} describe('testing useGetter composable', () => { it('maps store getters', () => { - const { historyQueriesGetter, store } = renderUseGetterTest(['storageKey', 'historyQueries']); - expect(historyQueriesGetter.storageKey.value).toEqual('history-queries'); - expect(historyQueriesGetter.historyQueries.value).toHaveLength(0); + const { storageKey, historyQueries } = render(['storageKey', 'historyQueries']); + expect(storageKey.value).toEqual('history-queries'); + expect(historyQueries.value).toHaveLength(0); // eslint-disable-next-line @typescript-eslint/no-unsafe-call - store.dispatch('x/historyQueries/addQueryToHistory', 'chorizo'); + XPlugin.store.dispatch('x/historyQueries/addQueryToHistory', 'chorizo'); - expect(historyQueriesGetter.historyQueries.value).toHaveLength(1); + expect(historyQueries.value).toHaveLength(1); }); it('does not return not requested getters', () => { - const { historyQueriesGetter } = renderUseGetterTest(['storageKey']); - expect(historyQueriesGetter.storageKey).toBeDefined(); - expect(historyQueriesGetter.historyQueries).toBeUndefined(); + const { storageKey, historyQueries } = render(['storageKey']); + expect(storageKey).toBeDefined(); + expect(historyQueries).toBeUndefined(); }); }); - -type renderUseGetterTestAPI = { - historyQueriesGetter: Dictionary