[DevTools] Rework some focus code.

third_party/WebKit/Source/devtools/front_end/ui/UIUtils.js

 /*
  * Copyright (C) 2011 Google Inc.  All rights reserved.
  * Copyright (C) 2006, 2007, 2008 Apple Inc.  All rights reserved.
  * Copyright (C) 2007 Matt Lilek (pewtermoose@gmail.com).
  * Copyright (C) 2009 Joseph Pecoraro
  *
  * Redistribution and use in source and binary forms, with or without
  * modification, are permitted provided that the following conditions
  * are met:
  *
@@ skipping 266 matching lines @@
  * @param {boolean=} dimmed
  */
 WebInspector.GlassPane = function(document, dimmed)
 {
     this.element = createElement("div");
     var background = dimmed ? "rgba(255, 255, 255, 0.5)" : "transparent";
     this._zIndex = WebInspector._glassPane ? WebInspector._glassPane._zIndex + 1000 : 3000; // Deliberately starts with 3000 to hide other z-indexed elements below.
     this.element.style.cssText = "position:absolute;top:0;bottom:0;left:0;right:0;background-color:" + background + ";z-index:" + this._zIndex + ";overflow:hidden;";
     document.body.appendChild(this.element);
     WebInspector._glassPane = this;
+    // TODO(dgozman): disallow focus outside of glass pane?
 }
 
 WebInspector.GlassPane.prototype = {
     dispose: function()
     {
         delete WebInspector._glassPane;
         this.element.remove();
     }
 }
 
