Diff
Modified: trunk/Source/WebInspectorUI/ChangeLog (162964 => 162965)
--- trunk/Source/WebInspectorUI/ChangeLog 2014-01-28 22:46:43 UTC (rev 162964)
+++ trunk/Source/WebInspectorUI/ChangeLog 2014-01-28 22:47:03 UTC (rev 162965)
@@ -1,3 +1,32 @@
+2014-01-28 Joseph Pecoraro <pecor...@apple.com>
+
+ Web Inspector: Tweak UI when debugging a JSContext
+ https://bugs.webkit.org/show_bug.cgi?id=127799
+
+ Reviewed by Timothy Hatcher.
+
+ * UserInterface/DashboardView.css:
+ (.toolbar._javascript_ .dashboard):
+ (.toolbar.web.collapsed .dashboard > .logs):
+ (.toolbar._javascript_ .dashboard > .resourcesCount):
+ Adjust collapsed dashboard in web and _javascript_ debugging modes.
+ _javascript_ debugging mode is always treated as collapsed.
+
+ * UserInterface/Main.js:
+ (WebInspector.contentLoaded):
+ Adjust what is created and shown when in _javascript_ debugging mode.
+
+ * UserInterface/NavigationSidebarPanel.css:
+ (.navigation-sidebar-panel-content-tree-outline.hide-disclosure-buttons .item.small):
+ * UserInterface/ResourceSidebarPanel.js:
+ (WebInspector.ResourceSidebarPanel):
+ (WebInspector.ResourceSidebarPanel.prototype._scriptWasAdded):
+ * UserInterface/TimelineSidebarPanel.css:
+ (.sidebar > .panel.timeline > .status-bar):
+ (.sidebar > .panel.timeline > .title-bar):
+ When _javascript_ debugging expect to put things at the root level, so hide
+ disclosure buttons and adjust the style so resources look nice here.
+
2014-01-28 Diego Pino Garcia <dp...@igalia.com>
Web Inspector: In a DataGrid, store value of columnIdentifier to DOM node representing a cell
Modified: trunk/Source/WebInspectorUI/UserInterface/DashboardView.css (162964 => 162965)
--- trunk/Source/WebInspectorUI/UserInterface/DashboardView.css 2014-01-28 22:46:43 UTC (rev 162964)
+++ trunk/Source/WebInspectorUI/UserInterface/DashboardView.css 2014-01-28 22:47:03 UTC (rev 162965)
@@ -53,16 +53,23 @@
background-color: rgb(239, 239, 239);
}
-.toolbar.collapsed .dashboard {
+.toolbar.collapsed .dashboard,
+._javascript_ .toolbar .dashboard {
width: 175px;
}
-.toolbar.collapsed .dashboard > .time,
-.toolbar.collapsed .dashboard > .resourcesSize,
-.toolbar.collapsed .dashboard > .logs {
+.web .toolbar.collapsed .dashboard > .time,
+.web .toolbar.collapsed .dashboard > .resourcesSize,
+.web .toolbar.collapsed .dashboard > .logs {
display: none;
}
+._javascript_ .toolbar .dashboard > .time,
+._javascript_ .toolbar .dashboard > .resourcesSize,
+._javascript_ .toolbar .dashboard > .resourcesCount {
+ display: none;
+}
+
.toolbar .dashboard > .item {
font-family: Helvetica, sans-serif;
font-weight: bold;
Modified: trunk/Source/WebInspectorUI/UserInterface/Main.js (162964 => 162965)
--- trunk/Source/WebInspectorUI/UserInterface/Main.js 2014-01-28 22:46:43 UTC (rev 162964)
+++ trunk/Source/WebInspectorUI/UserInterface/Main.js 2014-01-28 22:47:03 UTC (rev 162965)
@@ -37,7 +37,11 @@
DOMStorage: "dom-storage",
Resource: "resource", // includes Frame too.
Timelines: "timelines",
+};
+WebInspector.DebuggableType = {
+ Web: "web",
+ _javascript_: "_javascript_"
};
WebInspector.SelectedSidebarPanelCookieKey = "selected-sidebar-panel";
@@ -181,6 +185,9 @@
if (versionMatch && versionMatch[1].indexOf("+") !== -1 && document.styleSheets.length < 10)
document.body.classList.add("nightly-build");
+ this.debuggableType = InspectorFrontendHost.debuggableType() === "web" ? WebInspector.DebuggableType.Web : WebInspector.DebuggableType._javascript_;
+ document.body.classList.add(this.debuggableType);
+
// Create the user interface elements.
this.toolbar = new WebInspector.Toolbar(document.getElementById("toolbar"));
this.toolbar.addEventListener(WebInspector.Toolbar.Event.DisplayModeDidChange, this._toolbarDisplayModeDidChange, this);
@@ -238,11 +245,15 @@
this.debuggerSidebarPanel = new WebInspector.DebuggerSidebarPanel;
this.navigationSidebar.addSidebarPanel(this.resourceSidebarPanel);
- this.navigationSidebar.addSidebarPanel(this.timelineSidebarPanel);
+ // FIXME: Enable timelines panel for _javascript_ inspection.
+ if (this.debuggableType !== WebInspector.DebuggableType._javascript_)
+ this.navigationSidebar.addSidebarPanel(this.timelineSidebarPanel);
this.navigationSidebar.addSidebarPanel(this.debuggerSidebarPanel);
this.toolbar.addToolbarItem(this.resourceSidebarPanel.toolbarItem, WebInspector.Toolbar.Section.Left);
- this.toolbar.addToolbarItem(this.timelineSidebarPanel.toolbarItem, WebInspector.Toolbar.Section.Left);
+ // FIXME: Enable timelines panel for _javascript_ inspection.
+ if (this.debuggableType !== WebInspector.DebuggableType._javascript_)
+ this.toolbar.addToolbarItem(this.timelineSidebarPanel.toolbarItem, WebInspector.Toolbar.Section.Left);
this.toolbar.addToolbarItem(this.debuggerSidebarPanel.toolbarItem, WebInspector.Toolbar.Section.Left);
// The toolbar button for the console.
@@ -256,11 +267,13 @@
this.toolbar.addToolbarItem(this.dashboardManager.toolbarItem, WebInspector.Toolbar.Section.Center);
// The toolbar button for node inspection.
- var toolTip = WebInspector.UIString("Enable point to inspect mode (%s)").format(WebInspector._inspectModeKeyboardShortcut.displayName);
- var activatedToolTip = WebInspector.UIString("Disable point to inspect mode (%s)").format(WebInspector._inspectModeKeyboardShortcut.displayName);
- this._inspectModeToolbarButton = new WebInspector.ActivateButtonToolbarItem("inspect", toolTip, activatedToolTip, WebInspector.UIString("Inspect"), "Images/Crosshair.svg");
- this._inspectModeToolbarButton.addEventListener(WebInspector.ButtonNavigationItem.Event.Clicked, this._toggleInspectMode, this);
- this.toolbar.addToolbarItem(this._inspectModeToolbarButton, WebInspector.Toolbar.Section.Center);
+ if (this.debuggableType === WebInspector.DebuggableType.Web) {
+ var toolTip = WebInspector.UIString("Enable point to inspect mode (%s)").format(WebInspector._inspectModeKeyboardShortcut.displayName);
+ var activatedToolTip = WebInspector.UIString("Disable point to inspect mode (%s)").format(WebInspector._inspectModeKeyboardShortcut.displayName);
+ this._inspectModeToolbarButton = new WebInspector.ActivateButtonToolbarItem("inspect", toolTip, activatedToolTip, WebInspector.UIString("Inspect"), "Images/Crosshair.svg");
+ this._inspectModeToolbarButton.addEventListener(WebInspector.ButtonNavigationItem.Event.Clicked, this._toggleInspectMode, this);
+ this.toolbar.addToolbarItem(this._inspectModeToolbarButton, WebInspector.Toolbar.Section.Center);
+ }
this.resourceDetailsSidebarPanel = new WebInspector.ResourceDetailsSidebarPanel;
this.domNodeDetailsSidebarPanel = new WebInspector.DOMNodeDetailsSidebarPanel;
Modified: trunk/Source/WebInspectorUI/UserInterface/NavigationSidebarPanel.css (162964 => 162965)
--- trunk/Source/WebInspectorUI/UserInterface/NavigationSidebarPanel.css 2014-01-28 22:46:43 UTC (rev 162964)
+++ trunk/Source/WebInspectorUI/UserInterface/NavigationSidebarPanel.css 2014-01-28 22:47:03 UTC (rev 162965)
@@ -145,6 +145,10 @@
margin-left: 16px;
}
+.navigation-sidebar-panel-content-tree-outline.hide-disclosure-buttons .item.small {
+ padding-left: 8px;
+}
+
.navigation-sidebar-panel-content-tree-outline .item .disclosure-button {
display: none;
Modified: trunk/Source/WebInspectorUI/UserInterface/ResourceSidebarPanel.js (162964 => 162965)
--- trunk/Source/WebInspectorUI/UserInterface/ResourceSidebarPanel.js 2014-01-28 22:46:43 UTC (rev 162964)
+++ trunk/Source/WebInspectorUI/UserInterface/ResourceSidebarPanel.js 2014-01-28 22:47:03 UTC (rev 162965)
@@ -86,6 +86,9 @@
this._searchContentTreeOutline._onselect_ = this._treeElementSelected.bind(this);
this._resourcesContentTreeOutline.includeSourceMapResourceChildren = true;
+
+ if (WebInspector.debuggableType === WebInspector.DebuggableType._javascript_)
+ this._resourcesContentTreeOutline.element.classList.add(WebInspector.NavigationSidebarPanel.HideDisclosureButtonsStyleClassName);
};
WebInspector.ResourceSidebarPanel.prototype = {
@@ -578,23 +581,35 @@
if (script.resource)
return;
+ var insertIntoTopLevel = false;
+
if (script.injected) {
if (!this._extensionScriptsFolderTreeElement)
this._extensionScriptsFolderTreeElement = new WebInspector.FolderTreeElement(WebInspector.UIString("Extension Scripts"));
var parentFolderTreeElement = this._extensionScriptsFolderTreeElement;
} else {
- if (!this._extraScriptsFolderTreeElement)
- this._extraScriptsFolderTreeElement = new WebInspector.FolderTreeElement(WebInspector.UIString("Extra Scripts"));
- var parentFolderTreeElement = this._extraScriptsFolderTreeElement;
+ if (WebInspector.debuggableType === WebInspector.DebuggableType._javascript_)
+ insertIntoTopLevel = true;
+ else {
+ if (!this._extraScriptsFolderTreeElement)
+ this._extraScriptsFolderTreeElement = new WebInspector.FolderTreeElement(WebInspector.UIString("Extra Scripts"));
+ var parentFolderTreeElement = this._extraScriptsFolderTreeElement;
+ }
}
- if (!parentFolderTreeElement.parent) {
- var index = insertionIndexForObjectInListSortedByFunction(parentFolderTreeElement, this._resourcesContentTreeOutline.children, this._compareTreeElements);
- this._resourcesContentTreeOutline.insertChild(parentFolderTreeElement, index);
+ var scriptTreeElement = new WebInspector.ScriptTreeElement(script);
+
+ if (insertIntoTopLevel) {
+ var index = insertionIndexForObjectInListSortedByFunction(scriptTreeElement, this._resourcesContentTreeOutline.children, this._compareTreeElements);
+ this._resourcesContentTreeOutline.insertChild(scriptTreeElement, index);
+ } else {
+ if (!parentFolderTreeElement.parent) {
+ var index = insertionIndexForObjectInListSortedByFunction(parentFolderTreeElement, this._resourcesContentTreeOutline.children, this._compareTreeElements);
+ this._resourcesContentTreeOutline.insertChild(parentFolderTreeElement, index);
+ }
+
+ parentFolderTreeElement.appendChild(scriptTreeElement);
}
-
- var scriptTreeElement = new WebInspector.ScriptTreeElement(script);
- parentFolderTreeElement.appendChild(scriptTreeElement);
},
_scriptsCleared: function(event)
Modified: trunk/Source/WebInspectorUI/UserInterface/TimelineSidebarPanel.css (162964 => 162965)
--- trunk/Source/WebInspectorUI/UserInterface/TimelineSidebarPanel.css 2014-01-28 22:46:43 UTC (rev 162964)
+++ trunk/Source/WebInspectorUI/UserInterface/TimelineSidebarPanel.css 2014-01-28 22:47:03 UTC (rev 162965)
@@ -26,7 +26,7 @@
.sidebar > .panel.timeline > .status-bar {
position: absolute;
top: 0;
- left: 0;
+ left: 5px;
right: 0;
height: 22px;
border-bottom: 1px solid rgb(179, 179, 179);
@@ -110,7 +110,7 @@
font-family: "Lucida Grande", sans-serif;
font-weight: bold;
- padding: 4px 6px;
+ padding: 4px 9px;
white-space: nowrap;
overflow: hidden;
