Issue with block content editor resolved by updating Sanity Studio

3 replies

Last updated: Jun 19, 2024

Hey all, ive noticed an issue with our block content editor, here is my schema for the editor

import {defineType} from 'sanity'

export default defineType({
  title: 'Content',
  name: 'richText',
  type: 'array',
  // All possible "Blocks" that a content editor can use
  options: {
    sortable: true,
  },
  of: [
    {
      type: 'block',
      styles: [
        {title: 'Normal', value: 'normal'},
        {title: 'Heading 2', value: 'h2'},
        {title: 'Heading 3', value: 'h3'},
        {title: 'Heading 4', value: 'h4'},
        {title: 'Heading 5', value: 'h5'},
      ],
    },
    {
      type: 'image',
      icon: () => '🖼️',
      options: {hotspot: true},
      fields: [
        {
          name: 'alt',
          type: 'string',
          title: 'Alternative text',
          description: 'Describe the image. Important for SEO and accessiblity.',
        },
        {
          name: 'wide',
          type: 'boolean',
          title: 'Wide Image?',
          description: 'Makes images wider than the text column.',
          initialValue: false,
        },
        {
          name: 'background',
          type: 'boolean',
          title: 'Add grey background?',
          description: 'Adds a grey background/border to the image.',
          initialValue: false,
        },
      ],
    },
    // Rest of my blocks
  ],
  validation: (Rule) => Rule.required(),
  group: 'content',
})

When i paste an image into the editor, i get the following error:

Could not validate the resulting portable text to insert. Editor value must be an array of Portable Text blocks, or undefined. Try to insert as plain text (shift-paste) instead.

Could someone help here? I know i can paste images in because it works in another studio i have, but the schema seems similar

AI Update

I can see you're hitting the "Could not validate the resulting portable text to insert" error when pasting images. Your schema looks correct, so let's troubleshoot this systematically.

Check Your Sanity Version First

The ability to paste images directly into the Portable Text Editor is a relatively recent feature. Before diving into other causes, check what version of Sanity you're running:

npm list sanity

If you're on an older version of Studio v3, updating might resolve the issue:

npm install sanity@latest

Then restart your dev server. The Portable Text Editor has received numerous improvements for paste and drag-and-drop functionality in recent releases, and older versions may not properly handle pasted image content.

Your Schema Looks Correct

Based on the Portable Text documentation and Block Content guide, your schema structure is valid. The image block definition with custom fields (alt, wide, background) follows the standard pattern for custom blocks in the of array. The fact that a similar schema works in your other studio confirms this approach is sound.

Other Things to Check

Compare with your working studio:

The exact Sanity version numbers (minor versions can matter)
Any plugins in the plugins array of sanity.config.ts that might affect the editor
Whether there are any custom components or configuration on the array field itself
Asset source configuration that might restrict uploads

Browser and environment:

Try copying the image from a different source
Test in a different browser
Check the browser console for additional error messages beyond the validation error
Verify clipboard permissions aren't being blocked

Schema validation:

Make sure there are no conflicting schema definitions for richText or image types elsewhere
Verify the schema compiles without errors (sanity schema extract)

Workarounds While Troubleshooting

While you investigate, you can still add images using:

The "+" button or toolbar in the editor to insert images through the UI
Drag and drop image files directly into the editor (this uses a different code path than paste)
The image button if you've configured one in your editor toolbar

The validation error suggests the editor is receiving the pasted content but rejecting it during the validation phase. This is most commonly caused by version differences - the paste handling code has evolved significantly across Studio v3 releases. Since you have a working studio with similar schema, comparing the exact package versions between the two projects would be my first debugging step.

👋 What version of the Studio are you running?

Its v3 🙂 Specifically 3.31.0

Have updated it and it seems to now work 🤔

Sanity – Build the way you think, not the way your CMS thinks

Sanity is the developer-first content operating system that gives you complete control. Schema-as-code, GROQ queries, and real-time APIs mean no more workarounds or waiting for deployments. Free to start, scale as you grow.

Get started for free Explore the demo