Web Inspector: add button to open Inspector^2

https://bugs.webkit.org/show_bug.cgi?id=175108

Reviewed by Brian Burg.

Source/WebCore:

This patch just exposes a function to the inspector page. No new functionality was added.

* inspector/InspectorFrontendHost.idl:
* inspector/InspectorFrontendHost.h:
* inspector/InspectorFrontendHost.cpp:
(WebCore::InspectorFrontendHost::inspectInspector):

Source/WebInspectorUI:

* UserInterface/Debug/Bootstrap.js:
(updateDebugUI):
(WI.runBootstrapOperations):

* UserInterface/Views/ButtonToolbarItem.js:
(WI.ButtonToolbarItem):
(WI.ButtonToolbarItem.prototype.get label): Deleted.
(WI.ButtonToolbarItem.prototype.set label): Deleted.
* UserInterface/Views/ButtonToolbarItem.css:
(.toolbar .item.button):
(.toolbar .item.button:not(.disabled):active):
(.toolbar .item.button:not(.disabled):matches(:focus, .activate.activated)):
(.toolbar .item.button:not(.disabled):active:matches(:focus, .activate.activated)):
(.toolbar .item.button > .glyph):
(.toolbar .item.button:not(.disabled):active > .glyph): Deleted.
(.toolbar .item.button:not(.disabled):matches(:focus, .activate.activated) > .glyph): Deleted.
(.toolbar .item.button:not(.disabled):active:matches(:focus, .activate.activated) > .glyph): Deleted.
(.toolbar .item.button > .label): Deleted.
* UserInterface/Views/ActivateButtonToolbarItem.js:
(WI.ActivateButtonToolbarItem):
(WI.ActivateButtonToolbarItem.prototype.get label): Deleted.
(WI.ActivateButtonToolbarItem.prototype.set label): Deleted.
* UserInterface/Base/Main.js:
(WI.contentLoaded):
Remove unused `label` parameter from Toolbar objects.

git-svn-id: https://svn.webkit.org/repository/webkit/trunk@220235 268f45cc-cd09-0410-ab3c-d52691b4dbfc

diff --git a/Source/WebCore/ChangeLog b/Source/WebCore/ChangeLog
index e30ec9722cdadc6056bf9987cc77e3f146e2566c..62692096d30392deb27735e25493653c53b5b4ae 100644 (file)
--- a/Source/WebCore/ChangeLog
+++ b/Source/WebCore/ChangeLog
@@ -1,3 +1,17 @@
+2017-08-03  Devin Rousso  <drousso@apple.com>
+
+        Web Inspector: add button to open Inspector^2
+        https://bugs.webkit.org/show_bug.cgi?id=175108
+
+        Reviewed by Brian Burg.
+
+        This patch just exposes a function to the inspector page. No new functionality was added.
+
+        * inspector/InspectorFrontendHost.idl:
+        * inspector/InspectorFrontendHost.h:
+        * inspector/InspectorFrontendHost.cpp:
+        (WebCore::InspectorFrontendHost::inspectInspector):
+
 2017-08-03  Matt Baker  <mattbaker@apple.com>
 
         Web Inspector: Instrument WebGLProgram created/deleted

diff --git a/Source/WebCore/inspector/InspectorFrontendHost.cpp b/Source/WebCore/inspector/InspectorFrontendHost.cpp
index 83dc66b96ee3e6ddffe4c2bc74018f775654d1b9..e05f67e8bf470bc7a20f5fdb13347c8a1f0926c2 100644 (file)
--- a/Source/WebCore/inspector/InspectorFrontendHost.cpp
+++ b/Source/WebCore/inspector/InspectorFrontendHost.cpp
@@ -40,6 +40,7 @@
 #include "Event.h"
 #include "FocusController.h"
 #include "HitTestResult.h"
+#include "InspectorController.h"
 #include "InspectorFrontendClient.h"
 #include "JSMainThreadExecState.h"
 #include "MainFrame.h"
@@ -417,4 +418,10 @@ void InspectorFrontendHost::beep()
     PAL::systemBeep();
 }
 
+void InspectorFrontendHost::inspectInspector()
+{
+    if (m_frontendPage)
+        m_frontendPage->inspectorController().show();
+}
+
 } // namespace WebCore

