vikingowl
d81430e1aa
Backend: - Add fetcher_test.go (HTML stripping, URL fetching utilities) - Add model_registry_test.go (parsing, size ranges, model matching) - Add database_test.go (CRUD operations, migrations) - Add tests for geolocation, search, tools, version handlers Frontend unit tests (469 total): - OllamaClient: 22 tests for API methods with mocked fetch - Memory/RAG: tokenizer, chunker, summarizer, embeddings, vector-store - Services: prompt-resolution, conversation-summary - Components: Skeleton, BranchNavigator, ConfirmDialog, ThinkingBlock - Utils: export, import, file-processor, keyboard - Tools: builtin math parser (44 tests) E2E tests (28 total): - Set up Playwright with Chromium - App loading, sidebar navigation, settings page - Chat interface, responsive design, accessibility - Import dialog, project modal interactions Config changes: - Add browser conditions to vitest.config.ts for Svelte 5 components - Add playwright.config.ts for E2E testing - Add test:e2e scripts to package.json - Update .gitignore to exclude test artifacts Closes #8
68 lines
2.1 KiB
TypeScript
68 lines
2.1 KiB
TypeScript
/**
|
|
* Skeleton component tests
|
|
*
|
|
* Tests the loading placeholder component
|
|
*/
|
|
|
|
import { describe, it, expect } from 'vitest';
|
|
import { render, screen } from '@testing-library/svelte';
|
|
import Skeleton from './Skeleton.svelte';
|
|
|
|
describe('Skeleton', () => {
|
|
it('renders with default props', () => {
|
|
render(Skeleton);
|
|
const skeleton = screen.getByRole('status');
|
|
expect(skeleton).toBeDefined();
|
|
expect(skeleton.getAttribute('aria-label')).toBe('Loading...');
|
|
});
|
|
|
|
it('renders with custom width and height', () => {
|
|
render(Skeleton, { props: { width: '200px', height: '50px' } });
|
|
const skeleton = screen.getByRole('status');
|
|
expect(skeleton.style.width).toBe('200px');
|
|
expect(skeleton.style.height).toBe('50px');
|
|
});
|
|
|
|
it('renders circular variant', () => {
|
|
render(Skeleton, { props: { variant: 'circular' } });
|
|
const skeleton = screen.getByRole('status');
|
|
expect(skeleton.className).toContain('rounded-full');
|
|
});
|
|
|
|
it('renders rectangular variant', () => {
|
|
render(Skeleton, { props: { variant: 'rectangular' } });
|
|
const skeleton = screen.getByRole('status');
|
|
expect(skeleton.className).toContain('rounded-none');
|
|
});
|
|
|
|
it('renders rounded variant', () => {
|
|
render(Skeleton, { props: { variant: 'rounded' } });
|
|
const skeleton = screen.getByRole('status');
|
|
expect(skeleton.className).toContain('rounded-lg');
|
|
});
|
|
|
|
it('renders text variant by default', () => {
|
|
render(Skeleton, { props: { variant: 'text' } });
|
|
const skeleton = screen.getByRole('status');
|
|
expect(skeleton.className).toContain('rounded');
|
|
});
|
|
|
|
it('renders multiple lines for text variant', () => {
|
|
render(Skeleton, { props: { variant: 'text', lines: 3 } });
|
|
const skeletons = screen.getAllByRole('status');
|
|
expect(skeletons).toHaveLength(3);
|
|
});
|
|
|
|
it('applies custom class', () => {
|
|
render(Skeleton, { props: { class: 'my-custom-class' } });
|
|
const skeleton = screen.getByRole('status');
|
|
expect(skeleton.className).toContain('my-custom-class');
|
|
});
|
|
|
|
it('has animate-pulse class for loading effect', () => {
|
|
render(Skeleton);
|
|
const skeleton = screen.getByRole('status');
|
|
expect(skeleton.className).toContain('animate-pulse');
|
|
});
|
|
});
|