Skip to content

Commit

Permalink
Web Inspector: Always show percents together with counters in heap in…
Browse files Browse the repository at this point in the history 
…spector.

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

Source/WebCore:

Patch by Alexei Filippov <alexeif@chromium.org> on 2012-02-02
Reviewed by Pavel Feldman.

* inspector/front-end/DetailedHeapshotGridNodes.js:
(WebInspector.HeapSnapshotGridNode.prototype._toPercentString):
(WebInspector.HeapSnapshotGridNode.prototype._createValueCell):
(WebInspector.HeapSnapshotGenericObjectNode.prototype.createCell):
(WebInspector.HeapSnapshotGenericObjectNode.prototype.get data):
(WebInspector.HeapSnapshotConstructorNode.prototype.createCell):
(WebInspector.HeapSnapshotConstructorNode.prototype.get data):
(WebInspector.HeapSnapshotDiffNode.prototype.get data):
* inspector/front-end/DetailedHeapshotView.js:
(WebInspector.HeapSnapshotContainmentDataGrid):
(WebInspector.HeapSnapshotConstructorsDataGrid):
(WebInspector.HeapSnapshotDiffDataGrid):
(WebInspector.HeapSnapshotDominatorsDataGrid):
(WebInspector.DetailedHeapshotView.prototype._mouseDownInContentsGrid):
(WebInspector.DetailedHeapshotView.prototype.get _isShowingAsPercent):
(WebInspector.DetailedHeapshotView.prototype._percentClicked):
* inspector/front-end/heapProfiler.css:
(.detailed-heapshot-view .data-grid span.percent-column):

LayoutTests:

Added parseInt conversion as counters are now strings not ints.

Patch by Alexei Filippov <alexeif@chromium.org> on 2012-02-02
Reviewed by Pavel Feldman.

* inspector/profiler/detailed-heapshots-comparison-show-all.html:
* inspector/profiler/detailed-heapshots-comparison-show-next.html:
* inspector/profiler/detailed-heapshots-summary-show-all.html:

git-svn-id: http://svn.webkit.org/repository/webkit/trunk@106633 268f45cc-cd09-0410-ab3c-d52691b4dbfc
  • Loading branch information
@webkit-commit-queue
webkit-commit-queue committed Feb 3, 2012
1 parent 8435476 commit c6cc684
Show file tree
Hide file tree
Showing 8 changed files with 123 additions and 55 deletions.
13 changes: 13 additions & 0 deletions LayoutTests/ChangeLog
View file
@@ -1,3 +1,16 @@
2012-02-02 Alexei Filippov <alexeif@chromium.org>

Web Inspector: Always show percents together with counters in heap inspector.
https://bugs.webkit.org/show_bug.cgi?id=77434

Added parseInt conversion as counters are now strings not ints.

Reviewed by Pavel Feldman.

* inspector/profiler/detailed-heapshots-comparison-show-all.html:
* inspector/profiler/detailed-heapshots-comparison-show-next.html:
* inspector/profiler/detailed-heapshots-summary-show-all.html:

2012-02-02 Matt Falkenhagen <falken@chromium.org>

Use content-language from http-equiv to set document locale and font
Expand Down
8 changes: 4 additions & 4 deletions LayoutTests/inspector/profiler/detailed-heapshots-comparison-show-all.html
View file
Expand Up @@ -47,7 +47,7 @@
for (var i = 0; i < words.length; ++i) {
var maybeNumber = parseInt(words[i], 10);
if (!isNaN(maybeNumber))
InspectorTest.assertEquals(countA, maybeNumber, buttonsNode.showAll.textContent);
InspectorTest.assertEquals(countA, words[i], buttonsNode.showAll.textContent);
}
InspectorTest.clickShowMoreButton("showAll", buttonsNode, step4);
}
Expand All @@ -56,7 +56,7 @@
function step4(row)
{
var rowsShown = InspectorTest.countDataRows(row, function(node) { return node.data.addedCount; });
InspectorTest.assertEquals(countA, rowsShown, "after showAll click 1");
InspectorTest.assertEquals(countA, rowsShown.toString(), "after showAll click 1");

countB = row.data["removedCount"];
InspectorTest.assertEquals(true, countB > 0, "countB > 0");
Expand All @@ -66,15 +66,15 @@
for (var i = 0; i < words.length; ++i) {
var maybeNumber = parseInt(words[i], 10);
if (!isNaN(maybeNumber))
InspectorTest.assertEquals(countB, maybeNumber, buttonsNode.showAll.textContent);
InspectorTest.assertEquals(countB, words[i], buttonsNode.showAll.textContent);
}
InspectorTest.clickShowMoreButton("showAll", buttonsNode, step5);
}

