UX: improve mobile search

Improves usability of header search icon while user is already in full page search in mobile.

Currently, hitting search icon a second time empties input and does not scroll up to show search form.

This commit scrolls up to show form and sets focus on input.

app/assets/javascripts/discourse/widgets/header.js.es6

@@ -6,7 +6,7 @@ import { wantsNewWindow } from "discourse/lib/intercept-click";
 import { applySearchAutocomplete } from "discourse/lib/search";
 import { ajax } from "discourse/lib/ajax";
 import { addExtraUserClasses } from "discourse/helpers/user-avatar";
-
+import { scrollTop } from "discourse/mixins/scroll-top";
 import { h } from "virtual-dom";
 
 const dropdown = {
@@ -403,7 +403,17 @@ export default createWidget("header", {
         }&skip_context=${this.state.skipSearchContext}`;
       }
 
-      return DiscourseURL.routeTo("/search" + params);
+      const currentPath = this.register
+        .lookup("controller:application")
+        .get("currentPath");
+
+      if (currentPath === "full-page-search") {
+        scrollTop();
+        $(".full-page-search").focus();
+        return false;
+      } else {
+        return DiscourseURL.routeTo("/search" + params);
+      }
     }
 
     this.state.searchVisible = !this.state.searchVisible;

test/javascripts/acceptance/search-mobile-test.js.es6

@@ -0,0 +1,30 @@
+import { acceptance } from "helpers/qunit-helpers";
+
+acceptance("Search - Mobile", { mobileView: true });
+
+QUnit.test("search", async assert => {
+  await visit("/");
+
+  await click("#search-button");
+
+  assert.ok(
+    exists("input.full-page-search"),
+    "it shows the full page search form"
+  );
+  assert.ok(!exists(".search-results .fps-topic"), "no results by default");
+
+  await fillIn(".search-query", "posts");
+  await click(".search-cta");
+
+  assert.ok(find(".fps-topic").length === 1, "has one post");
+
+  await $(document).scrollTop(200);
+  await click("#search-button");
+
+  assert.equal(
+    find("input.full-page-search").val(),
+    "posts",
+    "it does not reset input when hitting search icon again"
+  );
+  assert.equal($(document).scrollTop(), 0, "it scrolls back to top of document");
+});