How to change the nodeType returned from Fragment.cut()

Show
1

Hi,

I am trying to use prosemirror to show inserted and deleted contents by editor/s. To record all changes I have used prosemirror-changeset. Now I am writing a plugin to display these changes with decorations to clearly indicate the inserts and deletions.

Inserts appear to work fine. For deletes, I have the below piece of code:

          if (changeset.deleted) {
          // changeset.deleted.forEach(() => {
            
            const updated_doc = fbSchema.nodeFromJSON(JSON.parse(previous[1].doc))
            const fragment = updated_doc.content
            console.log('change_set 1', fragment)
            const toPosition = changeset.toA > fragment.size ? fragment.size : changeset.toA
            const slice = fragment.cut(changeset.fromA, toPosition)
            const doc_fragment = DOMSerializer.fromSchema(fbSchema).serializeFragment(slice)
            console.log('change_set 2', slice)

            let element = document.createElement("span");
            element.appendChild(doc_fragment);
  
  
            element.style.color = `${userColor}`
            element.style.textDecoration = `line-through`
            decorations.push(Decoration.widget(changeset.fromA, element))

          // })
        }

All looks almost ok, except that when i create a slice using Fragment.cut(), I get the fragment inside a paragraph node, which makes the text move to the next line. How can I avoid this?

2

Fragment.cut returns a Fragment without a node type. Are you sure you aren’t accidentally calling Node.cut?

3

Hi @marijn thanks for your reply.

From my understanding, this would return a node

const updated_doc = fbSchema.nodeFromJSON(JSON.parse(previous[1].doc))

But this would return a fragment
const fragment = updated_doc.content

Then i am trying to use fragment.cut(), which in turn should return a Fragment right? Somehow it returns a node ‘paragraph’

Furthermore, I have tried to use Node functions on ‘fragment’ variable, (e.g 'textContent'). And it throws an error “textContent” is not a function", further confirming that the variable ‘fragment’ is NOT a node?

Any thoughts?

4

I think what you’re seeing is a fragment containing a paragraph node.