From e9258ddad8e59020602b317228142f562bc4083e Mon Sep 17 00:00:00 2001
From: Brian Birtles <birtles@gmail.com>
Date: Thu, 28 Jun 2018 15:10:27 +0900
Subject: [PATCH] Bug 1461522 - Factor out a focusableSelector utility;
 r=jdescottes

We will use this later when we introduce a MenuList class since it will want to
manage focus for its menu items.

This patch also extends the definition of focusable elements somewhat.

MozReview-Commit-ID: 3shnC0t79rF

--HG--
extra : rebase_source : 177e05adeef9708bdb78d46fda5286216db6cbb7
---
 devtools/client/shared/focus.js               | 19 +++++++++++++++++++
 devtools/client/shared/moz.build              |  1 +
 .../shared/widgets/tooltip/HTMLTooltip.js     |  8 +++-----
 3 files changed, 23 insertions(+), 5 deletions(-)
 create mode 100644 devtools/client/shared/focus.js

diff --git a/devtools/client/shared/focus.js b/devtools/client/shared/focus.js
new file mode 100644
index 000000000000..8c03925e203a
--- /dev/null
+++ b/devtools/client/shared/focus.js
@@ -0,0 +1,19 @@
+/* This Source Code Form is subject to the terms of the Mozilla Public
+ * License, v. 2.0. If a copy of the MPL was not distributed with this
+ * file, You can obtain one at http://mozilla.org/MPL/2.0/. */
+
+"use strict";
+
+// Simplied selector targetting elements that can receive the focus, full
+// version at
+// http://stackoverflow.com/questions/1599660/which-html-elements-can-receive-focus
+// .
+exports.focusableSelector = [
+  "a[href]:not([tabindex='-1'])",
+  "button:not([disabled]):not([tabindex='-1'])",
+  "iframe:not([tabindex='-1'])",
+  "input:not([disabled]):not([tabindex='-1'])",
+  "select:not([disabled]):not([tabindex='-1'])",
+  "textarea:not([disabled]):not([tabindex='-1'])",
+  "[tabindex]:not([tabindex='-1'])",
+].join(", ");
diff --git a/devtools/client/shared/moz.build b/devtools/client/shared/moz.build
index a97d84f5a620..68ec35c01825 100644
--- a/devtools/client/shared/moz.build
+++ b/devtools/client/shared/moz.build
@@ -30,6 +30,7 @@ DevToolsModules(
     'DOMHelpers.jsm',
     'enum.js',
     'file-saver.js',
+    'focus.js',
     'getjson.js',
     'inplace-editor.js',
     'key-shortcuts.js',
diff --git a/devtools/client/shared/widgets/tooltip/HTMLTooltip.js b/devtools/client/shared/widgets/tooltip/HTMLTooltip.js
index ad80d42469d3..6cfedc8a01c4 100644
--- a/devtools/client/shared/widgets/tooltip/HTMLTooltip.js
+++ b/devtools/client/shared/widgets/tooltip/HTMLTooltip.js
@@ -8,6 +8,7 @@
 
 const EventEmitter = require("devtools/shared/event-emitter");
 const {TooltipToggle} = require("devtools/client/shared/widgets/tooltip/TooltipToggle");
+const {focusableSelector} = require("devtools/client/shared/focus");
 const {getCurrentZoom} = require("devtools/shared/layout/utils");
 const {listenOnce} = require("devtools/shared/async-utils");
 
@@ -759,13 +760,10 @@ HTMLTooltip.prototype = {
   },
 
   /**
-   * If the tootlip is configured to autofocus and a focusable element can be found,
-   * focus it.
+   * If the tooltip is configured to autofocus and a focusable element can be
+   * found, focus it.
    */
   _maybeFocusTooltip: function() {
-    // Simplied selector targetting elements that can receive the focus, full version at
-    // http://stackoverflow.com/questions/1599660/which-html-elements-can-receive-focus .
-    const focusableSelector = "a, button, iframe, input, select, textarea";
     const focusableElement = this.panel.querySelector(focusableSelector);
     if (this.autofocus && focusableElement) {
       focusableElement.focus();