blockly 8.0.4-beta.0 → 8.0.5-beta.0

package/core/utils/dom.d.ts

@@ -0,0 +1,165 @@
+/**
+ * @license
+ * Copyright 2019 Google LLC
+ * SPDX-License-Identifier: Apache-2.0
+ */
+import type { Svg } from './svg.js';
+/**
+ * Required name space for SVG elements.
+ * @alias Blockly.utils.dom.SVG_NS
+ */
+export declare const SVG_NS = "http://www.w3.org/2000/svg";
+/**
+ * Required name space for HTML elements.
+ * @alias Blockly.utils.dom.HTML_NS
+ */
+export declare const HTML_NS = "http://www.w3.org/1999/xhtml";
+/**
+ * Required name space for XLINK elements.
+ * @alias Blockly.utils.dom.XLINK_NS
+ */
+export declare const XLINK_NS = "http://www.w3.org/1999/xlink";
+/**
+ * Node type constants.
+ * https://developer.mozilla.org/en-US/docs/Web/API/Node/nodeType
+ * @alias Blockly.utils.dom.NodeType
+ */
+export declare enum NodeType {
+    ELEMENT_NODE = 1,
+    TEXT_NODE = 3,
+    COMMENT_NODE = 8,
+    DOCUMENT_POSITION_CONTAINED_BY = 16
+}
+/**
+ * Helper method for creating SVG elements.
+ * @param name Element's tag name.
+ * @param attrs Dictionary of attribute names and values.
+ * @param opt_parent Optional parent on which to append the element.
+ * @return if name is a string or a more specific type if it a member of Svg.
+ * @alias Blockly.utils.dom.createSvgElement
+ */
+export declare function createSvgElement<T extends SVGElement>(name: string | Svg<T>, attrs: any, opt_parent?: Element): T;
+/**
+ * Add a CSS class to a element.
+ * Similar to Closure's goog.dom.classes.add, except it handles SVG elements.
+ * @param element DOM element to add class to.
+ * @param className Name of class to add.
+ * @return True if class was added, false if already present.
+ * @alias Blockly.utils.dom.addClass
+ */
+export declare function addClass(element: Element, className: string): boolean;
+/**
+ * Removes multiple calsses from an element.
+ * @param element DOM element to remove classes from.
+ * @param classNames A string of one or multiple class names for an element.
+ * @alias Blockly.utils.dom.removeClasses
+ */
+export declare function removeClasses(element: Element, classNames: string): void;
+/**
+ * Remove a CSS class from a element.
+ * Similar to Closure's goog.dom.classes.remove, except it handles SVG elements.
+ * @param element DOM element to remove class from.
+ * @param className Name of class to remove.
+ * @return True if class was removed, false if never present.
+ * @alias Blockly.utils.dom.removeClass
+ */
+export declare function removeClass(element: Element, className: string): boolean;
+/**
+ * Checks if an element has the specified CSS class.
+ * Similar to Closure's goog.dom.classes.has, except it handles SVG elements.
+ * @param element DOM element to check.
+ * @param className Name of class to check.
+ * @return True if class exists, false otherwise.
+ * @alias Blockly.utils.dom.hasClass
+ */
+export declare function hasClass(element: Element, className: string): boolean;
+/**
+ * Removes a node from its parent. No-op if not attached to a parent.
+ * @param node The node to remove.
+ * @return The node removed if removed; else, null.
+ * @alias Blockly.utils.dom.removeNode
+ */
+export declare function removeNode(node: Node | null): Node | null;
+/**
+ * Insert a node after a reference node.
+ * Contrast with node.insertBefore function.
+ * @param newNode New element to insert.
+ * @param refNode Existing element to precede new node.
+ * @alias Blockly.utils.dom.insertAfter
+ */
+export declare function insertAfter(newNode: Element, refNode: Element): void;
+/**
+ * Whether a node contains another node.
+ * @param parent The node that should contain the other node.
+ * @param descendant The node to test presence of.
+ * @return Whether the parent node contains the descendant node.
+ * @alias Blockly.utils.dom.containsNode
+ */
+export declare function containsNode(parent: Node, descendant: Node): boolean;
+/**
+ * Sets the CSS transform property on an element. This function sets the
+ * non-vendor-prefixed and vendor-prefixed versions for backwards compatibility
+ * with older browsers. See https://caniuse.com/#feat=transforms2d
+ * @param element Element to which the CSS transform will be applied.
+ * @param transform The value of the CSS `transform` property.
+ * @alias Blockly.utils.dom.setCssTransform
+ */
+export declare function setCssTransform(element: Element, transform: string): void;
+/**
+ * Start caching text widths. Every call to this function MUST also call
+ * stopTextWidthCache. Caches must not survive between execution threads.
+ * @alias Blockly.utils.dom.startTextWidthCache
+ */
+export declare function startTextWidthCache(): void;
+/**
+ * Stop caching field widths. Unless caching was already on when the
+ * corresponding call to startTextWidthCache was made.
+ * @alias Blockly.utils.dom.stopTextWidthCache
+ */
+export declare function stopTextWidthCache(): void;
+/**
+ * Gets the width of a text element, caching it in the process.
+ * @param textElement An SVG 'text' element.
+ * @return Width of element.
+ * @alias Blockly.utils.dom.getTextWidth
+ */
+export declare function getTextWidth(textElement: SVGTextElement): number;
+/**
+ * Gets the width of a text element using a faster method than `getTextWidth`.
+ * This method requires that we know the text element's font family and size in
+ * advance. Similar to `getTextWidth`, we cache the width we compute.
+ * @param textElement An SVG 'text' element.
+ * @param fontSize The font size to use.
+ * @param fontWeight The font weight to use.
+ * @param fontFamily The font family to use.
+ * @return Width of element.
+ * @alias Blockly.utils.dom.getFastTextWidth
+ */
+export declare function getFastTextWidth(textElement: Element, fontSize: number, fontWeight: string, fontFamily: string): number;
+/**
+ * Gets the width of a text element using a faster method than `getTextWidth`.
+ * This method requires that we know the text element's font family and size in
+ * advance. Similar to `getTextWidth`, we cache the width we compute.
+ * This method is similar to ``getFastTextWidth`` but expects the font size
+ * parameter to be a string.
+ * @param textElement An SVG 'text' element.
+ * @param fontSize The font size to use.
+ * @param fontWeight The font weight to use.
+ * @param fontFamily The font family to use.
+ * @return Width of element.
+ * @alias Blockly.utils.dom.getFastTextWidthWithSizeString
+ */
+export declare function getFastTextWidthWithSizeString(textElement: Element, fontSize: string, fontWeight: string, fontFamily: string): number;
+/**
+ * Measure a font's metrics. The height and baseline values.
+ * @param text Text to measure the font dimensions of.
+ * @param fontSize The font size to use.
+ * @param fontWeight The font weight to use.
+ * @param fontFamily The font family to use.
+ * @return Font measurements.
+ * @alias Blockly.utils.dom.measureFontMetrics
+ */
+export declare function measureFontMetrics(text: string, fontSize: string, fontWeight: string, fontFamily: string): {
+    height: number;
+    baseline: number;
+};

