MD Settings: adjust focus-outline behaviors on search engine iron-list.

chrome/browser/resources/settings/focusable_iron_list_item_behavior.js

Index: chrome/browser/resources/settings/focusable_iron_list_item_behavior.js
diff --git a/chrome/browser/resources/settings/focusable_iron_list_item_behavior.js b/chrome/browser/resources/settings/focusable_iron_list_item_behavior.js
new file mode 100644
index 0000000000000000000000000000000000000000..71d873037876e9cd7bba104ea22ff69be1d4448d
--- /dev/null
+++ b/chrome/browser/resources/settings/focusable_iron_list_item_behavior.js
@@ -0,0 +1,59 @@
+// Copyright 2017 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.
+
+/** @polymerBehavior */
+var FocusableIronListItemBehavior = {
+  properties: {
+    /** @private {!boolean} */
+    focusedByKey_: {
+      type: Boolean,
+      value: false
+    },
+  },
+
+  listeners: {
+    'keyup': 'onKeyUp_',
+    'keydown': 'onKeyDown_',
+    'mousedown': 'onMouseDown_',
+    'blur': 'onBlur_',
+  },
+
+  /**
+   * Flag that `this` is focused by keyboard, so mouse click doesn't apply
+   * the .no-outline class.
+   * @private
+   */
+  onKeyUp_: function() {
+    // If refocusing on child, row itself isn't focused by keyboard anymore.
+    if(!this.$$('[focused]'))

[Dan Beam, 2017/02/22 23:25:46]

please stop doing this

  if(
    ^
and do this instead.

  if (!this.$$('[focused]'))
    ^

please read the style guide[s]:
https://google.github.io/styleguide/jsguide.html
https://google.github.io/styleguide/javascriptguide.xml

our code also never does this. git cl format --js should also help.

[scottchen, 2017/02/23 00:31:49]

Done.

+      this.focusedByKey_ = true;
+  },
+
+  /**
+   * Unflag when moving away via keyboard (e.g. tabbing onto its children).
+   * @private
+   */
+  onKeyDown_: function() {
+    this.focusedByKey_ = false;
+  },
+
+  /**
+   * When clicking on a row, do not show focus outline if the element wasn't
+   * already in focus.
+   * @private
+   */
+  onMouseDown_: function() {
+    if(!this.focusedByKey_)
+      this.classList.add('no-outline');
+  },
+
+  /**
+   * Reset when moving away from the row entirely.
+   * @private
+   */
+  onBlur_: function() {
+    this.classList.remove('no-outline');
+    this.focusedByKey_ = false;
+  },
+};