compare html with cheerio

test/src/rt-html-valid.spec.js

@@ -0,0 +1,64 @@
+'use strict';
+// const _ = require('lodash');
+const reactTemplates = require('../../src/reactTemplates');
+const testUtils = require('./testUtils');
+const readFileNormalized = testUtils.readFileNormalized;
+const compareAndWriteHtml = testUtils.compareAndWriteHtml;
+const path = require('path');
+const fsUtil = require('../../src/fsUtil');
+const fs = require('fs');
+
+module.exports = {
+    runTests(test, dataPath) {
+        test('html tests', t => {
+            const files = [
+                'scope.rt',
+                'scope-trailing-semicolon.rt',
+                'scope-variable-references.rt',
+                'lambda.rt',
+                'eval.rt',
+                'props.rt',
+                'custom-element.rt',
+                'style.rt',
+                'concat.rt',
+                'js-in-attr.rt',
+                'props-class.rt',
+                'rt-class.rt',
+                'className.rt',
+                'svg.rt',
+                'virtual.rt',
+                'scope-evaluated-after-repeat.rt',
+                'scope-evaluated-after-repeat2.rt',
+                'scope-evaluated-after-if.rt',
+                'scope-obj.rt',
+                'repeat-literal-collection.rt',
+                'include.rt'
+            ];
+            // t.plan(files.length);
+
+            files.forEach(testFile => {
+                const filename = path.join(dataPath, testFile);
+                const options = {
+                    readFileSync: fsUtil.createRelativeReadFileSync(filename),
+                    modules: 'amd'
+                };
+                let code = '';
+                try {
+                    const html = fs.readFileSync(filename).toString();
+                    const expected = testUtils.normalizeHtml(readFileNormalized(filename + '.html'));
+                    code = reactTemplates.convertTemplateToReact(html, options).replace(/\r/g, '');
+                    const actual = testUtils.normalizeHtml(testUtils.codeToHtml(code));
+                    const equal = compareAndWriteHtml(t, actual, expected, filename);
+                    if (!equal) {
+                        fs.writeFileSync(filename + '.code.js', code);
+                    }
+                } catch (e) {
+                    console.log(testFile, e);
+                    fs.writeFileSync(filename + '.code.js', code);
+                    t.fail(e);
+                }
+            });
+            t.end();
+        });
+    }
+};

test/src/rt.valid.spec.js

@@ -6,8 +6,6 @@ const readFileNormalized = testUtils.readFileNormalized;
 const compareAndWrite = testUtils.compareAndWrite;
 const path = require('path');
 const context = require('../../src/context');
