RangeError: Selection passed to setSelection must point at the current document

1

Hello,

I started to get this RangeError on calling setSelection.

Context

So far, we have been using the prosemirror to edit and render the content page on its own page / document. We have been experimenting with GatsbyJS lately and we made a component out of our application and started to render the content as a blog on a different page which has its own header and footer.

Problem

Our content is appearing as expected, but, it is throwing this error when setSelection is called as shown below:

 let foo = this.view.state.tr
.setNodeMarkup(this.getPos(), null, {
  condition: 'open',
  value: this.node.attrs.value,
  id: this.fieldID
})

console.log("foo.doc is: ", foo.doc)
console.log("from doc is:", nodeSelection.$from.doc)

if(foo.doc == nodeSelection.$from.doc) {
  console.log("These two are the same.")
}
else{
  console.log("These two are different.")
}

let bar = foo.setSelection(nodeSelection)

I am seeing a console message that These two are different, although the content of the doc seems to be the same, especially the attrs.

And I get the error at setSelection – Uncaught RangeError: Selection passed to setSelection must point at the current document.

I am reading the docs on Step. Do I need to apply a transform.steps here? Since the content of these two docs is the same, I am not sure what or how to call steps.

I have so many instances of these in the application and I am trying to figure out a way to handle these errors. Could anyone suggest a way out, please? Thanks a lot!

1 Like
2

You made a change in the transaction, which means that the new document is definitely different (documents are immutable, so you never keep the same document object after a change). When setting the selection, create the selection for the current document in the transaction.

2 Likes
3

Thank you for the response. I was able to get this working as per your suggestion. Here’s my updated code:

    let saveThisPos = this.getPos()
    let foo = this.view.state.tr
            .setNodeMarkup(this.getPos(), null, {
              ...
            }) 
    let resolvedPos = foo.doc.resolve(saveThisPos)
    let nodeSelection = new NodeSelection(resolvedPos)
    foo = foo.setSelection(nodeSelection)
    this.view.dispatch(foo)
3 Likes