Make button click shortcut work seamlessly with disable on click

[eberleant]

Describe your motivation

I have a button with a click handler that takes several seconds to complete. I want the button to:

1. be disabled after clicking so that the user can immediately see that the click went through, and
2. be triggered when the user presses "Enter"

However, when using both setDisableOnClick(true) and addClickShortcut(Key.ENTER), the button is not disabled until after the click handler has completed (which defeats the purpose of giving the user immediate feedback that the click worked).

This is different from what happens when you click the button on the browser/webpage (as opposed to using the click shortcut) - the button will be immediately disabled even if the event handler is still being processed on the server.

Describe the solution you'd like

I'd like to be able to do this in the Java API more easily, for example:

button.addClickShortcut(Key.ENTER);
button.setDisableOnClick(true);

Describe alternatives you've considered

If using LitElement, you could add the event listener on the template, for example:

connectedCallback() {
  super.connectedCallback();
  this.addEventListener('keypress', event => {
    if (event.key === 'Enter') this.buttonElement?.click();
  }
}

or use the Element API to add a DOM event listener:

getElement().addEventListener("keypress", domEvent -> {
    if (Key.ENTER.matches(domEvent.getEventData().getString("event.key"))) {
        button.clickInClient();
    }
}).addEventData("event.key");

or perform the click handling asynchronously.

Additional context

No response