MD Settings People: Make Enter key work for Sync Page

chrome/browser/resources/settings/people_page/sync_page.html

 <link rel="import" href="chrome://resources/html/i18n_behavior.html">
 <link rel="import" href="chrome://resources/html/polymer.html">
 <link rel="import" href="chrome://resources/html/web_ui_listener_behavior.html">
+<link rel="import" href="chrome://resources/polymer/v1_0/iron-a11y-keys/iron-a11y-keys.html">
 <link rel="import" href="chrome://resources/polymer/v1_0/paper-button/paper-button.html">
 <link rel="import" href="chrome://resources/polymer/v1_0/paper-toggle-button/paper-toggle-button.html">
 <link rel="import" href="chrome://resources/polymer/v1_0/paper-input/paper-input.html">
 <link rel="import" href="chrome://resources/polymer/v1_0/paper-radio-button/paper-radio-button.html">
 <link rel="import" href="chrome://resources/polymer/v1_0/paper-radio-group/paper-radio-group.html">
 <link rel="import" href="/people_page/sync_browser_proxy.html">
 <link rel="import" href="/route.html">
 <link rel="import" href="/settings_shared_css.html">
 
 <dom-module id="settings-sync-page">
@@ skipping 203 matching lines @@
           </paper-radio-button>
         </paper-radio-group>
         <div id="reset-sync-message-box" class="list-item"
             hidden="[[!syncPrefs.encryptAllData]]">
           <span>$i18nRaw{passphraseResetHint}</span>
         </div>
       </div>
 
       <template is="dom-if" if="[[creatingNewPassphrase_]]">
         <div class="list-frame">
           <div id="create-password-box">

[Dan Beam, 2017/01/14 00:08:07]

can we just use keyBindings and/or IronA11yKeysBehavior directly rather than
making an <iron-a11y-keys> tag for this?

[tommycli, 2017/01/14 00:33:15]

I gave this a try locally, and the main problem is that it listens for Enter
anywhere on the page rather than in the inputs.

In this case I have to inspect the event.target to determine where it's coming
from. Unfortunately event.target and event.currentTarget seem to be null for
some reason. event.detail.keyboardEvent.target is the settings-sync-page.

I'd recommend just sticking with iron-a11y-keys for sanity. The users_page
keyBindings is dead code anyways, so IronA11yKeysBehavior is truly never used
within settings (so far)

             <div class="list-item">
               <span>$i18nRaw{passphraseExplanationText}</span>
             </div>
+            <iron-a11y-keys id="keys" keys="enter"
+                on-keys-pressed="onSaveNewPassphraseTap_">
+            </iron-a11y-keys>
             <paper-input id="passphraseInput" type="password"
                 value="{{passphrase_}}"
                 placeholder="$i18n{passphrasePlaceholder}"
                 error-message="$i18n{emptyPassphraseError}">
             </paper-input>
             <paper-input id="passphraseConfirmationInput" type="password"
                 value="{{confirmation_}}"
                 placeholder="$i18n{passphraseConfirmationPlaceholder}"
                 error-message="$i18n{mismatchedPassphraseError}">
             </paper-input>
@@ skipping 15 matching lines @@
               <a href="$i18nRaw{syncErrorHelpUrl}" target="_blank">
                 $i18n{learnMore}
               </a>
             </span>
           </div>
           <div id="existingPassphraseContainer" class="list-item">
             <paper-input id="existingPassphraseInput" type="password"
                 value="{{existingPassphrase_}}"
                 placeholder="$i18n{passphrasePlaceholder}"
                 error-message="$i18n{incorrectPassphraseError}">
+              <iron-a11y-keys id="keys" keys="enter"
+                  on-keys-pressed="onSubmitExistingPassphraseTap_">

[Dan Beam, 2017/01/14 00:08:07]

if we do end up going with the tag, you should close it ;)

[tommycli, 2017/01/14 00:33:16]

Done.

             </paper-input>
             <paper-button id="submitExistingPassphrase"
                 on-tap="onSubmitExistingPassphraseTap_" class="action-button"
                 disabled="[[!existingPassphrase_]]">
               $i18n{submitPassphraseButton}
             </paper-button>
           </div>
           <div id="passphraseRecoverHint" class="list-item">
             <span>$i18nRaw{passphraseRecover}</span>
           </div>
         </div>
       </template>
     </div>
   </template>
   <script src="sync_page.js"></script>
 </dom-module>