@portabletext/editor 2.21.3 → 3.0.1

package/src/test/vitest/step-definitions.tsx

@@ -114,6 +114,7 @@ export const stepDefinitions = [
           },
           blocks: JSON.parse(blocks),
           options: {
+            normalize: false,
             removeUnusedMarkDefs: false,
             validateFields: true,
           },
@@ -235,6 +236,21 @@ export const stepDefinitions = [
       })
     },
   ),
+  When(
+    '{button} is pressed in Editor B',
+    async (context: Context, button: Parameter['button']) => {
+      const previousSelection = context.editorB.getSnapshot().context.selection
+      await userEvent.keyboard(button)
+
+      await vi.waitFor(() => {
+        const currentSelection = context.editorB.getSnapshot().context.selection
+
+        if (currentSelection) {
+          expect(currentSelection).not.toBe(previousSelection)
+        }
+      })
+    },
+  ),
   When(
     '{button} is pressed {int} times',
     async (context: Context, button: Parameter['button'], times: number) => {
@@ -253,6 +269,25 @@ export const stepDefinitions = [
       }
     },
   ),
+  When(
+    '{button} is pressed {int} times in Editor B',
+    async (context: Context, button: Parameter['button'], times: number) => {
+      for (let i = 0; i < times; i++) {
+        const previousSelection =
+          context.editorB.getSnapshot().context.selection
+        await userEvent.keyboard(button)
+
+        await vi.waitFor(() => {
+          const currentSelection =
+            context.editorB.getSnapshot().context.selection
+
+          if (currentSelection) {
+            expect(currentSelection).not.toBe(previousSelection)
+          }
+        })
+      }
+    },
+  ),
   When(
     '{shortcut} is pressed',
     async (context: Context, shortcut: Parameter['shortcut']) => {
@@ -302,6 +337,27 @@ export const stepDefinitions = [
       })
     },
   ),
+  When(
+    'the caret is put before {string} in Editor B',
+    async (context: Context, text: string) => {
+      await vi.waitFor(() => {
+        const selection = getSelectionBeforeText(
+          context.editorB.getSnapshot().context,
+          text,
+        )
+        expect(selection).not.toBeNull()
+
+        context.editorB.send({
+          type: 'select',
+          at: selection,
+        })
+
+        expect(context.editorB.getSnapshot().context.selection).toEqual(
+          selection,
+        )
+      })
+    },
+  ),
   Then(
     'the caret is before {string}',
     async (context: Context, text: string) => {
@@ -506,6 +562,7 @@ export const stepDefinitions = [
           },
           blocks: JSON.parse(blocks),
           options: {
+            normalize: false,
             removeUnusedMarkDefs: false,
             validateFields: true,
           },

package/src/test/vitest/test-editor.tsx

@@ -134,7 +134,7 @@ export async function createTestEditors(
                   ...patch,
                   origin: 'remote',
                 })),
-                snapshot: event.snapshot,
+                snapshot: event.value,
               })
               editorBRef.current?.send({
                 type: 'update value',

package/src/utils/parse-blocks.test.ts

@@ -1,7 +1,7 @@
 import {compileSchema, defineSchema} from '@portabletext/schema'
 import {createTestKeyGenerator} from '@portabletext/test'
 import {describe, expect, test} from 'vitest'
-import {parseBlock, parseSpan} from './parse-blocks'
+import {parseBlock, parseInlineObject, parseSpan} from './parse-blocks'
 
 describe(parseBlock.name, () => {
   test('null', () => {
@@ -12,7 +12,11 @@ describe(parseBlock.name, () => {
           keyGenerator: createTestKeyGenerator(),
           schema: compileSchema(defineSchema({})),
         },
-        options: {removeUnusedMarkDefs: true, validateFields: true},
+        options: {
+          normalize: false,
+          removeUnusedMarkDefs: true,
+          validateFields: true,
+        },
       }),
     ).toBe(undefined)
   })
@@ -25,7 +29,11 @@ describe(parseBlock.name, () => {
           keyGenerator: createTestKeyGenerator(),
           schema: compileSchema(defineSchema({})),
         },
-        options: {removeUnusedMarkDefs: true, validateFields: true},
+        options: {
+          normalize: false,
+          removeUnusedMarkDefs: true,
+          validateFields: true,
+        },
       }),
     ).toBe(undefined)
   })
