Merge pull request #13118 from brendandahl/page-aria

Add landmark region and aria-label for each page.
This commit is contained in:
Tim van der Meij 2021-03-19 23:17:55 +01:00 committed by GitHub
commit d775616fd4
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
3 changed files with 13 additions and 6 deletions

View File

@ -149,8 +149,8 @@ findbar.title=Find in Document
findbar_label=Find
additional_layers=Additional Layers
# LOCALIZATION NOTE (page_canvas): "{{page}}" will be replaced by the page number.
page_canvas=Page {{page}}
# LOCALIZATION NOTE (page_landmark): "{{page}}" will be replaced by the page number.
page_landmark=Page {{page}}
# Thumbnails panel item (tooltip and alt text for images)
# LOCALIZATION NOTE (thumb_page_title): "{{page}}" will be replaced by the page
# number.
@ -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.

View File

@ -45,7 +45,7 @@ const DEFAULT_L10N_STRINGS = {
"Toggle Sidebar (document contains outline/attachments/layers)",
additional_layers: "Additional Layers",
page_canvas: "Page {{page}}",
page_landmark: "Page {{page}}",
thumb_page_title: "Page {{page}}",
thumb_page_canvas: "Thumbnail of Page {{page}}",
@ -70,6 +70,7 @@ const DEFAULT_L10N_STRINGS = {
page_scale_actual: "Actual Size",
page_scale_percent: "{{scale}}%",
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.",

View File

@ -125,6 +125,10 @@ 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_landmark", { page: this.id }).then(msg => {
div.setAttribute("aria-label", msg);
});
this.div = div;
container.appendChild(div);
@ -259,6 +263,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);
}
@ -617,9 +625,6 @@ class PDFPageView {
const viewport = this.viewport;
const canvas = document.createElement("canvas");
this.l10n.get("page_canvas", { page: this.id }).then(msg => {
canvas.setAttribute("aria-label", msg);
});
// Keep the canvas hidden until the first draw callback, or until drawing
// is complete when `!this.renderingQueue`, to prevent black flickering.