MD WebUI: Improve tab focus behavior for toolbar search field

ui/webui/resources/cr_elements/cr_toolbar/cr_toolbar_search_field.html

 <link rel="import" href="chrome://resources/html/polymer.html">
 <link rel="import" href="chrome://resources/polymer/v1_0/iron-input/iron-input.html">
 <link rel="import" href="chrome://resources/polymer/v1_0/paper-icon-button/paper-icon-button.html">
 <link rel="import" href="chrome://resources/polymer/v1_0/paper-input/paper-input-container.html">
 <link rel="import" href="chrome://resources/cr_elements/cr_search_field/cr_search_field_behavior.html">
 <link rel="import" href="chrome://resources/cr_elements/icons.html">
 
 <dom-module id="cr-toolbar-search-field">
   <template>
     <style>
@@ skipping 64 matching lines @@
 
       /* Any layout, search open. */
       :host([showing-search]) {
         width: 100%;
       }
 
       :host([narrow][showing-search]) #icon {
         -webkit-margin-start: 18px;
       }
     </style>
-    <paper-icon-button id="icon" icon="cr:search"
-        title="[[label]]">
+    <paper-icon-button id="icon" icon="cr:search" title="[[label]]"
+        tabindex$="[[computeIconTabIndex_(narrow)]]">
     </paper-icon-button>
     <paper-input-container on-search="onSearchTermSearch_"
-        on-keydown="onSearchTermKeydown_" no-label-float>
+        on-keydown="onSearchTermKeydown_" on-keypress="onSearchTermKeypress_"

[dpapad, 2016/05/31 18:57:58]

It is confusing that onSearchTermKeydown_ is a reference to a private method of
the behavior. Since this method is used outside the behavior, I think it should
be public.

Also why are we using both keypress and keydown events here and not just stick
with one of the two?

[tsergeant, 2016/06/01 01:20:49]

Good point, done.
 
Keydown is used in the behavior because it wants to pick up the Escape key,
which does not fire keypress events.

Keypress is used in this CL because it doesn't want to pick up non-text keys
like Esc, Tab, Shift, etc, which all fire keydown events but not keypress
events. I've added a comment to explain this.

+        no-label-float>
       <label id="prompt" for="searchInput">[[label]]</label>
       <input is="iron-input" id="searchInput" type="search"
           on-blur="onInputBlur_" incremental></input>
     </paper-input-container>
     <paper-icon-button icon="cr:cancel" id="clearSearch"
         title="[[clearLabel]]" hidden$="[[!hasSearchText]]"
         on-tap="hideSearch_">
     </paper-icon-button>
   </template>
   <script src="cr_toolbar_search_field.js"></script>
 </dom-module>