Pause translation when appending the textLayer and structTreeLayer to…

… the page

Note that we must append the textLayer to the DOM *before* enabling the `highlighter` and `accessibilityManager`, to avoid breaking e.g. a pending searching operation.
The least invasive solution, that I was able to come up with, is to introduce a new `TextLayerBuilder` callback-function for this purpose.

web/pdf_page_view.js

@@ -436,7 +436,10 @@ class PDFPageView {
       : null);
     const treeDom = this.structTreeLayer?.render(tree);
     if (treeDom) {
+      // Pause translation when inserting the structTree in the DOM.
+      this.l10n.pause();
       this.canvas?.append(treeDom);
+      this.l10n.resume();
     }
     this.structTreeLayer?.show();
   }
@@ -863,7 +866,12 @@ class PDFPageView {
         enablePermissions:
           this.#textLayerMode === TextLayerMode.ENABLE_PERMISSIONS,
       });
-      div.append(this.textLayer.div);
+      this.textLayer.onAppend = textLayerDiv => {
+        // Pause translation when inserting the textLayer in the DOM.
+        this.l10n.pause();
+        this.div.append(textLayerDiv);
+        this.l10n.resume();
+      };
     }
 
     if (

web/text_layer_builder.js

@@ -62,9 +62,14 @@ class TextLayerBuilder {
     this.isOffscreenCanvasSupported = isOffscreenCanvasSupported;
     this.#enablePermissions = enablePermissions === true;
 
+    /**
+     * Callback used to attach the textLayer to the DOM.
+     * @type {function}
+     */
+    this.onAppend = null;
+
     this.div = document.createElement("div");
     this.div.className = "textLayer";
-    this.hide();
   }
 
   #finishRendering() {
@@ -131,12 +136,15 @@ class TextLayerBuilder {
     this.#finishRendering();
     this.#scale = scale;
     this.#rotation = rotation;
-    this.show();
+    // Ensure that the textLayer is appended to the DOM *before* handling
+    // e.g. a pending search operation.
+    this.onAppend(this.div);
+    this.highlighter?.enable();
     this.accessibilityManager?.enable();
   }
 
   hide() {
-    if (!this.div.hidden) {
+    if (!this.div.hidden && this.renderingDone) {
       // We turn off the highlighter in order to avoid to scroll into view an
       // element of the text layer which could be hidden.
       this.highlighter?.disable();