Fix Transforms.wrapNodes where split: true at text node start or end (#5943)

* Fix `Transforms.wrapNodes` where `split: true` at text node start or end

* Fix block case too

packages/slate/src/transforms-node/wrap-nodes.ts

@@ -6,6 +6,7 @@ import { Element } from '../interfaces/element'
 import { Text } from '../interfaces/text'
 import { Range } from '../interfaces/range'
 import { Transforms } from '../interfaces/transforms'
+import { Point } from '../interfaces'
 
 export const wrapNodes: NodeTransforms['wrapNodes'] = (
   editor,
@@ -33,11 +34,35 @@ export const wrapNodes: NodeTransforms['wrapNodes'] = (
 
     if (split && Range.isRange(at)) {
       const [start, end] = Range.edges(at)
+
       const rangeRef = Editor.rangeRef(editor, at, {
         affinity: 'inward',
       })
-      Transforms.splitNodes(editor, { at: end, match, voids })
-      Transforms.splitNodes(editor, { at: start, match, voids })
+
+      // Always split if we're in the middle of a block, to ensure that text
+      // node boundaries are handled correctly.
+      const isAtBlockEdge = (point: Point) => {
+        const blockAbove = Editor.above(editor, {
+          at: point,
+          match: n => Element.isElement(n) && Editor.isBlock(editor, n),
+        })
+        return blockAbove && Editor.isEdge(editor, point, blockAbove[1])
+      }
+
+      Transforms.splitNodes(editor, {
+        at: end,
+        match,
+        voids,
+        always: !isAtBlockEdge(end),
+      })
+
+      Transforms.splitNodes(editor, {
+        at: start,
+        match,
+        voids,
+        always: !isAtBlockEdge(start),
+      })
+
       at = rangeRef.unref()!
 
       if (options.at == null) {

packages/slate/test/transforms/wrapNodes/split-block/block-mark.tsx

@@ -0,0 +1,39 @@
+/** @jsx jsx */
+import { Transforms } from 'slate'
+import { jsx } from '../../..'
+
+export const input = (
+  <editor>
+    <block old>
+      <text>
+        one
+        <anchor />
+      </text>
+      <text bold>two</text>
+      <text>
+        <focus />
+        three
+      </text>
+    </block>
+  </editor>
+)
+export const run = editor => {
+  Transforms.wrapNodes(editor, <block new />, { split: true })
+}
+export const output = (
+  <editor>
+    <block old>one</block>
+    <block new>
+      <block old>
+        <text bold>
+          <anchor />
+          two
+          <focus />
+        </text>
+      </block>
+    </block>
+    <block old>
+      <text>three</text>
+    </block>
+  </editor>
+)

packages/slate/test/transforms/wrapNodes/split-inline/inline-mark.tsx

@@ -0,0 +1,37 @@
+/** @jsx jsx */
+import { Transforms } from 'slate'
+import { jsx } from '../../..'
+
+export const input = (
+  <editor>
+    <block>
+      <text>
+        one
+        <anchor />
+      </text>
+      <text bold>two</text>
+      <text>
+        <focus />
+        three
+      </text>
+    </block>
+  </editor>
+)
+export const run = editor => {
+  Transforms.wrapNodes(editor, <inline new />, { split: true })
+}
+export const output = (
+  <editor>
+    <block>
+      <text>one</text>
+      <inline new>
+        <text bold>
+          <anchor />
+          two
+          <focus />
+        </text>
+      </inline>
+      <text>three</text>
+    </block>
+  </editor>
+)