Merge pull request #14910 from Snuffleupagus/adjustScaleWidth-animationStarted

Ensure that setting the width of the zoom dropdown works correctly (PR 14028 follow-up)

Author: timvandermeij

web/toolbar.js

@@ -170,7 +170,7 @@ class Toolbar {
 
     this.eventBus._on("localized", () => {
       this._wasLocalized = true;
-      this._adjustScaleWidth();
+      this.#adjustScaleWidth();
       this._updateUIState(true);
     });
   }
@@ -237,9 +237,8 @@ class Toolbar {
   /**
    * Increase the width of the zoom dropdown DOM element if, and only if, it's
    * too narrow to fit the *longest* of the localized strings.
-   * @private
    */
-  async _adjustScaleWidth() {
+  async #adjustScaleWidth() {
     const { items, l10n } = this;
 
     const predefinedValuesPromise = Promise.all([
@@ -248,6 +247,7 @@ class Toolbar {
       l10n.get("page_scale_fit"),
       l10n.get("page_scale_width"),
     ]);
+    await animationStarted;
 
     const style = getComputedStyle(items.scaleSelect),
       scaleSelectContainerWidth = parseInt(
@@ -260,10 +260,8 @@ class Toolbar {
       );
 
     // The temporary canvas is used to measure text length in the DOM.
-    let canvas = document.createElement("canvas");
-    let ctx = canvas.getContext("2d", { alpha: false });
-
-    await animationStarted;
+    const canvas = document.createElement("canvas");
+    const ctx = canvas.getContext("2d", { alpha: false });
     ctx.font = `${style.fontSize} ${style.fontFamily}`;
 
     let maxWidth = 0;
@@ -283,7 +281,6 @@ class Toolbar {
     // immediately, which can greatly reduce memory consumption.
     canvas.width = 0;
     canvas.height = 0;
-    canvas = ctx = null;
   }
 }