PDF Viewer update: Add missing aria-labels to various buttons.

 - Add aria-label and title attributes were missing.
 - Fix incorrect aria-label$=... assignments where no
   Polymer bindings are involved.

Bug: 1123470
Change-Id: I0d6c33c9338a1494d47e249bd71885f4614566fb
Reviewed-on: https://chromium-review.googlesource.com/c/chromium/src/+/2418471
Commit-Queue: dpapad <dpapad@chromium.org>
Reviewed-by: Rebekah Potter <rbpotter@chromium.org>
Cr-Commit-Position: refs/heads/master@{#808516}

chrome/browser/pdf/pdf_extension_util.cc

@@ -9,6 +9,7 @@
 #include "chrome/browser/browser_process.h"
 #include "chrome/common/chrome_content_client.h"
 #include "chrome/grit/browser_resources.h"
+#include "chrome/grit/generated_resources.h"
 #include "components/strings/grit/components_strings.h"
 #include "components/zoom/page_zoom_constants.h"
 #include "pdf/pdf_features.h"
@@ -50,10 +51,13 @@ void AddCommonStrings(base::Value* dict) {
 // Adds strings that are used only by the stand-alone PDF Viewer.
 void AddPdfViewerStrings(base::Value* dict) {
   static constexpr webui::LocalizedString kPdfResources[] = {
+    {"annotationsShowToggle", IDS_PDF_ANNOTATIONS_SHOW_TOGGLE},
     {"bookmarks", IDS_PDF_BOOKMARKS},
     {"downloadEdited", IDS_PDF_DOWNLOAD_EDITED},
     {"downloadOriginal", IDS_PDF_DOWNLOAD_ORIGINAL},
     {"labelPageNumber", IDS_PDF_LABEL_PAGE_NUMBER},
+    {"menu", IDS_MENU},
+    {"moreActions", IDS_DOWNLOAD_MORE_ACTIONS},
     {"passwordDialogTitle", IDS_PDF_PASSWORD_DIALOG_TITLE},
     {"passwordInvalid", IDS_PDF_PASSWORD_INVALID},
     {"passwordPrompt", IDS_PDF_NEED_PASSWORD},
@@ -61,10 +65,9 @@ void AddPdfViewerStrings(base::Value* dict) {
     {"tooltipDocumentOutline", IDS_PDF_TOOLTIP_DOCUMENT_OUTLINE},
     {"tooltipDownload", IDS_PDF_TOOLTIP_DOWNLOAD},
     {"tooltipPrint", IDS_PDF_TOOLTIP_PRINT},
-    {"tooltipRotateCW", IDS_PDF_TOOLTIP_ROTATE_CW},
     {"tooltipRotateCCW", IDS_PDF_TOOLTIP_ROTATE_CCW},
+    {"tooltipRotateCW", IDS_PDF_TOOLTIP_ROTATE_CW},
     {"tooltipThumbnails", IDS_PDF_TOOLTIP_THUMBNAILS},
-    {"annotationsShowToggle", IDS_PDF_ANNOTATIONS_SHOW_TOGGLE},
 #if defined(OS_CHROMEOS)
     {"tooltipAnnotate", IDS_PDF_ANNOTATION_ANNOTATE},
     {"annotationDocumentTooLarge", IDS_PDF_ANNOTATION_DOCUMENT_TOO_LARGE},

chrome/browser/resources/pdf/elements/viewer-annotations-bar.html

@@ -87,17 +87,17 @@
 <cr-icon-button id="eraser"
     selected$="[[isAnnotationTool_('eraser', annotationTool_.tool)]]"
     on-click="annotationToolClicked_" iron-icon="pdf:eraser"
-    aria-label$="$i18n{annotationEraser}"
+    aria-label="$i18n{annotationEraser}"
     title="$i18n{annotationEraser}"></cr-icon-button>
 
 <div id="annotation-separator"></div>
 
 <cr-icon-button id="undo" disabled="[[!canUndoAnnotation_]]"
     iron-icon="pdf:undo" on-click="onUndoClick_"
-    aria-label$="$i18n{annotationUndo}"
+    aria-label="$i18n{annotationUndo}"
     title="$i18n{annotationUndo}"></cr-icon-button>
 
 <cr-icon-button id="redo" disabled="[[!canRedoAnnotation_]]"
     iron-icon="pdf:redo" on-click="onRedoClick_"
-    aria-label$="$i18n{annotationRedo}"
+    aria-label="$i18n{annotationRedo}"
     title="$i18n{annotationRedo}"></cr-icon-button>

chrome/browser/resources/pdf/elements/viewer-download-controls.html

@@ -10,7 +10,7 @@
   }
 </style>
 <cr-icon-button id="download" iron-icon="cr:file-download"
-    on-click="onDownloadClick_" aria-label$="$i18n{tooltipDownload}"
+    on-click="onDownloadClick_" aria-label="$i18n{tooltipDownload}"
     aria-haspopup$="[[downloadHasPopup_]]"
     title="$i18n{tooltipDownload}"></cr-icon-button>
 <cr-action-menu id="menu" on-close="onMenuClose_">

chrome/browser/resources/pdf/elements/viewer-page-selector.html

@@ -38,6 +38,6 @@
     </style>
     <input type="text" id="pageselector" value="[[pageNo]]"
         on-pointerup="select" on-input="onInput_" on-change="pageNoCommitted"
-        aria-label$="$i18n{labelPageNumber}">
+        aria-label="$i18n{labelPageNumber}">
     <span id="divider">/</span>
     <span id="pagelength">[[docLength]]</span>

chrome/browser/resources/pdf/elements/viewer-pdf-sidenav.html

@@ -69,14 +69,17 @@
 <div id="icons" hidden$="[[!bookmarks.length]]">
   <div class$="button-wrapper [[thumbnailButtonClass_(thumbnailView_)]]">
     <cr-icon-button iron-icon="pdf:thumbnails" role="tab"
+        title="$i18n{tooltipThumbnails}" aria-label="$i18n{tooltipThumbnails}"
         aria-selected$="[[getAriaSelectedThumbnails_(thumbnailView_)]]"
-        title="$i18n{tooltipThumbnails}" on-click="onThumbnailClick_">
+        on-click="onThumbnailClick_">
     </cr-icon-button>
   </div>
   <div class$="button-wrapper [[outlineButtonClass_(thumbnailView_)]]">
     <cr-icon-button iron-icon="pdf:doc-outline" role="tab"
+        title="$i18n{tooltipDocumentOutline}"
+        aria-label="$i18n{tooltipDocumentOutline}"
         aria-selected$="[[getAriaSelectedOutline_(thumbnailView_)]]"
-        title="$i18n{tooltipDocumentOutline}" on-click="onOutlineClick_">
+        on-click="onOutlineClick_">
     </cr-icon-button>
   </div>
 </div>

chrome/browser/resources/pdf/elements/viewer-pdf-toolbar-new.html

@@ -164,10 +164,10 @@
     width: 16px;
   }
 </style>
-<!-- TODO(dpapad): Add aria-label and title for all buttons -->
 <div id="toolbar">
   <div id="start">
     <cr-icon-button id="sidenavToggle" iron-icon="cr20:menu"
+        title="$i18n{menu}" aria-label="$i18n{menu}"
 <if expr="chromeos">
         disabled="[[annotationMode]]"
 </if>
@@ -180,27 +180,30 @@
     </viewer-page-selector>
     <span id="zoom-controls">
       <cr-icon-button iron-icon="pdf:remove" title="$i18n{tooltipZoomOut}"
-          on-click="onZoomOutClick_">
+          aria-label="$i18n{tooltipZoomOut}" on-click="onZoomOutClick_">
       </cr-icon-button>
       <input type="text" value="100%" on-input="onZoomInput_"
           on-pointerup="onZoomInputPointerup_"
           on-blur="onZoomInputBlur_">
       </input>
       <cr-icon-button iron-icon="pdf:add" title="$i18n{tooltipZoomIn}"
-          on-click="onZoomInClick_">
+          aria-label="$i18n{tooltipZoomIn}" on-click="onZoomInClick_">
       </cr-icon-button>
     </span>
     <cr-icon-button id="fit" iron-icon="[[fitToButtonIcon_]]"
         title="[[getFitToButtonTooltip_('$i18nPolymer{tooltipFitToPage}',
                                         '$i18nPolymer{tooltipFitToWidth}',
                                         fittingType_)]]"