package/core/utils/{dom.js → dom.ts}

@@ -9,7 +9,6 @@
  * These methods are not specific to Blockly, and could be factored out into
  * a JavaScript framework such as Closure.
  */
-'use strict';
 
 /**
  * Utility methods for DOM manipulation.
@@ -17,110 +16,90 @@
  * a JavaScript framework such as Closure.
  * @namespace Blockly.utils.dom
  */
-goog.module('Blockly.utils.dom');
+import * as goog from '../../closure/goog/goog.js';
+goog.declareModuleId('Blockly.utils.dom');
 
-const userAgent = goog.require('Blockly.utils.userAgent');
-/* eslint-disable-next-line no-unused-vars */
-const {Svg} = goog.requireType('Blockly.utils.Svg');
+import type {Svg} from './svg.js';
+import * as userAgent from './useragent.js';
 
 
 /**
  * Required name space for SVG elements.
- * @const
  * @alias Blockly.utils.dom.SVG_NS
  */
-const SVG_NS = 'http://www.w3.org/2000/svg';
-exports.SVG_NS = SVG_NS;
+export const SVG_NS = 'http://www.w3.org/2000/svg';
 
 /**
  * Required name space for HTML elements.
- * @const
  * @alias Blockly.utils.dom.HTML_NS
  */
-const HTML_NS = 'http://www.w3.org/1999/xhtml';
-exports.HTML_NS = HTML_NS;
+export const HTML_NS = 'http://www.w3.org/1999/xhtml';
 
 /**
  * Required name space for XLINK elements.
- * @const
  * @alias Blockly.utils.dom.XLINK_NS
  */
