Merge pull request #118 from uktrade/bug/search-button-prevent-default

fix: Fix "Search" button firing default event
uktrade · Aug 27, 2019 · 471f099 · 471f099
2 parents 2643c3d + 23486dc
commit 471f099
Show file tree

Hide file tree

Showing 3 changed files with 75 additions and 58 deletions.
diff --git a/src/entity-search/EntitySearch.jsx b/src/entity-search/EntitySearch.jsx
@@ -25,6 +25,11 @@ const EntitySearch = ({
   error,
 }) => {
   const { filters, setFilter } = useFilter()
+  const onSearchClick = (e) => {
+    e.preventDefault()
+    onEntitySearch(filters)
+  }
+
   return (
     <>
       {previouslySelected && <PreviouslySelected {...previouslySelected} />}
@@ -44,7 +49,7 @@ const EntitySearch = ({
 
       {error && <p>{error}</p>}
 
-      <StyledButton onClick={() => onEntitySearch(filters)}>Search</StyledButton>
+      <StyledButton onClick={onSearchClick}>Search</StyledButton>
     </>
   )
 }

diff --git a/src/entity-search/EntitySearch.test.jsx b/src/entity-search/EntitySearch.test.jsx
@@ -66,15 +66,27 @@ describe('EntitySearch', () => {
   })
 
   describe('when the "Search" button has been clicked', () => {
-    test('should render the component with entities', async () => {
-      const wrappedEntitySearch = wrapEntitySearch()
+    let wrappedEntitySearch
+    let preventDefaultMock
 
-      wrappedEntitySearch.find('Search').simulate('click')
+    beforeAll(async () => {
+      wrappedEntitySearch = wrapEntitySearch()
+      preventDefaultMock = jest.fn()
+
+      wrappedEntitySearch
+        .find('Search')
+        .simulate('click', { preventDefault: preventDefaultMock })
 
       await act(flushPromises)
 
       wrappedEntitySearch.update()
+    })
+
+    test('should prevent the default button action', () => {
+      expect(preventDefaultMock.mock.calls.length).toEqual(1)
+    })
 
+    test('should render the component with entities', () => {
       expect(wrappedEntitySearch.debug()).toMatchSnapshot()
     })
   })