Title: [222485] trunk/Source/WebInspectorUI
- Revision
- 222485
- Author
- [email protected]
- Date
- 2017-09-25 18:35:52 -0700 (Mon, 25 Sep 2017)
Log Message
Web Inspector: Add loading indicator next to resources in the Network Tab
https://bugs.webkit.org/show_bug.cgi?id=177469
Patch by Joseph Pecoraro <[email protected]> on 2017-09-25
Reviewed by Matt Baker.
* UserInterface/Models/Resource.js:
(WI.Resource.prototype.isLoading):
Provide a useful accessor to check if the Resource is considered loading or not.
* UserInterface/Views/NetworkGridContentView.js:
(WI.NetworkGridContentView.prototype._networkTimelineRecordAdded):
* UserInterface/Views/ResourceTimelineDataGridNode.js:
(WI.ResourceTimelineDataGridNode.prototype._updateStatus):
* UserInterface/Views/ResourceTreeElement.js:
(WI.ResourceTreeElement.prototype._updateStatus):
Switch existing code to use the new isLoading() function and make the similiar
code more consistent.
* UserInterface/Views/NetworkTableContentView.css:
(body[dir=ltr] .content-view.network .table .cell.name > .status):
(body[dir=rtl] .content-view.network .table .cell.name > .status):
(.content-view.network .table .cell.name > .status .indeterminate-progress-spinner):
* UserInterface/Views/NetworkTableContentView.js:
(WI.NetworkTableContentView.prototype._populateNameCell):
Add a loading indicator to the Name column in the Network tab.
It is sized the same as the loading indicator in the Resource tab.
Modified Paths
Diff
Modified: trunk/Source/WebInspectorUI/ChangeLog (222484 => 222485)
--- trunk/Source/WebInspectorUI/ChangeLog 2017-09-26 01:31:25 UTC (rev 222484)
+++ trunk/Source/WebInspectorUI/ChangeLog 2017-09-26 01:35:52 UTC (rev 222485)
@@ -1,3 +1,32 @@
+2017-09-25 Joseph Pecoraro <[email protected]>
+
+ Web Inspector: Add loading indicator next to resources in the Network Tab
+ https://bugs.webkit.org/show_bug.cgi?id=177469
+
+ Reviewed by Matt Baker.
+
+ * UserInterface/Models/Resource.js:
+ (WI.Resource.prototype.isLoading):
+ Provide a useful accessor to check if the Resource is considered loading or not.
+
+ * UserInterface/Views/NetworkGridContentView.js:
+ (WI.NetworkGridContentView.prototype._networkTimelineRecordAdded):
+ * UserInterface/Views/ResourceTimelineDataGridNode.js:
+ (WI.ResourceTimelineDataGridNode.prototype._updateStatus):
+ * UserInterface/Views/ResourceTreeElement.js:
+ (WI.ResourceTreeElement.prototype._updateStatus):
+ Switch existing code to use the new isLoading() function and make the similiar
+ code more consistent.
+
+ * UserInterface/Views/NetworkTableContentView.css:
+ (body[dir=ltr] .content-view.network .table .cell.name > .status):
+ (body[dir=rtl] .content-view.network .table .cell.name > .status):
+ (.content-view.network .table .cell.name > .status .indeterminate-progress-spinner):
+ * UserInterface/Views/NetworkTableContentView.js:
+ (WI.NetworkTableContentView.prototype._populateNameCell):
+ Add a loading indicator to the Name column in the Network tab.
+ It is sized the same as the loading indicator in the Resource tab.
+
2017-09-25 Ross Kirsling <[email protected]>
Web Inspector: Elements tab's Layers sidebar should disappear when Layers tab is present.
Modified: trunk/Source/WebInspectorUI/UserInterface/Models/Resource.js (222484 => 222485)
--- trunk/Source/WebInspectorUI/UserInterface/Models/Resource.js 2017-09-26 01:31:25 UTC (rev 222484)
+++ trunk/Source/WebInspectorUI/UserInterface/Models/Resource.js 2017-09-26 01:35:52 UTC (rev 222485)
@@ -843,6 +843,11 @@
this.markAsCached();
}
+ isLoading()
+ {
+ return !this._finished && !this._failed;
+ }
+
hadLoadingError()
{
return this._failed || this._canceled || this._statusCode >= 400;
Modified: trunk/Source/WebInspectorUI/UserInterface/Views/NetworkGridContentView.js (222484 => 222485)
--- trunk/Source/WebInspectorUI/UserInterface/Views/NetworkGridContentView.js 2017-09-26 01:31:25 UTC (rev 222484)
+++ trunk/Source/WebInspectorUI/UserInterface/Views/NetworkGridContentView.js 2017-09-26 01:35:52 UTC (rev 222485)
@@ -356,7 +356,7 @@
this.needsLayout();
let resource = resourceTimelineRecord.resource;
- if (resource.finished || resource.failed || resource.canceled)
+ if (!resource.isLoading())
return;
resource[WI.NetworkGridContentView.ResourceDidFinishOrFail] = false;
Modified: trunk/Source/WebInspectorUI/UserInterface/Views/NetworkTableContentView.css (222484 => 222485)
--- trunk/Source/WebInspectorUI/UserInterface/Views/NetworkTableContentView.css 2017-09-26 01:31:25 UTC (rev 222484)
+++ trunk/Source/WebInspectorUI/UserInterface/Views/NetworkTableContentView.css 2017-09-26 01:35:52 UTC (rev 222485)
@@ -43,3 +43,19 @@
.content-view.network .table .error {
color: var(--error-text-color);
}
+
+body[dir=ltr] .content-view.network .table .cell.name > .status {
+ float: right;
+ margin-left: 4px;
+}
+
+body[dir=rtl] .content-view.network .table .cell.name > .status {
+ float: left;
+ margin-right: 4px;
+}
+
+.content-view.network .table .cell.name > .status .indeterminate-progress-spinner {
+ margin-top: 3px;
+ width: 14px;
+ height: 14px;
+}
Modified: trunk/Source/WebInspectorUI/UserInterface/Views/NetworkTableContentView.js (222484 => 222485)
--- trunk/Source/WebInspectorUI/UserInterface/Views/NetworkTableContentView.js 2017-09-26 01:31:25 UTC (rev 222484)
+++ trunk/Source/WebInspectorUI/UserInterface/Views/NetworkTableContentView.js 2017-09-26 01:35:52 UTC (rev 222485)
@@ -270,8 +270,16 @@
_populateNameCell(cell, entry)
{
- cell.removeChildren();
+ console.assert(!cell.firstChild, "We expect the cell to be empty.", cell, cell.firstChild);
+ let resource = entry.resource;
+ if (resource.isLoading()) {
+ let statusElement = cell.appendChild(document.createElement("div"));
+ statusElement.className = "status";
+ let spinner = new WI.IndeterminateProgressSpinner;
+ statusElement.appendChild(spinner.element);
+ }
+
let iconElement = cell.appendChild(document.createElement("img"));
iconElement.className = "icon";
cell.classList.add(WI.ResourceTreeElement.ResourceIconStyleClassName, entry.resource.type);
Modified: trunk/Source/WebInspectorUI/UserInterface/Views/ResourceTimelineDataGridNode.js (222484 => 222485)
--- trunk/Source/WebInspectorUI/UserInterface/Views/ResourceTimelineDataGridNode.js 2017-09-26 01:31:25 UTC (rev 222484)
+++ trunk/Source/WebInspectorUI/UserInterface/Views/ResourceTimelineDataGridNode.js 2017-09-26 01:35:52 UTC (rev 222485)
@@ -310,17 +310,15 @@
this.createGoToArrowButton(cell, this._dataGridNodeGoToArrowClicked.bind(this));
}
- if (this._spinner)
- this._spinner.element.remove();
-
- if (this._resource.finished || this._resource.failed)
- return;
-
- if (!this._spinner)
- this._spinner = new WI.IndeterminateProgressSpinner;
-
- let contentElement = cell.firstChild;
- contentElement.appendChild(this._spinner.element);
+ if (this._resource.isLoading()) {
+ if (!this._spinner)
+ this._spinner = new WI.IndeterminateProgressSpinner;
+ let contentElement = cell.firstChild;
+ contentElement.appendChild(this._spinner.element);
+ } else {
+ if (this._spinner)
+ this._spinner.element.remove();
+ }
}
_mouseoverRecordBar(event)
Modified: trunk/Source/WebInspectorUI/UserInterface/Views/ResourceTreeElement.js (222484 => 222485)
--- trunk/Source/WebInspectorUI/UserInterface/Views/ResourceTreeElement.js 2017-09-26 01:31:25 UTC (rev 222484)
+++ trunk/Source/WebInspectorUI/UserInterface/Views/ResourceTreeElement.js 2017-09-26 01:35:52 UTC (rev 222485)
@@ -177,14 +177,15 @@
else
this.removeClassName(WI.ResourceTreeElement.FailedStyleClassName);
- if (this._resource.finished || this._resource.failed) {
- // Remove the spinner.
+ if (this._resource.isLoading()) {
+ if (!this.status || !this.status[WI.ResourceTreeElement.SpinnerSymbol]) {
+ let spinner = new WI.IndeterminateProgressSpinner;
+ this.status = spinner.element;
+ this.status[WI.ResourceTreeElement.SpinnerSymbol] = true;
+ }
+ } else {
if (this.status && this.status[WI.ResourceTreeElement.SpinnerSymbol])
this.status = "";
- } else {
- let spinner = new WI.IndeterminateProgressSpinner;
- this.status = spinner.element;
- this.status[WI.ResourceTreeElement.SpinnerSymbol] = true;
}
}
_______________________________________________
webkit-changes mailing list
[email protected]
https://lists.webkit.org/mailman/listinfo/webkit-changes
