Reliable a11y events on smart card PIN errors

Make the smart card PIN errors being dispatched to the a11y subsystem
more reliably, by directly associating the error text with the PIN input
field.

This allows to support the scenario when the PIN keyboard is hidden
during PIN verification animation and shown back. Before this CL, the
error alert would be lost in such scenario, since it's followed by the
focus switch events.

Also do a small cleanup by removing the "aria-invalid" attribute from
the <pin-keyboard> element, since it doesn't seem to be recognized by
the a11y screen reader, meanwhile the actual useful attribute is already
set thanks to the dataflow "<pin-keyboard has-error>" => "<cr-input
invalid>" => "<input aria-invalid>".

Bug: 1001612, 1016839
Change-Id: Ib7baff4bf5d172ada92fbb035455894b1baff5ab
Reviewed-on: https://chromium-review.googlesource.com/c/chromium/src/+/2031106
Commit-Queue: Maksim Ivanov <emaxx@chromium.org>
Reviewed-by: Steven Bennetts <stevenjb@chromium.org>
Cr-Commit-Position: refs/heads/master@{#737471}

chrome/browser/resources/chromeos/login/security_token_pin.html

@@ -27,7 +27,8 @@
         <div id="pinKeyboardContainer">
           <pin-keyboard id="pinKeyboard" enable-letters
               has-error="[[isErrorLabelVisible_(errorLabelId_, userEdited_)]]"
-              aria-invalid$="[[isAriaInvalid_(parameters, userEdited_)]]"
+              aria-label="[[getLabel_(locale, parameters, errorLabelId_,
+                                      userEdited_)]]"
               on-pin-change="onPinChange_" on-submit="onSubmit_"
               disabled="[[!canEdit_]]">
             <div id="errorContainer" role="alert" problem

chrome/browser/resources/chromeos/login/security_token_pin.js

@@ -28,7 +28,7 @@ Polymer({
 
     /**
      * The i18n string ID containing the error label to be shown to the user.
-     * Is undefined when there's no error label.
+     * Is null when there's no error label.
      * @private
      */
     errorLabelId_: {
@@ -89,15 +89,15 @@ Polymer({
   /**
    * Returns the i18n string ID for the current error label.
    * @param {OobeTypes.SecurityTokenPinDialogParameters} parameters
-   * @return {string|undefined}
+   * @return {string|null}
    * @private
    */
   computeErrorLabelId_(parameters) {
     if (!parameters)
-      return;
+      return null;
     switch (parameters.errorLabel) {
       case OobeTypes.SecurityTokenPinDialogErrorType.NONE:
-        return;
+        return null;
       case OobeTypes.SecurityTokenPinDialogErrorType.UNKNOWN:
         return 'securityTokenPinDialogUnknownError';
       case OobeTypes.SecurityTokenPinDialogErrorType.INVALID_PIN:
@@ -193,17 +193,6 @@ Polymer({
         !userEdited;
   },
 
-  /**
-   * Returns a string for a11y whether there is an error.
-   * @param {OobeTypes.SecurityTokenPinDialogParameters} parameters
-   * @param {boolean} userEdited
-   * @return {string}
-   * @private
-   */
-  isAriaInvalid_(parameters, userEdited) {
-    return this.isErrorLabelVisible_(parameters, userEdited) ? 'true' : 'false';
-  },
-
   /**
    * Returns whether the PIN attempts left count should be shown.
    * @param {OobeTypes.SecurityTokenPinDialogParameters} parameters
@@ -230,20 +219,26 @@ Polymer({
    * Returns the label to be used for the PIN input field.
    * @param {string} locale
    * @param {OobeTypes.SecurityTokenPinDialogParameters} parameters
-   * @param {string} errorLabelId
+   * @param {string|null} errorLabelId
    * @param {boolean} userEdited
    * @return {string}
    * @private
    */
   getLabel_(locale, parameters, errorLabelId, userEdited) {
     if (!this.isLabelVisible_(parameters, userEdited)) {
+      // Neither error nor the number of left attempts are to be displayed.
       return '';
     }
     if (!this.isErrorLabelVisible_(parameters, userEdited) &&
         this.isAttemptsLeftVisible_(parameters)) {
+      // There's no error, but the number of left attempts has to be displayed.
       return this.i18n(
           'securityTokenPinDialogAttemptsLeft', parameters.attemptsLeft);
     }
+    // If we get here, |parameters| must be defined, and |parameters.errorLabel|
+    // != NONE, so |errorLabelId| will be defined.
+    assert(errorLabelId);
+    // Format the error and, if present, the number of left attempts.
     if (parameters && !parameters.enableUserInput) {
       return this.i18n(errorLabelId);
     }