@createiq/htmldiff 1.1.0-beta.0 → 1.1.0

package/test/HtmlDiff.tables.spec.ts

@@ -859,7 +859,15 @@ describe('HtmlDiff — tables', () => {
         '<table><tr><td>A</td><td>X</td></tr><tr data-behaviour="data"><td>B</td><td>EXTRA</td><td>C</td></tr></table>'
 
       const result = HtmlDiff.execute(oldHtml, newHtml)
-      expect(result).toContain('<tr data-behaviour="data">')
+      // The <tr> attribute must survive AND the row's cells must be
+      // intact: B preserved, EXTRA inserted, C preserved. A bare
+      // `toContain('<tr data-behaviour="data">')` would pass even if
+      // the cells were dropped or duplicated downstream.
+      expect(result).toContain(
+        '<tr data-behaviour="data"><td>B</td>' +
+          "<td class='diffins'><ins class='diffins'>EXTRA</ins></td>" +
+          '<td>C</td></tr>'
+      )
     })
 
     it('preserves data-* attribute on a <tr> when the row passes through fuzzy-matching with content edit', () => {
@@ -879,7 +887,12 @@ describe('HtmlDiff — tables', () => {
         '</table>'
 
       const result = HtmlDiff.execute(oldHtml, newHtml)
-      expect(result).toContain('<tr data-behaviour="data">')
+      // Same intent as above: attribute must survive AND the row's
+      // content-edit must be present on the same <tr>.
+      expect(result).toContain(
+        '<tr data-behaviour="data"><td>The quick brown fox jumps over' +
+          "<ins class='diffins'>&nbsp;the lazy dog</ins>.</td></tr>"
+      )
     })
 
     it('preserves <table> attributes verbatim from new (no diff marker on attribute changes)', () => {
@@ -1689,15 +1702,18 @@ describe('HtmlDiff — tables', () => {
       const newHtml =
         '<table><tr>' + '<td>FirstB</td>' + '<td colspan="2">Merged AB</td>' + '<td>LastB</td>' + '</tr></table>'
 
-      const result = HtmlDiff.execute(oldHtml, newHtml)
       // First and last cells should diff content cell-by-cell (matching
       // colspans = 1 on both sides); middle two old cells merge into
-      // one colspan=2 cell tagged 'mod colspan'.
-      expect(result).toContain("<del class='diffmod'>FirstA</del>")
-      expect(result).toContain("<ins class='diffmod'>FirstB</ins>")
-      expect(result).toContain('colspan="2" class=\'mod colspan\'')
-      expect(result).toContain("<del class='diffmod'>LastA</del>")
-      expect(result).toContain("<ins class='diffmod'>LastB</ins>")
+      // one colspan=2 cell tagged 'mod colspan'. Asserted as an exact
+      // string so that a positional swap of first/last is caught — a
+      // swap-blind set of `toContain` assertions would not flag it.
+      expect(HtmlDiff.execute(oldHtml, newHtml)).toEqual(
+        '<table><tr>' +
+          "<td><del class='diffmod'>FirstA</del><ins class='diffmod'>FirstB</ins></td>" +
+          `<td colspan="2" class='mod colspan'>Merged AB</td>` +
+          "<td><del class='diffmod'>LastA</del><ins class='diffmod'>LastB</ins></td>" +
+          '</tr></table>'
+      )
     })
 
     it('handles row wider than MAX_COLUMN_SEARCH_WIDTH (40 cells) — fallback to cell-LCS', () => {
@@ -1741,4 +1757,313 @@ describe('HtmlDiff — tables', () => {
       )
     })
   })
+
+  // The combinatorial position search can encounter score ties when
+  // inserted cells have content that is similar both to each other and to
+  // existing cells (e.g. boilerplate "N/A" in a legal schedule). The
+  // algorithm resolves ties by combination-iteration order, so the choice
+  // of which specific column gets the diffins marker is deterministic
+  // but not necessarily the "intuitive" one. These tests lock in the
+  // observed behaviour and guard against silent regressions in the
+  // structural shape: all original cells must survive unmarked, and the
+  // inserted-marker count must equal the column delta.
+  describe('combinatorial column search — score-tied inputs', () => {
+    it('handles delta=2 with content-similar inserts (N/A boilerplate)', () => {
+      const oldHtml = '<table><tr><td>N/A</td><td>Term</td><td>Amount</td><td>N/A</td></tr></table>'
+      const newHtml =
+        '<table><tr><td>N/A</td><td>N/A</td><td>Term</td><td>N/A</td><td>Amount</td><td>N/A</td></tr></table>'
+
+      const result = HtmlDiff.execute(oldHtml, newHtml)
+      // Both inserted N/A cells must be marked diffins.
+      const insMarkers = (result.match(/<td class='diffins'>/g) || []).length
+      expect(insMarkers).toBe(2)
+      // Total td count must be 6 (no phantoms).
+      const tdCount = (result.match(/<td[\s>]/g) || []).length
+      expect(tdCount).toBe(6)
+      // Term and Amount must appear as unmarked preserved cells exactly
+      // once each — they're not similar to N/A, so the algorithm has no
+      // ambiguity around them.
+      expect(result).toContain('<td>Term</td>')
+      expect(result).toContain('<td>Amount</td>')
+    })
+
+    it('handles delta=6 (the MAX_COLUMN_DELTA cap) without misalignment', () => {
+      const oldHtml = '<table><tr><td>A</td><td>B</td><td>C</td><td>D</td></tr></table>'
+      const newHtml =
+        '<table><tr>' +
+        '<td>A</td><td>X1</td><td>X2</td><td>B</td><td>X3</td>' +
+        '<td>X4</td><td>C</td><td>X5</td><td>X6</td><td>D</td>' +
+        '</tr></table>'
+
+      const result = HtmlDiff.execute(oldHtml, newHtml)
+      // Exactly 6 cells inserted, 4 preserved.
+      const insMarkers = (result.match(/<td class='diffins'>/g) || []).length
+      expect(insMarkers).toBe(6)
+      const tdCount = (result.match(/<td[\s>]/g) || []).length
+      expect(tdCount).toBe(10)
+      // All four original cells survive in order without diff markers.
+      expect(result).toContain('<td>A</td>')
+      expect(result).toContain('<td>B</td>')
+      expect(result).toContain('<td>C</td>')
+      expect(result).toContain('<td>D</td>')
+    })
+  })
+
+  // orderAlignmentForEmission's `preserved` list is empty when no rows
+  // survive across the diff. The "delete every row" and "insert every
+  // row" cases are corner cases where the float-positioning logic must
+  // degenerate cleanly: every del's primary becomes `-0.5` (predecessor
+  // index -1), every ins's primary is its own newIdx. Both should emit
+  // in oldIdx / newIdx order respectively, with no preserved rows
+  // sandwiched between them.
+  describe('orderAlignmentForEmission — empty preserved list', () => {
+    it('emits every row as diffdel when new is empty (no preserved rows)', () => {
+      const oldHtml =
+        '<table>' +
+        '<tr><td>r1</td></tr>' +
+        '<tr><td>r2</td></tr>' +
+        '<tr><td>r3</td></tr>' +
+        '<tr><td>r4</td></tr>' +
+        '<tr><td>r5</td></tr>' +
+        '</table>'
+      const newHtml = '<table></table>'
+
+      expect(HtmlDiff.execute(oldHtml, newHtml)).toEqual(
+        '<table>' +
+          "<tr class='diffdel'><td class='diffdel'><del class='diffdel'>r1</del></td></tr>" +
+          "<tr class='diffdel'><td class='diffdel'><del class='diffdel'>r2</del></td></tr>" +
+          "<tr class='diffdel'><td class='diffdel'><del class='diffdel'>r3</del></td></tr>" +
+          "<tr class='diffdel'><td class='diffdel'><del class='diffdel'>r4</del></td></tr>" +
+          "<tr class='diffdel'><td class='diffdel'><del class='diffdel'>r5</del></td></tr>" +
+          '</table>'
+      )
+    })
+
+    it('emits every row as diffins when old is empty (no preserved rows)', () => {
+      const oldHtml = '<table></table>'
+      const newHtml = '<table>' + '<tr><td>r1</td></tr>' + '<tr><td>r2</td></tr>' + '<tr><td>r3</td></tr>' + '</table>'
+
+      expect(HtmlDiff.execute(oldHtml, newHtml)).toEqual(
+        '<table>' +
+          "<tr class='diffins'><td class='diffins'><ins class='diffins'>r1</ins></td></tr>" +
+          "<tr class='diffins'><td class='diffins'><ins class='diffins'>r2</ins></td></tr>" +
+          "<tr class='diffins'><td class='diffins'><ins class='diffins'>r3</ins></td></tr>" +
+          '</table>'
+      )
+    })
+
+    it('emits all-deletes in order when only the header is preserved', () => {
+      // The header is the only preserved row, so 'preserved' has 1 entry
+      // and every del's newIdxOfPreservedBefore returns -1 — exercising
+      // the boundary between empty-preserved and a single anchoring row.
+      const oldHtml =
+        '<table>' +
+        '<tr><td>Header</td></tr>' +
+        '<tr><td>row a</td></tr>' +
+        '<tr><td>row b</td></tr>' +
+        '<tr><td>row c</td></tr>' +
+        '</table>'
+      const newHtml = '<table><tr><td>Header</td></tr></table>'
+
+      expect(HtmlDiff.execute(oldHtml, newHtml)).toEqual(
+        '<table>' +
+          '<tr><td>Header</td></tr>' +
+          "<tr class='diffdel'><td class='diffdel'><del class='diffdel'>row a</del></td></tr>" +
+          "<tr class='diffdel'><td class='diffdel'><del class='diffdel'>row b</del></td></tr>" +
+          "<tr class='diffdel'><td class='diffdel'><del class='diffdel'>row c</del></td></tr>" +
+          '</table>'
+      )
+    })
+  })
+
+  // Fuzzy row-pairing threshold (0.5) calibrations on ISDA-flavoured
+  // content. The interesting cases are at the edges: rows that share a
+  // little (an enumeration prefix only) — must NOT pair (otherwise an
+  // unrelated rewrite shows up as a single-row content edit); rows that
+  // share a lot of boilerplate text but differ in the meaningful body —
+  // must pair (otherwise the user sees del+ins instead of an edit).
+  describe('fuzzy row pairing — enumerated clauses and shared boilerplate', () => {
+    it('does NOT pair rows that share only an enumeration prefix (different bodies)', () => {
+      // Old has 2 rows, new has 3 rows. The "1." and "2." prefixes are
+      // the only commonality — bodies are completely unrelated.
+      // textSimilarity falls below 0.5 (prefix is 3 chars in 60+; jaccard
+      // is also tiny), so fuzzy pairing must NOT fire — each pair should
+      // emit as a clean del + ins, not a noisy intra-row diff.
+      const oldHtml =
+        '<table>' +
+        '<tr><td>1. Party A shall pay the gross amount on each Payment Date.</td></tr>' +
+        '<tr><td>2. Party B shall deliver collateral on each Calculation Date.</td></tr>' +
+        '</table>'
+      const newHtml =
+        '<table>' +
+        '<tr><td>1. Section intentionally left blank.</td></tr>' +
+        '<tr><td>2. Different boilerplate entirely.</td></tr>' +
+        '<tr><td>3. Brand new clause added here.</td></tr>' +
+        '</table>'
+
+      expect(HtmlDiff.execute(oldHtml, newHtml)).toEqual(
+        '<table>' +
+          "<tr class='diffdel'><td class='diffdel'><del class='diffdel'>1. Party A shall pay the gross amount on each Payment Date.</del></td></tr>" +
+          "<tr class='diffdel'><td class='diffdel'><del class='diffdel'>2. Party B shall deliver collateral on each Calculation Date.</del></td></tr>" +
+          "<tr class='diffins'><td class='diffins'><ins class='diffins'>1. Section intentionally left blank.</ins></td></tr>" +
+          "<tr class='diffins'><td class='diffins'><ins class='diffins'>2. Different boilerplate entirely.</ins></td></tr>" +
+          "<tr class='diffins'><td class='diffins'><ins class='diffins'>3. Brand new clause added here.</ins></td></tr>" +
+          '</table>'
+      )
+    })
+
+    it('DOES pair rows that share a long boilerplate footer (Jaccard kicks in)', () => {
+      // The 9-char body differs, but the 50-char trailing footer is
+      // identical. Prefix-suffix similarity is low, but token Jaccard is
+      // very high because shared footer tokens dominate the token set.
+      // textSimilarity = Math.max(prefix_suffix, jaccard) → must pair.
+      const footer = ' subject to the terms of the Master Agreement.'
+      const oldHtml = `<table><tr><td>Anchor row</td></tr><tr><td>Alpha now${footer}</td></tr></table>`
+      const newHtml =
+        `<table><tr><td>Anchor row</td></tr><tr><td>Bravo new${footer}</td></tr>` +
+        '<tr><td>Extra row appended</td></tr></table>'
+
+      expect(HtmlDiff.execute(oldHtml, newHtml)).toEqual(
+        '<table>' +
+          '<tr><td>Anchor row</td></tr>' +
+          "<tr><td><del class='diffmod'>Alpha</del><ins class='diffmod'>Bravo</ins> " +
+          "<del class='diffmod'>now</del><ins class='diffmod'>new</ins>" +
+          ' subject to the terms of the Master Agreement.</td></tr>' +
+          "<tr class='diffins'><td class='diffins'><ins class='diffins'>Extra row appended</ins></td></tr>" +
+          '</table>'
+      )
+    })
+  })
+
+  // orderAlignmentForEmission must keep unpaired dels in their correct
+  // positions even when the run contains a mix of preserved rows, fuzzy-
+  // paired rows, and unpaired dels. A regression here would make trailing
+  // dels appear before the row they came after — the same family of bug
+  // as the "deleted rows out of order" report that motivated the
+  // function in the first place.
+  describe('orderAlignmentForEmission — mixed paired and unpaired rows', () => {
+    it('emits trailing unpaired dels after a fuzzy-paired content edit', () => {
+      // Old: [Aaaaa, Bbbbb, Cccc, Dddd]. New: [Aaaaa, Bbbbb+NEW].
+      // After LCS: A is preserved. After pairSimilarUnmatchedRows: B↔B'
+      // via fuzzy. C and D are unpaired dels. The output order must be:
+      // preserved(A) → paired(B,B') → del(C) → del(D).
+      const oldHtml =
+        '<table>' +
+        '<tr><td>Aaaaa shared content here</td></tr>' +
+        '<tr><td>Bbbbb shared content here</td></tr>' +
+        '<tr><td>Cccc deleted row</td></tr>' +
+        '<tr><td>Dddd deleted row</td></tr>' +
+        '</table>'
+      const newHtml =
+        '<table>' +
+        '<tr><td>Aaaaa shared content here</td></tr>' +
+        '<tr><td>Bbbbb shared content here NEW</td></tr>' +
+        '</table>'
+
+      expect(HtmlDiff.execute(oldHtml, newHtml)).toEqual(
+        '<table>' +
+          '<tr><td>Aaaaa shared content here</td></tr>' +
+          "<tr><td>Bbbbb shared content here<ins class='diffins'>&nbsp;NEW</ins></td></tr>" +
+          "<tr class='diffdel'><td class='diffdel'><del class='diffdel'>Cccc deleted row</del></td></tr>" +
+          "<tr class='diffdel'><td class='diffdel'><del class='diffdel'>Dddd deleted row</del></td></tr>" +
+          '</table>'
+      )
+    })
+
+    it('emits dels at the end of the table in old-document order', () => {
+      // Specifically protects against the regression that motivated
+      // orderAlignmentForEmission: deleting the last two rows
+      // simultaneously must emit them in the order they appeared in old
+      // (second-last, then last), not reversed or jumbled.
+      const oldHtml =
+        '<table>' +
+        '<tr><td>kept1</td></tr>' +
+        '<tr><td>kept2</td></tr>' +
+        '<tr><td>second-last</td></tr>' +
+        '<tr><td>last</td></tr>' +
+        '</table>'
+      const newHtml = '<table><tr><td>kept1</td></tr><tr><td>kept2</td></tr></table>'
+
+      expect(HtmlDiff.execute(oldHtml, newHtml)).toEqual(
+        '<table>' +
+          '<tr><td>kept1</td></tr>' +
+          '<tr><td>kept2</td></tr>' +
+          "<tr class='diffdel'><td class='diffdel'><del class='diffdel'>second-last</del></td></tr>" +
+          "<tr class='diffdel'><td class='diffdel'><del class='diffdel'>last</del></td></tr>" +
+          '</table>'
+      )
+    })
+  })
+
+  // pairSimilarUnmatched is intentionally greedy (not Hungarian-optimal).
+  // When two unmatched-old entries are both above-threshold matches for
+  // the same unmatched-new entry, the first del wins the pairing only
+  // when iterating in document order means "first" matches the better
+  // candidate. The output must still be structurally valid — no phantom
+  // cells, no dropped content — regardless of which del wins.
+  describe('pairSimilarUnmatchedCells — competing dels for the same ins', () => {
+    it('keeps both candidate cells intact when two old cells could pair with one new cell', () => {
+      // Two old cells with identical content compete for one similar
+      // new cell. The greedy assignment picks one to pair as a content
+      // edit; the other emits as a full diffdel. Both must appear; no
+      // cell may silently vanish.
+      const oldHtml =
+        '<table><tr>' +
+        '<td>Preserved</td>' +
+        '<td>Old content alpha to be edited</td>' +
+        '<td>Old content alpha to be edited</td>' +
+        '</tr></table>'
+      const newHtml = '<table><tr>' + '<td>Preserved</td>' + '<td>Old content alpha CHANGED</td>' + '</tr></table>'
+
+      const result = HtmlDiff.execute(oldHtml, newHtml)
+      // The losing del must emit as a full diffdel cell.
+      expect(result).toContain("<td class='diffdel'><del class='diffdel'>Old content alpha to be edited</del></td>")
+      // The winning pair must emit as a partial content edit.
+      expect(result).toContain("<del class='diffmod'>to be edited</del>")
+      expect(result).toContain("<ins class='diffmod'>CHANGED</ins>")
+      // Structural: 3 tds total in the output (1 preserved, 1 full-del,
+      // 1 paired-edit). No phantoms.
+      const tdCount = (result.match(/<td[\s>]/g) || []).length
+      expect(tdCount).toBe(3)
+    })
+  })
+
+  // Row-LCS on a non-trivial 7-row table where only every other row
+  // matches. Existing named tests max out around 4 rows; the matrix
+  // never produces a row-count drop this large with this much
+  // interleaving. This exercises the LCS DP itself, not just the
+  // diff emission.
+  describe('row-LCS on larger tables', () => {
+    it('finds 4 preserved rows interleaved with 3 dropped rows in a 7-row old table', () => {
+      const oldHtml =
+        '<table>' +
+        '<tr><td>row1 preserved</td></tr>' +
+        '<tr><td>row2 old body</td></tr>' +
+        '<tr><td>row3 preserved</td></tr>' +
+        '<tr><td>row4 old body</td></tr>' +
+        '<tr><td>row5 preserved</td></tr>' +
+        '<tr><td>row6 old body</td></tr>' +
+        '<tr><td>row7 preserved</td></tr>' +
+        '</table>'
+      const newHtml =
+        '<table>' +
+        '<tr><td>row1 preserved</td></tr>' +
+        '<tr><td>row3 preserved</td></tr>' +
+        '<tr><td>row5 preserved</td></tr>' +
+        '<tr><td>row7 preserved</td></tr>' +
+        '</table>'
+
+      expect(HtmlDiff.execute(oldHtml, newHtml)).toEqual(
+        '<table>' +
+          '<tr><td>row1 preserved</td></tr>' +
+          "<tr class='diffdel'><td class='diffdel'><del class='diffdel'>row2 old body</del></td></tr>" +
+          '<tr><td>row3 preserved</td></tr>' +
+          "<tr class='diffdel'><td class='diffdel'><del class='diffdel'>row4 old body</del></td></tr>" +
+          '<tr><td>row5 preserved</td></tr>' +
+          "<tr class='diffdel'><td class='diffdel'><del class='diffdel'>row6 old body</del></td></tr>" +
+          '<tr><td>row7 preserved</td></tr>' +
+          '</table>'
+      )
+    })
+  })
 })

package/.claude/settings.local.json

@@ -1,15 +0,0 @@
-{
-  "permissions": {
-    "allow": [
-      "Bash(diff -u test/input1.html test/input2.html)",
-      "Bash(npm test -- test/Bug.spec.tsx)",
-      "Bash(timeout 30s npm run test:ci -- test/Bug.spec.tsx)",
-      "Bash(npm run build)",
-      "Bash(timeout 10s npm run test:ci -- test/Bug.spec.tsx)",
-      "Bash(npm run lint)",
-      "Bash(npm run test:ci)",
-      "Bash(npm run bench:ci)"
-    ],
-    "deny": []
-  }
-}