Make all find mode updates go via the HUD in preparation to use an input

4 files changed, 41 insertions, 30 deletions

diff --git a/content_scripts/hud.coffee b/content_scripts/hud.coffee
index 3e749da5..64ebd8e3 100644
--- a/content_scripts/hud.coffee
+++ b/content_scripts/hud.coffee
@@ -28,12 +28,25 @@ HUD =
 
   showFindMode: (text = "") ->
     return unless @enabled()
+    # NOTE(mrmr1993): We set findModeQuery.rawQuery here rather in search while we still handle keys in the
+    # main frame. When key handling is moved to the HUD iframe, this line should be deleted, and the
+    # equivalent in search should be uncommented.
+    findModeQuery.rawQuery = text
     @hudUI.show {name: "showFindMode", text}
     @tween.fade 1.0, 150
 
   updateMatchesCount: (matchCount, showMatchText = true) ->
     @hudUI.postMessage {name: "updateMatchesCount", matchCount, showMatchText}
 
+  search: (data) ->
+    # NOTE(mrmr1993): The following line is disabled as it is currently vulnerable to a race condition when a
+    # user types quickly. When all of the key handling is done in the HUD iframe, this should be uncommented,
+    # and the equivalent line in showFindMode should be deleted.
+    #findModeQuery.rawQuery = data.query
+    updateFindModeQuery()
+    performFindInPlace()
+    showFindModeHUDForQuery()
+
   # Hide the HUD.
   # If :immediate is falsy, then the HUD is faded out smoothly (otherwise it is hidden immediately).
   # If :updateIndicator is truthy, then we also refresh the mode indicator.  The only time we don't update the
diff --git a/content_scripts/vimium.css b/content_scripts/vimium.css
index 38a968fc..7b501f94 100644
--- a/content_scripts/vimium.css
+++ b/content_scripts/vimium.css
@@ -284,6 +284,11 @@ iframe.vimiumHUDFrame {
   opacity: 0;
 }
 
+div.vimiumHUD span#hud-find-input * {
+    display: inline;
+    white-space: nowrap;
+}
+
 body.vimiumFindMode ::selection {
   background: #ff9632;
 }
diff --git a/content_scripts/vimium_frontend.coffee b/content_scripts/vimium_frontend.coffee
index 46af3847..70a8fef7 100644
--- a/content_scripts/vimium_frontend.coffee
+++ b/content_scripts/vimium_frontend.coffee
@@ -5,7 +5,7 @@
 # "domReady".
 #
 
-findModeQuery = { rawQuery: "", matchCount: 0 }
+window.findModeQuery = { rawQuery: "", matchCount: 0 }
 findModeQueryHasResults = false
 findModeAnchorNode = null
 findModeInitialRange = null
@@ -666,7 +666,7 @@ FindModeHistory =
     ([ query ].concat rawQueryList.filter (q) => q != query)[0..@max]
 
 # should be called whenever rawQuery is modified.
-updateFindModeQuery = ->
+window.updateFindModeQuery = ->
   # the query can be treated differently (e.g. as a plain string versus regex depending on the presence of
   # escape sequences. '\' is the escape character and needs to be escaped itself to be used as a normal
   # character. here we grep for the relevant escape sequences.
@@ -711,14 +711,8 @@ updateFindModeQuery = ->
     text = document.body.innerText
     findModeQuery.matchCount = text.match(pattern)?.length
 
-updateQueryForFindMode = (rawQuery) ->
-  findModeQuery.rawQuery = rawQuery
-  updateFindModeQuery()
-  performFindInPlace()
-  showFindModeHUDForQuery()
-
 handleKeyCharForFindMode = (keyChar) ->
-  updateQueryForFindMode findModeQuery.rawQuery + keyChar
+  HUD.showFindMode findModeQuery.rawQuery + keyChar
 
 handleEscapeForFindMode = ->
   document.body.classList.remove("vimiumFindMode")
@@ -737,7 +731,7 @@ handleDeleteForFindMode = ->
     HUD.hide()
     false
   else
