Do not combine adjacent atomic tags while diffing

[ragoolkr]

This pull request introduces improvements to how atomic HTML tags (such as <iframe>) are handled during diff operations, ensuring that each atomic tag is wrapped independently when inserted or deleted. It also adds comprehensive tests to verify this behavior and bumps the package version to reflect these changes.

Feature added

The algorithm now gets all the adjacent changes and combine them together into one tag which needs a bit complex css to style later.

We already have a function isStartOfAtomicTag to determine an atomic tag then in the combine method we stop the array push if it in an atomic tag.

UI

Code

<div data-operation-index="1" data-diff-node="ins">
 <ins data-operation-index="1">
    <div data-htmldiff-id="two" class="label-tag-wrapper">
     <span class="truncate">two</span>
    </div>
</ins>
<ins data-operation-index="1">
   <div data-htmldiff-id="three" class="label-tag-wrapper">
      <span class="truncate">three</span>
    </div>
 </ins>
</div>

Atomic tag diff handling:

• Updated the diffing logic in js/htmldiff.js so that each atomic tag is wrapped with its own <ins> or <del> tag, rather than combining adjacent atomic tags or merging them with text. This ensures clearer and more accurate diff output for atomic elements.

Testing improvements:

• Added a new test suite in test/diff.spec.js to verify that adjacent atomic tags are wrapped independently, that atomic tags are not merged with adjacent text, and that non-atomic container tags are handled correctly.
• Updated an existing test in test/render_operations.spec.js to check that atomic tags are wrapped independently in deletion operations.

Versioning:

• Bumped the package version in package.json from 1.2.0 to 1.3.0 to reflect the new behavior and improvements.

[sirenevenkii]

looks good, let's try it out 👍