@portabletext/editor 1.0.19 → 1.1.1

package/src/editor/__tests__/PortableTextEditor.test.tsx

@@ -1,10 +1,8 @@
 import {describe, expect, it, jest} from '@jest/globals'
-/* eslint-disable no-irregular-whitespace */
-import {type PortableTextBlock} from '@sanity/types'
+import type {PortableTextBlock} from '@sanity/types'
 import {render, waitFor} from '@testing-library/react'
 import {createRef, type RefObject} from 'react'
-
-import {type EditorSelection} from '../..'
+import type {EditorSelection} from '../..'
 import {PortableTextEditor} from '../PortableTextEditor'
 import {PortableTextEditorTester, schemaType} from './PortableTextEditorTester'
 
@@ -102,10 +100,15 @@ describe('initialization', () => {
     )
     const normalizedEditorValue = [{...initialValue[0], style: 'normal'}]
     await waitFor(() => {
-      expect(onChange).toHaveBeenCalledWith({type: 'value', value: initialValue})
+      expect(onChange).toHaveBeenCalledWith({
+        type: 'value',
+        value: initialValue,
+      })
     })
     if (editorRef.current) {
-      expect(PortableTextEditor.getValue(editorRef.current)).toStrictEqual(normalizedEditorValue)
+      expect(PortableTextEditor.getValue(editorRef.current)).toStrictEqual(
+        normalizedEditorValue,
+      )
     }
   })
 
