ianstormtaylor/slate · error · Error

A HyperscriptPointRef must be passed as the ref prop of a <p

Error message

A HyperscriptPointRef must be passed as the ref prop of a <point /> tag that is used inside an <editor>.

What it means

In slate-hyperscript, a <point ref={...}/> tag's ref only accumulates a path and offset when the tag is used inside an <editor> element. When the tag is used outside an <editor> (e.g., inside a plain <value>, <fragment>, or <text> tag), the ref never receives a path/offset, and calling .point() on the ref throws this error. The library throws it because a Point requires both a path and an offset, and neither can be inferred outside of an editor's tree context.

Source

Thrown at packages/slate-hyperscript/src/refs.ts:16

import { Path, Point, Range } from 'slate'

/**
 * Hyperscript point refs can be used to construct arbitrary points using the
 * ref prop of a <point /> tag.
 */

export class HyperscriptPointRef {
  path?: Path
  offset?: number

  point(): Point {
    const { path, offset } = this

    if (path == null || offset == null) {
      throw new Error(
        'A HyperscriptPointRef must be passed as the ref prop of a <point /> tag that is used inside an <editor>.'
      )
    }

    return { path, offset }
  }
}

/**
 * Hyperscript range refs can be used to construct arbitrary range using the ref
 * props of <anchor /> and <focus /> tags.
 */

export class HyperscriptRangeRef {
  anchor?: Point
  focus?: Point

  range(): Range {

View on GitHub (pinned to 72a37c701e)

Solutions

1. Move the <point ref={p}/> tag inside an <editor>...</editor> tag so it gets a path and offset assigned
2. Ensure 'editor' is included in the elements option of createHyperscript (it is part of the default set)
3. If you only need a path/offset outside an editor, pass explicit path/offset props or construct the Point object manually instead of using a ref

Example fix

// before
const fragment = (
  <fragment>
    <point ref={start} />
    <text>hello</text>
  </fragment>
)
const p = start.current.point() // throws

// after
const value = (
  <editor>
    <point ref={start} />
    <text>hello</text>
  </editor>
)
const p = start.current.point() // works

if (start.current?.path != null && start.current?.offset != null) {
  const p = start.current.point()
}

const hasPoint = (r) =>
  r != null && r.path != null && r.offset != null

When it happens

Trigger: Creating a hyperscript tag creator without registering 'editor' among elements (e.g. createHyperscript({ elements: { point: ... } }) without editor), placing <point ref={p}/> inside <fragment> or <element> instead of <editor>, or calling p.current.point() on a ref that was never rendered inside an editor.

Common situations: Test files that build standalone fragments with points in them; upgrading slate-hyperscript where the default elements set changed; forgetting that the ref's point() only works post-render inside an editor.

Related errors

• A HyperscriptRangeRef must be passed as the ref prop of an <
• A HyperscriptRangeRef must be passed as the ref prop of a <f
• The ref prop of a token cannot be used with the path prop.
• Unexpected hyperscript child object: ${child}
• No hyperscript creator found for tag: <${tagName}>

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