Function Transforms. insertFragment is not working properly when insert a fragment with two paragraphs

[Jianrong-Yu]

Description
When this function is called to insert a fragment with two paragraphs, the two paragraphs will be merged and inserted as inline nodes.

Steps
To reproduce the behavior:

1. Go to https://www.slatejs.org/examples/paste-html
2. Select the last two paragraphs and copy the content
   
3. Put the cursor in the middle of one paragraph (in this example it's before textof doing exactly that)
   
4. paste from clipboard
5. Easy to notice the copied two paragraphs are merged into one and inserted in the cursor
   

Expectation
It should create a new paragraph

Environment

• Slate Version: 0.110.2
• Operating System: macOS
• Browser: Chrome
• TypeScript Version: N/A

Context
The root cause of this issue is the incorrect behavior of Transforms. insertFragment when the fragment is two paragraphs.

Here is a new test case which can reproduce this issue, please create it in the repo to reproduce.

packages/slate/test/transforms/insertFragment/of-blocks/block-middle-two-blocks.tsx

/** @jsx jsx */
import { Transforms } from 'slate'
import { jsx } from '../../..'

export const run = (editor, options = {}) => {
  Transforms.insertFragment(
    editor,
    <fragment>
      <block>one</block>
      <block>two</block>
    </fragment>,
    options
  )
}
export const input = (
  <editor>
    <block>
      wo
      <cursor />
      rd
    </block>
  </editor>
)
export const output = (
  <editor>
    <block>woone</block>
    <block>
      two
      <cursor />
      rd
    </block>
  </editor>
)

[zhugexiaogou666]

Description 描述 When this function is called to insert a fragment with two paragraphs, the two paragraphs will be merged and inserted as inline nodes.调用此函数以插入包含两个段落的片段时，这两个段落将被合并并作为内联节点插入。

Steps 步骤 To reproduce the behavior:要重现该行为，请执行以下操作：

1. Go to https://www.slatejs.org/examples/paste-html转至 https://www.slatejs.org/examples/paste-html
2. Select the last two paragraphs and copy the content选择最后两个段落并复制内容
   
3. Put the cursor in the middle of one paragraph (in this example it's before textof doing exactly that)将光标放在一个段落的中间（在本例中，它位于执行此操作的文本之前）
   
4. paste from clipboard 从剪贴板粘贴
5. Easy to notice the copied two paragraphs are merged into one and inserted in the cursor很容易注意到复制的两个段落合并为一个并插入到光标中
   

Expectation 期望 It should create a new paragraph它应该创建一个新段落

Environment 环境

• Slate Version: 0.110.2 Slate 版本：0.110.2
• Operating System: macOS 操作系统： macOS
• Browser: Chrome 浏览器：Chrome
• TypeScript Version: N/A TypeScript 版本：N/A

Context 上下文 The root cause of this issue is the incorrect behavior of Transforms.insertNodes when the fragment is two paragraphs.此问题的根本原因是当片段为两个段落时 Transforms.insertNodes 的行为不正确。

Here is a new test case which can reproduce this issue, please create it in the repo to reproduce.这里有一个新的测试用例，可以复现这个问题，请在 repo 中创建来复现。

packages/slate/test/transforms/insertFragment/of-blocks/block-middle-two-blocks.tsx

/** @jsx jsx */
import { Transforms } from 'slate'
import { jsx } from '../../..'

export const run = (editor, options = {}) => {
  Transforms.insertFragment(
    editor,
    <fragment>
      <block>one</block>
      <block>two</block>
    </fragment>,
    options
  )
}
export const input = (
  <editor>
    <block>
      wo
      <cursor />
      rd
    </block>
  </editor>
)
export const output = (
  <editor>
    <block>woone</block>
    <block>
      two
      <cursor />
      rd
    </block>
  </editor>
)

don't use insertFragment, try insertText, and it works.

[zhugexiaogou666]

Screen-2024-12-06-150538.mp4

[Jianrong-Yu]

@zhugexiaogou666 I know, but insertText is used for insert Text and insertFragment is the solution used for paste in the official examples: https://www.slatejs.org/examples/paste-html
Sorry I have it typo to insertNodes in the description.

[zhugexiaogou666]

insertFragment

I know, but the problem now is that the insertFragment api may have bugs. I say this method may meet your current needs.I tried insertText which can also satisfy the paste situation and will not conflict with insertFragment. And this is a case:

editor.insertText = (text) => {
		const { selection } = editor;
                     // Distinguish between selected insertion and pasting
		if (selection && Range.isExpanded(selection)) {
			//... your code
				 insertText(text),
		}

		// 调用原始的 insertText 方法
		insertText(text);
	};

[zhugexiaogou666]

insertFragment

I know, but the problem now is that the insertFragment api may have bugs. I say this method may meet your current needs.I tried insertText which can also satisfy the paste situation and will not conflict with insertFragment. And this is a case:我知道，但现在的问题是 insertFragment api 可能存在错误。我说这种方法可能满足您当前的需求。我尝试了 insertText，它也可以满足粘贴情况，并且不会与 insertFragment 冲突。这是一个案例：

editor.insertText = (text) => {
		const { selection } = editor;
                     // Distinguish between selected insertion and pasting
		if (selection && Range.isExpanded(selection)) {
			//... your code
				 insertText(text),
		}

		// 调用原始的 insertText 方法
		insertText(text);
	};

Or you can customize the paste event to override slate's paste

[Jianrong-Yu]

I'd prefer this bug to be fixed on insertFragment instead of using insertNodes to downgrade to text copy/paste from HTML copy/paste.