@@ -39,7 +47,11 @@ describe(parseBlock.name, () => {
             keyGenerator: createTestKeyGenerator(),
             schema: compileSchema(defineSchema({})),
           },
-          options: {removeUnusedMarkDefs: true, validateFields: true},
+          options: {
+            normalize: false,
+            removeUnusedMarkDefs: true,
+            validateFields: true,
+          },
         }),
       ).toBe(undefined)
     })
@@ -54,7 +66,11 @@ describe(parseBlock.name, () => {
               defineSchema({blockObjects: [{name: 'image'}]}),
             ),
           },
-          options: {removeUnusedMarkDefs: true, validateFields: true},
+          options: {
+            normalize: false,
+            removeUnusedMarkDefs: true,
+            validateFields: true,
+          },
         }),
       ).toBe(undefined)
     })
@@ -69,7 +85,11 @@ describe(parseBlock.name, () => {
               defineSchema({blockObjects: [{name: 'image'}]}),
             ),
           },
-          options: {removeUnusedMarkDefs: true, validateFields: true},
+          options: {
+            normalize: false,
+            removeUnusedMarkDefs: true,
+            validateFields: true,
+          },
         }),
       ).toEqual({
         _key: 'k0',
@@ -87,7 +107,11 @@ describe(parseBlock.name, () => {
             keyGenerator: createTestKeyGenerator(),
             schema: compileSchema(defineSchema({})),
           },
-          options: {removeUnusedMarkDefs: true, validateFields: true},
+          options: {
+            normalize: false,
+            removeUnusedMarkDefs: true,
+            validateFields: true,
+          },
         }),
       ).toEqual({
         _key: 'k0',
@@ -114,7 +138,11 @@ describe(parseBlock.name, () => {
             keyGenerator: createTestKeyGenerator(),
             schema: {...schema, block: {...schema.block, name: 'text'}},
           },
-          options: {removeUnusedMarkDefs: true, validateFields: true},
+          options: {
+            normalize: false,
+            removeUnusedMarkDefs: true,
+            validateFields: true,
+          },
         }),
       ).toEqual({
         _key: 'k0',
@@ -149,7 +177,11 @@ describe(parseBlock.name, () => {
             keyGenerator: createTestKeyGenerator(),
             schema: compileSchema(defineSchema({})),
           },
-          options: {removeUnusedMarkDefs: true, validateFields: true},
+          options: {
+            normalize: false,
+            removeUnusedMarkDefs: true,
+            validateFields: true,
+          },
         }),
       ).toBe(undefined)
     })
@@ -166,7 +198,7 @@ describe(parseBlock.name, () => {
               42,
               {foo: 'bar'},
               {
-                _key: 'k1',
+                _key: 'some key',
                 text: 'foo',
                 marks: [],
               },
@@ -177,6 +209,7 @@ describe(parseBlock.name, () => {
               {_type: 'span', text: 'foo'},
               {_type: 'span', marks: ['strong']},
               {_type: 'span', marks: ['em']},
+              {_type: 'image', text: 'inline object or span?'},
             ],
           },
           context: {
@@ -188,12 +221,22 @@ describe(parseBlock.name, () => {
               }),
             ),
           },
-          options: {removeUnusedMarkDefs: true, validateFields: true},
+          options: {
+            normalize: false,
+            removeUnusedMarkDefs: true,
+            validateFields: true,
+          },
         }),
       ).toEqual({
         _key: 'k0',
         _type: 'block',
         children: [
+          {
+            _key: 'some key',
+            _type: 'span',
+            text: 'foo',
+            marks: [],
+          },
           {
             _key: 'k1',
             _type: 'stock-ticker',
@@ -222,6 +265,12 @@ describe(parseBlock.name, () => {
             text: '',
             marks: ['em'],
           },
+          {
+            _key: 'k6',
+            _type: 'span',
+            text: 'inline object or span?',
+            marks: [],
+          },
         ],
         markDefs: [],
         style: 'normal',
@@ -236,7 +285,11 @@ describe(parseBlock.name, () => {
             keyGenerator: createTestKeyGenerator(),
             schema: compileSchema(defineSchema({lists: [{name: 'bullet'}]})),
           },
-          options: {removeUnusedMarkDefs: true, validateFields: true},
+          options: {
+            normalize: false,
+            removeUnusedMarkDefs: true,
+            validateFields: true,
+          },
         }),
       ).toEqual({
         _key: 'k0',
@@ -263,7 +316,11 @@ describe(parseBlock.name, () => {
             keyGenerator: createTestKeyGenerator(),
             schema: compileSchema(defineSchema({lists: [{name: 'bullet'}]})),
           },
-          options: {removeUnusedMarkDefs: true, validateFields: true},
+          options: {
+            normalize: false,
+            removeUnusedMarkDefs: true,
+            validateFields: true,
+          },
         }),
       ).toEqual({
         _key: 'k0',
@@ -290,7 +347,11 @@ describe(parseBlock.name, () => {
               keyGenerator: createTestKeyGenerator(),
               schema: compileSchema(defineSchema({})),
             },
-            options: {removeUnusedMarkDefs: true, validateFields: true},
+            options: {
+              normalize: false,
+              removeUnusedMarkDefs: true,
+              validateFields: true,
+            },
           }),
         ).toEqual({
           _type: 'block',
@@ -320,7 +381,11 @@ describe(parseBlock.name, () => {
                 }),
               ),
             },
-            options: {removeUnusedMarkDefs: true, validateFields: true},
+            options: {
+              normalize: false,
+              removeUnusedMarkDefs: true,
+              validateFields: true,
+            },
           }),
         ).toEqual({
           _type: 'block',
@@ -351,7 +416,11 @@ describe(parseBlock.name, () => {
                 }),
               ),
             },
