/** * 图表组件单元测试示例 * 测试 PieChart 组件 */ import { describe, it, expect, vi } from 'vitest' import { mount } from '@vue/test-utils' import PieChart from '@/components/charts/PieChart.vue' describe('PieChart.vue', () => { it('renders properly with data', () => { const wrapper = mount(PieChart, { props: { data: [ { name: '库存中', value: 200 }, { name: '在用', value: 750 }, ], title: '资产状态分布', }, }) expect(wrapper.find('.base-chart').exists()).toBe(true) }) it('emits click event when clicking on a slice', async () => { const wrapper = mount(PieChart, { props: { data: [ { name: '库存中', value: 200 }, { name: '在用', value: 750 }, ], }, }) // 模拟点击事件 // 注意:实际测试需要等待图表渲染完成 // 这里只是示例 expect(wrapper.exists()).toBe(true) }) it('renders doughnut chart when type is doughnut', () => { const wrapper = mount(PieChart, { props: { data: [{ name: '测试', value: 100 }], type: 'doughnut', }, }) expect(wrapper.props('type')).toBe('doughnut') }) it('renders pie chart when type is pie', () => { const wrapper = mount(PieChart, { props: { data: [{ name: '测试', value: 100 }], type: 'pie', }, }) expect(wrapper.props('type')).toBe('pie') }) it('shows legend when showLegend is true', () => { const wrapper = mount(PieChart, { props: { data: [{ name: '测试', value: 100 }], showLegend: true, }, }) expect(wrapper.props('showLegend')).toBe(true) }) it('hides legend when showLegend is false', () => { const wrapper = mount(PieChart, { props: { data: [{ name: '测试', value: 100 }], showLegend: false, }, }) expect(wrapper.props('showLegend')).toBe(false) }) it('uses custom color when customColor is true', () => { const wrapper = mount(PieChart, { props: { data: [ { name: '库存中', value: 200, status: 'in_stock' }, { name: '在用', value: 750, status: 'in_use' }, ], customColor: true, }, }) expect(wrapper.props('customColor')).toBe(true) }) it('applies custom height', () => { const wrapper = mount(PieChart, { props: { data: [{ name: '测试', value: 100 }], height: '500px', }, }) expect(wrapper.props('height')).toBe('500px') }) it('emits ready event when chart is ready', async () => { const wrapper = mount(PieChart, { props: { data: [{ name: '测试', value: 100 }], }, }) // 等待组件挂载 await wrapper.vm.$nextTick() // 检查事件是否被触发 // 注意:实际测试需要等待 ECharts 初始化完成 expect(wrapper.exists()).toBe(true) }) })