Add an aria-label to the sidebar resizer (bug 2016142)

l10n/en-US/viewer.ftl

@@ -693,6 +693,8 @@ pdfjs-toggle-views-manager-button-label = Toggle Sidebar
 
 pdfjs-views-manager-sidebar =
     .aria-label = Sidebar
+pdfjs-views-manager-sidebar-resizer =
+    .aria-label = Sidebar resizer
 pdfjs-views-manager-view-selector-button =
     .title = Views
 pdfjs-views-manager-view-selector-button-label = Views

test/integration/thumbnail_view_spec.mjs

@@ -41,6 +41,21 @@ describe("PDF Thumbnail View", () => {
         })
       );
     });
+
+    it("should have accessible label on resizer", async () => {
+      await Promise.all(
+        pages.map(async ([browserName, page]) => {
+          await page.click("#viewsManagerToggleButton");
+
+          const ariaLabel = await page.$eval("#viewsManagerResizer", el =>
+            el.getAttribute("aria-label")
+          );
+          expect(ariaLabel)
+            .withContext(`In ${browserName}`)
+            .toBe("Sidebar resizer");
+        })
+      );
+    });
   });
 
   describe("The view is scrolled correctly", () => {

web/viewer.html

@@ -278,7 +278,14 @@ See https://github.com/adobe-type-tools/cmap-resources
                     <div id="attachmentsView" class="hidden"></div>
                     <div id="layersView" class="treeView hidden"></div>
                   </div>
-                  <div id="viewsManagerResizer" class="sidebarResizer" role="separator" aria-controls="viewsManager" tabindex="0"></div>
+                  <div
+                    id="viewsManagerResizer"
+                    class="sidebarResizer"
+                    role="separator"
+                    aria-controls="viewsManager"
+                    tabindex="0"
+                    data-l10n-id="pdfjs-views-manager-sidebar-resizer"
+                  ></div>
                 </div>
                 <!-- sidebarContainer -->