+        aria-label="[[getFitToButtonTooltip_('$i18nPolymer{tooltipFitToPage}',
+                                             '$i18nPolymer{tooltipFitToWidth}',
+                                             fittingType_)]]"
         on-click="onFitToButtonClick_">
     </cr-icon-button>
     <cr-icon-button iron-icon="pdf:rotate-left"
 <if expr="chromeos">
         disabled="[[annotationMode]]"
 </if>
-        aria-label$="$i18n{tooltipRotateCCW}" title="$i18n{tooltipRotateCCW}"
+        aria-label="$i18n{tooltipRotateCCW}" title="$i18n{tooltipRotateCCW}"
         on-click="onRotateClick_">
     </cr-icon-button>
   </div>
@@ -209,7 +212,7 @@
     <template is="dom-if" if="[[pdfAnnotationsEnabled]]">
       <cr-icon-button id="annotate" iron-icon="pdf:create"
           disabled="[[!annotationAvailable]]" on-click="toggleAnnotation"
-          aria-label$="$i18n{tooltipAnnotate}"
+          aria-label="$i18n{tooltipAnnotate}"
           title="$i18n{tooltipAnnotate}"></cr-icon-button>
     </template>
   </if>
@@ -220,10 +223,12 @@
         pdf-form-save-enabled="[[pdfFormSaveEnabled]]">
     </viewer-download-controls>
     <cr-icon-button id="print" iron-icon="cr:print"
