Merge pull request #66 from bem/update-ignore-whitespace-option

Update ignore whitespace option

Author: eGavr

lib/index.js

@@ -11,13 +11,13 @@ var utils = require('./utils'),
  * @param {Object} options
  * @returns {AST}
  */
-function htmlToAST(HTMLDoc, options) {
+function htmlToAST(HTMLDoc) {
     var parser,
         parserHandler;
 
     parserHandler = new htmlParser.DomHandler(function(err) {
         if (err) console.log(err);
-    }, options);
+    });
 
     parser = new htmlParser.Parser(parserHandler);
     parser.parseComplete(HTMLDoc);
@@ -26,45 +26,54 @@ function htmlToAST(HTMLDoc, options) {
 }
 
 /**
- * Recursively sorts arttibutes' values of the AST leafs
+ * Recursively modifies the tree depending on the given options
  * @param {AST} tree
  * @param {Object} options
  * @returns {AST}
  */
 function modifyASTTree(tree, options) {
-    _.each(tree, function(node) {
-        Object.keys(node).forEach(function(leaf) {
-            if (leaf === 'attribs') {
-                var attrs = utils.sortObj(node[leaf]);
+    _.forEach(tree, function(node) {
+        if (options.ignoreWhitespace && node.type === 'text') {
 
-                if (attrs.hasOwnProperty('class')) {
-                    attrs['class'] = utils.sortCssClasses(attrs['class']);
-                }
+            node.data = node.data
+                .replace(/(\n|\r|\t|\v|\f)+/g, '')
+                .replace(/\s+/g, ' ')
+                .trim();
 
-                _.each(options.compareHtmlAttrsAsJSON, function(attr) {
-                    var attrValue,
-                        isFunction = (attr === 'onclick' || attr === 'ondblclick'); // @FIXME: should be configurable
+            return;
+        }
 
-                    if (attrs.hasOwnProperty(attr)) {
+        if (node.hasOwnProperty('attribs')) {
+            var attrs = utils.sortObj(node['attribs']);
 
-                        attrValue = utils.parseAttr(attrs[attr].replace(/"/g, '"'), isFunction);
-                        attrValue = utils.sortObj(attrValue);
-                        attrValue = JSON.stringify(attrValue);
+            if (attrs.hasOwnProperty('class')) {
+                attrs['class'] = utils.sortCssClasses(attrs['class']);
+            }
 
-                        attrs[attr] = (isFunction ? 'return ' : '') + attrValue.replace(/"/g, '"')
-                    }
-                });
+            _.forEach(options.compareHtmlAttrsAsJSON, function(attr) {
+                var attrValue,
+                    isFunction = (attr === 'onclick' || attr === 'ondblclick'); // @FIXME: should be configurable
 
-                _.each(options.ignoreHtmlAttrs, function(attr) {
-                    attrs.hasOwnProperty(attr) && (attrs[attr] = '');
-                });
+                if (attrs.hasOwnProperty(attr)) {
 
-                node[leaf] = attrs;
-            }
-            else if (leaf === 'children') {
-                modifyASTTree(node.children, options);
-            }
-        });
+                    attrValue = utils.parseAttr(attrs[attr].replace(/"/g, '"'), isFunction);
+                    attrValue = utils.sortObj(attrValue);
+                    attrValue = JSON.stringify(attrValue);
+
+                    attrs[attr] = (isFunction ? 'return ' : '') + attrValue.replace(/"/g, '"')
+                }
+            });
+
+            _.forEach(options.ignoreHtmlAttrs, function(attr) {
+                attrs.hasOwnProperty(attr) && (attrs[attr] = '');
+            });
+
+            node['attribs'] = attrs;
+        }
+
+        if (node.hasOwnProperty('children')) {
+            modifyASTTree(node.children, options);
+        }
     });
 
     return tree;

lib/utils.js

@@ -9,7 +9,7 @@ exports.sortObj = function sortObj(obj) {
     var keys = _.keys(obj).sort(),
         sortedObj = {};
 
-    _.each(keys, function(key) {
+    _.forEach(keys, function(key) {
         var objValue = obj[key];
 
         if(_.isPlainObject(objValue)) {

test/diffHtml.js

@@ -18,7 +18,7 @@ describe('\'diffHtml\'', function () {
             files = readFiles('3.html', '_3.html'),
 
             res = [ {
-                value: '<html> <head> <title>Test</title> </head> <body> <label for="">label for input</label> <input id=""> </body> </html> ',
+                value: '<html><head><title>Test</title></head><body><label for="">label for input</label><input id=""></body></html>',
                 added: undefined,
                 removed: undefined
             } ];

test/fixtures/10.html

@@ -0,0 +1,12 @@
+<!DOCTYPE html>
+<!-- comments1 -->
+<html>
+<head lang="en">
+    <meta charset="UTF-8">
+    <title><!-- comments2 --></title>
+</head>
+<body>
+Text<!-- comments3 -->
+</body>
+</html>
+<!-- comments4 -->

test/fixtures/7.html

@@ -1,5 +1,6 @@
 <!DOCTYPE html>
 <html>
+Text Text
 <head lang="en">
     <meta charset="UTF-8">
     <title></title>

test/fixtures/_10.html

@@ -0,0 +1,10 @@
+<!DOCTYPE html>
+<html>
+<head lang="en">
+    <meta charset="UTF-8">
+    <title></title>
+</head>
+<body>
+Text
+</body>
+</html>

test/fixtures/_7.html

@@ -1,14 +1,21 @@
 <!DOCTYPE html>
-<html>
+ <html>
+ Text   Text
+<head lang  =       "en">
+        <meta        charset="UTF-8">
+    <title                        >               </title>
 
-<head lang="en">
-        <meta charset="UTF-8">
-    <title                        ></title>
-</head>
+
+            </head>
 
 <body>
-Text
-</body>
+     Text
+
+    </body>
+
+
+
+
 </html>