IE 11 requires EAGER TextField for addClickShortcut()

Flow
1

I have the following simple layout (some styling and layouting code omitted for brevity):

final EmailField email_address_field = new EmailField("Email Address");
email_address_field.setValueChangeMode(EAGER); // Only required for IE11 ***
 
final PasswordField password_field = new PasswordField("Password");
password_field.setValueChangeMode(EAGER); // Only required for IE11 ***
 
final Span sign_in_status = new Span();
sign_in_status.addClassName(ERROR_MESSAGE);
sign_in_status.setVisible(false);
 
final Button sign_in_button = new Button("Sign-In");
sign_in_button.addClickShortcut(ENTER);
sign_in_button.addClickListener((a_event) ->
{
    try
    {
        authenticate(email_address_field.getValue(),
                     password_field.getValue());

        a_on_authenticated.run();
    }
    catch (final Base_exception e)
    {
        LOGGER_.warn("Authentication failure", e);

        sign_in_status.setText("Invalid credentials.");
        sign_in_status.setVisible(true);
    }
});

For Chrome and Firefox EAGER value change mode is unrequired to retrieve the most recent values from the email address and password fields when the enter key is pressed but is required for IE11. When the sign-in button is clicked in any browser EAGER mode is unrequired.

Is Chrome and Firefox just working by chance without EAGER mode or is this an issue with IE11 ?

Cheers,
Martin.

2

Additionally, the enter key works correctly in IE11 if neither the email field or password field has focus.

3

I would expect all browsers to behave similarly, unless there is a major issue (e.g. browser bug that can’t be worked around with reasonable effort). So I’d recommend filing a ticket at https://github.com/vaadin/vaadin-text-field-flow .

-Olli