Is there any way to simulate beforeinput for tests?

1

Or otherwise what’s the best approach to testing a function that relies on reacting to beforeinput events?

2

You can make browsers fire events with dispatchEvent. But because editing actions produce a whole series of events, and such simulated events don’t cause the browser’s default behavior for the event, accurately simulating such situations entirely in tests remains difficult.

3

Thanks for your reply and great work @marijn.

Sorry, I should have mentioned, I already tried a number of approaches including dispatchEvent but nothing seemed to work. I understand it may be difficult to properly simulate all of the events that a normal keyboard input may produce, but I couldn’t even get the beforeinput part alone to fire. I tried a number of approaches similar to this and I wonder where I’m going wrong?

function triggerBeforeInput(editor, data) {
  const { view } = editor;
  const attributes = {
    data,
    bubbles: true,
    cancelable: true,
  };

  const event = new window.KeyboardEvent('beforeinput', attributes);

  view.dom.dispatchEvent(event);

  if (event.defaultPrevented) {
    console.log('Prevented'); // Never fires
  } else {
    editor.commands.insertText(data); // So we always end up using the fallback
  }
}

And all events just end up inserted via insertText is there some more robust approach we could use? Or am I doing things entirely incorrectly?