-const XLINK_NS = 'http://www.w3.org/1999/xlink';
-exports.XLINK_NS = XLINK_NS;
+export const XLINK_NS = 'http://www.w3.org/1999/xlink';
 
 /**
  * Node type constants.
  * https://developer.mozilla.org/en-US/docs/Web/API/Node/nodeType
- * @enum {number}
  * @alias Blockly.utils.dom.NodeType
  */
-const NodeType = {
-  ELEMENT_NODE: 1,
-  TEXT_NODE: 3,
-  COMMENT_NODE: 8,
-  DOCUMENT_POSITION_CONTAINED_BY: 16,
-};
-exports.NodeType = NodeType;
+export enum NodeType {
+  ELEMENT_NODE = 1,
+  TEXT_NODE = 3,
+  COMMENT_NODE = 8,
+  DOCUMENT_POSITION_CONTAINED_BY = 16
+}
 
-/**
- * Temporary cache of text widths.
- * @type {Object}
- * @private
- */
-let cacheWidths = null;
+/** Temporary cache of text widths. */
+let cacheWidths: AnyDuringMigration = null;
 
-/**
- * Number of current references to cache.
- * @type {number}
- * @private
- */
+/** Number of current references to cache. */
 let cacheReference = 0;
 
-/**
- * A HTML canvas context used for computing text width.
- * @type {CanvasRenderingContext2D}
- * @private
- */
-let canvasContext = null;
+/** A HTML canvas context used for computing text width. */
+// AnyDuringMigration because:  Type 'null' is not assignable to type
+// 'CanvasRenderingContext2D'.
+let canvasContext: CanvasRenderingContext2D = null as AnyDuringMigration;
 
 /**
  * Helper method for creating SVG elements.
- * @param {string|Svg<T>} name Element's tag name.
- * @param {!Object} attrs Dictionary of attribute names and values.
- * @param {Element=} opt_parent Optional parent on which to append the element.
- * @return {T} Newly created SVG element.  The return type is {!SVGElement} if
- *     name is a string or a more specific type if it a member of Svg.
- * @template T
+ * @param name Element's tag name.
+ * @param attrs Dictionary of attribute names and values.
+ * @param opt_parent Optional parent on which to append the element.
+ * @return if name is a string or a more specific type if it a member of Svg.
  * @alias Blockly.utils.dom.createSvgElement
  */
