How to combine multiple transactions

1

Hello, how do I combine multiple transactions into a single transaction that I can dispatch once?

This is the code I have that is running in a loop. Pos is the position of a node.

const newNode = node.type.create(node.attrs, node, node.marks)

newNode.attrs.style = cssStyles

 const frag = new Slice(Fragment.from(newNode), 0, 0)
                      
 tr.step(new ReplaceStep(pos, pos + node.nodeSize, frag))

cssStyles adds styling to the node. tr is a transaction. I would like to add multiple steps to the transaction and dispatch it only once. The problem is that the ReplaceStep seems to append to the node instead of replacing it. How do I replace the node?

2

This isn’t supported in ProseMirror—because they may include opaque metadata that describes exactly the changes that transaction makes, arbitrary transactions can’t be combined.

3

@marijn I appreciate how quickly you respond. Thank you.

Isn’t there a way to combine steps into a single transaction? I’m essentially trying to do what’s being done here: Combine Multiple transactions into one history step [SOLVED] - #3 by turigeza but I’m unsuccessful. What am I doing wrong?

4

It’s been so long ago : ) I can not contribute much sorry.

If you take the code I posted does that not work anymore ?

You need at least something like

let transaction = view.state.tr;

and

if(transaction.docChanged){
        view.dispatch(transaction);
}
5

Thanks for your response. No, I keep getting this error: TransformError: Gap is not a flat range I followed your code quite well but I keep getting that error.

I believe the gap is the part in bold

transaction.step( new ReplaceAroundStep(pos, pos + node.nodeSize, pos + 1, pos + node.nodeSize - 1, new Slice(Fragment.from(newNode), 0, 0), 1, true) ) https://prosemirror.net/docs/ref/#transform.ReplaceAroundStep