-        aria-label$="$i18n{tooltipPrint}" hidden="[[!printingEnabled]]"
-        title="$i18n{tooltipPrint}" on-click="onPrintClick_"></cr-icon-button>
-    <cr-icon-button id="more"
-        iron-icon="cr:more-vert" on-click="onMoreClick_"></cr-icon-button>
+        hidden="[[!printingEnabled]]" title="$i18n{tooltipPrint}"
+        aria-label="$i18n{tooltipPrint}" on-click="onPrintClick_">
+    </cr-icon-button>
+    <cr-icon-button id="more" iron-icon="cr:more-vert"
+        title="$i18n{moreActions}" aria-label="$i18n{moreActions}"
+        on-click="onMoreClick_"></cr-icon-button>
   </div>
 </div>
 <paper-progress id="progress" value="[[loadProgress]]" hidden="[[!loading_]]">

chrome/browser/resources/pdf/elements/viewer-pdf-toolbar.html

@@ -116,14 +116,14 @@
           <template is="dom-if" if="[[pdfAnnotationsEnabled]]">
             <cr-icon-button id="annotate" iron-icon="pdf:create"
                 disabled="[[!annotationAvailable]]" on-click="toggleAnnotation"
-                aria-label$="$i18n{tooltipAnnotate}"
+                aria-label="$i18n{tooltipAnnotate}"
                 title="$i18n{tooltipAnnotate}"></cr-icon-button>
           </template>
 </if>
 
           <cr-icon-button id="rotate-right" iron-icon="pdf:rotate-right"
               disabled="[[annotationMode]]" on-click="rotateRight"
-              aria-label$="$i18n{tooltipRotateCW}"
+              aria-label="$i18n{tooltipRotateCW}"
               title="$i18n{tooltipRotateCW}"></cr-icon-button>
           <viewer-download-controls id="downloads"
               has-edits="[[hasEdits]]"
@@ -134,7 +134,7 @@
 
           <cr-icon-button id="print" iron-icon="cr:print" on-click="print"
               hidden="[[!printingEnabled]]" title="$i18n{tooltipPrint}"
-              aria-label$="$i18n{tooltipPrint}"></cr-icon-button>
+              aria-label="$i18n{tooltipPrint}"></cr-icon-button>
 
           <viewer-toolbar-dropdown id="bookmarks"
                                    selected

chrome/browser/resources/pdf/elements/viewer-pen-options.html

@@ -65,7 +65,7 @@
             on-pointerdown="blurOnPointerDown">
       </template>
       <cr-icon-button id="expand" iron-icon="cr:expand-more" tabindex="3"
-          on-click="toggleExpanded_" aria-label$="$i18n{annotationExpand}"
+          on-click="toggleExpanded_" aria-label="$i18n{annotationExpand}"
           title$="$i18n{annotationExpand}"></cr-icon-button>
     </div>
     <div id="separator"></div>