Some diff operations include actions that cancel each other out

[bwindels]

With diff-dom 4.1.3, I'm diffing these two strings:

<div><em>foo</em> bar baz</div>

<div><em>foo</em> bar bay</div>

Using new DiffDOM().diff("<div><em>foo</em> bar baz</div>","<div><em>foo</em> bar bay</div>"), I get the following back:

[
  {
    "action": "modifyTextElement",
    "route": [
      1
    ],
    "oldValue": " bar baz",
    "newValue": " bar bay"
  },
  {
    "action": "removeTextElement",
    "route": [
      1
    ],
    "value": " bar bay"
  },
  {
    "action": "addTextElement",
    "route": [
      1
    ],
    "value": " bar bay"
  }
]

The first diff action is correct, but then the second and third cancel each other out and are redundant, and in my case even bothersome.

I'm using these, not to apply them to a DOM, but to visually mark the difference between two DOM trees (wrapping in <del> and <ins>), so having extra actions in there that shouldn't be shown messes it up a bit.

I've got a workaround, detecting exactly this case, but wanted to report as it's something potentially worth fixing.

[johanneswilm]

Hey, this is interesting. I'll happily merge a fix.

[rzhornyk]

Hi @johanneswilm
Here is more interesting example of redundant changes. Swapping two DOM elements cause 200+ changes in text nodes.
https://jsfiddle.net/nqtrewb5/8/
Could you take a look?