Add component tests for ModalHeader, IconChecked, and Conformance result components
Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com>
This commit is contained in:
46
tests/components/ModalHeader.test.js
Normal file
46
tests/components/ModalHeader.test.js
Normal file
@@ -0,0 +1,46 @@
|
||||
import { describe, it, expect, beforeEach, vi } from 'vitest';
|
||||
import { mount } from '@vue/test-utils';
|
||||
import { setActivePinia, createPinia } from 'pinia';
|
||||
import ModalHeader from '@/views/AccountManagement/ModalHeader.vue';
|
||||
import { useModalStore } from '@/stores/modal.js';
|
||||
|
||||
describe('ModalHeader', () => {
|
||||
let pinia;
|
||||
|
||||
beforeEach(() => {
|
||||
pinia = createPinia();
|
||||
setActivePinia(pinia);
|
||||
});
|
||||
|
||||
const mountModalHeader = (headerText = 'Test Header') => {
|
||||
return mount(ModalHeader, {
|
||||
props: { headerText },
|
||||
global: { plugins: [pinia] },
|
||||
});
|
||||
};
|
||||
|
||||
it('renders header text from prop', () => {
|
||||
const wrapper = mountModalHeader('Account Info');
|
||||
expect(wrapper.find('h1').text()).toBe('Account Info');
|
||||
});
|
||||
|
||||
it('renders close button (X icon)', () => {
|
||||
const wrapper = mountModalHeader();
|
||||
const img = wrapper.find('img[alt="X"]');
|
||||
expect(img.exists()).toBe(true);
|
||||
});
|
||||
|
||||
it('calls closeModal when X is clicked', async () => {
|
||||
const wrapper = mountModalHeader();
|
||||
const store = useModalStore();
|
||||
store.isModalOpen = true;
|
||||
store.whichModal = 'SOME_MODAL';
|
||||
|
||||
const img = wrapper.find('img[alt="X"]');
|
||||
await img.trigger('click');
|
||||
|
||||
// closeModal only sets isModalOpen to false; whichModal is not reset
|
||||
expect(store.isModalOpen).toBe(false);
|
||||
expect(store.whichModal).toBe('SOME_MODAL');
|
||||
});
|
||||
});
|
||||
Reference in New Issue
Block a user