How to dispatch a transaction with function name followed by inserting brackets?

I would like to insert a function call like this one: abc(), but I cannot wrap my head around how to dispatch a transaction where I insert someFunc, then insert the () brackets.

Let’s say I have an empty document, and do this:

const state = view.state;
const tr = state.update(
  {
    changes: {
      from: 0,
      to: 0,
      insert: 'abc',
    },
    selection: EditorSelection.single(2),
  },
  insertBracket(state, bracketSuffix),
);
view.dispatch(tr);

The output I get from this turns out to be something like this on the document: abc( ). I also noticed that typing “)” right before “)” doesn’t actually skip the closing bracket. What am I missing?

Nevermind, it seems like there was another transaction happening somewhere else that was intervening with this one.