Add landmark region and aria-label for each page.

Allows screen readers to jump landmarks and announce
the page. Since landmarks must have content, I also added
aria labels for the loading images.

Author: brendandahl

l10n/en-US/viewer.properties

@@ -223,6 +223,7 @@ page_scale_actual=Actual Size
 page_scale_percent={{scale}}%
 
 # Loading indicator messages
+loading=Loading…
 loading_error=An error occurred while loading the PDF.
 invalid_file_error=Invalid or corrupted PDF file.
 missing_file_error=Missing PDF file.

web/pdf_page_view.js

@@ -122,6 +122,12 @@ class PDFPageView {
     div.style.width = Math.floor(this.viewport.width) + "px";
     div.style.height = Math.floor(this.viewport.height) + "px";
     div.setAttribute("data-page-number", this.id);
+    div.setAttribute("role", "region");
+    this.l10n
+      .get("page_canvas", { page: this.id }, "Page {{page}}")
+      .then(msg => {
+        div.setAttribute("aria-label", msg);
+      });
     this.div = div;
 
     container.appendChild(div);
@@ -233,6 +239,10 @@ class PDFPageView {
 
     this.loadingIconDiv = document.createElement("div");
     this.loadingIconDiv.className = "loadingIcon";
+    this.loadingIconDiv.setAttribute("role", "img");
+    this.l10n.get("loading").then(msg => {
+      this.loadingIconDiv?.setAttribute("aria-label", msg);
+    });
     div.appendChild(this.loadingIconDiv);
   }