Retain focused node when redrawing tokenizer/typeahead results

Summary:
Ref T4420. Fixes T5473. Currently, when typeahead results get redrawn, you can lose your cursor position. A simple way to reproduce this is type "dif", select "Differential" using the arrow keys, then type "f". The selection will be lost.

Instead: store the old selection, then look for an item with the same name in the new set and select it. In effect, this preserves any focus selection.

Test Plan:
  - Typed "dif".
  - Typed "down arrow key" to select "Differential".
  - Typed "f".
  - "Differential" remained selected.

Reviewers: btrahan

Reviewed By: btrahan

Subscribers: epriestley

Maniphest Tasks: T5473, T4420

Differential Revision: https://secure.phabricator.com/D9900

resources/celerity/map.php

@@ -8,7 +8,7 @@
 return array(
   'names' => array(
     'core.pkg.css' => 'c2c68e64',
-    'core.pkg.js' => '0095fb2c',
+    'core.pkg.js' => 'dc4959a8',
     'darkconsole.pkg.js' => 'df001cab',
     'differential.pkg.css' => '4a93db37',
     'differential.pkg.js' => '7528cfc9',
@@ -212,7 +212,7 @@ return array(
     'rsrc/externals/javelin/lib/__tests__/behavior.js' => '1ea62783',
     'rsrc/externals/javelin/lib/behavior.js' => '61cbc29a',
     'rsrc/externals/javelin/lib/control/tokenizer/Tokenizer.js' => 'a5b67173',
-    'rsrc/externals/javelin/lib/control/typeahead/Typeahead.js' => '61f72a3d',
+    'rsrc/externals/javelin/lib/control/typeahead/Typeahead.js' => 'e614d22b',
     'rsrc/externals/javelin/lib/control/typeahead/normalizer/TypeaheadNormalizer.js' => 'aa93c7b0',
     'rsrc/externals/javelin/lib/control/typeahead/source/TypeaheadCompositeSource.js' => '503e17fd',
     'rsrc/externals/javelin/lib/control/typeahead/source/TypeaheadOnDemandSource.js' => '8b3fd187',
@@ -683,7 +683,7 @@ return array(
     'javelin-router' => '29274e2b',
     'javelin-stratcom' => '8b0ad945',
     'javelin-tokenizer' => 'a5b67173',
-    'javelin-typeahead' => '61f72a3d',
+    'javelin-typeahead' => 'e614d22b',
     'javelin-typeahead-composite-source' => '503e17fd',
     'javelin-typeahead-normalizer' => 'aa93c7b0',
     'javelin-typeahead-ondemand-source' => '8b3fd187',
@@ -1245,12 +1245,6 @@ return array(
       0 => 'javelin-magical-init',
       1 => 'javelin-util',
     ),
-    '61f72a3d' => array(
-      0 => 'javelin-install',
-      1 => 'javelin-dom',
-      2 => 'javelin-vector',
-      3 => 'javelin-util',
-    ),
     '6453c869' => array(
       0 => 'javelin-install',
       1 => 'javelin-dom',
@@ -1836,6 +1830,12 @@ return array(
       2 => 'javelin-view-visitor',
       3 => 'javelin-util',
     ),
+    'e614d22b' => array(
+      0 => 'javelin-install',
+      1 => 'javelin-dom',
+      2 => 'javelin-vector',
+      3 => 'javelin-util',
+    ),
     'e9581f08' => array(
       0 => 'javelin-behavior',
       1 => 'javelin-stratcom',

webroot/rsrc/externals/javelin/lib/control/typeahead/Typeahead.js

@@ -241,6 +241,15 @@ JX.install('Typeahead', {
       var obj = {show: results};
       var e = this.invoke('show', obj);
 
+      // If the user has an element focused, store the value before we redraw.
+      // After we redraw, try to select the same element if it still exists in
+      // the list. This prevents redraws from disrupting keyboard element
+      // selection.
+      var old_focus = null;
+      if (this._focus >= 0 && this._display[this._focus]) {
+        old_focus = this._display[this._focus].name;
+      }
+
       // Note that the results list may have been update by the "show" event
       // listener. Non-result node (e.g. divider or label) may have been
       // inserted.
@@ -256,6 +265,18 @@ JX.install('Typeahead', {
           this._hardpoint.appendChild(this._root);
         }
         JX.DOM.show(this._root);
+
+        // If we had a node focused before, look for a node with the same value
+        // and focus it.
+        if (old_focus !== null) {
+          for (var ii = 0; ii < this._display.length; ii++) {
+            if (this._display[ii].name == old_focus) {
+              this._focus = ii;
+              this._drawFocus();
+              break;
+            }
+          }
+        }
       } else {
         this.hide();
         JX.DOM.setContent(this._root, null);