function step5(row)
{
var rowsShown = InspectorTest.countDataRows(row, function(node) { return node.data.removedCount; });
InspectorTest.assertEquals(countB, rowsShown, "after showAll click 2");
InspectorTest.assertEquals(countB, rowsShown.toString(), "after showAll click 2");
var buttonsNode = InspectorTest.findButtonsNode(row);
InspectorTest.assertEquals(false, !!buttonsNode, "buttons node found after all rows shown");
setTimeout(next, 0);
Expand Down
4 changes: 2 additions & 2 deletions LayoutTests/inspector/profiler/detailed-heapshots-comparison-show-next.html
View file
Expand Up @@ -38,7 +38,7 @@

function step3(row)
{
var expectedRowCountA = row.data["addedCount"];
var expectedRowCountA = parseInt(row.data["addedCount"]);
var rowsShown = InspectorTest.countDataRows(row, function(node) { return node.data.addedCount; });
InspectorTest.assertEquals(true, rowsShown <= expectedRowCountA, "shown more instances than created: " + rowsShown + " > " + expectedRowCountA);
if (rowsShown < expectedRowCountA) {
Expand All @@ -51,7 +51,7 @@

function step4(row)
{
var expectedRowCountB = row.data["removedCount"];
var expectedRowCountB = parseInt(row.data["removedCount"]);
var rowsShown = InspectorTest.countDataRows(row, function(node) { return node.data.removedCount; });
InspectorTest.assertEquals(true, rowsShown <= expectedRowCountB, "shown more instances than created: " + rowsShown + " > " + expectedRowCountB);
if (rowsShown < expectedRowCountB) {
Expand Down
2 changes: 1 addition & 1 deletion LayoutTests/inspector/profiler/detailed-heapshots-summary-show-all.html
View file
Expand Up @@ -32,7 +32,7 @@
function step3(row)
{
var count = row.data["count"];
InspectorTest.assertEquals(instanceCount, count);
InspectorTest.assertEquals(instanceCount.toString(), count);
var buttonsNode = InspectorTest.findButtonsNode(row);
InspectorTest.assertEquals(true, !!buttonsNode, "buttons node");
var words = buttonsNode.showAll.textContent.split(" ");
Expand Down
26 changes: 26 additions & 0 deletions Source/WebCore/ChangeLog
View file
@@ -1,3 +1,29 @@
2012-02-02 Alexei Filippov <alexeif@chromium.org>

Web Inspector: Always show percents together with counters in heap inspector.
https://bugs.webkit.org/show_bug.cgi?id=77434

Reviewed by Pavel Feldman.

* inspector/front-end/DetailedHeapshotGridNodes.js:
(WebInspector.HeapSnapshotGridNode.prototype._toPercentString):
(WebInspector.HeapSnapshotGridNode.prototype._createValueCell):
(WebInspector.HeapSnapshotGenericObjectNode.prototype.createCell):
(WebInspector.HeapSnapshotGenericObjectNode.prototype.get data):
(WebInspector.HeapSnapshotConstructorNode.prototype.createCell):
(WebInspector.HeapSnapshotConstructorNode.prototype.get data):
(WebInspector.HeapSnapshotDiffNode.prototype.get data):
* inspector/front-end/DetailedHeapshotView.js:
(WebInspector.HeapSnapshotContainmentDataGrid):
(WebInspector.HeapSnapshotConstructorsDataGrid):
(WebInspector.HeapSnapshotDiffDataGrid):
(WebInspector.HeapSnapshotDominatorsDataGrid):
(WebInspector.DetailedHeapshotView.prototype._mouseDownInContentsGrid):
(WebInspector.DetailedHeapshotView.prototype.get _isShowingAsPercent):
(WebInspector.DetailedHeapshotView.prototype._percentClicked):
* inspector/front-end/heapProfiler.css:
(.detailed-heapshot-view .data-grid span.percent-column):

2012-02-02 Matt Falkenhagen <falken@chromium.org>

Use content-language from http-equiv to set document locale and font
Expand Down
62 changes: 51 additions & 11 deletions Source/WebCore/inspector/front-end/DetailedHeapshotGridNodes.js
View file
Expand Up @@ -60,6 +60,30 @@ WebInspector.HeapSnapshotGridNode.prototype = {
{
},

_toPercentString: function(num)
{
return num.toFixed(2) + "%";
},

_createValueCell: function(columnIdentifier)
{
var cell = document.createElement("td");
cell.className = columnIdentifier + "-column";
var div = document.createElement("div");
var valueSpan = document.createElement("span");
valueSpan.textContent = this.data[columnIdentifier];
var percentColumn = columnIdentifier + "-percent";
if (percentColumn in this.data) {
var percentSpan = document.createElement("span");
percentSpan.className = "percent-column";
percentSpan.textContent = this.data[percentColumn];
div.appendChild(percentSpan);
}
div.appendChild(valueSpan);
cell.appendChild(div);
return cell;
},

_populate: function(event)
{
this.removeEventListener("populate", this._populate, this);
Expand Down Expand Up @@ -195,7 +219,7 @@ WebInspector.HeapSnapshotGenericObjectNode = function(tree, node)
WebInspector.HeapSnapshotGenericObjectNode.prototype = {
createCell: function(columnIdentifier)
{
var cell = columnIdentifier !== "object" ? WebInspector.DataGridNode.prototype.createCell.call(this, columnIdentifier) : this._createObjectCell();
var cell = columnIdentifier !== "object" ? this._createValueCell(columnIdentifier) : this._createObjectCell();
if (this._searchMatched)
cell.addStyleClass("highlight");
return cell;
Expand Down Expand Up @@ -268,8 +292,12 @@ WebInspector.HeapSnapshotGenericObjectNode.prototype = {
data["object"] = { valueStyle: valueStyle, value: value + ": @" + this.snapshotNodeId };

var view = this.dataGrid.snapshotView;
data["shallowSize"] = view.showShallowSizeAsPercent ? WebInspector.UIString("%.2f%%", this._shallowSizePercent) : Number.withThousandsSeparator(this._shallowSize);
data["retainedSize"] = view.showRetainedSizeAsPercent ? WebInspector.UIString("%.2f%%", this._retainedSizePercent) : Number.withThousandsSeparator(this._retainedSize);
data["shallowSize"] = Number.withThousandsSeparator(this._shallowSize);
data["retainedSize"] = Number.withThousandsSeparator(this._retainedSize);
if (view._showPercentage) {
data["shallowSize-percent"] = this._toPercentString(this._shallowSizePercent);
data["retainedSize-percent"] = this._toPercentString(this._retainedSizePercent);
}

return this._enhanceData ? this._enhanceData(data) : data;
},
Expand Down Expand Up @@ -532,6 +560,14 @@ WebInspector.HeapSnapshotConstructorNode = function(tree, className, aggregate,
}

WebInspector.HeapSnapshotConstructorNode.prototype = {
createCell: function(columnIdentifier)
{
var cell = columnIdentifier !== "object" ? this._createValueCell(columnIdentifier) : WebInspector.HeapSnapshotGridNode.prototype.createCell.call(this, columnIdentifier);
if (this._searchMatched)
cell.addStyleClass("highlight");
return cell;
},

_createChildNode: function(item)
{
return new WebInspector.HeapSnapshotInstanceNode(this.dataGrid, null, this.dataGrid.snapshot, item);
Expand Down Expand Up @@ -567,11 +603,15 @@ WebInspector.HeapSnapshotConstructorNode.prototype = {

get data()
{
var data = {object: this._name, count: this._count};
var data = {object: this._name};
var view = this.dataGrid.snapshotView;
data["count"] = view.showCountAsPercent ? WebInspector.UIString("%.2f%%", this._countPercent) : this._count;
data["shallowSize"] = view.showShallowSizeAsPercent ? WebInspector.UIString("%.2f%%", this._shallowSizePercent) : Number.withThousandsSeparator(this._shallowSize);
data["retainedSize"] = view.showRetainedSizeAsPercent ? "~" + WebInspector.UIString("%.2f%%", this._retainedSizePercent) : Number.withThousandsSeparator(this._retainedSize) + "+";
data["count"] = Number.withThousandsSeparator(this._count);
data["shallowSize"] = Number.withThousandsSeparator(this._shallowSize);
data["retainedSize"] = Number.withThousandsSeparator(this._retainedSize) + "+";
if (view._showPercentage) {
data["shallowSize-percent"] = this._toPercentString(this._shallowSizePercent);
data["retainedSize-percent"] = this._toPercentString(this._retainedSizePercent);
}
return data;
},

Expand Down Expand Up @@ -748,12 +788,12 @@ WebInspector.HeapSnapshotDiffNode.prototype = {
{
var data = {object: this._name};

data["addedCount"] = this._addedCount;
data["removedCount"] = this._removedCount;
data["countDelta"] = WebInspector.UIString("%s%d", this._signForDelta(this._countDelta), Math.abs(this._countDelta));
data["addedCount"] = Number.withThousandsSeparator(this._addedCount);
data["removedCount"] = Number.withThousandsSeparator(this._removedCount);
data["countDelta"] = this._signForDelta(this._countDelta) + Number.withThousandsSeparator(Math.abs(this._countDelta));
data["addedSize"] = Number.withThousandsSeparator(this._addedSize);
data["removedSize"] = Number.withThousandsSeparator(this._removedSize);
data["sizeDelta"] = WebInspector.UIString("%s%s", this._signForDelta(this._sizeDelta), Number.withThousandsSeparator(Math.abs(this._sizeDelta)));
data["sizeDelta"] = this._signForDelta(this._sizeDelta) + Number.withThousandsSeparator(Math.abs(this._sizeDelta));

return data;
}
Expand Down
57 changes: 20 additions & 37 deletions Source/WebCore/inspector/front-end/DetailedHeapshotView.js
View file
Expand Up @@ -115,9 +115,9 @@ WebInspector.HeapSnapshotSortableDataGrid.prototype.__proto__ = WebInspector.Dat
WebInspector.HeapSnapshotContainmentDataGrid = function()
{
var columns = {
object: { title: WebInspector.UIString("Object"), disclosure: true, sortable: true, sort: "ascending" },
shallowSize: { title: WebInspector.UIString("Shallow Size"), width: "90px", sortable: true },
retainedSize: { title: WebInspector.UIString("Retained Size"), width: "90px", sortable: true }
object: { title: WebInspector.UIString("Object"), disclosure: true, sortable: true },
shallowSize: { title: WebInspector.UIString("Shallow Size"), width: "120px", sortable: true },
retainedSize: { title: WebInspector.UIString("Retained Size"), width: "120px", sortable: true, sort: "descending" }
};
WebInspector.HeapSnapshotSortableDataGrid.call(this, columns);
}
Expand Down Expand Up @@ -200,9 +200,9 @@ WebInspector.HeapSnapshotConstructorsDataGrid = function()
{
var columns = {
object: { title: WebInspector.UIString("Constructor"), disclosure: true, sortable: true },
count: { title: WebInspector.UIString("#"), width: "45px", sortable: true },
shallowSize: { title: WebInspector.UIString("Shallow Size"), width: "90px", sortable: true },
retainedSize: { title: WebInspector.UIString("Retained Size"), width: "90px", sort: "descending", sortable: true }
count: { title: WebInspector.UIString("Objects Count"), width: "90px", sortable: true },
shallowSize: { title: WebInspector.UIString("Shallow Size"), width: "120px", sortable: true },
retainedSize: { title: WebInspector.UIString("Retained Size"), width: "120px", sort: "descending", sortable: true }
};
WebInspector.HeapSnapshotSortableDataGrid.call(this, columns);
this._filterProfileIndex = -1;
Expand Down Expand Up @@ -291,13 +291,12 @@ WebInspector.HeapSnapshotDiffDataGrid = function()
{
var columns = {
object: { title: WebInspector.UIString("Constructor"), disclosure: true, sortable: true },
addedCount: { title: WebInspector.UIString("# New"), width: "72px", sortable: true, sort: "descending" },
addedCount: { title: WebInspector.UIString("# New"), width: "72px", sortable: true },
removedCount: { title: WebInspector.UIString("# Deleted"), width: "72px", sortable: true },
// \u0394 is a Greek delta letter.
countDelta: { title: "\u0394", width: "40px", sortable: true },
addedSize: { title: WebInspector.UIString("Alloc. Size"), width: "72px", sortable: true },
countDelta: { title: "# Delta", width: "64px", sortable: true },
addedSize: { title: WebInspector.UIString("Alloc. Size"), width: "72px", sortable: true, sort: "descending" },
removedSize: { title: WebInspector.UIString("Freed Size"), width: "72px", sortable: true },
sizeDelta: { title: "\u0394", width: "72px", sortable: true }
sizeDelta: { title: "Size Delta", width: "72px", sortable: true }
};
WebInspector.HeapSnapshotSortableDataGrid.call(this, columns);
}
Expand Down Expand Up @@ -381,8 +380,8 @@ WebInspector.HeapSnapshotDominatorsDataGrid = function()
{
var columns = {
object: { title: WebInspector.UIString("Object"), disclosure: true, sortable: true },
shallowSize: { title: WebInspector.UIString("Shallow Size"), width: "90px", sortable: true },
retainedSize: { title: WebInspector.UIString("Retained Size"), width: "90px", sort: "descending", sortable: true }
shallowSize: { title: WebInspector.UIString("Shallow Size"), width: "120px", sortable: true },
retainedSize: { title: WebInspector.UIString("Retained Size"), width: "120px", sort: "descending", sortable: true }
};
WebInspector.HeapSnapshotSortableDataGrid.call(this, columns);
}
Expand Down Expand Up @@ -418,9 +417,7 @@ WebInspector.DetailedHeapshotView = function(parent, profile)
this.parent.addEventListener("profile added", this._updateBaseOptions, this);
this.parent.addEventListener("profile added", this._updateFilterOptions, this);

this.showCountAsPercent = false;
this.showShallowSizeAsPercent = false;
this.showRetainedSizeAsPercent = false;
this._showPercentage = false;

this.viewsContainer = document.createElement("div");
this.viewsContainer.addStyleClass("views-container");
Expand Down Expand Up @@ -602,7 +599,7 @@ WebInspector.DetailedHeapshotView.prototype = {
this._updateRetainmentViewHeight(height);
},

refreshShowAsPercents: function()
refreshShowPercents: function()
{
this._updatePercentButton();
this.refreshVisibleData();
Expand Down Expand Up @@ -833,13 +830,7 @@ WebInspector.DetailedHeapshotView.prototype = {
if (!cell || (!cell.hasStyleClass("count-column") && !cell.hasStyleClass("shallowSize-column") && !cell.hasStyleClass("retainedSize-column")))
return;

if (cell.hasStyleClass("count-column"))
this.showCountAsPercent = !this.showCountAsPercent;
else if (cell.hasStyleClass("shallowSize-column"))
this.showShallowSizeAsPercent = !this.showShallowSizeAsPercent;
else if (cell.hasStyleClass("retainedSize-column"))
this.showRetainedSizeAsPercent = !this.showRetainedSizeAsPercent;
this.refreshShowAsPercents();
this.refreshShowPercents();

event.preventDefault();
event.stopPropagation();
Expand Down Expand Up @@ -942,18 +933,10 @@ WebInspector.DetailedHeapshotView.prototype = {
return span;
},

get _isShowingAsPercent()
{
return this.showCountAsPercent && this.showShallowSizeAsPercent && this.showRetainedSizeAsPercent;
},

_percentClicked: function(event)
{
var currentState = this._isShowingAsPercent;
this.showCountAsPercent = !currentState;
this.showShallowSizeAsPercent = !currentState;
this.showRetainedSizeAsPercent = !currentState;
this.refreshShowAsPercents();
this._showPercentage = !this._showPercentage;
this.refreshShowPercents();
},

_showObjectPopover: function(element, showCallback)
Expand Down Expand Up @@ -1103,11 +1086,11 @@ WebInspector.DetailedHeapshotView.prototype = {

_updatePercentButton: function()
{
if (this._isShowingAsPercent) {
this.percentButton.title = WebInspector.UIString("Show absolute counts and sizes.");
if (this._showPercentage) {
this.percentButton.title = WebInspector.UIString("Hide percentages of counts and sizes.");
this.percentButton.toggled = true;
} else {
this.percentButton.title = WebInspector.UIString("Show counts and sizes as percentages.");
this.percentButton.title = WebInspector.UIString("Show percentages of counts and sizes.");
this.percentButton.toggled = false;
}
}
Expand Down
6 changes: 6 additions & 0 deletions Source/WebCore/inspector/front-end/heapProfiler.css
View file
Expand Up @@ -115,6 +115,12 @@ body.inactive .heap-snapshot-sidebar-tree-item.wait.selected .icon {
text-align: right;
}

.detailed-heapshot-view .data-grid span.percent-column {
color: grey;
width: 42px;
float: left;
}

.detailed-heapshot-view .console-formatted-object, .console-formatted-node {
display: inline;
position: static;
Expand Down

0 comments on commit c6cc684

Please sign in to comment.