abstract htmldiffer

jasmine.json

@@ -4,7 +4,7 @@
     "**/*-spec.js"
   ],
   "helpers": [
-    "helpers/**/*.js"
+    "helpers/helpers.js"
   ],
   "stopSpecOnExpectationFailure": false,
   "random": true

test/helpers/helpers.js

@@ -1,8 +1,5 @@
 const marked = require('../../');
-const HtmlDiffer = require('@markedjs/html-differ').HtmlDiffer;
-const htmlDiffer = new HtmlDiffer({ignoreSelfClosingSlash: true});
-
-const EXCERPT_LENGTH = 30;
+const htmlDiffer = require('./html-differ.js');
 
 beforeEach(() => {
   marked.setOptions(marked.getDefaults());
@@ -18,23 +15,8 @@ beforeEach(() => {
           if (result.pass) {
             result.message = spec.markdown + '\n------\n\nExpected: Should Fail';
           } else {
-            var expectedHtml = expected.replace(/\s/g, '');
-            var actualHtml = actual.replace(/\s/g, '');
-
-            for (var i = 0; i < expectedHtml.length; i++) {
-              if (actualHtml[i] !== expectedHtml[i]) {
-                actualHtml = actualHtml.substring(
-                  Math.max(i - EXCERPT_LENGTH, 0),
-                  Math.min(i + EXCERPT_LENGTH, actualHtml.length));
-
-                expectedHtml = expectedHtml.substring(
-                  Math.max(i - EXCERPT_LENGTH, 0),
-                  Math.min(i + EXCERPT_LENGTH, expectedHtml.length));
-
-                break;
-              }
-            }
-            result.message = 'Expected:\n' + expectedHtml + '\n\nActual:\n' + actualHtml;
+            const diff = htmlDiffer.firstDiff(actual, expected);
+            result.message = 'Expected: ' + diff.expected + '\n  Actual: ' + diff.actual;
           }
           return result;
         }

test/helpers/html-differ.js

@@ -0,0 +1,38 @@
+const HtmlDiffer = require('@markedjs/html-differ').HtmlDiffer;
+const htmlDiffer = new HtmlDiffer({ignoreSelfClosingSlash: true});
+
+module.exports = {
+  isEqual: htmlDiffer.isEqual.bind(htmlDiffer),
+  firstDiff: (actual, expected, padding) => {
+    padding = padding || 30;
+    const result = htmlDiffer
+      .diffHtml(actual, expected)
+      .reduce((obj, diff) => {
+        if (diff.added) {
+          if (obj.firstIndex === null) {
+            obj.firstIndex = obj.expected.length;
+          }
+          obj.expected += diff.value;
+        } else if (diff.removed) {
+          if (obj.firstIndex === null) {
+            obj.firstIndex = obj.actual.length;
+          }
+          obj.actual += diff.value;
+        } else {
+          obj.actual += diff.value;
+          obj.expected += diff.value;
+        }
+
+        return obj;
+      }, {
+        firstIndex: null,
+        actual: '',
+        expected: ''
+      });
+
+    return {
+      actual: result.actual.substring(result.firstIndex - padding, result.firstIndex + padding),
+      expected: result.expected.substring(result.firstIndex - padding, result.firstIndex + padding)
+    };
+  }
+};