82 lines
2.2 KiB
TypeScript
82 lines
2.2 KiB
TypeScript
import { describe, it, expect, vi, beforeEach } from 'vitest';
|
|
import { mount } from '@vue/test-utils';
|
|
import { defineComponent } from 'vue';
|
|
import SocialBadge from './SocialButton.vue';
|
|
|
|
function mockIconComponent(name: string) {
|
|
return {
|
|
__esModule: true,
|
|
default: defineComponent({
|
|
name,
|
|
template: `<svg class='${name.toLowerCase()}'></svg>`,
|
|
}),
|
|
};
|
|
}
|
|
|
|
vi.mock('@/components/icons/IconDiscord.vue', () => mockIconComponent('IconDiscord'));
|
|
vi.mock('@/components/icons/IconTwitter.vue', () => mockIconComponent('IconTwitter'));
|
|
vi.mock('@/components/icons/IconTelegram.vue', () => mockIconComponent('IconTelegram'));
|
|
|
|
describe('SocialBadge.vue', () => {
|
|
let wrapper;
|
|
|
|
beforeEach(() => {
|
|
wrapper = null;
|
|
});
|
|
|
|
it('renders the correct link', () => {
|
|
wrapper = mount(SocialBadge, {
|
|
props: {
|
|
href: 'https://example.com',
|
|
},
|
|
});
|
|
|
|
const link = wrapper.find('a');
|
|
expect(link.exists()).toBe(true);
|
|
expect(link.attributes('href')).toBe('https://example.com');
|
|
expect(link.attributes('target')).toBe('_blank');
|
|
});
|
|
|
|
it('applies the correct color for light mode', () => {
|
|
wrapper = mount(SocialBadge, {
|
|
props: {
|
|
dark: false,
|
|
},
|
|
});
|
|
|
|
const badge = wrapper.find('.social-badge');
|
|
expect(badge.attributes('style')).toContain('color: black');
|
|
expect(badge.attributes('style')).toContain('border-color: black');
|
|
});
|
|
|
|
it('applies the correct color for dark mode', () => {
|
|
wrapper = mount(SocialBadge, {
|
|
props: {
|
|
dark: true,
|
|
},
|
|
});
|
|
|
|
const badge = wrapper.find('.social-badge');
|
|
expect(badge.attributes('style')).toContain('color: white');
|
|
expect(badge.attributes('style')).toContain('border-color: white');
|
|
});
|
|
|
|
it('does not render an icon if the type is unsupported', async () => {
|
|
wrapper = mount(SocialBadge, {
|
|
props: {
|
|
type: 'unsupported',
|
|
},
|
|
});
|
|
|
|
await wrapper.vm.$nextTick();
|
|
|
|
const icon = wrapper.find('.social-badge-icon').find('component');
|
|
expect(icon.exists()).toBe(false);
|
|
});
|
|
|
|
it('renders without crashing when no props are provided', () => {
|
|
wrapper = mount(SocialBadge);
|
|
|
|
expect(wrapper.exists()).toBe(true);
|
|
});
|
|
});
|