Merge pull request #62 from gmetais/develop

v1.3.2

front/src/css/timeline.css

@@ -224,7 +224,7 @@
   background: #EBD8E2;
   line-height: 1.3em;
   height: 1.3em;
-  z-index: 1;
+  z-index: 2;
 }
 .table .showingDetails .child span:hover {
   background: inherit;

front/src/js/directives/offendersDirectives.js

@@ -147,6 +147,9 @@
             case 'addEventListener':
                 return 'bind <b>' + args[0] + '</b> to ' + getDomElementButtonHTML(ctxt.elements[0], onASingleLine);
 
+            case 'getComputedStyle':
+                return getDomElementButtonHTML(args[0], onASingleLine) + (args[1] || '');
+
             case 'error':
                 return args[0];
 
@@ -200,7 +203,7 @@
                 return 'append ' + joinArgs(args) + ' to ' + getJQueryContextButtonHTML(ctxt, onASingleLine);
 
             case 'jQuery - appendTo':
-                return 'append' + getJQueryContextButtonHTML(ctxt, onASingleLine) + ' to <b>' + args[0] + '</b>';
+                return 'append ' + getJQueryContextButtonHTML(ctxt, onASingleLine) + ' to <b>' + args[0] + '</b>';
 
             case 'jQuery - prepend':
                 return 'prepend ' + joinArgs(args) + ' to ' + getJQueryContextButtonHTML(ctxt, onASingleLine);
@@ -280,10 +283,8 @@
             case 'jQuery - offset':
             case 'jQuery - height':
             case 'jQuery - innerHeight':
-            case 'jQuery - outerHeight':
             case 'jQuery - width':
             case 'jQuery - innerWidth':
-            case 'jQuery - outerWidth':
             case 'jQuery - scrollLeft':
             case 'jQuery - scrollTop':
             case 'jQuery - position':
@@ -294,6 +295,17 @@
                 }
                 break;
 
+            case 'jQuery - outerHeight':
+            case 'jQuery - outerWidth':
+                if (args[0] && args[0] !== 'true') {
+                    return 'set <b>' + args[0] + '</b> on ' + getJQueryContextButtonHTML(ctxt, onASingleLine);
+                } else if (args[0] === 'true') {
+                    return 'get from ' + getJQueryContextButtonHTML(ctxt, onASingleLine) + ' (with include margins option)';
+                } else {
+                    return 'get from ' + getJQueryContextButtonHTML(ctxt, onASingleLine);
+                }
+                break;
+
             case 'jQuery - toggle':
                 if (args[0] === 'true') {
                     return getJQueryContextButtonHTML(ctxt, onASingleLine) + ' to visible';
@@ -357,15 +369,10 @@
             case 'jQuery - change':
             case 'jQuery - click':
             case 'jQuery - dblclick':
-            case 'jQuery - error':
             case 'jQuery - focus':
-            case 'jQuery - focusin':
-            case 'jQuery - focusout':
-            case 'jQuery - hover':
             case 'jQuery - keydown':
             case 'jQuery - keypress':
             case 'jQuery - keyup':
-            case 'jQuery - load':
             case 'jQuery - mousedown':
             case 'jQuery - mouseenter':
             case 'jQuery - mouseleave':
@@ -377,6 +384,18 @@
             case 'jQuery - scroll':
             case 'jQuery - select':
             case 'jQuery - submit':
+                if (args[0]) {
+                    return 'bind on ' + getJQueryContextButtonHTML(ctxt, onASingleLine);
+                } else {
+                    return 'triggered on ' + getJQueryContextButtonHTML(ctxt, onASingleLine);
+                }
+                break;
+
+            case 'jQuery - error':
+            case 'jQuery - focusin':
+            case 'jQuery - focusout':
+            case 'jQuery - hover':
+            case 'jQuery - load':
             case 'jQuery - unload':
                 return 'bind on ' + getJQueryContextButtonHTML(ctxt, onASingleLine);
 

front/src/less/timeline.less

@@ -257,7 +257,7 @@
             background: #EBD8E2;
             line-height: 1.3em;
             height: 1.3em;
-            z-index: 1;
+            z-index: 2;
         }
     }
 }

lib/runner.js

@@ -23,7 +23,7 @@ var Runner = function(params) {
         data.toolsResults.phantomas = phantomasResults;
 
         // Treat the JS Execution Tree from offenders
-        data.javascriptExecutionTree = jsExecutionTransformer.transform(data);
+        data = jsExecutionTransformer.transform(data);
 
         // Other tools go here
 

lib/tools/jsExecutionTransformer.js

@@ -6,6 +6,14 @@ var jsExecutionTransformer = function() {
 
     this.transform = function(data) {
         var javascriptExecutionTree = {};
+        
+        var metrics = {
+            domManipulations: 0,
+            queriesWithoutResults: 0,
+            jQueryCalls: 0,
+            jQueryCallsOnEmptyObject: 0
+            
+        };
 
         debug('Starting JS execution transformation');
 
@@ -56,7 +64,7 @@ var jsExecutionTransformer = function() {
                             node.data.callDetails.context.elements = node.data.callDetails.context.elements.map(offendersHelpers.domPathToDomElementObj, offendersHelpers);
                         }
 
-                        if (node.data.type === 'appendChild' || node.data.type === 'insertBefore') {
+                        if (node.data.type === 'appendChild' || node.data.type === 'insertBefore' || node.data.type === 'getComputedStyle') {
                             node.data.callDetails.arguments[0] = offendersHelpers.domPathToDomElementObj(node.data.callDetails.arguments[0]);
                         }
 
@@ -73,7 +81,12 @@ var jsExecutionTransformer = function() {
             throw err;
         }
 
-        return javascriptExecutionTree;
+        data.javascriptExecutionTree = javascriptExecutionTree;
+        data.toolsResults.jsExecutionTransformer = {
+            metrics: metrics
+        };
+
+        return data;
     };
 
     function treeRecursiveParser(node, fn) {

lib/tools/phantomas/custom_modules/modules/domQYLT/domQYLT.js

@@ -323,6 +323,22 @@ exports.module = function(phantomas) {
                     phantomas.leaveContext();
                 });
 
+
+                phantomas.spy(window, 'getComputedStyle', function(element, pseudoElement) {
+                    var target = phantomas.getDOMPath(element);
+                    
+                    phantomas.enterContext({
+                        type: 'getComputedStyle',
+                        callDetails: {
+                            arguments: [target, pseudoElement]
+                        },
+                        backtrace: phantomas.getBacktrace()
+                    });
+
+                }, function(result, args) {
+                    phantomas.leaveContext();
+                });
+
             })(window.__phantomas);
         });
     });

package.json

@@ -1,6 +1,6 @@
 {
   "name": "yellowlabtools",
-  "version": "1.3.1",
+  "version": "1.3.2",
   "description": "Online tool to audit a webpage for performance and front-end quality issues",
   "repository": {
     "type": "git",