ianstormtaylor/slate · error · Error

The `useEditor` hook must be used inside the <Slate> compone

Error message

The `useEditor` hook must be used inside the <Slate> component's context.

What it means

useEditor() requires the React context provided by <Slate>. Calling it in a component rendered outside a <Slate> provider yields a null context, and the hook throws to surface the mistake early instead of returning undefined and crashing later.

Source

Thrown at packages/slate-react/src/hooks/use-editor.tsx:14

import { useContext } from 'react'

import { EditorContext } from './use-slate-static'

/**
 * Get the current editor object from the React context.
 * @deprecated Use useSlateStatic instead.
 */

export const useEditor = () => {
  const editor = useContext(EditorContext)

  if (!editor) {
    throw new Error(
      `The \`useEditor\` hook must be used inside the <Slate> component's context.`
    )
  }

  return editor
}

View on GitHub (pinned to 72a37c701e)

Solutions

  1. Move the component inside the <Slate>...</Slate> subtree
  2. In tests, wrap rendered components in a <Slate editor={editor} initialValue={...}> helper
  3. For portals, wrap portal content in the same context provider or use a custom render target inside the tree

Example fix

// before
function Toolbar(){ const editor = useEditor(); ... }
render(<Toolbar/>) // no provider

// after
render(
  <Slate editor={editor} initialValue={initialValue}>
    <Toolbar/>
  </Slate>
)
Defensive patterns

Strategy: validation

Validate before calling

// render helper
function renderWithSlate(ui) {
  const editor = withReact(createEditor())
  return render(<Slate editor={editor} initialValue={[{type:'paragraph',children:[{text:''}]}]}>{ui}</Slate>)
}

Prevention

When it happens

Trigger: Calling useEditor() (or a component that uses it) outside of <Slate>...</Slate>; rendering editor-dependent components as siblings rather than children of <Slate>; testing components with render() but no Slate wrapper; portals rendered outside the provider tree.

Common situations: Component trees reorganized so a leaf ends up outside <Slate>; unit tests (Jest/RTL) rendering leaves without the provider; portals to document.body escaping the context.

Related errors


AI-assisted analysis of ianstormtaylor/slate@72a37c701e (2026-08-27). Data as JSON: /api/errors/bf520c2d1e482392. Report an issue: GitHub.