Language settings: fix focus issues

chrome/browser/resources/settings/languages_page/languages_page.js

 // Copyright 2015 The Chromium Authors. All rights reserved.
 // Use of this source code is governed by a BSD-style license that can be
 // found in the LICENSE file.
 
 /**
  * @fileoverview 'settings-languages-page' is the settings page
  * for language and input method settings.
  */
 (function() {
 'use strict';
@@ skipping 258 matching lines @@
   /**
    * Opens the Manage Input Methods page.
    * @private
    */
   onManageInputMethodsTap_: function() {
     assert(cr.isChromeOS);
     settings.navigateTo(settings.Route.INPUT_METHODS);
   },
 
   /**
-   * Handler for clicking an input method on the main page, which sets it as
-   * the current input method.
+   * Handler for tap and <Enter> events on an input method on the main page,
+   * which sets it as the current input method.
    * @param {!{model: !{item: !chrome.languageSettingsPrivate.InputMethod},
-   *           target: !{tagName: string}}} e
+   *           target: !{tagName: string},
+   *           type: string,
+   *           key: (string|undefined)}} e
    */
   onInputMethodTap_: function(e) {
     assert(cr.isChromeOS);
 
     // Taps on the paper-icon-button are handled in onInputMethodOptionsTap_.
     if (e.target.tagName == 'PAPER-ICON-BUTTON')
       return;
 
+    // Ignore key presses other than <Enter>.
+    if (e.type == 'keypress' && e.key != 'Enter')
+      return;
+
     // Set the input method.
     this.languageHelper.setCurrentInputMethod(e.model.item.id);
   },
 
   /**
    * Opens the input method extension's options page in a new tab (or focuses
    * an existing instance of the IME's options).
    * @param {!{model: !{item: chrome.languageSettingsPrivate.InputMethod}}} e
    * @private
    */
@@ skipping 78 matching lines @@
 
   /**
    * @return {string}
    * @private
    */
   getLanguageListTwoLine_: function() {
     return cr.isChromeOS || cr.isWindows ? 'two-line' : '';
   },
 
   /**
+   * @return {string}
+   * @private
+   */
+  getSpellcheckListTwoLine_: function() {
+    var spellCheckEnabled =
+        this.languages.enabled.some(function(languageState) {
+          return languageState.spellCheckEnabled &&
+                 languageState.language.supportsSpellcheck;
+        });

[stevenjb, 2016/12/01 23:45:33]

This looks duplicated at the top of getSpellCheckSecondaryText_, which makes
sense given the html. I think this would be more clear if they both used a
helper method.

[michaelpg, 2016/12/02 03:31:05]

I've moved this out to a follow-up CL to keep this one somewhat focused on
focus.

+    return spellCheckEnabled ? 'two-line' : '';
+  },
+
+  /**
    * Returns either the "selected" class, if the language matches the
    * prospective UI language, or an empty string. Languages can only be
    * selected on Chrome OS and Windows.
    * @param {string} languageCode The language code identifying a language.
    * @param {string} prospectiveUILanguage The prospective UI language.
    * @param {boolean} supportsUI Whether Chrome's UI can be shown in this
    *     language.
    * @return {string} The class name for the language item.
    * @private
    */
@@ skipping 103 matching lines @@
    * @private
    */
   onRestartTap_: function() {
 <if expr="chromeos">
     settings.LifetimeBrowserProxyImpl.getInstance().signOutAndRestart();
 </if>
 <if expr="not chromeos">
     settings.LifetimeBrowserProxyImpl.getInstance().restart();
 </if>
   },
+
+  /**
+   * Toggles the expand button within the element being listened to.
+   * @param {!Event} e
+   * @private
+   */
+  toggleExpandButton_: function(e) {
+    // The expand button handles toggling itself.
+    var expandButtonTag = 'CR-EXPAND-BUTTON';
+    if (e.target.tagName == expandButtonTag)
+      return;
+
+    /** @type {!CrExpandButtonElement} */
+    var expandButton = e.currentTarget.querySelector(expandButtonTag);
+    assert(expandButton);
+    expandButton.expanded = !expandButton.expanded;
+  },
 });
 })();