fix(merge): incorrect caret position on merge

[neSpecc]

Problem

Right now caret restored at incorrect position after merging:

header merge is ok, paragraph is not:

paragraph-to-paragraph-merge-caret-bug.mov

Can be reproduced in Safari.

Cause

In editor.js blockEvents we have this logic:

https://github.com/codex-team/editor.js/blob/b355f1673c11ec3c0603303aefaa6a546cf3a377/src/components/modules/blockEvents.ts#L488-L503

  private mergeBlocks(targetBlock: Block, blockToMerge: Block): void {
    const { BlockManager, Caret, Toolbar } = this.Editor;

    Caret.createShadow(targetBlock.pluginsContent);

    BlockManager
      .mergeBlocks(targetBlock, blockToMerge)
      .then(() => {
        window.requestAnimationFrame(() => {
          /** Restore caret position after merge */
          Caret.restoreCaret(targetBlock.pluginsContent as HTMLElement);
          targetBlock.pluginsContent.normalize();
          Toolbar.close();
        });
      });
  }

There is 2 problems:

• redundant requestAnimationFrame. It used only because paragraph this.data setter updates DOM in requestAnimationFrame
• In paragraph's merge() method we update DOM using innerHTML replacement. Link to the shadow-caret losing at that time

Solution

• Get rid of this.data setter and getter. They has no sense and it's hard to maintain them: logic should be different in every case:
  • onPaste() should use RAF,
  • render() should not use RAF (chore: migrate to vite, make render sync #75),
  • merge() should not break links to existing nodes, just append new content.
• merge() now just appends new content and don't breaks links to existing nodes (eg. shadow caret)

Resolves #73