@@ -130,7 +133,10 @@ describe('initialization', () => {
 
     await waitFor(() => {
       if (editorRef.current) {
-        expect(onChange).toHaveBeenCalledWith({type: 'value', value: initialValue})
+        expect(onChange).toHaveBeenCalledWith({
+          type: 'value',
+          value: initialValue,
+        })
         expect(onChange).toHaveBeenCalledWith({type: 'ready'})
       }
     })
@@ -138,7 +144,9 @@ describe('initialization', () => {
     await waitFor(() => {
       if (editorRef.current) {
         PortableTextEditor.focus(editorRef.current)
-        expect(PortableTextEditor.getSelection(editorRef.current)).toStrictEqual(initialSelection)
+        expect(
+          PortableTextEditor.getSelection(editorRef.current),
+        ).toStrictEqual(initialSelection)
       }
     })
   })
@@ -169,7 +177,10 @@ describe('initialization', () => {
 
     await waitFor(() => {
       if (editorRef.current) {
-        expect(onChange).toHaveBeenCalledWith({type: 'value', value: initialValue})
+        expect(onChange).toHaveBeenCalledWith({
+          type: 'value',
+          value: initialValue,
+        })
         expect(onChange).toHaveBeenCalledWith({type: 'ready'})
       }
     })
@@ -181,7 +192,9 @@ describe('initialization', () => {
 
         // Test for object equality here!
         const anotherSel = PortableTextEditor.getSelection(editorRef.current)
-        expect(PortableTextEditor.getSelection(editorRef.current)).toStrictEqual(initialSelection)
+        expect(
+          PortableTextEditor.getSelection(editorRef.current),
+        ).toStrictEqual(initialSelection)
         expect(sel).toBe(anotherSel)
       }
     })
@@ -196,7 +209,9 @@ describe('initialization', () => {
     )
     waitFor(() => {
       if (editorRef.current) {
-        expect(PortableTextEditor.getSelection(editorRef.current)).toEqual(newSelection)
+        expect(PortableTextEditor.getSelection(editorRef.current)).toEqual(
+          newSelection,
+        )
       }
     })
   })
@@ -225,7 +240,8 @@ describe('initialization', () => {
           value: initialValue,
           resolution: {
             action: 'Unset the value',
-            description: 'Editor value must be an array of Portable Text blocks, or undefined.',
+            description:
+              'Editor value must be an array of Portable Text blocks, or undefined.',
             item: initialValue,
             patches: [
               {
@@ -235,7 +251,10 @@ describe('initialization', () => {
             ],
           },
         })
-        expect(onChange).toHaveBeenCalledWith({type: 'value', value: initialValue})
+        expect(onChange).toHaveBeenCalledWith({
+          type: 'value',
+          value: initialValue,
+        })
         expect(onChange).toHaveBeenCalledWith({type: 'ready'})
       }
     })
@@ -267,7 +286,8 @@ describe('initialization', () => {
         value,
         resolution: {
           action: 'Unset the value',
-          description: 'Editor value must be an array of Portable Text blocks, or undefined.',
+          description:
+            'Editor value must be an array of Portable Text blocks, or undefined.',
           item: value,
           patches: [
             {
@@ -306,7 +326,8 @@ describe('initialization', () => {
           ],
           i18n: {
             action: 'inputs.portable-text.invalid-value.disallowed-type.action',
-            description: 'inputs.portable-text.invalid-value.disallowed-type.description',
+            description:
+              'inputs.portable-text.invalid-value.disallowed-type.description',
             values: {
               key: '123',
               typeName: 'banana',
@@ -351,8 +372,10 @@ describe('initialization', () => {
             description:
               "Child with _key 'def' in block with key 'abc' has missing or invalid text property!",
             i18n: {
-              action: 'inputs.portable-text.invalid-value.invalid-span-text.action',
-              description: 'inputs.portable-text.invalid-value.invalid-span-text.description',
+              action:
+                'inputs.portable-text.invalid-value.invalid-span-text.action',
+              description:
+                'inputs.portable-text.invalid-value.invalid-span-text.description',
               values: {
                 key: 'abc',
                 childKey: 'def',
@@ -394,7 +417,10 @@ describe('initialization', () => {
         })
       }
     })
-    expect(onChange).not.toHaveBeenCalledWith({type: 'value', value: initialValue})
+    expect(onChange).not.toHaveBeenCalledWith({
+      type: 'value',
+      value: initialValue,
+    })
     expect(onChange).toHaveBeenCalledWith({type: 'ready'})
   })
 })

package/src/editor/__tests__/PortableTextEditorTester.tsx

@@ -1,12 +1,17 @@
 import {jest} from '@jest/globals'
 import {Schema} from '@sanity/schema'
 import {defineArrayMember, defineField} from '@sanity/types'
-import {type ForwardedRef, forwardRef, useCallback, useEffect, useMemo} from 'react'
-
+import {
+  forwardRef,
+  useCallback,
+  useEffect,
+  useMemo,
+  type ForwardedRef,
+} from 'react'
 import {
   PortableTextEditable,
-  type PortableTextEditableProps,
   PortableTextEditor,
+  type PortableTextEditableProps,
   type PortableTextEditorProps,
 } from '../../index'
 
@@ -74,42 +79,49 @@ const schema = Schema.compile({
 
 let key = 0
 
-export const PortableTextEditorTester = forwardRef(function PortableTextEditorTester(
-  props: Partial<Omit<PortableTextEditorProps, 'type' | 'onChange' | 'value'>> & {
-    onChange?: PortableTextEditorProps['onChange']
-    rangeDecorations?: PortableTextEditableProps['rangeDecorations']
-    renderPlaceholder?: PortableTextEditableProps['renderPlaceholder']
-    schemaType: PortableTextEditorProps['schemaType']
-    selection?: PortableTextEditableProps['selection']
-    value?: PortableTextEditorProps['value']
+export const PortableTextEditorTester = forwardRef(
+  function PortableTextEditorTester(
+    props: Partial<
+      Omit<PortableTextEditorProps, 'type' | 'onChange' | 'value'>
+    > & {
+      onChange?: PortableTextEditorProps['onChange']
+      rangeDecorations?: PortableTextEditableProps['rangeDecorations']
+      renderPlaceholder?: PortableTextEditableProps['renderPlaceholder']
+      schemaType: PortableTextEditorProps['schemaType']
+      selection?: PortableTextEditableProps['selection']
+      value?: PortableTextEditorProps['value']
+    },
+    ref: ForwardedRef<PortableTextEditor>,
+  ) {
+    useEffect(() => {
+      key = 0
+    }, [])
+    const _keyGenerator = useCallback(() => {
+      key++
+      return `${key}`
+    }, [])
+    const onChange = useMemo(
+      () => props.onChange || jest.fn(),
+      [props.onChange],
+    )
+    return (
+      <PortableTextEditor
+        schemaType={props.schemaType}
+        onChange={onChange}
+        value={props.value || undefined}
+        keyGenerator={_keyGenerator}
+        ref={ref}
+      >
+        <PortableTextEditable
+          selection={props.selection || undefined}
+          rangeDecorations={props.rangeDecorations}
+          renderPlaceholder={props.renderPlaceholder}
+          aria-describedby="desc_foo"
+        />
+      </PortableTextEditor>
+    )
   },
-  ref: ForwardedRef<PortableTextEditor>,
-) {
-  useEffect(() => {
-    key = 0
-  }, [])
-  const _keyGenerator = useCallback(() => {
-    key++
-    return `${key}`
-  }, [])
-  const onChange = useMemo(() => props.onChange || jest.fn(), [props.onChange])
-  return (
-    <PortableTextEditor
-      schemaType={props.schemaType}
-      onChange={onChange}
-      value={props.value || undefined}
-      keyGenerator={_keyGenerator}
-      ref={ref}
-    >
-      <PortableTextEditable
-        selection={props.selection || undefined}
-        rangeDecorations={props.rangeDecorations}
-        renderPlaceholder={props.renderPlaceholder}
-        aria-describedby="desc_foo"
-      />
-    </PortableTextEditor>
-  )
-})
+)
 
 export const schemaType = schema.get('body')
 

package/src/editor/__tests__/RangeDecorations.test.tsx

@@ -1,11 +1,9 @@
 import {describe, expect, it, jest} from '@jest/globals'
-/* eslint-disable no-irregular-whitespace */
-import {type PortableTextBlock} from '@sanity/types'
+import type {PortableTextBlock} from '@sanity/types'
 import {render, waitFor} from '@testing-library/react'
 import {createRef, type ReactNode, type RefObject} from 'react'
-
-import {type RangeDecoration} from '../..'
-import {type PortableTextEditor} from '../PortableTextEditor'
+import type {RangeDecoration} from '../..'
+import type {PortableTextEditor} from '../PortableTextEditor'
 import {PortableTextEditorTester, schemaType} from './PortableTextEditorTester'
 
 const helloBlock: PortableTextBlock = {
@@ -23,7 +21,7 @@ const RangeDecorationTestComponent = ({children}: {children?: ReactNode}) => {
 }
 
 describe('RangeDecorations', () => {
-  it.only('only render range decorations as necessary', async () => {
+  it('only render range decorations as necessary', async () => {
     const editorRef: RefObject<PortableTextEditor> = createRef()
     const onChange = jest.fn()
     const value = [helloBlock]

package/src/editor/__tests__/handleClick.test.tsx

@@ -1,7 +1,6 @@
 import {describe, expect, it, jest} from '@jest/globals'
 import {fireEvent, render, waitFor} from '@testing-library/react'
 import {createRef, type RefObject} from 'react'
-
 import {PortableTextEditor} from '../PortableTextEditor'
 import {PortableTextEditorTester, schemaType} from './PortableTextEditorTester'
 import {getEditableElement} from './utils'
@@ -47,7 +46,10 @@ describe('adds empty text block if its needed', () => {
 
     await waitFor(() => {
       if (editorRef.current) {
-        expect(onChange).toHaveBeenCalledWith({type: 'value', value: initialValue})
+        expect(onChange).toHaveBeenCalledWith({
+          type: 'value',
+          value: initialValue,
+        })
         expect(onChange).toHaveBeenCalledWith({type: 'ready'})
       }
     })
@@ -59,7 +61,10 @@ describe('adds empty text block if its needed', () => {
         PortableTextEditor.focus(editorRef.current)
         PortableTextEditor.select(editorRef.current, initialSelection)
         fireEvent.click(element)
-        expect(PortableTextEditor.getValue(editorRef.current)).toEqual([initialValue[0], newBlock])
+        expect(PortableTextEditor.getValue(editorRef.current)).toEqual([
+          initialValue[0],
+          newBlock,
+        ])
       }
     })
   })
@@ -107,7 +112,9 @@ describe('adds empty text block if its needed', () => {
         PortableTextEditor.focus(editorRef.current)
         PortableTextEditor.select(editorRef.current, initialSelection)
         fireEvent.click(element)
-        expect(PortableTextEditor.getValue(editorRef.current)).toEqual(initialValue)
+        expect(PortableTextEditor.getValue(editorRef.current)).toEqual(
+          initialValue,
+        )
       }
     })
   })
@@ -156,7 +163,10 @@ describe('adds empty text block if its needed', () => {
 
     await waitFor(() => {
       if (editorRef.current) {
-        expect(onChange).toHaveBeenCalledWith({type: 'value', value: initialValue})
+        expect(onChange).toHaveBeenCalledWith({
+          type: 'value',
+          value: initialValue,
+        })
         expect(onChange).toHaveBeenCalledWith({type: 'ready'})
       }
     })
@@ -168,7 +178,9 @@ describe('adds empty text block if its needed', () => {
         PortableTextEditor.focus(editorRef.current)
         PortableTextEditor.select(editorRef.current, initialSelection)
         fireEvent.click(element)
-        expect(PortableTextEditor.getValue(editorRef.current)).toEqual(initialValue)
+        expect(PortableTextEditor.getValue(editorRef.current)).toEqual(
+          initialValue,
+        )
       }
     })
   })
@@ -217,7 +229,10 @@ describe('adds empty text block if its needed', () => {
 
     await waitFor(() => {
       if (editorRef.current) {
-        expect(onChange).toHaveBeenCalledWith({type: 'value', value: initialValue})
+        expect(onChange).toHaveBeenCalledWith({
+          type: 'value',
+          value: initialValue,
+        })
         expect(onChange).toHaveBeenCalledWith({type: 'ready'})
       }
     })
@@ -225,13 +240,17 @@ describe('adds empty text block if its needed', () => {
     const element = await getEditableElement(component)
 
     const editor = editorRef.current
-    const inlineType = editor?.schemaTypes.inlineObjects.find((t) => t.name === 'someObject')
+    const inlineType = editor?.schemaTypes.inlineObjects.find(
+      (t) => t.name === 'someObject',
+    )
     await waitFor(async () => {
       if (editor && inlineType && element) {
         PortableTextEditor.focus(editor)
         PortableTextEditor.select(editor, initialSelection)
         fireEvent.click(element)
-        expect(PortableTextEditor.getValue(editor)).toEqual(initialValue.concat(newBlock))
+        expect(PortableTextEditor.getValue(editor)).toEqual(
+          initialValue.concat(newBlock),
+        )
       }
     })
   })

package/src/editor/__tests__/insert-block.test.tsx

@@ -1,16 +1,19 @@
 import {describe, expect, jest, test} from '@jest/globals'
 import {Schema} from '@sanity/schema'
-import {type PortableTextBlock} from '@sanity/types'
+import type {PortableTextBlock} from '@sanity/types'
 import {render, waitFor} from '@testing-library/react'
 import {createRef, type RefObject} from 'react'
-
-import {type EditorChange, type EditorSelection} from '../../types/editor'
+import type {EditorChange, EditorSelection} from '../../types/editor'
 import {PortableTextEditable} from '../Editable'
 import {PortableTextEditor} from '../PortableTextEditor'
 
 const schema = Schema.compile({
   types: [
-    {name: 'portable-text', type: 'array', of: [{type: 'block'}, {type: 'image'}]},
+    {
+      name: 'portable-text',
+      type: 'array',
+      of: [{type: 'block'}, {type: 'image'}],
+    },
     {name: 'image', type: 'object'},
   ],
 }).get('portable-text')
@@ -49,7 +52,10 @@ describe(PortableTextEditor.insertBlock.name, () => {
     // Given an empty text block
     await waitFor(() => {
       if (editorRef.current) {
-        expect(onChange).toHaveBeenCalledWith({type: 'value', value: initialValue})
+        expect(onChange).toHaveBeenCalledWith({
+          type: 'value',
+          value: initialValue,
+        })
         expect(onChange).toHaveBeenCalledWith({type: 'ready'})
       }
     })
@@ -94,6 +100,7 @@ describe(PortableTextEditor.insertBlock.name, () => {
           marks: [],
         },
       ],
+      markDefs: [],
       style: 'normal',
     }
     const initialValue: Array<PortableTextBlock> = [nonEmptyTextBlock]
@@ -114,7 +121,10 @@ describe(PortableTextEditor.insertBlock.name, () => {
     // Given an non-empty text block
     await waitFor(() => {
       if (editorRef.current) {
-        expect(onChange).toHaveBeenCalledWith({type: 'value', value: initialValue})
+        expect(onChange).toHaveBeenCalledWith({
+          type: 'value',
+          value: initialValue,
+        })
         expect(onChange).toHaveBeenCalledWith({type: 'ready'})
       }
     })
@@ -184,7 +194,10 @@ describe(PortableTextEditor.insertBlock.name, () => {
     // Given an empty text block followed by an image
     await waitFor(() => {
       if (editorRef.current) {
-        expect(onChange).toHaveBeenCalledWith({type: 'value', value: initialValue})
+        expect(onChange).toHaveBeenCalledWith({
+          type: 'value',
+          value: initialValue,
+        })
         expect(onChange).toHaveBeenCalledWith({type: 'ready'})
       }
     })
@@ -202,7 +215,10 @@ describe(PortableTextEditor.insertBlock.name, () => {
     })
     await waitFor(() => {
       if (editorRef.current) {
-        expect(onChange).toHaveBeenCalledWith({type: 'selection', selection: initialSelection})
+        expect(onChange).toHaveBeenCalledWith({
+          type: 'selection',
+          selection: initialSelection,
+        })
       }
     })
 

package/src/editor/__tests__/pteWarningsSelfSolving.test.tsx

@@ -1,8 +1,7 @@
 import {describe, expect, it, jest} from '@jest/globals'
-import {type PortableTextBlock} from '@sanity/types'
+import type {PortableTextBlock} from '@sanity/types'
 import {render, waitFor} from '@testing-library/react'
 import {createRef, type RefObject} from 'react'
-
 import {PortableTextEditor} from '../PortableTextEditor'
 import {PortableTextEditorTester, schemaType} from './PortableTextEditorTester'
 
@@ -35,7 +34,10 @@ describe('when PTE would display warnings, instead it self solves', () => {
       />,
     )
     await waitFor(() => {
-      expect(onChange).toHaveBeenCalledWith({type: 'value', value: initialValue})
+      expect(onChange).toHaveBeenCalledWith({
+        type: 'value',
+        value: initialValue,
+      })
       expect(onChange).toHaveBeenCalledWith({type: 'ready'})
     })
     await waitFor(() => {
@@ -60,7 +62,7 @@ describe('when PTE would display warnings, instead it self solves', () => {
     })
   })
 
-  it('allows missing .markDefs', async () => {
+  it('self-solves missing .markDefs', async () => {
     const editorRef: RefObject<PortableTextEditor> = createRef()
     const initialValue = [
       {
@@ -88,7 +90,10 @@ describe('when PTE would display warnings, instead it self solves', () => {
       />,
     )
     await waitFor(() => {
-      expect(onChange).toHaveBeenCalledWith({type: 'value', value: initialValue})
+      expect(onChange).toHaveBeenCalledWith({
+        type: 'value',
+        value: initialValue,
+      })
       expect(onChange).toHaveBeenCalledWith({type: 'ready'})
     })
     await waitFor(() => {
@@ -106,6 +111,7 @@ describe('when PTE would display warnings, instead it self solves', () => {
                 marks: [],
               },
             ],
+            markDefs: [],
             style: 'normal',
           },
         ])
@@ -141,7 +147,10 @@ describe('when PTE would display warnings, instead it self solves', () => {
       />,
     )
     await waitFor(() => {
-      expect(onChange).toHaveBeenCalledWith({type: 'value', value: initialValue})
+      expect(onChange).toHaveBeenCalledWith({
+        type: 'value',
+        value: initialValue,
+      })
       expect(onChange).toHaveBeenCalledWith({type: 'ready'})
     })
     await waitFor(() => {
@@ -210,7 +219,10 @@ describe('when PTE would display warnings, instead it self solves', () => {
       />,
     )
     await waitFor(() => {
-      expect(onChange).toHaveBeenCalledWith({type: 'value', value: initialValue})
+      expect(onChange).toHaveBeenCalledWith({
+        type: 'value',
+        value: initialValue,
+      })
       expect(onChange).toHaveBeenCalledWith({type: 'ready'})
     })
     await waitFor(() => {
@@ -271,7 +283,10 @@ describe('when PTE would display warnings, instead it self solves', () => {
       />,
     )
     await waitFor(() => {
-      expect(onChange).toHaveBeenCalledWith({type: 'value', value: initialValue})
+      expect(onChange).toHaveBeenCalledWith({
+        type: 'value',
+        value: initialValue,
+      })
       expect(onChange).toHaveBeenCalledWith({type: 'ready'})
     })
     await waitFor(() => {
@@ -297,59 +312,6 @@ describe('when PTE would display warnings, instead it self solves', () => {
     })
   })
 
-  it('allows missing .markDefs', async () => {
-    const editorRef: RefObject<PortableTextEditor> = createRef()
-    const initialValue = [
-      {
-        _key: 'abc',
-        _type: 'myTestBlockType',
-        children: [
-          {
-            _key: 'def',
-            _type: 'span',
-            marks: [],
-            text: 'No markDefs',
-          },
-        ],
-        style: 'normal',
-      },
-    ]
-
-    const onChange = jest.fn()
-    render(
-      <PortableTextEditorTester
-        onChange={onChange}
-        ref={editorRef}
-        schemaType={schemaType}
-        value={initialValue}
-      />,
-    )
-    await waitFor(() => {
-      expect(onChange).toHaveBeenCalledWith({type: 'value', value: initialValue})
-      expect(onChange).toHaveBeenCalledWith({type: 'ready'})
-    })
-    await waitFor(() => {
-      if (editorRef.current) {
-        PortableTextEditor.focus(editorRef.current)
-        expect(PortableTextEditor.getValue(editorRef.current)).toEqual([
-          {
-            _key: 'abc',
-            _type: 'myTestBlockType',
-            children: [
-              {
-                _key: 'def',
-                _type: 'span',
-                text: 'No markDefs',
-                marks: [],
-              },
-            ],
-            style: 'normal',
-          },
-        ])
-      }
-    })
-  })
-
   it('allows empty array of blocks', async () => {
     const editorRef: RefObject<PortableTextEditor> = createRef()
     const initialValue = [] as PortableTextBlock[]
@@ -364,7 +326,10 @@ describe('when PTE would display warnings, instead it self solves', () => {
       />,
     )
     await waitFor(() => {
-      expect(onChange).toHaveBeenCalledWith({type: 'value', value: initialValue})
+      expect(onChange).toHaveBeenCalledWith({
+        type: 'value',
+        value: initialValue,
+      })
       expect(onChange).toHaveBeenCalledWith({type: 'ready'})
     })
     await waitFor(() => {
@@ -382,7 +347,10 @@ describe('when PTE would display warnings, instead it self solves', () => {
       }
     })
     await waitFor(() => {
-      expect(onChange).toHaveBeenCalledWith({type: 'value', value: initialValue})
+      expect(onChange).toHaveBeenCalledWith({
+        type: 'value',
+        value: initialValue,
+      })
       expect(onChange).toHaveBeenCalledWith({type: 'ready'})
     })
   })

package/src/editor/__tests__/utils.ts

@@ -3,7 +3,10 @@ import {fireEvent, type render} from '@testing-library/react'
 import {parseHotkey} from 'is-hotkey-esm'
 import {act} from 'react'
 
-export async function triggerKeyboardEvent(hotkey: string, element: Element): Promise<void> {
+export async function triggerKeyboardEvent(
+  hotkey: string,
+  element: Element,
+): Promise<void> {
   const eventProps = parseHotkey(hotkey)
   const values = hotkey.split('+')
 
@@ -19,9 +22,13 @@ export async function triggerKeyboardEvent(hotkey: string, element: Element): Pr
   )
 }
 
-export async function getEditableElement(component: ReturnType<typeof render>): Promise<Element> {
+export async function getEditableElement(
+  component: ReturnType<typeof render>,
+): Promise<Element> {
   await act(async () => component)
-  const element = component.container.querySelector('[data-slate-editor="true"]')
+  const element = component.container.querySelector(
+    '[data-slate-editor="true"]',
+  )
   if (!element) {
     throw new Error('Could not find element')
   }
@@ -31,7 +38,6 @@ export async function getEditableElement(component: ReturnType<typeof render>):
    *
    * https://github.com/jsdom/jsdom/issues/1670
    */
-  // eslint-disable-next-line @typescript-eslint/ban-ts-comment
   // @ts-ignore
   element.isContentEditable = true
   return element