diff --git a/cypress/integration/search.spec.js b/cypress/integration/search.spec.js
new file mode 100644
index 0000000..e1a91f0
--- /dev/null
+++ b/cypress/integration/search.spec.js
@@ -0,0 +1,12 @@
+describe('Chart view', () => {
+  beforeEach(() => {
+    cy.visit('/view?handleCors=false&url=https%3A%2F%2Fraw.githubusercontent.com%2FPeWu%2Ftopola%2Fmaster%2Fdemo%2Fdata%2Ffamily.ged');
+  });
+  it('Search works', () => {
+    cy.contains('Chike').should('not.exist');
+    cy.get('#search').type('chik');
+    cy.contains('Chike');
+    cy.get('#search').type('{enter}');
+    cy.get('#content').contains('Chike');
+  });
+});
diff --git a/src/top_bar.tsx b/src/top_bar.tsx
index 6a3a59b..99a773c 100644
--- a/src/top_bar.tsx
+++ b/src/top_bar.tsx
@@ -349,6 +349,7 @@ export class TopBar extends React.Component<
             setValue(value: string): void;
           })
         }
+        id="search"
       />
     );
   }