@@ skipping 18 matching lines @@
     while (element) {
         if (element.__editing)
             return true;
         element = element.parentElementOrShadowHost();
     }
     return false;
 }
 
 /**
  * @return {boolean}
+ * @suppressGlobalPropertiesCheck
  */
 WebInspector.isEditing = function()
 {
     if (WebInspector.__editingCount)
         return true;
 
-    var element = WebInspector.currentFocusElement();
-    if (!element)
+    var focused = document.deepActiveElement();
+    if (!focused)
         return false;
-    return element.classList.contains("text-prompt") || element.nodeName === "INPUT" || element.nodeName === "TEXTAREA";
+    return focused.classList.contains("text-prompt") || focused.nodeName === "INPUT" || focused.nodeName === "TEXTAREA";
 }
 
 /**
  * @param {!Element} element
  * @param {boolean} value
  * @return {boolean}
  */
 WebInspector.markBeingEdited = function(element, value)
 {
     if (value) {
@@ skipping 440 matching lines @@
  * @param {!Document} document
  * @param {!Event} event
  */
 WebInspector._windowBlurred = function(document, event)
 {
     if (event.target.document.nodeType === Node.DOCUMENT_NODE)
         document.body.classList.add("inactive");
 }
 
 /**
- * @return {!Element}
- */
-WebInspector.previousFocusElement = function()
-{
-    return WebInspector._previousFocusElement;
-}
-
-/**
- * @return {!Element}
- */
-WebInspector.currentFocusElement = function()
-{
-    return WebInspector._currentFocusElement;
-}
-
-/**
  * @param {!Event} event
  */
 WebInspector._focusChanged = function(event)
 {
     var node = event.deepActiveElement();
     WebInspector.Widget.focusWidgetForNode(node);
-    WebInspector.setCurrentFocusElement(node);
 }
 
 /**
- * @param {!Document} document
- * @param {!Event} event
+ * @param {!Element|!WebInspector.Widget} toFocus
+ * @return {?Element}
  */
-WebInspector._documentBlurred = function(document, event)
+WebInspector.saveFocusedElement = function(toFocus)
 {
-    // We want to know when currentFocusElement loses focus to nowhere.
-    // This is the case when event.relatedTarget is null (no element is being focused)
-    // and document.activeElement is reset to default (this is not a window blur).
-    if (!event.relatedTarget && document.activeElement === document.body)
-        WebInspector.setCurrentFocusElement(null);
-}
+    var element = null;
+    var widget = null;
+    if (toFocus instanceof WebInspector.Widget) {
+        widget = /** @type {!WebInspector.Widget} */ (toFocus);
+        element = widget.element;
+    } else {
+        element = /** @type {!Element} */ (toFocus);
+    }
 
-WebInspector._textInputTypes = new Set(["text", "search", "tel", "url", "email", "password"]);
-WebInspector._isTextEditingElement = function(element)
-{
-    if (element instanceof HTMLInputElement)
-        return WebInspector._textInputTypes.has(element.type);
-
-    if (element instanceof HTMLTextAreaElement)
-        return true;
-
-    return false;
+    if (!element.isConnected)
+        return null;
+    var result = element.ownerDocument.deepActiveElement();
+    if (widget)
+        widget.focus();
+    else
+        element.focus();
+    return result;
 }
 
 /**
- * @param {?Node} x
+ * @param {!Element|!WebInspector.Widget} fromFocused
+ * @param {?Element} savedElement
+ * @return {?Element}

[luoe, 2016/09/30 18:25:36]

Should this be @return {null}, since this fn() always returns null?

[dgozman, 2016/09/30 20:27:19]

This will mess up with jscompiler, unfortunately.

  */
-WebInspector.setCurrentFocusElement = function(x)
+WebInspector.restoreFocusedElement = function(fromFocused, savedElement)
 {
-    if (WebInspector._glassPane && x && !WebInspector._glassPane.element.isAncestor(x))
-        return;
-    if (x && !x.ownerDocument.isAncestor(x))
-        return;
-    if (WebInspector._currentFocusElement !== x)
-        WebInspector._previousFocusElement = WebInspector._currentFocusElement;
-    WebInspector._currentFocusElement = x;
-
-    if (x) {
-        x.focus();
-
-        // Make a caret selection inside the new element if there isn't a range selection and there isn't already a caret selection inside.
-        // This is needed (at least) to remove caret from console when focus is moved to some element in the panel.
-        // The code below should not be applied to text fields and text areas, hence _isTextEditingElement check.
-        var selection = x.getComponentSelection();
-        if (!WebInspector._isTextEditingElement(x) && selection.isCollapsed && !x.isInsertionCaretInside()) {
-            var selectionRange = x.ownerDocument.createRange();
-            selectionRange.setStart(x, 0);
-            selectionRange.setEnd(x, 0);
-
-            selection.removeAllRanges();
-            selection.addRange(selectionRange);
-        }
-    } else if (WebInspector._previousFocusElement)
-        WebInspector._previousFocusElement.blur();
-}
-
-WebInspector.restoreFocusFromElement = function(element)
-{
-    if (element && element.isSelfOrAncestor(WebInspector.currentFocusElement()))
-        WebInspector.setCurrentFocusElement(WebInspector.previousFocusElement());
+    if (!savedElement || !savedElement.isConnected)
+        return null;
+    var fromNode = fromFocused instanceof WebInspector.Widget ? /** @type {!WebInspector.Widget} */(fromFocused).element : fromFocused;
+    if (fromNode.hasFocus())
+        savedElement.focus();
+    return null;
 }
 
 /**
  * @param {!Element} element
  * @param {number} offset
  * @param {number} length
  * @param {!Array.<!Object>=} domChanges
  * @return {?Element}
  */
 WebInspector.highlightSearchResult = function(element, offset, length, domChanges)
@@ skipping 373 matching lines @@
 
 /**
  * @param {!Document} document
  * @param {!WebInspector.Setting} themeSetting
  */
 WebInspector.initializeUIUtils = function(document, themeSetting)
 {
     document.defaultView.addEventListener("focus", WebInspector._windowFocused.bind(WebInspector, document), false);
     document.defaultView.addEventListener("blur", WebInspector._windowBlurred.bind(WebInspector, document), false);
     document.addEventListener("focus", WebInspector._focusChanged.bind(WebInspector), true);
-    document.addEventListener("blur", WebInspector._documentBlurred.bind(WebInspector, document), true);
 
     if (!WebInspector.themeSupport)
         WebInspector.themeSupport = new WebInspector.ThemeSupport(themeSetting);
     WebInspector.themeSupport.applyTheme(document);
 
     var body = /** @type {!Element} */ (document.body);
     WebInspector.appendStyle(body, "ui/inspectorStyle.css");
     WebInspector.appendStyle(body, "ui/popover.css");
 }
 
@@ skipping 727 matching lines @@
  * @param {string} title
  * @return {!Element}
  */
 WebInspector.linkifyDocumentationURLAsNode = function(article, title)
 {
     return WebInspector.linkifyURLAsNode("https://developers.google.com/web/tools/chrome-devtools/" + article, title, undefined, true);
 }
 
 /** @type {!WebInspector.ThemeSupport} */
 WebInspector.themeSupport;