-    updateQueryForFindMode findModeQuery.rawQuery.substring(0, findModeQuery.rawQuery.length - 1)
+    HUD.showFindMode findModeQuery.rawQuery.substring(0, findModeQuery.rawQuery.length - 1)
     true
 
 # <esc> sends us into insert mode if possible, but <cr> does not.
@@ -774,12 +768,12 @@ class FindMode extends Mode
           if rawQuery = FindModeHistory.getQuery @historyIndex + 1
             @historyIndex += 1
             @partialQuery = findModeQuery.rawQuery if @historyIndex == 0
-            updateQueryForFindMode rawQuery
+            HUD.showFindMode rawQuery
           @suppressEvent
         else if event.keyCode == keyCodes.downArrow
           @historyIndex = Math.max -1, @historyIndex - 1
           rawQuery = if 0 <= @historyIndex then FindModeHistory.getQuery @historyIndex else @partialQuery
-          updateQueryForFindMode rawQuery
+          HUD.showFindMode rawQuery
           @suppressEvent
         else
           DomUtils.suppressPropagation(event)
@@ -800,7 +794,7 @@ class FindMode extends Mode
     if findModeQueryHasResults and event?.type != "click"
       new PostFindMode
 
-performFindInPlace = ->
+window.performFindInPlace = ->
   # Restore the selection.  That way, we're always searching forward from the same place, so we find the right
   # match as the user adds matching characters, or removes previously-matched characters. See #1434.
   findModeRestoreSelection()
@@ -989,11 +983,10 @@ window.goNext = ->
   nextStrings = nextPatterns.split(",").filter( (s) -> s.trim().length )
   findAndFollowRel("next") || findAndFollowLink(nextStrings)
 
-showFindModeHUDForQuery = ->
+window.showFindModeHUDForQuery = ->
   matchCount = if findModeQuery.parsedQuery.length > 0 then findModeQuery.matchCount else 0
   showCount = findModeQuery.rawQuery.length > 0
 
-  HUD.showFindMode findModeQuery.rawQuery
   HUD.updateMatchesCount matchCount, showCount
 
 getCurrentRange = ->
@@ -1020,7 +1013,7 @@ window.enterFindMode = (options = {}) ->
   Marks.setPreviousPosition()
   # Save the selection, so performFindInPlace can restore it.
   findModeSaveSelection()
-  findModeQuery = rawQuery: ""
+  window.findModeQuery = rawQuery: ""
   findMode = new FindMode options
   HUD.showFindMode()
   findMode
diff --git a/pages/hud.coffee b/pages/hud.coffee
index a1eef836..3f8eaa93 100644
--- a/pages/hud.coffee
+++ b/pages/hud.coffee
@@ -15,26 +15,26 @@ handlers =
     hud.innerText = "/"
 
     inputElement = document.createElement "span"
-    inputElement.innerText = data.text
+    inputElement.textContent = data.text
     inputElement.id = "hud-find-input"
     hud.appendChild inputElement
 
-  updateMatchesCount: ({matchCount, showMatchText}) ->
-    inputElement = document.getElementById "hud-find-input"
-    return unless inputElement? # Don't do anything if we're not in find mode.
-    nodeAfter = inputElement.nextSibling # The node containing the old match text.
+    countElement = document.createElement "span"
+    countElement.id = "hud-match-count"
+    hud.appendChild countElement
 
-    if showMatchText
-      plural = if matchCount == 1 then "" else "es"
-      countText = if matchCount > 0
-        " (" + matchCount + " Match#{plural})"
-      else
-        " (No matches)"
+    UIComponentServer.postMessage {name: "search", query: inputElement.textContent}
 
-      # Replace the old count (if there was one) with the new one.
-      document.getElementById("hud").insertBefore document.createTextNode(countText), nodeAfter
+  updateMatchesCount: ({matchCount, showMatchText}) ->
+    countElement = document.getElementById "hud-match-count"
+    return unless countElement? # Don't do anything if we're not in find mode.
 
-    nodeAfter?.remove() # Remove the old match text.
+    plural = if matchCount == 1 then "" else "es"
+    countText = if matchCount > 0
+      " (" + matchCount + " Match#{plural})"
+    else
+      " (No matches)"
+    countElement.textContent = if showMatchText then countText else ""
 
 UIComponentServer.registerHandler (event) ->
   {data} = event