From ddb5fb445c9fd17d2cfa8ea9bb45b80683f06fca Mon Sep 17 00:00:00 2001
From: Cilibiu Bogdan <pionnegru@users.noreply.github.com>
Date: Mon, 2 Sep 2019 14:45:08 +0300
Subject: [PATCH] [ADF-4855] Upload dialog - Buttons must have discernible text
 (#5040)

* aria labels translation keys

* actions aria label

* announce confirmation content
---
 lib/content-services/i18n/en.json                | 10 +++++++++-
 .../file-uploading-dialog.component.html         | 16 +++++++++++++---
 2 files changed, 22 insertions(+), 4 deletions(-)

diff --git a/lib/content-services/i18n/en.json b/lib/content-services/i18n/en.json
index fe456a97e8..0e7a953c72 100644
--- a/lib/content-services/i18n/en.json
+++ b/lib/content-services/i18n/en.json
@@ -130,7 +130,15 @@
       }
     },
     "ARIA-LABEL": {
-      "VERSION": "File version"
+      "VERSION": "File version",
+      "DIALOG_MAXIMIZE": "Maximize upload dialog",
+      "DIALOG_MINIMIZE": "Minimize upload dialog",
+      "DIALOG_CLOSE": "Close upload dialog",
+      "CANCEL_ALL": "Cancel all uploading files",
+      "CONFIRMATION": {
+        "CANCEL": "Confirm cancel",
+        "CONTINUE": "Continue uploading"
+      }
     }
   },
   "FILE_UPLOAD": {
diff --git a/lib/content-services/upload/components/file-uploading-dialog.component.html b/lib/content-services/upload/components/file-uploading-dialog.component.html
index ec47771ab4..de1bc831e5 100644
--- a/lib/content-services/upload/components/file-uploading-dialog.component.html
+++ b/lib/content-services/upload/components/file-uploading-dialog.component.html
@@ -1,10 +1,14 @@
 <div *ngIf="isDialogActive"
+     role="dialog"
      class="adf-upload-dialog"
      id="upload-dialog"
      [class.adf-upload-dialog--minimized]="isDialogMinimized">
     <header class="adf-upload-dialog__header">
         <button
             mat-button
+            [attr.aria-label]="(isDialogMinimized ?
+                'ADF_FILE_UPLOAD.ARIA-LABEL.DIALOG_MAXIMIZE':
+                'ADF_FILE_UPLOAD.ARIA-LABEL.DIALOG_MINIMIZE') | translate"
             color="secondary"
             [disabled]="isConfirmation"
             [attr.aria-expanded]="!isDialogMinimized"
@@ -60,13 +64,15 @@
         </adf-file-uploading-list>
 
         <div
+            aria-live="polite"
+            aria-labelledby="confirmationTitle"
+            aria-describedby="confirmationDescription"
             class="adf-upload-dialog__confirmation"
             [class.adf-upload-dialog--hide]="!isConfirmation">
-                <p class="adf-upload-dialog__confirmation--title">
+                <p role="heading" id="confirmationTitle" class="adf-upload-dialog__confirmation--title">
                     {{ 'ADF_FILE_UPLOAD.CONFIRMATION.MESSAGE.TITLE' | translate }}
                 </p>
-
-                <p class="adf-upload-dialog__confirmation--text">
+                <p id="confirmationDescription" class="adf-upload-dialog__confirmation--text">
                     {{ 'ADF_FILE_UPLOAD.CONFIRMATION.MESSAGE.TEXT' | translate }}
                 </p>
         </div>
@@ -76,6 +82,7 @@
             *ngIf="!isConfirmation">
         <button
             id="adf-upload-dialog-cancel-all"
+            [attr.aria-label]="'ADF_FILE_UPLOAD.ARIA-LABEL.CANCEL_ALL' | translate"
             color="primary"
             mat-button
             *ngIf="!uploadList.isUploadCompleted() && !uploadList.isUploadCancelled()"
@@ -85,6 +92,7 @@
 
         <button
             id="adf-upload-dialog-close"
+            [attr.aria-label]="'ADF_FILE_UPLOAD.ARIA-LABEL.DIALOG_CLOSE' | translate"
             *ngIf="uploadList.isUploadCompleted() || uploadList.isUploadCancelled()"
             mat-button
             color="primary"
@@ -97,6 +105,7 @@
             *ngIf="isConfirmation">
         <button
             id="adf-upload-dialog-cancel"
+            [attr.aria-label]="'ADF_FILE_UPLOAD.ARIA-LABEL.CONFIRMATION.CANCEL' | translate"
             color="secondary"
             mat-button
             (click)="cancelAllUploads()">
@@ -105,6 +114,7 @@
 
         <button
             id="adf-upload-dialog-confirm"
+            [attr.aria-label]="'ADF_FILE_UPLOAD.ARIA-LABEL.CONFIRMATION.CONTINUE' | translate"
             mat-button
             color="primary"
             (click)="toggleConfirmation()">