-            options: {removeUnusedMarkDefs: true, validateFields: true},
+            options: {
+              normalize: false,
+              removeUnusedMarkDefs: true,
+              validateFields: true,
+            },
           }),
         ).toEqual({
           _type: 'block',
@@ -533,3 +602,214 @@ describe(parseSpan.name, () => {
     })
   })
 })
+
+describe(parseInlineObject.name, () => {
+  test('undefined', () => {
+    expect(
+      parseInlineObject({
+        inlineObject: undefined,
+        context: {
+          keyGenerator: createTestKeyGenerator(),
+          schema: compileSchema(
+            defineSchema({inlineObjects: [{name: 'stock-ticker'}]}),
+          ),
+        },
+        options: {validateFields: true},
+      }),
+    ).toBe(undefined)
+  })
+
+  test('null', () => {
+    expect(
+      parseInlineObject({
+        inlineObject: null,
+        context: {
+          keyGenerator: createTestKeyGenerator(),
+          schema: compileSchema(
+            defineSchema({inlineObjects: [{name: 'stock-ticker'}]}),
+          ),
+        },
+        options: {validateFields: true},
+      }),
+    ).toBe(undefined)
+  })
+
+  test('empty object', () => {
+    expect(
+      parseInlineObject({
+        inlineObject: {},
+        context: {
+          keyGenerator: createTestKeyGenerator(),
+          schema: compileSchema(
+            defineSchema({inlineObjects: [{name: 'stock-ticker'}]}),
+          ),
+        },
+        options: {validateFields: true},
+      }),
+    ).toBe(undefined)
+  })
+
+  test('invalid _type', () => {
+    expect(
+      parseInlineObject({
+        inlineObject: {_type: 'image'},
+        context: {
+          keyGenerator: createTestKeyGenerator(),
+          schema: compileSchema(
+            defineSchema({inlineObjects: [{name: 'stock-ticker'}]}),
+          ),
+        },
+        options: {validateFields: true},
+      }),
+    ).toBe(undefined)
+  })
+
+  test('only _type', () => {
+    expect(
+      parseInlineObject({
+        inlineObject: {_type: 'stock-ticker'},
+        context: {
+          keyGenerator: createTestKeyGenerator(),
+          schema: compileSchema(
+            defineSchema({inlineObjects: [{name: 'stock-ticker'}]}),
+          ),
+        },
+        options: {validateFields: true},
+      }),
+    ).toEqual({
+      _key: 'k0',
+      _type: 'stock-ticker',
+    })
+  })
+
+  describe('looks like text node', () => {
+    test('known inline object _type', () => {
+      expect(
+        parseInlineObject({
+          inlineObject: {_type: 'stock-ticker', text: 'foo'},
+          context: {
+            keyGenerator: createTestKeyGenerator(),
+            schema: compileSchema(
+              defineSchema({inlineObjects: [{name: 'stock-ticker'}]}),
+            ),
+          },
+          options: {validateFields: true},
+        }),
+      ).toEqual({_key: 'k0', _type: 'stock-ticker'})
+    })
+
+    test('unknown inline object _type', () => {
+      expect(
+        parseInlineObject({
+          inlineObject: {_type: 'image', text: 'foo'},
+          context: {
+            keyGenerator: createTestKeyGenerator(),
+            schema: compileSchema(
+              defineSchema({inlineObjects: [{name: 'stock-ticker'}]}),
+            ),
+          },
+          options: {validateFields: true},
+        }),
+      ).toBe(undefined)
+    })
+  })
+
+  describe('custom props', () => {
+    describe('unknown prop', () => {
+      test('validateFields: true', () => {
+        expect(
+          parseInlineObject({
+            inlineObject: {_type: 'stock-ticker', foo: 'bar'},
+            context: {
+              keyGenerator: createTestKeyGenerator(),
+              schema: compileSchema(
+                defineSchema({
+                  inlineObjects: [{name: 'stock-ticker'}],
+                }),
+              ),
+            },
+            options: {validateFields: true},
+          }),
+        ).toEqual({
+          _key: 'k0',
+          _type: 'stock-ticker',
+        })
+      })
+
+      test('validateFields: false', () => {
+        expect(
+          parseInlineObject({
+            inlineObject: {_type: 'stock-ticker', foo: 'bar'},
+            context: {
+              keyGenerator: createTestKeyGenerator(),
+              schema: compileSchema(
+                defineSchema({
+                  inlineObjects: [{name: 'stock-ticker'}],
+                }),
+              ),
+            },
+            options: {validateFields: false},
+          }),
+        ).toEqual({
+          _key: 'k0',
+          _type: 'stock-ticker',
+          foo: 'bar',
+        })
+      })
+    })
+
+    describe('known prop', () => {
+      test('validateFields: true', () => {
+        expect(
+          parseInlineObject({
+            inlineObject: {_type: 'stock-ticker', foo: 'bar'},
+            context: {
+              keyGenerator: createTestKeyGenerator(),
+              schema: compileSchema(
+                defineSchema({
+                  inlineObjects: [
+                    {
+                      name: 'stock-ticker',
+                      fields: [{name: 'foo', type: 'string'}],
+                    },
+                  ],
+                }),
+              ),
+            },
+            options: {validateFields: true},
+          }),
+        ).toEqual({
+          _key: 'k0',
+          _type: 'stock-ticker',
+          foo: 'bar',
+        })
+      })
+    })
+
+    test('validateFields: false', () => {
+      expect(
+        parseInlineObject({
+          inlineObject: {_type: 'stock-ticker', foo: 'bar'},
+          context: {
+            keyGenerator: createTestKeyGenerator(),
+            schema: compileSchema(
+              defineSchema({
+                inlineObjects: [
+                  {
+                    name: 'stock-ticker',
+                    fields: [{name: 'foo', type: 'string'}],
+                  },
+                ],
+              }),
+            ),
+          },
+          options: {validateFields: false},
+        }),
+      ).toEqual({
+        _key: 'k0',
+        _type: 'stock-ticker',
+        foo: 'bar',
+      })
+    })
+  })
+})

