diff --git a/src/components/FunctionalArea/TopBar/SearchBar/SearchBar.component.test.tsx b/src/components/FunctionalArea/TopBar/SearchBar/SearchBar.component.test.tsx index b8f11bb295a728fe3e5b0aed7985e961e9c0688a..f3db33ecd32d76c2d7318382b391de148348b23c 100644 --- a/src/components/FunctionalArea/TopBar/SearchBar/SearchBar.component.test.tsx +++ b/src/components/FunctionalArea/TopBar/SearchBar/SearchBar.component.test.tsx @@ -7,7 +7,7 @@ describe('SearchBar - component', () => { it('should let user type text', () => { renderComponent(); - const input = screen.getByRole('input', { name: 'search-input' }); + const input = screen.getByTestId('search-input'); fireEvent.change(input, { target: { value: 'test value' } }); expect(screen.getByDisplayValue('test value')).toBeInTheDocument(); diff --git a/src/components/FunctionalArea/TopBar/SearchBar/SearchBar.component.tsx b/src/components/FunctionalArea/TopBar/SearchBar/SearchBar.component.tsx index 82f82bb9d66630919321b3179e6ed9ec1978c32b..785ec99851f53c4fa52a564690e2e590a00cebf4 100644 --- a/src/components/FunctionalArea/TopBar/SearchBar/SearchBar.component.tsx +++ b/src/components/FunctionalArea/TopBar/SearchBar/SearchBar.component.tsx @@ -15,6 +15,7 @@ export const SearchBar = (): JSX.Element => { value={searchValue} name="search-input" aria-label="search-input" + data-testid="search-input" onChange={onSearchChange} className="bg-cultured r-[64px] w-72 rounded-[64px] py-2.5 px-4 text-xs outline-none border border-transparent focus:border-greyscale-600 hover:border-greyscale-600 font-medium text-font-400" />