nagai/fune
3
0
Fork 0
forked from mirrors/gecko-dev
Code Pull requests Activity

Bug 1290142 - Lint devtools/client/performance/components; r=jsantell

Browse source 
MozReview-Commit-ID: E418yPtONiX

--HG--
extra : rebase_source : 53f70dcefae586f5bb95c7cc21035a0aab71930e
This commit is contained in:
Greg Tatum 2016-07-28 08:58:05 -05:00
parent c99878c1ab
commit 92f73e196a
4 changed files with 143 additions and 92 deletions
repo.diff.show_diff_stats Download patch file Download diff file Expand all files Collapse all files

1
.eslintignore
View file

@ -84,7 +84,6 @@ devtools/client/jsonview/lib/**
devtools/client/memory/**
devtools/client/netmonitor/test/**
devtools/client/netmonitor/har/test/**
devtools/client/performance/components/**
devtools/client/performance/legacy/**
devtools/client/performance/modules/**
devtools/client/performance/test/**

113
devtools/client/performance/components/jit-optimizations-item.js
View file

@ -1,8 +1,7 @@
/* This Source Code Form is subject to the terms of the Mozilla Public
* License, v. 2.0. If a copy of the MPL was not distributed with this file,
* You can obtain one at http://mozilla.org/MPL/2.0/. */
const { Cu } = require("chrome");
"use strict";
const { LocalizationHelper } = require("devtools/client/shared/l10n");
const STRINGS_URI = "chrome://devtools/locale/jit-optimizations.properties";
@ -10,21 +9,30 @@ const L10N = new LocalizationHelper(STRINGS_URI);
const { PluralForm } = require("resource://gre/modules/PluralForm.jsm");
const { DOM: dom, PropTypes, createClass, createFactory } = require("devtools/client/shared/vendor/react");
const {
JITOptimizations, hasSuccessfulOutcome, isSuccessfulOutcome
} = require("devtools/client/performance/modules/logic/jit");
const Frame = createFactory(require("devtools/client/shared/components/frame"));
const OPTIMIZATION_FAILURE = L10N.getStr("jit.optimizationFailure");
const JIT_SAMPLES = L10N.getStr("jit.samples");
const JIT_TYPES = L10N.getStr("jit.types");
const JIT_ATTEMPTS = L10N.getStr("jit.attempts");
const PROPNAME_MAX_LENGTH = 4;
// If TREE_ROW_HEIGHT changes, be sure to change `var(--jit-tree-row-height)`
// in `devtools/client/themes/jit-optimizations.css`
const TREE_ROW_HEIGHT = 14;
const OPTIMIZATION_ITEM_TYPES = ["site", "attempts", "types", "attempt", "type", "observedtype"];
const JITOptimizationsItem = module.exports = createClass({
const OPTIMIZATION_ITEM_TYPES = ["site", "attempts", "types", "attempt", "type",
"observedtype"];
/* eslint-disable no-unused-vars */
/**
* TODO - Re-enable this eslint rule. The JIT tool is a work in progress, and isn't fully
* integrated as of yet.
*/
const {
JITOptimizations, hasSuccessfulOutcome, isSuccessfulOutcome
} = require("devtools/client/performance/modules/logic/jit");
const OPTIMIZATION_FAILURE = L10N.getStr("jit.optimizationFailure");
const JIT_SAMPLES = L10N.getStr("jit.samples");
const JIT_TYPES = L10N.getStr("jit.types");
const JIT_ATTEMPTS = L10N.getStr("jit.attempts");
/* eslint-enable no-unused-vars */
const JITOptimizationsItem = createClass({
displayName: "JITOptimizationsItem",
propTypes: {
@ -33,37 +41,6 @@ const JITOptimizationsItem = module.exports = createClass({
type: PropTypes.oneOf(OPTIMIZATION_ITEM_TYPES).isRequired,
},
render() {
let {
item,
depth,
arrow,
focused,
type,
frameData,
onViewSourceInDebugger,
} = this.props;
let content;
switch (type) {
case "site": content = this._renderSite(this.props); break;
case "attempts": content = this._renderAttempts(this.props); break;
case "types": content = this._renderTypes(this.props); break;
case "attempt": content = this._renderAttempt(this.props); break;
case "type": content = this._renderType(this.props); break;
case "observedtype": content = this._renderObservedType(this.props); break;
}
return dom.div(
{
className: `optimization-tree-item optimization-tree-item-${type}`,
style: { marginLeft: depth * TREE_ROW_HEIGHT }
},
arrow,
content
);
},
_renderSite({ item: site, onViewSourceInDebugger, frameData }) {
let attempts = site.data.attempts;
let lastStrategy = attempts[attempts.length - 1].strategy;
@ -79,7 +56,8 @@ const JITOptimizationsItem = module.exports = createClass({
}
}
let sampleString = PluralForm.get(site.samples, JIT_SAMPLES).replace("#1", site.samples);
let sampleString = PluralForm.get(site.samples, JIT_SAMPLES)
.replace("#1", site.samples);
let text = dom.span(
{ className: "optimization-site-title" },
`${lastStrategy}${propString} – (${sampleString})`
@ -119,12 +97,14 @@ const JITOptimizationsItem = module.exports = createClass({
return dom.span({ className: "optimization-attempt" },
dom.span({ className: "optimization-strategy" }, strategy),
" → ",
dom.span({ className: `optimization-outcome ${success ? "success" : "failure"}` }, outcome)
dom.span({ className: `optimization-outcome ${success ? "success" : "failure"}` },
outcome)
);
},
_renderType({ item: type }) {
return dom.span({ className: "optimization-ion-type" }, `${type.site}:${type.mirType}`);
return dom.span({ className: "optimization-ion-type" },
`${type.site}:${type.mirType}`);
},
_renderObservedType({ onViewSourceInDebugger, item: type }) {
@ -145,12 +125,51 @@ const JITOptimizationsItem = module.exports = createClass({
}
})
);
}
// Otherwise if we just have a location, it's probably just a memory location.
else if (type.location) {
} else if (type.location) {
children.push(`@${type.location}`);
}
return dom.span({ className: "optimization-observed-type" }, ...children);
},
render() {
/* eslint-disable no-unused-vars */
/**
* TODO - Re-enable this eslint rule. The JIT tool is a work in progress, and these
* undefined variables may represent intended functionality.
*/
let {
depth,
arrow,
type,
// TODO - The following are currently unused.
item,
focused,
frameData,
onViewSourceInDebugger,
} = this.props;
/* eslint-enable no-unused-vars */
let content;
switch (type) {
case "site": content = this._renderSite(this.props); break;
case "attempts": content = this._renderAttempts(this.props); break;
case "types": content = this._renderTypes(this.props); break;
case "attempt": content = this._renderAttempt(this.props); break;
case "type": content = this._renderType(this.props); break;
case "observedtype": content = this._renderObservedType(this.props); break;
}
return dom.div(
{
className: `optimization-tree-item optimization-tree-item-${type}`,
style: { marginLeft: depth * TREE_ROW_HEIGHT }
},
arrow,
content
);
},
});
module.exports = JITOptimizationsItem;

85
devtools/client/performance/components/jit-optimizations.js
View file

@ -1,8 +1,7 @@
/* This Source Code Form is subject to the terms of the Mozilla Public
* License, v. 2.0. If a copy of the MPL was not distributed with this file,
* You can obtain one at http://mozilla.org/MPL/2.0/. */
const { Cu } = require("chrome");
"use strict";
const { LocalizationHelper } = require("devtools/client/shared/l10n");
const STRINGS_URI = "chrome://devtools/locale/jit-optimizations.properties";
@ -13,14 +12,21 @@ const { DOM: dom, createClass, createFactory, PropTypes } = require("devtools/cl
const Tree = createFactory(require("../../shared/components/tree"));
const OptimizationsItem = createFactory(require("./jit-optimizations-item"));
const FrameView = createFactory(require("../../shared/components/frame"));
const onClickTooltipString = frame =>
L10N.getFormatStr("viewsourceindebugger", `${frame.source}:${frame.line}:${frame.column}`);
const JIT_TITLE = L10N.getStr("jit.title");
// If TREE_ROW_HEIGHT changes, be sure to change `var(--jit-tree-row-height)`
// in `devtools/client/themes/jit-optimizations.css`
const TREE_ROW_HEIGHT = 14;
/* eslint-disable no-unused-vars */
/**
* TODO - Re-enable this eslint rule. The JIT tool is a work in progress, and isn't fully
* integrated as of yet, and this may represent intended functionality.
*/
const onClickTooltipString = frame =>
L10N.getFormatStr("viewsourceindebugger",
`${frame.source}:${frame.line}:${frame.column}`);
/* eslint-enable no-unused-vars */
const optimizationAttemptModel = {
id: PropTypes.number.isRequired,
strategy: PropTypes.string.isRequired,
@ -52,7 +58,7 @@ const optimizationSiteModel = {
}).isRequired,
};
const JITOptimizations = module.exports = createClass({
const JITOptimizations = createClass({
displayName: "JITOptimizations",
propTypes: {
@ -62,23 +68,16 @@ const JITOptimizations = module.exports = createClass({
autoExpandDepth: PropTypes.number,
},
getInitialState() {
return {
expanded: new Set()
};
},
getDefaultProps() {
return {
autoExpandDepth: 0
};
},
render() {
let header = this._createHeader(this.props);
let tree = this._createTree(this.props);
return dom.div({}, header, tree);
getInitialState() {
return {
expanded: new Set()
};
},
/**
@ -118,11 +117,19 @@ const JITOptimizations = module.exports = createClass({
},
_createTree(props) {
let { autoExpandDepth, frameData, onViewSourceInDebugger, optimizationSites: sites } = this.props;
let {
autoExpandDepth,
frameData,
onViewSourceInDebugger,
optimizationSites: sites
} = this.props;
let getSite = id => sites.find(site => site.id === id);
let getIonTypeForObserved = type =>
getSite(type.id).data.types.find(iontype => (iontype.typeset || []).indexOf(type) !== -1);
let getIonTypeForObserved = type => {
return getSite(type.id).data.types
.find(iontype => (iontype.typeset || [])
.indexOf(type) !== -1);
};
let isSite = site => getSite(site.id) === site;
let isAttempts = attempts => getSite(attempts.id).data.attempts === attempts;
let isAttempt = attempt => getSite(attempt.id).data.attempts.indexOf(attempt) !== -1;
@ -131,12 +138,25 @@ const JITOptimizations = module.exports = createClass({
let isObservedType = type => getIonTypeForObserved(type);
let getRowType = node => {
return isSite(node) ? "site" :
isAttempts(node) ? "attempts" :
isTypes(node) ? "types" :
isAttempt(node) ? "attempt" :
isType(node) ? "type" :
isObservedType(node) ? "observedtype" : null;
if (isSite(node)) {
return "site";
}
if (isAttempts(node)) {
return "attempts";
}
if (isTypes(node)) {
return "types";
}
if (isAttempt(node)) {
return "attempt";
}
if (isType(node)) {
return "type";
}
if (isObservedType(node)) {
return "observedtype";
}
return null;
};
// Creates a unique key for each node in the
@ -157,6 +177,7 @@ const JITOptimizations = module.exports = createClass({
let iontype = getIonTypeForObserved(node);
return `${getKey(iontype)}-O-${iontype.typeset.indexOf(node)}`;
}
return "";
};
return Tree({
@ -184,9 +205,8 @@ const JITOptimizations = module.exports = createClass({
return node;
} else if (isType(node)) {
return node.typeset || [];
} else {
return [];
}
return [];
},
isExpanded: node => this.state.expanded.has(node),
onExpand: node => this.setState(state => {
@ -215,5 +235,14 @@ const JITOptimizations = module.exports = createClass({
frameData,
}),
});
},
render() {
let header = this._createHeader(this.props);
let tree = this._createTree(this.props);
return dom.div({}, header, tree);
}
});
module.exports = JITOptimizations;

36
devtools/client/performance/components/test/head.js
View file

@ -3,25 +3,28 @@
http://creativecommons.org/publicdomain/zero/1.0/ */
"use strict";
var { classes: Cc, interfaces: Ci, utils: Cu, results: Cr } = Components;
/* global document, SimpleTest, requestAnimationFrame, is, ok */
/* exported Cc, Ci, Cu, Cr, Assert, Task, TargetFactory, Toolbox, browserRequire,
forceRender, setProps, dumpn, checkOptimizationHeader, checkOptimizationTree */
let { classes: Cc, interfaces: Ci, utils: Cu, results: Cr } = Components;
var { require } = Cu.import("resource://gre/modules/devtools/shared/Loader.jsm", {});
var { Assert } = require("resource://testing-common/Assert.jsm");
var { BrowserLoader } = Cu.import("resource://devtools/client/shared/browser-loader.js", {});
var defer = require("devtools/shared/defer");
var DevToolsUtils = require("devtools/shared/DevToolsUtils");
var { Task } = require("devtools/shared/task");
var { TargetFactory } = require("devtools/client/framework/target");
var { Toolbox } = require("devtools/client/framework/toolbox");
let { require } = Cu.import("resource://gre/modules/devtools/shared/Loader.jsm", {});
let { Assert } = require("resource://testing-common/Assert.jsm");
let { BrowserLoader } = Cu.import("resource://devtools/client/shared/browser-loader.js", {});
let defer = require("devtools/shared/defer");
let DevToolsUtils = require("devtools/shared/DevToolsUtils");
let { Task } = require("devtools/shared/task");
let { TargetFactory } = require("devtools/client/framework/target");
let { Toolbox } = require("devtools/client/framework/toolbox");
DevToolsUtils.testing = true;
var { require: browserRequire } = BrowserLoader({
let { require: browserRequire } = BrowserLoader({
baseURI: "resource://devtools/client/performance/",
window: this
});
var $ = (selector, scope = document) => scope.querySelector(selector);
var $$ = (selector, scope = document) => scope.querySelectorAll(selector);
let $ = (selector, scope = document) => scope.querySelector(selector);
let $$ = (selector, scope = document) => scope.querySelectorAll(selector);
function forceRender(comp) {
return setState(comp, {})
@ -38,13 +41,13 @@ function onNextAnimationFrame(fn) {
}
function setState(component, newState) {
var deferred = defer();
let deferred = defer();
component.setState(newState, onNextAnimationFrame(deferred.resolve));
return deferred.promise;
}
function setProps(component, newState) {
var deferred = defer();
let deferred = defer();
component.setProps(newState, onNextAnimationFrame(deferred.resolve));
return deferred.promise;
}
@ -112,6 +115,7 @@ let OPTS_DATA_GENERAL = [{
}]
}
}];
OPTS_DATA_GENERAL.forEach(site => {
site.data.types.forEach(type => {
if (type.typeset) {
@ -122,7 +126,6 @@ OPTS_DATA_GENERAL.forEach(site => {
site.data.types.id = site.id;
});
function checkOptimizationHeader(name, file, line) {
is($(".optimization-header .header-function-name").textContent, name,
"correct optimization header function name");
@ -175,7 +178,8 @@ function checkOptimizationTree(rowData) {
`row ${i}th: correct attempt row, attempt item`);
is($(".optimization-outcome", row).textContent, expected.outcome,
`row ${i}th: correct attempt row, outcome item`);
ok($(".optimization-outcome", row).classList.contains(expected.success ? "success" : "failure"),
ok($(".optimization-outcome", row)
.classList.contains(expected.success ? "success" : "failure"),
`row ${i}th: correct attempt row, failure/success status`);
break;
}