package/src/utils/parse-blocks.ts

@@ -1,4 +1,4 @@
-import {isTextBlock} from '@portabletext/schema'
+import {isSpan, isTextBlock} from '@portabletext/schema'
 import type {
   PortableTextBlock,
   PortableTextListBlock,
@@ -9,7 +9,7 @@ import type {
 } from '@sanity/types'
 import type {EditorSchema} from '../editor/editor-schema'
 import type {EditorContext} from '../editor/editor-snapshot'
-import {isTypedObject} from './asserters'
+import {isRecord, isTypedObject} from './asserters'
 
 export function parseBlocks({
   context,
@@ -19,6 +19,7 @@ export function parseBlocks({
   context: Pick<EditorContext, 'keyGenerator' | 'schema'>
   blocks: unknown
   options: {
+    normalize: boolean
     removeUnusedMarkDefs: boolean
     validateFields: boolean
   }
@@ -42,6 +43,7 @@ export function parseBlock({
   context: Pick<EditorContext, 'keyGenerator' | 'schema'>
   block: unknown
   options: {
+    normalize: boolean
     removeUnusedMarkDefs: boolean
     validateFields: boolean
   }
@@ -102,6 +104,7 @@ export function parseTextBlock({
   block: unknown
   context: Pick<EditorContext, 'keyGenerator' | 'schema'>
   options: {
+    normalize: boolean
     removeUnusedMarkDefs: boolean
     validateFields: boolean
   }
@@ -186,29 +189,70 @@ export function parseTextBlock({
     ? block.children
     : []
 
-  const children = unparsedChildren
+  const parsedChildren = unparsedChildren
     .map(
       (child) =>
         parseSpan({span: child, context, markDefKeyMap, options}) ??
         parseInlineObject({inlineObject: child, context, options}),
     )
     .filter((child) => child !== undefined)
-  const marks = children.flatMap((child) => child.marks ?? [])
+  const marks = parsedChildren.flatMap((child) => child.marks ?? [])
+
+  const children =
+    parsedChildren.length > 0
+      ? parsedChildren
+      : [
+          {
+            _key: context.keyGenerator(),
+            _type: context.schema.span.name,
+            text: '',
+            marks: [],
+          },
+        ]
+
+  const normalizedChildren = options.normalize
+    ? // Ensure that inline objects re surrounded by spans
+      children.reduce<Array<PortableTextObject | PortableTextSpan>>(
+        (normalizedChildren, child, index) => {
+          if (isSpan(context, child)) {
+            return [...normalizedChildren, child]
+          }
+
+          const previousChild = normalizedChildren.at(-1)
+
+          if (!previousChild || !isSpan(context, previousChild)) {
+            return [
+              ...normalizedChildren,
+              {
+                _key: context.keyGenerator(),
+                _type: context.schema.span.name,
+                text: '',
+                marks: [],
+              },
+              child,
+              ...(index === children.length - 1
+                ? [
+                    {
+                      _key: context.keyGenerator(),
+                      _type: context.schema.span.name,
+                      text: '',
+                      marks: [],
+                    },
+                  ]
+                : []),
+            ]
+          }
+
+          return [...normalizedChildren, child]
+        },
+        [],
+      )
+    : children
 
   const parsedBlock: PortableTextTextBlock = {
     _type: context.schema.block.name,
     _key,
-    children:
-      children.length > 0
-        ? children
-        : [
-            {
-              _key: context.keyGenerator(),
-              _type: context.schema.span.name,
-              text: '',
-              marks: [],
-            },
-          ],
+    children: normalizedChildren,
     markDefs: options.removeUnusedMarkDefs
       ? markDefs.filter((markDef) => marks.includes(markDef._key))
       : markDefs,
@@ -255,7 +299,7 @@ export function parseSpan({
   markDefKeyMap: Map<string, string>
   options: {validateFields: boolean}
 }): PortableTextSpan | undefined {
-  if (!isTypedObject(span)) {
+  if (!isRecord(span)) {
     return undefined
   }
 
@@ -272,11 +316,6 @@ export function parseSpan({
     }
   }
 
-  // In reality, the span schema name is always 'span', but we only the check here anyway
-  if (span._type !== context.schema.span.name || span._type !== 'span') {
-    return undefined
-  }
-
   const unparsedMarks: Array<unknown> = Array.isArray(span.marks)
     ? span.marks
     : []
@@ -300,8 +339,28 @@ export function parseSpan({
     return []
   })
 
+  if (span._type !== context.schema.span.name) {
+    if (
+      !context.schema.inlineObjects.some(
+        (inlineObject) => inlineObject.name === span._type,
+      ) &&
+      typeof span.text === 'string'
+    ) {
+      return {
+        _type: context.schema.span.name as 'span',
+        _key:
+          typeof span._key === 'string' ? span._key : context.keyGenerator(),
+        text: span.text,
+        marks,
+        ...(options.validateFields ? {} : customFields),
+      }
+    }
+
+    return undefined
+  }
+
   return {
-    _type: 'span',
+    _type: context.schema.span.name as 'span',
     _key: typeof span._key === 'string' ? span._key : context.keyGenerator(),
     text: typeof span.text === 'string' ? span.text : '',
     marks,