Error when updating content on paste

Hi,

I’m trying to replace a selection with a custom value on paste.
But I’m getting the following error

Trying to update state with a transaction that doesn't start from the previous state.

Here’s a code to replicate my problem

Isn’t view.dispatch({ changes: ...}) the correct way for updating content ?

Any idea of

Regards

You are calling replace from your change filter. Those should definitely not have side effects—they are called as part of creating a transaction. By dispatching another transaction as a transaction is being built up, you are moving the view forward before that first transaction is applied, causing this error.

Thank you for your answer.

I had to replace the changeFilter with a transactionFilter.
I was using the changeFilter because I wanted to replicate the beforeChange
event and this comment says this is the way to go.

    EditorState.transactionFilter.of((tr) => {
      if (tr.isUserEvent('input.paste')) {
        const ranges = tr.startState.selection.ranges[0]
        return [{
          changes: {
           from: ranges.from, to: ranges.to, insert: 'XXXXX'}
          }]
      }
      return tr
    }),

Is this a correct way to do this?

Regards

Breaking paste like this sounds like a rather bad idea, and you might also be able to just handle the browser’s "paste" event, but other than that this looks like it would work.

1 Like