diff --git a/web/components/search.css b/web/components/search.css
index c9818df56..bb3ebff03 100644
--- a/web/components/search.css
+++ b/web/components/search.css
@@ -1,40 +1,41 @@
 div.searchContainer {
   background-color: var(--text-input-bg);
   display: flex;
   align-items: center;
   margin: 1rem;
   border-radius: 16px;
   padding: 8px;
 }
 
 div.searchIcon {
   display: flex;
   color: var(--search-icon-color);
 }
 
-input.searchInput {
+input.searchInput,
+#searchInputID {
   background-color: transparent;
   font-size: var(--m-font-16);
   line-height: 1.5;
   padding: 4px 12px;
   flex: 1;
   border: none;
   color: var(--search-input-color);
   outline: none;
 }
 
 input.searchInput::placeholder {
   color: var(--search-input-placeholder);
 }
 
 button.clearSearch {
   color: var(--search-clear-color);
   transition: ease-in-out 0.15s;
   background: var(--search-clear-bg);
   border-radius: 50%;
   padding: 6px;
 }
 
 button.clearSearchDisabled {
   opacity: 0;
 }
diff --git a/web/components/search.react.js b/web/components/search.react.js
index 3b8f69f84..3069cba1d 100644
--- a/web/components/search.react.js
+++ b/web/components/search.react.js
@@ -1,55 +1,56 @@
 // @flow
 
 import * as React from 'react';
 
 import SWMansionIcon from 'lib/components/SWMansionIcon.react.js';
 
 import ClearSearchButton from './clear-search-button.react.js';
 import css from './search.css';
 
 type Props = {
   +searchText: string,
   +onChangeText: (searchText: string) => mixed,
   +placeholder?: string,
 };
 
 function Search(props: Props, ref): React.Node {
   const { searchText, onChangeText, placeholder } = props;
 
   const showClearButton = !!searchText;
 
   const onClear = React.useCallback(() => {
     onChangeText('');
   }, [onChangeText]);
 
   const onChange = React.useCallback(
     event => {
       onChangeText(event.target.value);
     },
     [onChangeText],
   );
 
   return (
     <div className={css.searchContainer}>
       <div className={css.searchIcon}>
         <SWMansionIcon size={24} icon="search" />
       </div>
       <input
+        id={css.searchInputID}
         className={css.searchInput}
         onChange={onChange}
         value={searchText}
         type="text"
         placeholder={placeholder}
         ref={ref}
       />
       <ClearSearchButton onClick={onClear} active={showClearButton} />
     </div>
   );
 }
 
 const ForwardedSearch: React.AbstractComponent<
   Props,
   HTMLInputElement,
 > = React.forwardRef<Props, HTMLInputElement>(Search);
 
 export default ForwardedSearch;