test(SearchBar): cover SearchBar with tests
This commit is contained in:
45
src/shared/ui/SearchBar/SearchBar.svelte.test.ts
Normal file
45
src/shared/ui/SearchBar/SearchBar.svelte.test.ts
Normal 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();
|
||||
});
|
||||
});
|
||||
Reference in New Issue
Block a user