Merge pull request #4079 from alphagov/fix-bug-search-behavior-on-for…

…eign-travel-advice-page Fix search bug on foreign travel advice page
alphagov · May 31, 2024 · 4999951 · 4999951
2 parents a940fc1 + 0a5d623
commit 4999951
Show file tree

Hide file tree

Showing 3 changed files with 11 additions and 9 deletions.
diff --git a/app/assets/javascripts/views/travel-advice.js b/app/assets/javascripts/views/travel-advice.js
@@ -13,16 +13,18 @@
 
     this.container = searchInput.closest('.js-travel-container')
 
-    searchInput.addEventListener('keyup', function (event) {
+    searchInput.addEventListener('keydown', function (event) {
       if (event.keyCode === enterKeyCode) {
         event.preventDefault()
-      } else {
-        var filter = this.value
-        filterInst.filterListItems(filter)
-        filterInst.track(filter)
       }
     })
 
+    searchInput.addEventListener('keyup', function () {
+      var filter = this.value
+      filterInst.filterListItems(filter)
+      filterInst.track(filter)
+    })
+
     if (this.container) {
       var countryCount = this.container.getElementsByClassName('js-country-count')[0]
       if (countryCount) {

diff --git a/spec/javascripts/unit/foreign-travel-advice.spec.js b/spec/javascripts/unit/foreign-travel-advice.spec.js
@@ -121,11 +121,11 @@ describe('CountryFilter', function () {
       expect(filter.filterListItems).toHaveBeenCalled()
     })
 
-    it('Should cancel events bound to keyup when enter is pressed', function () {
+    it('Should prevent form submission and filtering when enter key is pressed', function () {
       filter = new GOVUK.countryFilter($input[0])
       spyOn(filter, 'filterListItems')
 
-      window.GOVUK.triggerEvent($input[0], 'keyup', { keyCode: 13 })
+      window.GOVUK.triggerEvent($input[0], 'keydown', { keyCode: 13 })
       expect(filter.filterListItems).not.toHaveBeenCalled()
     })
 

diff --git a/test/integration/travel_advice_test.rb b/test/integration/travel_advice_test.rb
@@ -96,8 +96,8 @@ def de_dup_spaces(string)
         assert page.has_selector?("#I li") # _In_dia
         assert page.has_selector?("#F li") # F_in_land
         assert page.has_selector?("#S li") # Spa_in_
-        assert page.has_no_selector?("#A li")
-        assert page.has_no_selector?("#M li")
+        assert page.has_selector?("#A li", visible: false)
+        assert page.has_selector?("#M li", visible: false)
       end
 
       within ".js-country-count" do