Make tagged images visible for screen readers (bug 1708040)

The idea is to insert a span in the text layer with an aria-role set to img
and use the bounding box provided by the attribute field in the tag dict in
order to have non-null dimensions for the image to make it "visible".

src/core/struct_tree.js

@@ -15,8 +15,8 @@
 
 import { AnnotationPrefix, stringToPDFString, warn } from "../shared/util.js";
 import { Dict, isName, Name, Ref, RefSetCache } from "./primitives.js";
+import { lookupNormalRect, stringToAsciiOrUTF16BE } from "./core_utils.js";
 import { NumberTree } from "./name_number_tree.js";
-import { stringToAsciiOrUTF16BE } from "./core_utils.js";
 import { writeObject } from "./writer.js";
 
 const MAX_DEPTH = 40;
@@ -751,10 +751,38 @@ class StructTreePage {
       obj.role = node.role;
       obj.children = [];
       parent.children.push(obj);
-      const alt = node.dict.get("Alt");
+      let alt = node.dict.get("Alt");
+      if (typeof alt !== "string") {
+        alt = node.dict.get("ActualText");
+      }
       if (typeof alt === "string") {
         obj.alt = stringToPDFString(alt);
       }
+
+      const a = node.dict.get("A");
+      if (a instanceof Dict) {
+        const bbox = lookupNormalRect(a.getArray("BBox"), null);
+        if (bbox) {
+          obj.bbox = bbox;
+        } else {
+          const width = a.get("Width");
+          const height = a.get("Height");
+          if (
+            typeof width === "number" &&
+            width > 0 &&
+            typeof height === "number" &&
+            height > 0
+          ) {
+            obj.bbox = [0, 0, width, height];
+          }
+        }
+        // TODO: If the bbox is not available, we should try to get it from
+        // the content stream.
+        // For example when rendering on the canvas the commands between the
+        // beginning and the end of the marked-content sequence, we can
+        // compute the overall bbox.
+      }
+
       const lang = node.dict.get("Lang");
       if (typeof lang === "string") {
         obj.lang = stringToPDFString(lang);

src/display/editor/annotation_editor_layer.js

@@ -395,7 +395,8 @@ class AnnotationEditorLayer {
     const { target } = event;
     if (
       target === this.#textLayer.div ||
-      (target.classList.contains("endOfContent") &&
+      ((target.getAttribute("role") === "img" ||
+        target.classList.contains("endOfContent")) &&
         this.#textLayer.div.contains(target))
     ) {
       const { isMac } = FeatureTest.platform;
@@ -413,7 +414,7 @@ class AnnotationEditorLayer {
       HighlightEditor.startHighlighting(
         this,
         this.#uiManager.direction === "ltr",
-        event
+        { target: this.#textLayer.div, x: event.x, y: event.y }
       );
       this.#textLayer.div.addEventListener(
         "pointerup",