@matrixreq/htmldiff 1.5.0 → 1.6.0

package/js/htmldiff.js

@@ -74,7 +74,15 @@
     // incomplete name, e.g. detecting '<abbr>' as the atomic tag 'a' while reading '<a'.
     var defaultAtomicTagsRegExp = new RegExp('^<(iframe|object|math|svg|script|video|head|style|a)[\\s/>]');
     var atomicTagsRegExp = defaultAtomicTagsRegExp;
-    const dataHtmlDiffIdRegExp = /^<([a-z\-]+).+data-htmldiff-id=["']?((?:.(?!["']?\s+(?:\S+)=|\s*\/?[>"']))*.)["']?/;
+    
+    /**
+     * Matches an element whose own opening tag carries data-htmldiff-id; captures tag name and
+     * attribute value. The skip before the attribute is quote aware, so it cannot run past '>'
+     * into a nested child. The leading \s prevents matching 'x-data-htmldiff-id'.
+     * @see isStartOfAtomicTag and createToken.
+     */
+    const dataHtmlDiffIdRegExp =
+        /^<([a-z\-]+)(?:[^>"']|"[^"]*"|'[^']*')*\sdata-htmldiff-id=["']?((?:.(?!["']?\s+(?:\S+)=|\s*\/?[>"']))*.)["']?/;
 
     /**
      * Opt-in marker for the recursive inner diff. When two matched atomic tokens (typically

package/package.json

@@ -2,7 +2,7 @@
     "name": "@matrixreq/htmldiff",
     "description": "Diff and markup HTML with <ins> and <del> tags",
     "companyname": "Matrix Requirements",
-    "version": "1.5.0",
+    "version": "1.6.0",
     "keywords": [
         "diff",
         "html",

package/test/html_to_tokens.spec.js

@@ -155,6 +155,17 @@ describe('htmlToTokens', function(){
                 expect(cut(atomic)).eql(tokenize([atomic]));
             });
 
+            it('should key a wrapper by its own data-htmldiff-id, not a nested child one', function(){
+                var atomic = '<strong data-htmldiff-id="s1">' +
+                        '<em data-htmldiff-id="e1">C</em></strong>';
+                expect(cut(atomic)[0].key).eql('s1');
+            });
+
+            it('should not key an unkeyed atomic tag by a nested child data-htmldiff-id', function(){
+                var atomic = '<a><em data-htmldiff-id="e1">C</em></a>';
+                expect(cut(atomic)[0].key).eql('<a>');
+            });
+
             it('should not bump depth on differently-named tags that share a prefix', function(){
                 // a tag must not be matched by an atomic tag named "a" appearing as <article>.
                 var atomic = '<a href="x"><article>hi</article></a>';