Merge pull request #3064 from /issues/3063/1

Fixes #3063 - Move search bar handling into shared navbar.js
webcompat · Oct 29, 2019 · 55a196c · 55a196c
2 parents b6a2d3a + 68109c8
commit 55a196c
Show file tree

Hide file tree

Showing 5 changed files with 49 additions and 45 deletions.
diff --git a/grunt-tasks/concat.js b/grunt-tasks/concat.js
@@ -47,7 +47,6 @@ module.exports = function(grunt) {
     },
     index: {
       src: [
-        "<%= jsPath %>/lib/homepage.js",
         "<%= jsPath %>/lib/models/label-list.js",
         "<%= jsPath %>/lib/models/issue.js",
         "<%= jsPath %>/lib/untriaged.js"

diff --git a/tests/functional/search-auth.js b/tests/functional/search-auth.js
@@ -92,7 +92,7 @@ registerSuite("Search (auth)", {
         .end();
     },
 
-    "Search works by icon click"() {
+    "Search works by icon click (issues page)"() {
       return FunctionalHelpers.openPage(
         this,
         url("/issues"),
@@ -116,6 +116,36 @@ registerSuite("Search (auth)", {
         .end();
     },
 
+    "Search opens by icon click (new issue page)"() {
+      return FunctionalHelpers.openPage(
+        this,
+        url("/issues/new"),
+        ".js-ReportForm"
+      )
+        .findByCssSelector(".js-SearchBarOpen")
+        .click()
+        .end()
+        .findDisplayedByCssSelector("#search-bar")
+        .isDisplayed()
+        .then(function(isDisplayed) {
+          assert.equal(isDisplayed, true, "Search form is visible.");
+        })
+        .end();
+    },
+
+    "Search works by icon click (home page)"() {
+      return FunctionalHelpers.openPage(this, url("/"), ".js-SearchBarOpen")
+        .findByCssSelector(".js-SearchBarOpen")
+        .click()
+        .end()
+        .findDisplayedByCssSelector("#search-bar")
+        .isDisplayed()
+        .then(function(isDisplayed) {
+          assert.equal(isDisplayed, true, "Search form is visible.");
+        })
+        .end();
+    },
+
     "Search works by Return key"() {
       return FunctionalHelpers.openPage(
         this,

diff --git a/webcompat/static/js/lib/homepage.js b/webcompat/static/js/lib/homepage.js
diff --git a/webcompat/static/js/lib/navbar.js b/webcompat/static/js/lib/navbar.js
@@ -8,8 +8,25 @@ function NavBar() {
   };
 
   this.setUpEvents = function() {
-    this.navbarHandler();
     this.dropDownHandler();
+    this.navbarHandler();
+    this.searchHandler();
+  };
+
+  this.searchHandler = function() {
+    var searchBar = $(".js-SearchBar");
+    var searchBarOpen = $(".js-SearchBarOpen");
+    var searchBarClose = $(".js-SearchBarClose");
+
+    searchBarOpen.click(function() {
+      searchBar.addClass("is-active");
+      searchBar.find("input").focus();
+    });
+
+    searchBarClose.click(function() {
+      searchBar.removeClass("is-active");
+      searchBar.find("input").blur();
+    });
   };
 
   this.navbarHandler = function() {

diff --git a/webcompat/templates/index.html b/webcompat/templates/index.html
@@ -13,7 +13,6 @@
 {%- if config.PRODUCTION or config.STAGING -%}
 <script src="{{ url_for('static', filename='js/dist/index.min.js')|bust_cache }}"></script>
 {%- else -%}
-<script src="{{ url_for('static', filename='js/lib/homepage.js') }}"></script>
 <script src="{{ url_for('static', filename='js/lib/models/label-list.js') }}"></script>
 <script src="{{ url_for('static', filename='js/lib/models/issue.js') }}"></script>
 <script src="{{ url_for('static', filename='js/lib/untriaged.js') }}"></script>