WEBDIENSTE/YellowLabTools
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

Fix timeline bug, not being displayed

Browse Source
This commit is contained in:
Gaël Métais
2015-05-25 14:04:27 +02:00
parent cb46274288
commit 4b098aef69
4 changed files with 41 additions and 26 deletions
Download Patch File Download Diff File Expand all files Collapse all files
front/src/views/timeline.html
+8 -8
View File
@@ -16,14 +16,14 @@
<div ng-repeat="duration in timeline track by $index" <div ng-repeat="duration in timeline track by $index"
class="interval" class="interval"
ng-class="{ ng-class="{
domCreation: $index * timelineIntervalDuration < result.toolsResults.phantomas.metrics.domInteractive, domCreation: $index * timelineIntervalDuration < result.javascriptExecutionTree.data.domInteractive,
domInteractive: $index * timelineIntervalDuration >= result.toolsResults.phantomas.metrics.domInteractive domInteractive: $index * timelineIntervalDuration >= result.javascriptExecutionTree.data.domInteractive
&& $index * timelineIntervalDuration < result.toolsResults.phantomas.metrics.domContentLoaded, && $index * timelineIntervalDuration < result.javascriptExecutionTree.data.domContentLoaded,
domContentLoaded: $index * timelineIntervalDuration >= result.toolsResults.phantomas.metrics.domContentLoaded domContentLoaded: $index * timelineIntervalDuration >= result.javascriptExecutionTree.data.domContentLoaded
&& $index * timelineIntervalDuration < result.toolsResults.phantomas.metrics.domContentLoadedEnd, && $index * timelineIntervalDuration < result.javascriptExecutionTree.data.domContentLoadedEnd,
domContentLoadedEnd: $index * timelineIntervalDuration >= result.toolsResults.phantomas.metrics.domContentLoadedEnd domContentLoadedEnd: $index * timelineIntervalDuration >= result.javascriptExecutionTree.data.domContentLoadedEnd
&& $index * timelineIntervalDuration < result.toolsResults.phantomas.metrics.domComplete, && $index * timelineIntervalDuration < result.javascriptExecutionTree.data.domComplete,
domComplete: $index * timelineIntervalDuration >= result.toolsResults.phantomas.metrics.domComplete domComplete: $index * timelineIntervalDuration >= result.javascriptExecutionTree.data.domComplete
}"> }">
<div style="height: {{100 * duration / timelineMax | number: 0}}px" class="color" ng-class="{clickable: duration > 0}" scroll-on-click="{{$index * timelineIntervalDuration}}"></div> <div style="height: {{100 * duration / timelineMax | number: 0}}px" class="color" ng-class="{clickable: duration > 0}" scroll-on-click="{{$index * timelineIntervalDuration}}"></div>
<div class="tooltip detailsOverlay"> <div class="tooltip detailsOverlay">
lib/tools/jsExecutionTransformer.js
+20 -15
View File
@@ -10,6 +10,11 @@ var jsExecutionTransformer = function() {
var jQueryFunctionsCollection = new Collection(); var jQueryFunctionsCollection = new Collection();
var metrics = { var metrics = {
domInteractive: 0,
domContentLoaded: 0,
domContentLoadedEnd: 0,
domComplete: 0,
DOMaccesses: 0, DOMaccesses: 0,
DOMaccessesOnScroll: 0, DOMaccessesOnScroll: 0,
queriesWithoutResults: 0 queriesWithoutResults: 0
@@ -68,22 +73,22 @@ var jsExecutionTransformer = function() {
// Mark a performance flag // Mark a performance flag
if (['domInteractive', 'domContentLoaded', 'domContentLoadedEnd', 'domComplete'].indexOf(node.data.type) >= 0) { if (['domInteractive', 'domContentLoaded', 'domContentLoadedEnd', 'domComplete'].indexOf(node.data.type) >= 0) {
node.windowPerformance = true; node.windowPerformance = true;
}
// Read the execution tree and adjust the navigation timings (cause their not very well synchronised) // Adjust the navigation timings (cause their not very well synchronised)
switch(node.data.type) { switch(node.data.type) {
case 'domInteractive': case 'domInteractive':
data.toolsResults.phantomas.metrics.domInteractive = node.data.timestamp; javascriptExecutionTree.data.domInteractive = node.data.timestamp;
break; break;
case 'domContentLoaded': case 'domContentLoaded':
data.toolsResults.phantomas.metrics.domContentLoaded = node.data.timestamp; javascriptExecutionTree.data.domContentLoaded = node.data.timestamp;
break; break;
case 'domContentLoadedEnd': case 'domContentLoadedEnd':
data.toolsResults.phantomas.metrics.domContentLoadedEnd = node.data.timestamp; javascriptExecutionTree.data.domContentLoadedEnd = node.data.timestamp;
break; break;
case 'domComplete': case 'domComplete':
data.toolsResults.phantomas.metrics.domComplete = node.data.timestamp; javascriptExecutionTree.data.domComplete = node.data.timestamp;
break; break;
}
} }
// Transform domPaths into objects // Transform domPaths into objects
test/core/indexTest.js
+9 -3
View File
@@ -53,8 +53,9 @@ describe('index.js', function() {
data.toolsResults.phantomas.metrics.should.have.a.property('requests').that.equals(1); data.toolsResults.phantomas.metrics.should.have.a.property('requests').that.equals(1);
data.toolsResults.phantomas.should.have.a.property('offenders').that.is.an('object'); data.toolsResults.phantomas.should.have.a.property('offenders').that.is.an('object');
data.toolsResults.phantomas.offenders.should.have.a.property('DOMelementMaxDepth'); data.toolsResults.phantomas.offenders.should.have.a.property('DOMelementMaxDepth');
data.toolsResults.phantomas.offenders.DOMelementMaxDepth.should.have.length(1); data.toolsResults.phantomas.offenders.DOMelementMaxDepth.should.have.length(2);
data.toolsResults.phantomas.offenders.DOMelementMaxDepth[0].should.equal('body > h1[0]'); data.toolsResults.phantomas.offenders.DOMelementMaxDepth[0].should.equal('body > h1[0]');
data.toolsResults.phantomas.offenders.DOMelementMaxDepth[1].should.equal('body > script[1]');
// Test rules // Test rules
data.should.have.a.property('rules').that.is.an('object'); data.should.have.a.property('rules').that.is.an('object');
@@ -76,10 +77,11 @@ describe('index.js', function() {
"score": 100, "score": 100,
"abnormalityScore": 0, "abnormalityScore": 0,
"offendersObj": { "offendersObj": {
"count": 1, "count": 2,
"tree": { "tree": {
"body": { "body": {
"h1[0]": 1 "h1[0]": 1,
"script[1]": 1
} }
} }
} }
@@ -91,6 +93,10 @@ describe('index.js', function() {
data.should.have.a.property('javascriptExecutionTree').that.is.an('object'); data.should.have.a.property('javascriptExecutionTree').that.is.an('object');
data.javascriptExecutionTree.should.have.a.property('data'); data.javascriptExecutionTree.should.have.a.property('data');
data.javascriptExecutionTree.data.should.have.a.property('type').that.equals('main'); data.javascriptExecutionTree.data.should.have.a.property('type').that.equals('main');
data.javascriptExecutionTree.data.should.have.a.property('domInteractive').that.is.a('number');
data.javascriptExecutionTree.data.should.have.a.property('domContentLoaded').that.is.a('number');
data.javascriptExecutionTree.data.should.have.a.property('domContentLoadedEnd').that.is.a('number');
data.javascriptExecutionTree.data.should.have.a.property('domComplete').that.is.a('number');
/*jshint expr: true*/ /*jshint expr: true*/
console.log.should.not.have.been.called; console.log.should.not.have.been.called;
test/www/simple-page.html
+4
View File
@@ -4,5 +4,9 @@
</head> </head>
<body> <body>
<h1>Simple page</h1> <h1>Simple page</h1>
<script>
document.getElementById('foo');
</script>
</body> </body>
</html> </html>