Search code examples
javavaadinvaadin-flow

Vaadin Flow: set Password Reveal Button Attributes

I am trying to replace the Aria Label of the Password Field reveal button with a different text.

As you can see in developer tools the button is inside the Password Field

My approach would have been to execute JavaScript: txtPassword.getElement().executeJs("document.getElementsByTagName('vaadin-password-field-button')" .setAttribute('attribute', 'value')");

Any help on this approach or maybe different ideas welcome.

Solution

  • The aria-label from the password field is a calculated value coming from a i18n property (a map, that as of now (v24) contains a reveal key). It seems, that this property is not accessible via some more elegant API (also as of now (v24)), but you can set properties like this quite easily via the Element-API.

    E.g.

    new PasswordField().tap {
    getElement().setPropertyMap(
        'i18n',
        [reveal: "Another Aria Label"]
    )
}