-const fsUtil = require('../../src/fsUtil');
-const fs = require('fs');
 
 module.exports = {
     runTests(test, dataPath) {
@@ -24,7 +22,7 @@ module.exports = {
             files.forEach(testFile => {
                 check(t, {
                     source: testFile,
-                    expected: testFile + '.js',
+                    expected: `${testFile}.js`,
                     options
                 });
             });
@@ -32,13 +30,13 @@ module.exports = {
 
         test('rt-if with rt-scope test', t => {
             const files = ['if-with-scope/valid-if-scope.rt'];
-            const options = {modules: 'amd'}; 
+            const options = {modules: 'amd'};
             testFiles(t, files, options);
         });
 
         test('conversion test', t => {
             const files = ['div.rt', 'test.rt', 'repeat.rt', 'repeat-with-index.rt', 'inputs.rt', 'virtual.rt', 'stateless.rt', 'style-vendor-prefix.rt', 'non-breaking-space.rt'];
-            const options = {modules: 'amd'}; 
+            const options = {modules: 'amd'};
             testFiles(t, files, options);
         });
 
@@ -63,9 +61,9 @@ module.exports = {
                     }
                 },
                 native: true
-            };        
+            };
-            const optionsNew = _.assign({nativeTargetVersion: '0.29.0'}, options);             
+            const optionsNew = _.assign({nativeTargetVersion: '0.29.0'}, options);
-               
+
             const files = [
                 {source: 'native/nativeView.rt', expected: 'native/nativeView.rt.js', options},
                 {source: 'native/listViewTemplate.rt', expected: 'native/listViewTemplate.rt.js', options},
@@ -92,10 +90,10 @@ module.exports = {
 
         test('normalize whitespace', t => {
             const files = ['whitespace.rt'];
-            const options = {normalizeHtmlWhitespace: true, modules: 'amd'};    
+            const options = {normalizeHtmlWhitespace: true, modules: 'amd'};
             testFiles(t, files, options);
         });
-        
+
         test('convert comment with AMD and ES6 modules', t => {
             const files = [
                 {source: 'comment.rt', expected: 'comment.rt.amd.js', options: {modules: 'amd'}},
@@ -140,54 +138,5 @@ module.exports = {
                 compareAndWrite(t, actual, expected, filename);
             });
         });
-
-        test('html tests', t => {
-            const files = [
-                'scope.rt',
-                'scope-trailing-semicolon.rt',
-                'scope-variable-references.rt',
-                'lambda.rt',
-                'eval.rt',
-                'props.rt',
-                'custom-element.rt',
-                'style.rt',
-                'concat.rt',
-                'js-in-attr.rt',
-                'props-class.rt',
-                'rt-class.rt',
-                'className.rt',
-                'svg.rt',
-                'virtual.rt',
-                'scope-evaluated-after-repeat.rt',
-                'scope-evaluated-after-repeat2.rt',
-                'scope-evaluated-after-if.rt',
-                'scope-obj.rt',
-                'repeat-literal-collection.rt',
-                'include.rt'
-            ];
-            t.plan(files.length);
-
-            files.forEach(testFile => {
-                const filename = path.join(dataPath, testFile);
-                const options = {
-                    readFileSync: fsUtil.createRelativeReadFileSync(filename),
-                    modules: 'amd'
-                };
-                let code = '';
-                try {
-                    const html = fs.readFileSync(filename).toString();
-                    const expected = testUtils.normalizeHtml(readFileNormalized(filename + '.html'));
-                    code = reactTemplates.convertTemplateToReact(html, options).replace(/\r/g, '');
-                    const actual = testUtils.normalizeHtml(testUtils.codeToHtml(code));
-                    const equal = compareAndWrite(t, actual, expected, filename);
-                    if (!equal) {
-                        fs.writeFileSync(filename + '.code.js', code);
-                    }
-                } catch (e) {
-                    console.log(testFile, e);
-                    fs.writeFileSync(filename + '.code.js', code);
-                }
-            });
-        });
     }
 };

test/src/testUtils.js

@@ -34,6 +34,41 @@ function compareAndWrite(t, actual, expected, filename) {
     return true;
 }
 
+/**
+ * @param {*} t
+ * @param {string} actual
+ * @param {string} expected
+ * @param {string} filename
+ * @return {boolean} whether actual is equal to expected
+ */
+function compareAndWriteHtml(t, actual, expected, filename) {
+    const $actual = cheerio.load(actual, {normalizeWhitespace: true});
+    const $expected = cheerio.load(expected, {normalizeWhitespace: true});
+    compareNodesList(t, $actual.root(), $expected.root(), filename);
+    // t.equal(actual, expected, filename);
+    // if (actual !== expected) {
+    //     fs.writeFileSync(filename + '.actual.js', actual);
+    //     return false;
+    // }
+    // return true;
+}
+
+function compareNodes(t, a, b, filename) {
+    _.forEach(a.attribs, (v, k) => {
+        if (v !== b.attribs[k]) {
+            console.log(`${v} is not ${b.attribs[k]}`);
+        }
+        t.equal(v, b.attribs[k], filename);
+    });
+    compareNodesList(t, a.children, b.children);
+}
+
+function compareNodesList(t, a, b, filename) {
+    _.forEach(a, (v, i) => {
+        compareNodes(t, v, b[i], filename);
+    });
+}
+
 /**
  * @param {string} filename
  * @return {string}
@@ -82,5 +117,6 @@ module.exports = {
     readFile,
     joinDataPath,
     rtToHtml,
-    codeToHtml
+    codeToHtml,
+    compareAndWriteHtml
 };