diff --git a/Source/WebCore/inspector/InspectorFrontendHost.h b/Source/WebCore/inspector/InspectorFrontendHost.h
index ba83a7e40483d66f086950ef5687691766c40cf7..c844e56bd98bf4ecafe9610fa59c7587091d20cf 100644 (file)
--- a/Source/WebCore/inspector/InspectorFrontendHost.h
+++ b/Source/WebCore/inspector/InspectorFrontendHost.h
@@ -101,6 +101,7 @@ public:
     void unbufferedLog(const String& message);
 
     void beep();
+    void inspectInspector();
 
 private:
 #if ENABLE(CONTEXT_MENUS)

diff --git a/Source/WebCore/inspector/InspectorFrontendHost.idl b/Source/WebCore/inspector/InspectorFrontendHost.idl
index 2a18af7099d48cd54f0b07a84065f7508cd5c2bf..d53418bcaedf7719f64c7001c2be574d2d65cb9d 100644 (file)
--- a/Source/WebCore/inspector/InspectorFrontendHost.idl
+++ b/Source/WebCore/inspector/InspectorFrontendHost.idl
@@ -76,6 +76,7 @@
     boolean isUnderTest();
 
     void beep();
+    void inspectInspector();
 };
 
 dictionary ContextMenuItem {

diff --git a/Source/WebInspectorUI/ChangeLog b/Source/WebInspectorUI/ChangeLog
index 4bf75c2c7b1a7185436626578d2ef74d422756a9..d2c236bc0281f8081e2c8b7d4172e5e3ee9e0184 100644 (file)
--- a/Source/WebInspectorUI/ChangeLog
+++ b/Source/WebInspectorUI/ChangeLog
@@ -1,3 +1,36 @@
+2017-08-03  Devin Rousso  <drousso@apple.com>
+
+        Web Inspector: add button to open Inspector^2
+        https://bugs.webkit.org/show_bug.cgi?id=175108
+
+        Reviewed by Brian Burg.
+
+        * UserInterface/Debug/Bootstrap.js:
+        (updateDebugUI):
+        (WI.runBootstrapOperations):
+
+        * UserInterface/Views/ButtonToolbarItem.js:
+        (WI.ButtonToolbarItem):
+        (WI.ButtonToolbarItem.prototype.get label): Deleted.
+        (WI.ButtonToolbarItem.prototype.set label): Deleted.
+        * UserInterface/Views/ButtonToolbarItem.css:
+        (.toolbar .item.button):
+        (.toolbar .item.button:not(.disabled):active):
+        (.toolbar .item.button:not(.disabled):matches(:focus, .activate.activated)):
+        (.toolbar .item.button:not(.disabled):active:matches(:focus, .activate.activated)):
+        (.toolbar .item.button > .glyph):
+        (.toolbar .item.button:not(.disabled):active > .glyph): Deleted.
+        (.toolbar .item.button:not(.disabled):matches(:focus, .activate.activated) > .glyph): Deleted.
+        (.toolbar .item.button:not(.disabled):active:matches(:focus, .activate.activated) > .glyph): Deleted.
+        (.toolbar .item.button > .label): Deleted.
+        * UserInterface/Views/ActivateButtonToolbarItem.js:
+        (WI.ActivateButtonToolbarItem):
+        (WI.ActivateButtonToolbarItem.prototype.get label): Deleted.
+        (WI.ActivateButtonToolbarItem.prototype.set label): Deleted.
+        * UserInterface/Base/Main.js:
+        (WI.contentLoaded):
+        Remove unused `label` parameter from Toolbar objects.
+
 2017-08-03  Matt Baker  <mattbaker@apple.com>
 
         Web Inspector: Instrument WebGLProgram created/deleted

diff --git a/Source/WebInspectorUI/UserInterface/Base/Main.js b/Source/WebInspectorUI/UserInterface/Base/Main.js
index 1aed2eb464289fbac0bc69c1fb3fdbbfaa29856c..715fb0adac418429609df148d592a11f5dd9cae1 100644 (file)
--- a/Source/WebInspectorUI/UserInterface/Base/Main.js
+++ b/Source/WebInspectorUI/UserInterface/Base/Main.js
@@ -354,18 +354,18 @@ WI.contentLoaded = function()
     this._closeToolbarButton = new WI.ControlToolbarItem("dock-close", WI.UIString("Close"), "Images/Close.svg", 16, 14);
     this._closeToolbarButton.addEventListener(WI.ButtonNavigationItem.Event.Clicked, this.close, this);
 
-    this._undockToolbarButton = new WI.ButtonToolbarItem("undock", WI.UIString("Detach into separate window"), null, "Images/Undock.svg");
+    this._undockToolbarButton = new WI.ButtonToolbarItem("undock", WI.UIString("Detach into separate window"), "Images/Undock.svg");
     this._undockToolbarButton.element.classList.add(WI.Popover.IgnoreAutoDismissClassName);
     this._undockToolbarButton.addEventListener(WI.ButtonNavigationItem.Event.Clicked, this._undock, this);
 
     let dockImage = WI.resolvedLayoutDirection() === WI.LayoutDirection.RTL ? "Images/DockLeft.svg" : "Images/DockRight.svg";
-    this._dockToSideToolbarButton = new WI.ButtonToolbarItem("dock-right", WI.UIString("Dock to side of window"), null, dockImage);
+    this._dockToSideToolbarButton = new WI.ButtonToolbarItem("dock-right", WI.UIString("Dock to side of window"), dockImage);
     this._dockToSideToolbarButton.element.classList.add(WI.Popover.IgnoreAutoDismissClassName);
 
     let dockToSideCallback = WI.resolvedLayoutDirection() === WI.LayoutDirection.RTL ? this._dockLeft : this._dockRight;
     this._dockToSideToolbarButton.addEventListener(WI.ButtonNavigationItem.Event.Clicked, dockToSideCallback, this);
 
-    this._dockBottomToolbarButton = new WI.ButtonToolbarItem("dock-bottom", WI.UIString("Dock to bottom of window"), null, "Images/DockBottom.svg");
+    this._dockBottomToolbarButton = new WI.ButtonToolbarItem("dock-bottom", WI.UIString("Dock to bottom of window"), "Images/DockBottom.svg");
     this._dockBottomToolbarButton.element.classList.add(WI.Popover.IgnoreAutoDismissClassName);
     this._dockBottomToolbarButton.addEventListener(WI.ButtonNavigationItem.Event.Clicked, this._dockBottom, this);
 
@@ -377,10 +377,10 @@ WI.contentLoaded = function()
     else
         toolTip = WI.UIString("Reload this page (%s)\nReload ignoring cache (%s)").format(this._reloadPageKeyboardShortcut.displayName, this._reloadPageIgnoringCacheKeyboardShortcut.displayName);
 
-    this._reloadToolbarButton = new WI.ButtonToolbarItem("reload", toolTip, null, "Images/ReloadToolbar.svg");
+    this._reloadToolbarButton = new WI.ButtonToolbarItem("reload", toolTip, "Images/ReloadToolbar.svg");
     this._reloadToolbarButton.addEventListener(WI.ButtonNavigationItem.Event.Clicked, this._reloadPageClicked, this);
 
-    this._downloadToolbarButton = new WI.ButtonToolbarItem("download", WI.UIString("Download Web Archive"), null, "Images/DownloadArrow.svg");
+    this._downloadToolbarButton = new WI.ButtonToolbarItem("download", WI.UIString("Download Web Archive"), "Images/DownloadArrow.svg");
     this._downloadToolbarButton.addEventListener(WI.ButtonNavigationItem.Event.Clicked, this._downloadWebArchive, this);
 
     this._updateReloadToolbarButton();
@@ -390,14 +390,14 @@ WI.contentLoaded = function()
     if (this.debuggableType === WI.DebuggableType.Web) {
         var toolTip = WI.UIString("Start element selection (%s)").format(WI._inspectModeKeyboardShortcut.displayName);
         var activatedToolTip = WI.UIString("Stop element selection (%s)").format(WI._inspectModeKeyboardShortcut.displayName);
-        this._inspectModeToolbarButton = new WI.ActivateButtonToolbarItem("inspect", toolTip, activatedToolTip, null, "Images/Crosshair.svg");
+        this._inspectModeToolbarButton = new WI.ActivateButtonToolbarItem("inspect", toolTip, activatedToolTip, "Images/Crosshair.svg");
         this._inspectModeToolbarButton.addEventListener(WI.ButtonNavigationItem.Event.Clicked, this._toggleInspectMode, this);
     }
 
     this._dashboardContainer = new WI.DashboardContainerView;
     this._dashboardContainer.showDashboardViewForRepresentedObject(this.dashboardManager.dashboards.default);
 
-    this._searchToolbarItem = new WI.SearchBar("inspector-search", WI.UIString("Search"), null, true);
+    this._searchToolbarItem = new WI.SearchBar("inspector-search", WI.UIString("Search"), true);
     this._searchToolbarItem.addEventListener(WI.SearchBar.Event.TextChanged, this._searchTextDidChange, this);
 
     this.toolbar.addToolbarItem(this._closeToolbarButton, WI.Toolbar.Section.Control);

diff --git a/Source/WebInspectorUI/UserInterface/Debug/Bootstrap.js b/Source/WebInspectorUI/UserInterface/Debug/Bootstrap.js
index 8de3617a97790f2d9f6f7531e6ac187e817a7168..a9cc1d1fa0d538b60913c0fd573d5297d27c59fd 100644 (file)
--- a/Source/WebInspectorUI/UserInterface/Debug/Bootstrap.js
+++ b/Source/WebInspectorUI/UserInterface/Debug/Bootstrap.js
@@ -37,22 +37,32 @@ WI.runBootstrapOperations = function() {
         window.location.reload();
     });
 
