test(SearchBar): cover SearchBar with tests

This commit is contained in:
Ilia Mashkov
2026-04-17 20:10:53 +03:00
parent 7975d9aeee
commit 5ab5cda611

View File

@@ -0,0 +1,45 @@
import {
fireEvent,
render,
screen,
} from '@testing-library/svelte';
import SearchBar from './SearchBar.svelte';
describe('SearchBar', () => {
it('renders an input element', () => {
render(SearchBar);
expect(screen.getByRole('textbox')).toBeInTheDocument();
});
it('renders placeholder text', () => {
render(SearchBar, { placeholder: 'Search…' });
expect(screen.getByPlaceholderText('Search…')).toBeInTheDocument();
});
it('renders with initial value', () => {
render(SearchBar, { value: 'Roboto' });
expect(screen.getByDisplayValue('Roboto')).toBeInTheDocument();
});
it('renders search icon', () => {
const { container } = render(SearchBar);
expect(container.querySelector('svg')).toBeInTheDocument();
});
it('updates value on user input', async () => {
render(SearchBar);
const input = screen.getByRole('textbox') as HTMLInputElement;
await fireEvent.input(input, { target: { value: 'Inter' } });
expect(input.value).toBe('Inter');
});
it('is not disabled by default', () => {
render(SearchBar);
expect(screen.getByRole('textbox')).not.toBeDisabled();
});
it('is disabled when disabled prop is true', () => {
render(SearchBar, { disabled: true });
expect(screen.getByRole('textbox')).toBeDisabled();
});
});