@portabletext/editor 2.21.3 → 2.21.5

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@portabletext/editor",
-  "version": "2.21.3",
+  "version": "2.21.5",
   "description": "Portable Text Editor made in React",
   "keywords": [
     "sanity",
@@ -75,8 +75,8 @@
     "xstate": "^5.24.0",
     "@portabletext/block-tools": "^4.0.2",
     "@portabletext/keyboard-shortcuts": "^2.1.0",
-    "@portabletext/patches": "^2.0.0",
-    "@portabletext/schema": "^2.0.0"
+    "@portabletext/schema": "^2.0.0",
+    "@portabletext/patches": "^2.0.0"
   },
   "devDependencies": {
     "@sanity/diff-match-patch": "^3.2.0",

package/src/editor/sync-machine.ts

@@ -757,8 +757,10 @@ function syncBlock({
   }
 
   if (validation.valid || validation.resolution?.autoResolve) {
-    if (oldBlock._key === block._key) {
-      if (debug.enabled) debug('Updating block', oldBlock, block)
+    if (oldBlock._key === block._key && oldBlock._type === block._type) {
+      if (debug.enabled) {
+        debug('Updating block', oldBlock, block)
+      }
 
       Editor.withoutNormalizing(slateEditor, () => {
         withRemoteChanges(slateEditor, () => {
@@ -908,8 +910,11 @@ function updateBlock({
       const path = [index, currentBlockChildIndex]
 
       if (isChildChanged) {
-        // Update if this is the same child
-        if (currentBlockChild._key === oldBlockChild?._key) {
+        // Update if this is the same child (same key and type)
+        if (
+          currentBlockChild._key === oldBlockChild?._key &&
+          currentBlockChild._type === oldBlockChild?._type
+        ) {
           debug('Updating changed child', currentBlockChild, oldBlockChild)
 
           Transforms.setNodes(slateEditor, currentBlockChild as Partial<Node>, {
@@ -949,7 +954,6 @@ function updateBlock({
             )
           }
         } else if (oldBlockChild) {
-          // Replace the child if _key's are different
           debug('Replacing child', currentBlockChild)
 
           Transforms.removeNodes(slateEditor, {

package/src/internal-utils/apply-operation-to-portable-text.test.ts

@@ -172,4 +172,95 @@ describe(applyOperationToPortableText.name, () => {
       },
     ])
   })
+
+  test('updating block object with a field named "text"', () => {
+    const keyGenerator = createTestKeyGenerator()
+    const k0 = keyGenerator()
+
+    expect(
+      applyOperationToPortableText(
+        createContext(),
+        [
+          {
+            _type: 'quote',
+            _key: k0,
+            text: 'h',
+          },
+        ],
+        {
+          type: 'set_node',
+          path: [0],
+          properties: {
+            value: {text: 'h'},
+          },
+          newProperties: {
+            value: {text: 'hello'},
+          },
+        },
+      ),
+    ).toEqual([
+      {
+        _type: 'quote',
+        _key: k0,
+        text: 'hello',
+      },
+    ])
+  })
+
+  test('updating inline object with a field named "text"', () => {
+    const keyGenerator = createTestKeyGenerator()
+    const k0 = keyGenerator()
+    const k1 = keyGenerator()
+    const k2 = keyGenerator()
+    const k3 = keyGenerator()
+
+    expect(
+      applyOperationToPortableText(
+        createContext(),
+        [
+          {
+            _key: k0,
+            _type: 'block',
+            children: [
+              {
+                _key: k1,
+                _type: 'span',
+                text: '',
+              },
+              {
+                _key: k2,
+                _type: 'mention',
+                text: 'J',
+              },
+              {
+                _key: k3,
+                _type: 'span',
+                text: '',
+              },
+            ],
+          },
+        ],
+        {
+          type: 'set_node',
+          path: [0, 1],
+          properties: {
+            value: {text: 'J'},
+          },
+          newProperties: {
+            value: {text: 'John Doe'},
+          },
+        },
+      ),
+    ).toEqual([
+      {
+        _type: 'block',
+        _key: k0,
+        children: [
+          {_type: 'span', _key: k1, text: ''},
+          {_type: 'mention', _key: k2, text: 'John Doe'},
+          {_type: 'span', _key: k3, text: ''},
+        ],
+      },
+    ])
+  })
 })

package/src/internal-utils/apply-operation-to-portable-text.ts

@@ -107,7 +107,7 @@ function applyOperationToPortableTextDraft(
           break
         }
 
-        if (isPartialSpanNode(insertedNode)) {
+        if (isPartialSpanNode(context, insertedNode)) {
           // Text nodes can be inserted as is
 
           parent.children.splice(index, 0, insertedNode)
@@ -161,7 +161,10 @@ function applyOperationToPortableTextDraft(
 
       const index = path[path.length - 1]
 
-      if (isPartialSpanNode(node) && isPartialSpanNode(prev)) {
+      if (
+        isPartialSpanNode(context, node) &&
+        isPartialSpanNode(context, prev)
+      ) {
         prev.text += node.text
       } else if (
         isTextBlockNode(context, node) &&
@@ -342,7 +345,7 @@ function applyOperationToPortableTextDraft(
         break
       }
 
-      if (isPartialSpanNode(node)) {
+      if (isPartialSpanNode(context, node)) {
         for (const key in newProperties) {
           if (key === 'text') {
             break

package/src/internal-utils/operation-to-patches.test.ts

@@ -141,6 +141,16 @@ describe('operationToPatches', () => {
       ),
     ).toMatchInlineSnapshot(`
       [
+        {
+          "path": [
+            {
+              "_key": "1f2e64b47787",
+            },
+            "children",
+          ],
+          "type": "setIfMissing",
+          "value": [],
+        },
         {
           "items": [
             {
@@ -285,6 +295,16 @@ describe('operationToPatches', () => {
       ),
     ).toMatchInlineSnapshot(`
       [
+        {
+          "path": [
+            {
+              "_key": "1f2e64b47787",
+            },
+            "children",
+          ],
+          "type": "setIfMissing",
+          "value": [],
+        },
         {
           "items": [
             {

package/src/internal-utils/operation-to-patches.ts

@@ -314,6 +314,9 @@ export function insertNodePatch(
       node._type = 'span'
       node.marks = []
     }
+
+    // Defensive setIfMissing to ensure children array exists before inserting
+    const setIfMissingPatch = setIfMissing([], [{_key: block._key}, 'children'])
     const blk = fromSlateValue(
       [
         {
@@ -326,6 +329,7 @@ export function insertNodePatch(
     )[0] as PortableTextTextBlock
     const child = blk.children[0]
     return [
+      setIfMissingPatch,
       insert([child], position, [
         {_key: block._key},
         'children',
@@ -389,6 +393,8 @@ export function splitNodePatch(
         )[0] as PortableTextTextBlock
       ).children
 
+      // Defensive setIfMissing to ensure children array exists before inserting
+      patches.push(setIfMissing([], [{_key: splitBlock._key}, 'children']))
       patches.push(
         insert(targetSpans, 'after', [
           {_key: splitBlock._key},
@@ -563,6 +569,8 @@ export function moveNodePatch(
       fromSlateValue([block], schema.block.name)[0] as PortableTextTextBlock
     ).children[operation.path[1]]
     patches.push(unset([{_key: block._key}, 'children', {_key: child._key}]))
+    // Defensive setIfMissing to ensure children array exists before inserting
+    patches.push(setIfMissing([], [{_key: targetBlock._key}, 'children']))
     patches.push(
       insert([childToInsert], position, [
         {_key: targetBlock._key},

package/src/internal-utils/portable-text-node.test.ts

@@ -0,0 +1,132 @@
+import {compileSchema, defineSchema} from '@portabletext/schema'
+import {describe, expect, test} from 'vitest'
+import {isObjectNode, isPartialSpanNode, isSpanNode} from './portable-text-node'
+
+const schema = compileSchema(defineSchema({}))
+
+describe(isPartialSpanNode.name, () => {
+  test('object with only text property', () => {
+    expect(isPartialSpanNode({schema}, {text: 'Hello'})).toBe(true)
+  })
+
+  test('non-objects', () => {
+    expect(isPartialSpanNode({schema}, null)).toBe(false)
+    expect(isPartialSpanNode({schema}, undefined)).toBe(false)
+    expect(isPartialSpanNode({schema}, 'text')).toBe(false)
+    expect(isPartialSpanNode({schema}, 123)).toBe(false)
+  })
+
+  test('text is not a string', () => {
+    expect(isPartialSpanNode({schema}, {text: 123})).toBe(false)
+    expect(isPartialSpanNode({schema}, {text: null})).toBe(false)
+    expect(isPartialSpanNode({schema}, {text: undefined})).toBe(false)
+  })
+
+  test('inline object with text field and _type', () => {
+    expect(
+      isPartialSpanNode(
+        {schema},
+        {_type: 'mention', _key: 'abc123', text: 'John Doe'},
+      ),
+    ).toBe(false)
+  })
+
+  test('block object with text field and _type', () => {
+    expect(
+      isPartialSpanNode(
+        {schema},
+        {
+          _type: 'quote',
+          _key: 'abc123',
+          text: 'Hello world',
+          source: 'Anonymous',
+        },
+      ),
+    ).toBe(false)
+  })
+})
+
+describe(isSpanNode.name, () => {
+  test('span with _type="span"', () => {
+    expect(isSpanNode({schema}, {_type: 'span', text: 'Hello'})).toBe(true)
+  })
+
+  test('partial span (no _type, has text)', () => {
+    expect(isSpanNode({schema}, {text: 'Hello'})).toBe(true)
+  })
+
+  test('object with children', () => {
+    expect(
+      isSpanNode({schema}, {_type: 'span', text: 'Hello', children: []}),
+    ).toBe(false)
+  })
+
+  test('object with different _type', () => {
+    expect(isSpanNode({schema}, {_type: 'mention', text: 'Hello'})).toBe(false)
+  })
+})
+
+describe(isObjectNode.name, () => {
+  test('inline object', () => {
+    expect(
+      isObjectNode(
+        {schema},
+        {_type: 'stock-ticker', _key: 'abc', symbol: 'AAPL'},
+      ),
+    ).toBe(true)
+  })
+
+  test('block object', () => {
+    expect(
+      isObjectNode(
+        {schema},
+        {_type: 'image', _key: 'abc', src: 'https://example.com'},
+      ),
+    ).toBe(true)
+  })
+
+  test('inline object with text field', () => {
+    expect(
+      isObjectNode(
+        {schema},
+        {_type: 'mention', _key: 'abc123', text: 'John Doe'},
+      ),
+    ).toBe(true)
+  })
+
+  test('block object with text field', () => {
+    expect(
+      isObjectNode(
+        {schema},
+        {
+          _type: 'quote',
+          _key: 'abc123',
+          text: 'Hello world',
+          source: 'Anonymous',
+        },
+      ),
+    ).toBe(true)
+  })
+
+  test('span', () => {
+    expect(
+      isObjectNode(
+        {schema},
+        {_type: 'span', _key: 'abc', text: 'Hello', marks: []},
+      ),
+    ).toBe(false)
+  })
+
+  test('text block', () => {
+    expect(
+      isObjectNode(
+        {schema},
+        {
+          _type: 'block',
+          _key: 'abc',
+          children: [{_type: 'span', text: 'Hello'}],
+        },
+      ),
+    ).toBe(false)
+  })
+})

package/src/internal-utils/portable-text-node.ts

@@ -79,13 +79,23 @@ export type PartialSpanNode = {
   [other: string]: unknown
 }
 
-export function isPartialSpanNode(node: unknown): node is PartialSpanNode {
-  return (
-    typeof node === 'object' &&
-    node !== null &&
-    'text' in node &&
-    typeof node.text === 'string'
-  )
+export function isPartialSpanNode(
+  context: {schema: EditorSchema},
+  node: unknown,
+): node is PartialSpanNode {
+  if (typeof node !== 'object' || node === null) {
+    return false
+  }
+
+  if (!('text' in node) || typeof node.text !== 'string') {
+    return false
+  }
+
+  if ('_type' in node && node._type !== context.schema.span.name) {
+    return false
+  }
+
+  return true
 }
 
 //////////
@@ -104,7 +114,7 @@ export function isObjectNode(
     !isEditorNode(node) &&
     !isTextBlockNode(context, node) &&
     !isSpanNode(context, node) &&
-    !isPartialSpanNode(node)
+    !isPartialSpanNode(context, node)
   )
 }