-    const toolTip = WI.unlocalizedString("Enable dump inspector messages to console");
-    const activatedToolTip = WI.unlocalizedString("Disable dump inspector messages to console");
-    let debugInspectorToolbarButton = new WI.ActivateButtonToolbarItem("debug-inspector", toolTip, activatedToolTip, null, "Images/Console.svg");
-    debugInspectorToolbarButton.activated = InspectorBackend.dumpInspectorProtocolMessages;
-    WI.toolbar.addToolbarItem(debugInspectorToolbarButton, WI.Toolbar.Section.CenterRight);
-    debugInspectorToolbarButton.addEventListener(WI.ButtonNavigationItem.Event.Clicked, () => {
+    const dumpMessagesToolTip = WI.unlocalizedString("Enable dump inspector messages to console");
+    const dumpMessagesActivatedToolTip = WI.unlocalizedString("Disable dump inspector messages to console");
+    let dumpMessagesToolbarItem = new WI.ActivateButtonToolbarItem("dump-messages", dumpMessagesToolTip, dumpMessagesActivatedToolTip, "Images/Console.svg");
+    dumpMessagesToolbarItem.activated = InspectorBackend.dumpInspectorProtocolMessages;
+    dumpMessagesToolbarItem.addEventListener(WI.ButtonNavigationItem.Event.Clicked, () => {
         InspectorBackend.dumpInspectorProtocolMessages = !InspectorBackend.dumpInspectorProtocolMessages;
-        debugInspectorToolbarButton.activated = InspectorBackend.dumpInspectorProtocolMessages;
+        dumpMessagesToolbarItem.activated = InspectorBackend.dumpInspectorProtocolMessages;
     });
     WI.settings.autoLogProtocolMessages.addEventListener(WI.Setting.Event.Changed, () => {
-        debugInspectorToolbarButton.activated = InspectorBackend.dumpInspectorProtocolMessages;
+        dumpMessagesToolbarItem.activated = InspectorBackend.dumpInspectorProtocolMessages;
     });
+    WI.toolbar.addToolbarItem(dumpMessagesToolbarItem, WI.Toolbar.Section.CenterRight);
+
+    let inspectionLevel = InspectorFrontendHost ? InspectorFrontendHost.inspectionLevel() : 1;
+    const inspectInspectorToolTip = WI.unlocalizedString("Open Web Inspector [%d]").format(inspectionLevel + 1);
+    let inspectInspectorToolbarItem = new WI.ButtonToolbarItem("inspect-inspector", inspectInspectorToolTip);
+    inspectInspectorToolbarItem.element.textContent = inspectionLevel + 1;
+    inspectInspectorToolbarItem.addEventListener(WI.ButtonNavigationItem.Event.Clicked, () => {
+        InspectorFrontendHost.inspectInspector();
+    });
+    WI.toolbar.addToolbarItem(inspectInspectorToolbarItem, WI.Toolbar.Section.CenterRight);
 
     function updateDebugUI()
     {
-        debugInspectorToolbarButton.hidden = !WI.showDebugUISetting.value;
+        dumpMessagesToolbarItem.hidden = !WI.showDebugUISetting.value;
+        inspectInspectorToolbarItem.hidden = !WI.showDebugUISetting.value;
     }
 
     WI.showDebugUISetting.addEventListener(WI.Setting.Event.Changed, () => {

diff --git a/Source/WebInspectorUI/UserInterface/Views/ActivateButtonToolbarItem.js b/Source/WebInspectorUI/UserInterface/Views/ActivateButtonToolbarItem.js
index 7481e599fac49e610b24d3c0dfc3a293f764cd9c..d57542cf4e527afe40f54533aaca9974ac045606 100644 (file)
--- a/Source/WebInspectorUI/UserInterface/Views/ActivateButtonToolbarItem.js
+++ b/Source/WebInspectorUI/UserInterface/Views/ActivateButtonToolbarItem.js
@@ -25,32 +25,8 @@
 
 WI.ActivateButtonToolbarItem = class ActivateButtonToolbarItem extends WI.ActivateButtonNavigationItem
 {
-    constructor(identifier, defaultToolTip, activatedToolTip, label, image, role)
+    constructor(identifier, defaultToolTip, activatedToolTip, image, role)
     {
         super(identifier, defaultToolTip, activatedToolTip, image, 16, 16, role);
-
-        if (typeof label === "string") {
-            this._labelElement = document.createElement("div");
-            this._labelElement.className = WI.ButtonToolbarItem.LabelStyleClassName;
-            this._element.appendChild(this._labelElement);
-
-            this.label = label;
-        }
-    }
-
-    // Public
-
-    get label()
-    {
-        return this._labelElement.textContent;
-    }
-
-    set label(newLabel)
-    {
-        console.assert(newLabel);
-        if (!newLabel || !this._labelElement)
-            return;
-
-        this._labelElement.textContent = newLabel;
     }
 };

diff --git a/Source/WebInspectorUI/UserInterface/Views/ButtonToolbarItem.css b/Source/WebInspectorUI/UserInterface/Views/ButtonToolbarItem.css
index 6a4501a9f37266abc25402793b34268b83b0662c..a69927c66b6a8b73c55b00df5225e741f5294cb0 100644 (file)
--- a/Source/WebInspectorUI/UserInterface/Views/ButtonToolbarItem.css
+++ b/Source/WebInspectorUI/UserInterface/Views/ButtonToolbarItem.css
@@ -29,29 +29,25 @@
 
     margin: 4px;
     padding: 0 10px;
-}
-
-.toolbar .item.button > .glyph {
-    width: 16px;
-    height: 16px;
 
     color: hsl(0, 0%, 45%);
 }
 
-.toolbar .item.button:not(.disabled):active > .glyph {
+.toolbar .item.button:not(.disabled):active {
     color: hsl(0, 0%, 30%);
 }
 
-.toolbar .item.button:not(.disabled):matches(:focus, .activate.activated) > .glyph {
+.toolbar .item.button:not(.disabled):matches(:focus, .activate.activated) {
     color: var(--selected-background-color);
 }
 
-.toolbar .item.button:not(.disabled):active:matches(:focus, .activate.activated) > .glyph {
+.toolbar .item.button:not(.disabled):active:matches(:focus, .activate.activated) {
     color: var(--selected-background-color-active);
 }
 
-.toolbar .item.button > .label {
-    display: none;
+.toolbar .item.button > .glyph {
+    width: 16px;
+    height: 16px;
 }
 
 body.window-inactive .toolbar .item.button {

diff --git a/Source/WebInspectorUI/UserInterface/Views/ButtonToolbarItem.js b/Source/WebInspectorUI/UserInterface/Views/ButtonToolbarItem.js
index dcf4d98d6e8d9efbfef9960051374ac762f15d2a..9e4f6d0a1bb6fd6f553b64bb686c355b50208758 100644 (file)
--- a/Source/WebInspectorUI/UserInterface/Views/ButtonToolbarItem.js
+++ b/Source/WebInspectorUI/UserInterface/Views/ButtonToolbarItem.js
@@ -25,34 +25,8 @@
 
 WI.ButtonToolbarItem = class ButtonToolbarItem extends WI.ButtonNavigationItem
 {
-    constructor(identifier, toolTip, label, image, role)
+    constructor(identifier, toolTip, image, role)
     {
         super(identifier, toolTip, image, 16, 16, role);
-
-        if (typeof label === "string") {
-            this._labelElement = document.createElement("div");
-            this._labelElement.className = WI.ButtonToolbarItem.LabelStyleClassName;
-            this._element.appendChild(this._labelElement);
-
-            this.label = label;
-        }
-    }
-
-    // Public
-
-    get label()
-    {
-        return this._labelElement.textContent;
-    }
-
-    set label(newLabel)
-    {
-        console.assert(newLabel);
-        if (!newLabel || !this._labelElement)
-            return;
-
-        this._labelElement.textContent = newLabel;
     }
 };
-
-WI.ButtonToolbarItem.LabelStyleClassName = "label";