Enhance .trigger() command to emit KeyboardEvent rather than the generic Event

[toyopilgrim]

What would you like?

I would like to propose an enhancement to Cypress's .trigger() command to support emitting KeyboardEvent with the key and code properties, in addition to the current keyCode.

Why is this needed?

This matter is vital because many modern web applications rely on key and code properties for keyboard event handling, and the current limitation to Event having only keyCode (which is deprecated) hampers the ability to test these applications effectively.

For instance, in my application, I have a keydown event listener that performs an action when the Space key is pressed.

document.addEventListener('keydown', keyDownGlobal);

function keyDownGlobal(event: KeyboardEvent) {
  if (event.code === 'Space') {
    doSomething();
  }

The current Cypress implementation fails to trigger this action because it does not include the code property in the event.

cy.get("[data-cy=target]").trigger("keydown", { keyCode: 32 })

I've worked around this by manually creating and dispatching a KeyboardEvent with the necessary properties.

      cy.document().then(document => {
        const spaceKeyDown = new KeyboardEvent("keydown", {
          key: " ",
          code: "Space",
          bubbles: true,
          cancelable: true,
          keyCode: 32,
          which: 32
        });
        document.dispatchEvent(spaceKeyDown);
      });

It would be more efficient and user-friendly if Cypress's .trigger() command natively supported these properties with KeyboardEvent. This enhancement would significantly improve Cypress's ability to test applications reliant on specific keyboard inputs, providing a more comprehensive and realistic testing environment.

Other

No response