test(activation): enhance ActivationCodeModal tests with Vue app integration

- Updated the `activationCodeModal.test.ts` file to integrate Vue app setup for testing the activation code modal store.
- Refactored test initialization to use a defined component and mount the app, improving the test structure and ensuring proper store usage.
- Added cleanup logic to unmount the app after each test, enhancing test isolation and reliability.

This update improves the testing framework for the activation code modal, ensuring better integration with Vue's reactivity system.
This commit is contained in:
Eli Bosley
2025-10-13 21:07:32 -04:00
parent 9a06af2b51
commit 0b3e78ecd0

View File

@@ -1,10 +1,12 @@
import { ref } from 'vue';
import { createApp, defineComponent, ref } from 'vue';
import { createPinia, setActivePinia } from 'pinia';
import { useSessionStorage } from '@vueuse/core';
import { ACTIVATION_CODE_MODAL_HIDDEN_STORAGE_KEY } from '~/consts';
import { afterEach, beforeEach, describe, expect, it, vi } from 'vitest';
import type { App } from 'vue';
import { useActivationCodeDataStore } from '~/components/Activation/store/activationCodeData';
import { useActivationCodeModalStore } from '~/components/Activation/store/activationCodeModal';
import { useCallbackActionsStore } from '~/store/callbackActions';
@@ -27,6 +29,8 @@ describe('ActivationCodeModal Store', () => {
let mockIsFreshInstall: ReturnType<typeof ref>;
let mockActivationCode: ReturnType<typeof ref>;
let mockCallbackData: ReturnType<typeof ref>;
let app: App<Element> | null = null;
let mountTarget: HTMLElement | null = null;
beforeEach(() => {
vi.clearAllMocks();
@@ -51,11 +55,29 @@ describe('ActivationCodeModal Store', () => {
callbackData: mockCallbackData,
} as unknown as ReturnType<typeof useCallbackActionsStore>);
setActivePinia(createPinia());
store = useActivationCodeModalStore();
const pinia = createPinia();
setActivePinia(pinia);
const TestHost = defineComponent({
setup() {
store = useActivationCodeModalStore();
return () => null;
},
});
mountTarget = document.createElement('div');
app = createApp(TestHost);
app.use(pinia);
app.mount(mountTarget);
});
afterEach(() => {
if (app) {
app.unmount();
app = null;
}
mountTarget = null;
vi.resetAllMocks();
mockIsHidden.value = null;
mockIsFreshInstall.value = false;