-const createSvgElement = function(name, attrs, opt_parent) {
-  const e = /** @type {T} */
-      (document.createElementNS(SVG_NS, String(name)));
+export function createSvgElement<T extends SVGElement>(
+    name: string|Svg<T>, attrs: AnyDuringMigration, opt_parent?: Element): T {
+  const e = document.createElementNS(SVG_NS, String(name)) as T;
   for (const key in attrs) {
     e.setAttribute(key, attrs[key]);
   }
   // IE defines a unique attribute "runtimeStyle", it is NOT applied to
   // elements created with createElementNS. However, Closure checks for IE
   // and assumes the presence of the attribute and crashes.
-  if (document.body.runtimeStyle) {  // Indicates presence of IE-only attr.
-    e.runtimeStyle = e.currentStyle = e.style;
+  if ((document.body as any)
+          .runtimeStyle) {  // Indicates presence of IE-only attr.
+    (e as any).runtimeStyle = (e as any).currentStyle = e.style;
   }
   if (opt_parent) {
     opt_parent.appendChild(e);
   }
   return e;
-};
-exports.createSvgElement = createSvgElement;
+}
 
 /**
  * Add a CSS class to a element.
  * Similar to Closure's goog.dom.classes.add, except it handles SVG elements.
- * @param {!Element} element DOM element to add class to.
- * @param {string} className Name of class to add.
- * @return {boolean} True if class was added, false if already present.
+ * @param element DOM element to add class to.
+ * @param className Name of class to add.
+ * @return True if class was added, false if already present.
  * @alias Blockly.utils.dom.addClass
  */
-const addClass = function(element, className) {
+export function addClass(element: Element, className: string): boolean {
   let classes = element.getAttribute('class') || '';
   if ((' ' + classes + ' ').indexOf(' ' + className + ' ') !== -1) {
     return false;
@@ -130,38 +109,35 @@ const addClass = function(element, className) {
   }
   element.setAttribute('class', classes + className);
   return true;
-};
-exports.addClass = addClass;
+}
 
 /**
  * Removes multiple calsses from an element.
- * @param {!Element} element DOM element to remove classes from.
- * @param {string} classNames A string of one or multiple class names for an
- *    element.
+ * @param element DOM element to remove classes from.
+ * @param classNames A string of one or multiple class names for an element.
  * @alias Blockly.utils.dom.removeClasses
  */
-const removeClasses = function(element, classNames) {
+export function removeClasses(element: Element, classNames: string) {
   const classList = classNames.split(' ');
   for (let i = 0; i < classList.length; i++) {
     removeClass(element, classList[i]);
   }
-};
-exports.removeClasses = removeClasses;
+}
 
 /**
  * Remove a CSS class from a element.
  * Similar to Closure's goog.dom.classes.remove, except it handles SVG elements.
- * @param {!Element} element DOM element to remove class from.
- * @param {string} className Name of class to remove.
- * @return {boolean} True if class was removed, false if never present.
+ * @param element DOM element to remove class from.
+ * @param className Name of class to remove.
+ * @return True if class was removed, false if never present.
  * @alias Blockly.utils.dom.removeClass
  */
-const removeClass = function(element, className) {
+export function removeClass(element: Element, className: string): boolean {
   const classes = element.getAttribute('class');
   if ((' ' + classes + ' ').indexOf(' ' + className + ' ') === -1) {
     return false;
   }
-  const classList = classes.split(/\s+/);
+  const classList = classes!.split(/\s+/);
   for (let i = 0; i < classList.length; i++) {
     if (!classList[i] || classList[i] === className) {
       classList.splice(i, 1);
@@ -174,43 +150,40 @@ const removeClass = function(element, className) {
     element.removeAttribute('class');
   }
   return true;
-};
-exports.removeClass = removeClass;
+}
 
 /**
  * Checks if an element has the specified CSS class.
  * Similar to Closure's goog.dom.classes.has, except it handles SVG elements.
- * @param {!Element} element DOM element to check.
- * @param {string} className Name of class to check.
- * @return {boolean} True if class exists, false otherwise.
+ * @param element DOM element to check.
+ * @param className Name of class to check.
+ * @return True if class exists, false otherwise.
  * @alias Blockly.utils.dom.hasClass
  */
-const hasClass = function(element, className) {
+export function hasClass(element: Element, className: string): boolean {
   const classes = element.getAttribute('class');
   return (' ' + classes + ' ').indexOf(' ' + className + ' ') !== -1;
-};
-exports.hasClass = hasClass;
+}
 
 /**
  * Removes a node from its parent. No-op if not attached to a parent.
- * @param {?Node} node The node to remove.
- * @return {?Node} The node removed if removed; else, null.
+ * @param node The node to remove.
+ * @return The node removed if removed; else, null.
  * @alias Blockly.utils.dom.removeNode
  */
 // Copied from Closure goog.dom.removeNode
-const removeNode = function(node) {
+export function removeNode(node: Node|null): Node|null {
   return node && node.parentNode ? node.parentNode.removeChild(node) : null;
-};
-exports.removeNode = removeNode;
+}
 
 /**
  * Insert a node after a reference node.
  * Contrast with node.insertBefore function.
- * @param {!Element} newNode New element to insert.
- * @param {!Element} refNode Existing element to precede new node.
+ * @param newNode New element to insert.
+ * @param refNode Existing element to precede new node.
  * @alias Blockly.utils.dom.insertAfter
  */
-const insertAfter = function(newNode, refNode) {
+export function insertAfter(newNode: Element, refNode: Element) {
   const siblingNode = refNode.nextSibling;
   const parentNode = refNode.parentNode;
   if (!parentNode) {
@@ -221,73 +194,71 @@ const insertAfter = function(newNode, refNode) {
   } else {
     parentNode.appendChild(newNode);
   }
-};
-exports.insertAfter = insertAfter;
+}
 
 /**
  * Whether a node contains another node.
- * @param {!Node} parent The node that should contain the other node.
- * @param {!Node} descendant The node to test presence of.
- * @return {boolean} Whether the parent node contains the descendant node.
+ * @param parent The node that should contain the other node.
+ * @param descendant The node to test presence of.
+ * @return Whether the parent node contains the descendant node.
  * @alias Blockly.utils.dom.containsNode
  */
-const containsNode = function(parent, descendant) {
+export function containsNode(parent: Node, descendant: Node): boolean {
   return !!(
       parent.compareDocumentPosition(descendant) &
       NodeType.DOCUMENT_POSITION_CONTAINED_BY);
-};
-exports.containsNode = containsNode;
+}
 
 /**
  * Sets the CSS transform property on an element. This function sets the
  * non-vendor-prefixed and vendor-prefixed versions for backwards compatibility
  * with older browsers. See https://caniuse.com/#feat=transforms2d
- * @param {!Element} element Element to which the CSS transform will be applied.
- * @param {string} transform The value of the CSS `transform` property.
+ * @param element Element to which the CSS transform will be applied.
+ * @param transform The value of the CSS `transform` property.
  * @alias Blockly.utils.dom.setCssTransform
  */
-const setCssTransform = function(element, transform) {
-  element.style['transform'] = transform;
-  element.style['-webkit-transform'] = transform;
-};
-exports.setCssTransform = setCssTransform;
+export function setCssTransform(element: Element, transform: string) {
+  // AnyDuringMigration because:  Property 'style' does not exist on type
+  // 'Element'.
+  (element as AnyDuringMigration).style['transform'] = transform;
+  // AnyDuringMigration because:  Property 'style' does not exist on type
+  // 'Element'.
+  (element as AnyDuringMigration).style['-webkit-transform'] = transform;
+}
 
 /**
  * Start caching text widths. Every call to this function MUST also call
  * stopTextWidthCache. Caches must not survive between execution threads.
  * @alias Blockly.utils.dom.startTextWidthCache
  */
-const startTextWidthCache = function() {
+export function startTextWidthCache() {
   cacheReference++;
   if (!cacheWidths) {
     cacheWidths = Object.create(null);
   }
-};
-exports.startTextWidthCache = startTextWidthCache;
+}
 
 /**
  * Stop caching field widths. Unless caching was already on when the
  * corresponding call to startTextWidthCache was made.
  * @alias Blockly.utils.dom.stopTextWidthCache
  */
-const stopTextWidthCache = function() {
+export function stopTextWidthCache() {
   cacheReference--;
   if (!cacheReference) {
     cacheWidths = null;
   }
-};
-exports.stopTextWidthCache = stopTextWidthCache;
+}
 
 /**
  * Gets the width of a text element, caching it in the process.
- * @param {!Element} textElement An SVG 'text' element.
- * @return {number} Width of element.
+ * @param textElement An SVG 'text' element.
+ * @return Width of element.
  * @alias Blockly.utils.dom.getTextWidth
  */
-const getTextWidth = function(textElement) {
+export function getTextWidth(textElement: SVGTextElement): number {
   const key = textElement.textContent + '\n' + textElement.className.baseVal;
   let width;
-
   // Return the cached width if it exists.
   if (cacheWidths) {
     width = cacheWidths[key];
@@ -308,7 +279,7 @@ const getTextWidth = function(textElement) {
     // approximation and do not cache the result. At some later point in time
     // when the block is inserted into the visible DOM, this method will be
     // called again and, at that point in time, will not throw an exception.
-    return textElement.textContent.length * 8;
+    return textElement.textContent!.length * 8;
   }
 
   // Cache the computed width and return.
@@ -316,26 +287,25 @@ const getTextWidth = function(textElement) {
     cacheWidths[key] = width;
   }
   return width;
-};
-exports.getTextWidth = getTextWidth;
+}
 
 /**
  * Gets the width of a text element using a faster method than `getTextWidth`.
  * This method requires that we know the text element's font family and size in
  * advance. Similar to `getTextWidth`, we cache the width we compute.
- * @param {!Element} textElement An SVG 'text' element.
- * @param {number} fontSize The font size to use.
- * @param {string} fontWeight The font weight to use.
- * @param {string} fontFamily The font family to use.
- * @return {number} Width of element.
+ * @param textElement An SVG 'text' element.
+ * @param fontSize The font size to use.
+ * @param fontWeight The font weight to use.
+ * @param fontFamily The font family to use.
+ * @return Width of element.
  * @alias Blockly.utils.dom.getFastTextWidth
  */
-const getFastTextWidth = function(
-    textElement, fontSize, fontWeight, fontFamily) {
+export function getFastTextWidth(
+    textElement: Element, fontSize: number, fontWeight: string,
+    fontFamily: string): number {
   return getFastTextWidthWithSizeString(
       textElement, fontSize + 'pt', fontWeight, fontFamily);
-};
-exports.getFastTextWidth = getFastTextWidth;
+}
 
 /**
  * Gets the width of a text element using a faster method than `getTextWidth`.
@@ -343,17 +313,21 @@ exports.getFastTextWidth = getFastTextWidth;
  * advance. Similar to `getTextWidth`, we cache the width we compute.
  * This method is similar to ``getFastTextWidth`` but expects the font size
  * parameter to be a string.
- * @param {!Element} textElement An SVG 'text' element.
- * @param {string} fontSize The font size to use.
- * @param {string} fontWeight The font weight to use.
- * @param {string} fontFamily The font family to use.
- * @return {number} Width of element.
+ * @param textElement An SVG 'text' element.
+ * @param fontSize The font size to use.
+ * @param fontWeight The font weight to use.
+ * @param fontFamily The font family to use.
+ * @return Width of element.
  * @alias Blockly.utils.dom.getFastTextWidthWithSizeString
  */
-const getFastTextWidthWithSizeString = function(
-    textElement, fontSize, fontWeight, fontFamily) {
+export function getFastTextWidthWithSizeString(
+    textElement: Element, fontSize: string, fontWeight: string,
+    fontFamily: string): number {
   const text = textElement.textContent;
-  const key = text + '\n' + textElement.className.baseVal;
+  // AnyDuringMigration because:  Property 'baseVal' does not exist on type
+  // 'string'.
+  const key =
+      text + '\n' + (textElement.className as AnyDuringMigration).baseVal;
   let width;
 
   // Return the cached width if it exists.
@@ -366,48 +340,53 @@ const getFastTextWidthWithSizeString = function(
 
   if (!canvasContext) {
     // Inject the canvas element used for computing text widths.
-    const computeCanvas = document.createElement('canvas');
+    const computeCanvas = (document.createElement('canvas'));
     computeCanvas.className = 'blocklyComputeCanvas';
     document.body.appendChild(computeCanvas);
 
     // Initialize the HTML canvas context and set the font.
     // The context font must match blocklyText's fontsize and font-family
     // set in CSS.
-    canvasContext = computeCanvas.getContext('2d');
+    canvasContext = computeCanvas.getContext('2d') as CanvasRenderingContext2D;
   }
   // Set the desired font size and family.
   canvasContext.font = fontWeight + ' ' + fontSize + ' ' + fontFamily;
 
   // Measure the text width using the helper canvas context.
-  width = canvasContext.measureText(text).width;
+  // AnyDuringMigration because:  Argument of type 'string | null' is not
+  // assignable to parameter of type 'string'.
+  width = canvasContext.measureText(text as AnyDuringMigration).width;
 
   // Cache the computed width and return.
   if (cacheWidths) {
     cacheWidths[key] = width;
   }
   return width;
-};
-exports.getFastTextWidthWithSizeString = getFastTextWidthWithSizeString;
+}
 
 /**
  * Measure a font's metrics. The height and baseline values.
- * @param {string} text Text to measure the font dimensions of.
- * @param {string} fontSize The font size to use.
- * @param {string} fontWeight The font weight to use.
- * @param {string} fontFamily The font family to use.
- * @return {{height: number, baseline: number}} Font measurements.
+ * @param text Text to measure the font dimensions of.
+ * @param fontSize The font size to use.
+ * @param fontWeight The font weight to use.
+ * @param fontFamily The font family to use.
+ * @return Font measurements.
  * @alias Blockly.utils.dom.measureFontMetrics
  */
-const measureFontMetrics = function(text, fontSize, fontWeight, fontFamily) {
-  const span = document.createElement('span');
+export function measureFontMetrics(
+    text: string, fontSize: string, fontWeight: string,
+    fontFamily: string): {height: number, baseline: number} {
+  const span = (document.createElement('span'));
   span.style.font = fontWeight + ' ' + fontSize + ' ' + fontFamily;
   span.textContent = text;
 
-  const block = /** @type {!HTMLDivElement} */ (document.createElement('div'));
+  const block = (document.createElement('div'));
   block.style.width = '1px';
-  block.style.height = 0;
+  // AnyDuringMigration because:  Type 'number' is not assignable to type
+  // 'string'.
+  block.style.height = 0 as AnyDuringMigration;
 
-  const div = /** @type {!HTMLDivElement} */ (document.createElement('div'));
+  const div = (document.createElement('div'));
   div.setAttribute('style', 'position: fixed; top: 0; left: 0; display: flex;');
   div.appendChild(span);
   div.appendChild(block);
@@ -426,5 +405,4 @@ const measureFontMetrics = function(text, fontSize, fontWeight, fontFamily) {
     document.body.removeChild(div);
   }
   return result;
-};
-exports.measureFontMetrics = measureFontMetrics;
+}