chore: Remove some more uses of AnyDuringMigration (#6785)

* chore: Remove uses of AnyDuringMigration in workspace_comment_svg.ts. * chore: Remove uses of AnyDuringMigration in toolbox.ts. * chore: Remove uses of AnyDuringMigration in field_colour.ts. * chore: Remove uses of AnyDuringMigration from field_image.ts. * chore: Remove uses of AnyDuringMigration from workspace.ts. * Update core/workspace_comment_svg.ts Co-authored-by: Christopher Allen <cpcallen+github@gmail.com> * chore: Remove uses of AnyDuringMigration in collapsible_category.ts. * chore: Revert unary - change to make clang-format happy. * chore: Remove unnecessary quotes in toolbox.ts. * Update core/workspace_comment_svg.ts Co-authored-by: Christopher Allen <cpcallen+github@gmail.com> --------- Co-authored-by: Christopher Allen <cpcallen+github@gmail.com>
2026-03-14 09:10:09 +01:00 · 2023-02-03 08:03:31 -08:00
parent a73a70b7a8
commit 299016e78d
12 changed files with 111 additions and 222 deletions
--- a/core/events/events_comment_move.ts
+++ b/core/events/events_comment_move.ts
@@ -52,7 +52,7 @@ export class CommentMove extends CommentBase {
    }

    this.comment_ = opt_comment;
-    this.oldCoordinate_ = opt_comment.getXY();
+    this.oldCoordinate_ = opt_comment.getRelativeToSurfaceXY();
  }

  /**
@@ -70,7 +70,7 @@ export class CommentMove extends CommentBase {
          'The comment is undefined. Pass a comment to ' +
          'the constructor if you want to use the record functionality');
    }
-    this.newCoordinate_ = this.comment_.getXY();
+    this.newCoordinate_ = this.comment_.getRelativeToSurfaceXY();
  }

  /**
@@ -180,7 +180,7 @@ export class CommentMove extends CommentBase {
          'or call fromJson');
    }
    // TODO: Check if the comment is being dragged, and give up if so.
-    const current = comment.getXY();
+    const current = comment.getRelativeToSurfaceXY();
    comment.moveBy(target.x - current.x, target.y - current.y);
  }
 }
--- a/core/field_colour.ts
+++ b/core/field_colour.ts
@@ -117,17 +117,13 @@ export class FieldColour extends Field<string> {
  protected override isDirty_ = false;

  /** Array of colours used by this field.  If null, use the global list. */
-  // AnyDuringMigration because:  Type 'null' is not assignable to type
-  // 'string[]'.
-  private colours_: string[] = null as AnyDuringMigration;
+  private colours_: string[]|null = null;

  /**
   * Array of colour tooltips used by this field.  If null, use the global
   * list.
   */
-  // AnyDuringMigration because:  Type 'null' is not assignable to type
-  // 'string[]'.
-  private titles_: string[] = null as AnyDuringMigration;
+  private titles_: string[]|null = null;

  /**
   * Number of colour columns used by this field.  If 0, use the global
@@ -211,8 +207,7 @@ export class FieldColour extends Field<string> {
   * @param opt_newValue The input value.
   * @returns A valid colour, or null if invalid.
   */
-  protected override doClassValidation_(opt_newValue?: AnyDuringMigration):
-      string|null {
+  protected override doClassValidation_(opt_newValue?: any): string|null {
    if (typeof opt_newValue !== 'string') {
      return null;
    }
@@ -415,9 +410,7 @@ export class FieldColour extends Field<string> {

  /** Handle a mouse enter event. Focus the picker. */
  private onMouseEnter_() {
-    // AnyDuringMigration because:  Property 'focus' does not exist on type
-    // 'Element'.
-    (this.picker_ as AnyDuringMigration)!.focus({preventScroll: true});
+    this.picker_?.focus({preventScroll: true});
  }

  /**
@@ -425,9 +418,7 @@ export class FieldColour extends Field<string> {
   * the currently highlighted colour.
   */
  private onMouseLeave_() {
-    // AnyDuringMigration because:  Property 'blur' does not exist on type
-    // 'Element'.
-    (this.picker_ as AnyDuringMigration)!.blur();
+    this.picker_?.blur();
    const highlighted = this.getHighlighted_();
    if (highlighted) {
      dom.removeClass(highlighted, 'blocklyColourHighlighted');
@@ -473,11 +464,10 @@ export class FieldColour extends Field<string> {
    this.highlightedIndex_ = index;

    // Update accessibility roles.
-    // AnyDuringMigration because:  Argument of type 'string | null' is not
-    // assignable to parameter of type 'string | number | boolean | string[]'.
-    aria.setState(
-        this.picker_ as Element, aria.State.ACTIVEDESCENDANT,
-        cell.getAttribute('id') as AnyDuringMigration);
+    const cellId = cell.getAttribute('id');
+    if (cellId && this.picker_) {
+      aria.setState(this.picker_, aria.State.ACTIVEDESCENDANT, cellId);
+    }
  }

  /** Create a colour picker dropdown editor. */
--- a/core/field_image.ts
+++ b/core/field_image.ts
@@ -35,12 +35,10 @@ export class FieldImage extends Field<string> {
  private readonly imageHeight_: number;

  /** The function to be called when this field is clicked. */
-  private clickHandler_: ((p1: FieldImage) => AnyDuringMigration)|null = null;
+  private clickHandler_: ((p1: FieldImage) => void)|null = null;

  /** The rendered field's image element. */
-  // AnyDuringMigration because:  Type 'null' is not assignable to type
-  // 'SVGImageElement'.
-  private imageElement_: SVGImageElement = null as AnyDuringMigration;
+  private imageElement_: SVGImageElement|null = null;

  /**
   * Editable fields usually show some sort of UI indicating they are
@@ -79,7 +77,7 @@ export class FieldImage extends Field<string> {
   */
  constructor(
      src: string|Sentinel, width: string|number, height: string|number,
-      opt_alt?: string, opt_onClick?: (p1: FieldImage) => AnyDuringMigration,
+      opt_alt?: string, opt_onClick?: (p1: FieldImage) => void,
      opt_flipRtl?: boolean, opt_config?: FieldImageConfig) {
    super(Field.SKIP_SETUP);

@@ -164,8 +162,7 @@ export class FieldImage extends Field<string> {
   * @param opt_newValue The input value.
   * @returns A string, or null if invalid.
   */
-  protected override doClassValidation_(opt_newValue?: AnyDuringMigration):
-      string|null {
+  protected override doClassValidation_(opt_newValue?: any): string|null {
    if (typeof opt_newValue !== 'string') {
      return null;
    }
@@ -226,7 +223,7 @@ export class FieldImage extends Field<string> {
   * @param func The function that is called when the image is clicked, or null
   *     to remove.
   */
-  setOnClickHandler(func: ((p1: FieldImage) => AnyDuringMigration)|null) {
+  setOnClickHandler(func: ((p1: FieldImage) => void)|null) {
    this.clickHandler_ = func;
  }

--- a/core/interfaces/i_copyable.ts
+++ b/core/interfaces/i_copyable.ts
@@ -31,7 +31,7 @@ export namespace ICopyable {
  export interface CopyData {
    saveInfo: Object|Element;
    source: WorkspaceSvg;
-    typeCounts: Object|null;
+    typeCounts: {[key: string]: number}|null;
  }
 }

--- a/core/interfaces/i_selectable_toolbox_item.ts
+++ b/core/interfaces/i_selectable_toolbox_item.ts
@@ -61,3 +61,11 @@ export interface ISelectableToolboxItem extends IToolboxItem {
   */
  onClick(_e: Event): void;
 }
+
+/**
+ * Type guard that checks whether an IToolboxItem is an ISelectableToolboxItem.
+ */
+export function isSelectableToolboxItem(toolboxItem: IToolboxItem):
+    toolboxItem is ISelectableToolboxItem {
+  return toolboxItem.isSelectable();
+}
--- a/core/toolbox/collapsible_category.ts
+++ b/core/toolbox/collapsible_category.ts
@@ -42,8 +42,6 @@ export class CollapsibleToolboxCategory extends ToolboxCategory implements

  /** The child toolbox items for this category. */
  protected toolboxItems_: IToolboxItem[] = [];
-  override flyoutItems_: AnyDuringMigration;
-  override isHidden_: AnyDuringMigration;

  /**
   * @param categoryDef The information needed to create a category in the
@@ -60,25 +58,18 @@ export class CollapsibleToolboxCategory extends ToolboxCategory implements

  override makeDefaultCssConfig_() {
    const cssConfig = super.makeDefaultCssConfig_();
-    (cssConfig as AnyDuringMigration)['contents'] = 'blocklyToolboxContents';
+    cssConfig['contents'] = 'blocklyToolboxContents';
    return cssConfig;
  }

  override parseContents_(categoryDef: toolbox.CategoryInfo) {
-    // AnyDuringMigration because:  Element implicitly has an 'any' type because
-    // expression of type '"contents"' can't be used to index type
-    // 'CategoryInfo'.
-    const contents = (categoryDef as AnyDuringMigration)['contents'];
-    let prevIsFlyoutItem = true;
-
-    // AnyDuringMigration because:  Element implicitly has an 'any' type because
-    // expression of type '"custom"' can't be used to index type 'CategoryInfo'.
-    if ((categoryDef as AnyDuringMigration)['custom']) {
-      // AnyDuringMigration because:  Element implicitly has an 'any' type
-      // because expression of type '"custom"' can't be used to index type
-      // 'CategoryInfo'.
-      this.flyoutItems_ = (categoryDef as AnyDuringMigration)['custom'];
-    } else if (contents) {
+    if ('custom' in categoryDef) {
+      this.flyoutItems_ = categoryDef['custom'];
+    } else {
+      const contents = categoryDef['contents'];
+      if (!contents) return;
+      this.flyoutItems_ = [];
+      let prevIsFlyoutItem = true;
      for (let i = 0; i < contents.length; i++) {
        const itemDef = contents[i];
        // Separators can exist as either a flyout item or a toolbox item so
@@ -123,8 +114,8 @@ export class CollapsibleToolboxCategory extends ToolboxCategory implements
    super.init();

    this.setExpanded(
-        (this.toolboxItemDef_ as AnyDuringMigration)['expanded'] === 'true' ||
-        (this.toolboxItemDef_ as AnyDuringMigration)['expanded']);
+        this.toolboxItemDef_['expanded'] === 'true' ||
+        !!this.toolboxItemDef_['expanded']);
  }

  override createDom_() {
@@ -141,7 +132,7 @@ export class CollapsibleToolboxCategory extends ToolboxCategory implements
  override createIconDom_() {
    const toolboxIcon = document.createElement('span');
    if (!this.parentToolbox_.isHorizontal()) {
-      const className = (this.cssConfig_ as AnyDuringMigration)['icon'];
+      const className = this.cssConfig_['icon'];
      if (className) {
        dom.addClass(toolboxIcon, className);
      }
@@ -161,7 +152,7 @@ export class CollapsibleToolboxCategory extends ToolboxCategory implements
  protected createSubCategoriesDom_(subcategories: IToolboxItem[]):
      HTMLDivElement {
    const contentsContainer = document.createElement('div');
-    const className = (this.cssConfig_ as AnyDuringMigration)['contents'];
+    const className = this.cssConfig_['contents'];
    if (className) {
      dom.addClass(contentsContainer, className);
    }
--- a/core/toolbox/toolbox.ts
+++ b/core/toolbox/toolbox.ts
@@ -29,6 +29,7 @@ import type {IDraggable} from '../interfaces/i_draggable.js';
 import type {IFlyout} from '../interfaces/i_flyout.js';
 import type {IKeyboardAccessible} from '../interfaces/i_keyboard_accessible.js';
 import type {ISelectableToolboxItem} from '../interfaces/i_selectable_toolbox_item.js';
+import {isSelectableToolboxItem} from '../interfaces/i_selectable_toolbox_item.js';
 import type {IStyleable} from '../interfaces/i_styleable.js';
 import type {IToolbox} from '../interfaces/i_toolbox.js';
 import type {IToolboxItem} from '../interfaces/i_toolbox_item.js';
@@ -100,7 +101,6 @@ export class Toolbox extends DeleteArea implements IAutoHideable,
   * Ex: [[node, name, func], [node, name, func]].
   */
  protected boundEvents_: browserEvents.Data[] = [];
-  override wouldDelete_: AnyDuringMigration;

  /** The workspace this toolbox is on. */
  protected readonly workspace_: WorkspaceSvg;
@@ -112,10 +112,9 @@ export class Toolbox extends DeleteArea implements IAutoHideable,
    this.workspace_ = workspace;

    /** The JSON describing the contents of this toolbox. */
-    // AnyDuringMigration because:  Type 'ToolboxInfo | { contents: never[]; }'
-    // is not assignable to type 'ToolboxInfo'.
-    this.toolboxDef_ = (workspace.options.languageTree || {'contents': []}) as
-        AnyDuringMigration;
+    this.toolboxDef_ =
+        (workspace.options.languageTree ||
+         {contents: new Array<toolbox.ToolboxItemInfo>()});

    /** Whether the toolbox should be laid out horizontally. */
    this.horizontalLayout_ = workspace.options.horizontalLayout;
@@ -299,9 +298,8 @@ export class Toolbox extends DeleteArea implements IAutoHideable,
    if (!handled && this.selectedItem_) {
      // TODO(#6097): Figure out who implements onKeyDown and which interface it
      // should be part of.
-      const untypedItem = this.selectedItem_ as AnyDuringMigration;
-      if (untypedItem.onKeyDown) {
-        handled = untypedItem.onKeyDown(e);
+      if ((this.selectedItem_ as any).onKeyDown) {
+        handled = (this.selectedItem_ as any).onKeyDown(e);
      }
    }

@@ -796,33 +794,20 @@ export class Toolbox extends DeleteArea implements IAutoHideable,
  setSelectedItem(newItem: IToolboxItem|null) {
    const oldItem = this.selectedItem_;

-    if (!newItem && !oldItem || newItem && !newItem.isSelectable()) {
+    if (!newItem && !oldItem || newItem && !isSelectableToolboxItem(newItem)) {
      return;
    }
-    newItem = newItem as ISelectableToolboxItem;

-    // AnyDuringMigration because:  Argument of type 'IToolboxItem' is not
-    // assignable to parameter of type 'ISelectableToolboxItem'.
-    if (this.shouldDeselectItem_(oldItem, newItem as AnyDuringMigration) &&
-        oldItem !== null) {
+    if (this.shouldDeselectItem_(oldItem, newItem) && oldItem !== null) {
      this.deselectItem_(oldItem);
    }

-    // AnyDuringMigration because:  Argument of type 'IToolboxItem' is not
-    // assignable to parameter of type 'ISelectableToolboxItem'.
-    if (this.shouldSelectItem_(oldItem, newItem as AnyDuringMigration) &&
-        newItem !== null) {
-      // AnyDuringMigration because:  Argument of type 'IToolboxItem' is not
-      // assignable to parameter of type 'ISelectableToolboxItem'.
-      this.selectItem_(oldItem, newItem as AnyDuringMigration);
+    if (this.shouldSelectItem_(oldItem, newItem) && newItem !== null) {
+      this.selectItem_(oldItem, newItem);
    }

-    // AnyDuringMigration because:  Argument of type 'IToolboxItem' is not
-    // assignable to parameter of type 'ISelectableToolboxItem'.
-    this.updateFlyout_(oldItem, newItem as AnyDuringMigration);
-    // AnyDuringMigration because:  Argument of type 'IToolboxItem' is not
-    // assignable to parameter of type 'ISelectableToolboxItem'.
-    this.fireSelectEvent_(oldItem, newItem as AnyDuringMigration);
+    this.updateFlyout_(oldItem, newItem);
+    this.fireSelectEvent_(oldItem, newItem);
  }

  /**
@@ -1044,11 +1029,10 @@ export class Toolbox extends DeleteArea implements IAutoHideable,
    this.boundEvents_ = [];
    this.contents_ = [];

-    // AnyDuringMigration because:  Argument of type 'HTMLDivElement | null' is
-    // not assignable to parameter of type 'Element'.
-    this.workspace_.getThemeManager().unsubscribe(
-        this.HtmlDiv as AnyDuringMigration);
-    dom.removeNode(this.HtmlDiv);
+    if (this.HtmlDiv) {
+      this.workspace_.getThemeManager().unsubscribe(this.HtmlDiv);
+      dom.removeNode(this.HtmlDiv);
+    }
  }
 }

--- a/core/utils/toolbox.ts
+++ b/core/utils/toolbox.ts
@@ -99,6 +99,7 @@ export interface StaticCategoryInfo {
  colour: string|undefined;
  cssconfig: CategoryCssConfig|undefined;
  hidden: string|undefined;
+  expanded?: string|boolean;
 }

 /**
@@ -114,6 +115,7 @@ export interface DynamicCategoryInfo {
  colour: string|undefined;
  cssconfig: CategoryCssConfig|undefined;
  hidden: string|undefined;
+  expanded?: string|boolean;
 }

 /**
--- a/core/workspace.ts
+++ b/core/workspace.ts
@@ -172,22 +172,11 @@ export class Workspace implements IASTNodeLocation {
   */
  private sortObjects_(a: Block|WorkspaceComment, b: Block|WorkspaceComment):
      number {
-    // AnyDuringMigration because:  Property 'getRelativeToSurfaceXY' does not
-    // exist on type 'Block | WorkspaceComment'.
-    const aXY = (a as AnyDuringMigration).getRelativeToSurfaceXY();
-    // AnyDuringMigration because:  Property 'getRelativeToSurfaceXY' does not
-    // exist on type 'Block | WorkspaceComment'.
-    const bXY = (b as AnyDuringMigration).getRelativeToSurfaceXY();
-    // AnyDuringMigration because:  Property 'offset' does not exist on type
-    // '(a: Block | WorkspaceComment, b: Block | WorkspaceComment) => number'.
-    // AnyDuringMigration because:  Property 'offset' does not exist on type
-    // '(a: Block | WorkspaceComment, b: Block | WorkspaceComment) => number'.
-    return aXY.y +
-        (Workspace.prototype.sortObjects_ as AnyDuringMigration).offset *
-        aXY.x -
-        (bXY.y +
-         (Workspace.prototype.sortObjects_ as AnyDuringMigration).offset *
-             bXY.x);
+    const offset =
+        Math.sin(math.toRadians(Workspace.SCAN_ANGLE)) * (this.RTL ? -1 : 1);
+    const aXY = a.getRelativeToSurfaceXY();
+    const bXY = b.getRelativeToSurfaceXY();
+    return aXY.y + offset * aXY.x - (bXY.y + offset * bXY.x);
  }

  /**
@@ -221,17 +210,7 @@ export class Workspace implements IASTNodeLocation {
    // Copy the topBlocks list.
    const blocks = (new Array<Block>()).concat(this.topBlocks);
    if (ordered && blocks.length > 1) {
-      // AnyDuringMigration because:  Property 'offset' does not exist on type
-      // '(a: Block | WorkspaceComment, b: Block | WorkspaceComment) => number'.
-      (this.sortObjects_ as AnyDuringMigration).offset =
-          Math.sin(math.toRadians(Workspace.SCAN_ANGLE));
-      if (this.RTL) {
-        // AnyDuringMigration because:  Property 'offset' does not exist on type
-        // '(a: Block | WorkspaceComment, b: Block | WorkspaceComment) =>
-        // number'.
-        (this.sortObjects_ as AnyDuringMigration).offset *= -1;
-      }
-      blocks.sort(this.sortObjects_);
+      blocks.sort(this.sortObjects_.bind(this));
    }
    return blocks;
  }
@@ -274,20 +253,10 @@ export class Workspace implements IASTNodeLocation {
    }
    const blocks = this.typedBlocksDB.get(type)!.slice(0);
    if (ordered && blocks && blocks.length > 1) {
-      // AnyDuringMigration because:  Property 'offset' does not exist on type
-      // '(a: Block | WorkspaceComment, b: Block | WorkspaceComment) => number'.
-      (this.sortObjects_ as AnyDuringMigration).offset =
-          Math.sin(math.toRadians(Workspace.SCAN_ANGLE));
-      if (this.RTL) {
-        // AnyDuringMigration because:  Property 'offset' does not exist on type
-        // '(a: Block | WorkspaceComment, b: Block | WorkspaceComment) =>
-        // number'.
-        (this.sortObjects_ as AnyDuringMigration).offset *= -1;
-      }
-      blocks.sort(this.sortObjects_);
+      blocks.sort(this.sortObjects_.bind(this));
    }

-    return blocks.filter(function(block: AnyDuringMigration) {
+    return blocks.filter(function(block: Block) {
      return !block.isInsertionMarker();
    });
  }
@@ -340,17 +309,7 @@ export class Workspace implements IASTNodeLocation {
    // Copy the topComments list.
    const comments = (new Array<WorkspaceComment>()).concat(this.topComments);
    if (ordered && comments.length > 1) {
-      // AnyDuringMigration because:  Property 'offset' does not exist on type
-      // '(a: Block | WorkspaceComment, b: Block | WorkspaceComment) => number'.
-      (this.sortObjects_ as AnyDuringMigration).offset =
-          Math.sin(math.toRadians(Workspace.SCAN_ANGLE));
-      if (this.RTL) {
-        // AnyDuringMigration because:  Property 'offset' does not exist on type
-        // '(a: Block | WorkspaceComment, b: Block | WorkspaceComment) =>
-        // number'.
-        (this.sortObjects_ as AnyDuringMigration).offset *= -1;
-      }
-      comments.sort(this.sortObjects_);
+      comments.sort(this.sortObjects_.bind(this));
    }
    return comments;
  }
@@ -363,7 +322,7 @@ export class Workspace implements IASTNodeLocation {
   * @returns Array of blocks.
   */
  getAllBlocks(ordered: boolean): Block[] {
-    let blocks: AnyDuringMigration[];
+    let blocks: Block[];
    if (ordered) {
      // Slow, but ordered.
      const topBlocks = this.getTopBlocks(true);
@@ -598,7 +557,7 @@ export class Workspace implements IASTNodeLocation {
   *     to be created).
   * @returns True if there is capacity for the given map, false otherwise.
   */
-  isCapacityAvailable(typeCountsMap: AnyDuringMigration): boolean {
+  isCapacityAvailable(typeCountsMap: {[key: string]: number}): boolean {
    if (!this.hasBlockLimits()) {
      return true;
    }
@@ -661,9 +620,9 @@ export class Workspace implements IASTNodeLocation {
    // Do another undo/redo if the next one is of the same group.
    while (inputStack.length && inputEvent.group &&
           inputEvent.group === inputStack[inputStack.length - 1].group) {
-      // AnyDuringMigration because:  Argument of type 'Abstract | undefined' is
-      // not assignable to parameter of type 'Abstract'.
-      events.push(inputStack.pop() as AnyDuringMigration);
+      const event = inputStack.pop();
+      if (!event) continue;
+      events.push(event);
    }
    // Push these popped events on the opposite stack.
    for (let i = 0; i < events.length; i++) {
--- a/core/workspace_comment.ts
+++ b/core/workspace_comment.ts
@@ -154,7 +154,7 @@ export class WorkspaceComment {
   *   This is not valid if the comment is currently being dragged.
   * @internal
   */
-  getXY(): Coordinate {
+  getRelativeToSurfaceXY(): Coordinate {
    return new Coordinate(this.xy_.x, this.xy_.y);
  }

--- a/core/workspace_comment_svg.ts
+++ b/core/workspace_comment_svg.ts
@@ -88,7 +88,7 @@ export class WorkspaceCommentSvg extends WorkspaceComment implements
  private autoLayout_ = false;
  // Create core elements for the block.
  private readonly svgGroup_: SVGElement;
-  svgRect_: AnyDuringMigration;
+  svgRect_: SVGRectElement;

  /** Whether the comment is rendered onscreen and is a part of the DOM. */
  private rendered_ = false;
@@ -296,20 +296,18 @@ export class WorkspaceCommentSvg extends WorkspaceComment implements
   * @returns Object with .x and .y properties in workspace coordinates.
   * @internal
   */
-  getRelativeToSurfaceXY(): Coordinate {
+  override getRelativeToSurfaceXY(): Coordinate {
    let x = 0;
    let y = 0;

-    let element = this.getSvgRoot();
+    let element: Node|null = this.getSvgRoot();
    if (element) {
      do {
        // Loop through this comment and every parent.
        const xy = svgMath.getRelativeXY(element as Element);
        x += xy.x;
        y += xy.y;
-        // AnyDuringMigration because:  Type 'ParentNode | null' is not
-        // assignable to type 'SVGElement'.
-        element = element.parentNode as AnyDuringMigration;
+        element = element.parentNode;
      } while (element && element !== this.workspace.getBubbleCanvas() &&
               element !== null);
    }
@@ -533,21 +531,11 @@ export class WorkspaceCommentSvg extends WorkspaceComment implements
    }
    const element = this.toXml(opt_noId);
    const xy = this.getRelativeToSurfaceXY();
-    // AnyDuringMigration because:  Argument of type 'number' is not assignable
-    // to parameter of type 'string'.
    element.setAttribute(
-        'x',
-        Math.round(this.workspace.RTL ? width - xy.x : xy.x) as
-            AnyDuringMigration);
-    // AnyDuringMigration because:  Argument of type 'number' is not assignable
-    // to parameter of type 'string'.
-    element.setAttribute('y', Math.round(xy.y) as AnyDuringMigration);
-    // AnyDuringMigration because:  Argument of type 'number' is not assignable
-    // to parameter of type 'string'.
-    element.setAttribute('h', this.getHeight() as AnyDuringMigration);
-    // AnyDuringMigration because:  Argument of type 'number' is not assignable
-    // to parameter of type 'string'.
-    element.setAttribute('w', this.getWidth() as AnyDuringMigration);
+        'x', String(Math.round(this.workspace.RTL ? width - xy.x : xy.x)));
+    element.setAttribute('y', String(Math.round(xy.y)));
+    element.setAttribute('h', String(this.getHeight()));
+    element.setAttribute('w', String(this.getWidth()));
    return element;
  }

@@ -588,16 +576,12 @@ export class WorkspaceCommentSvg extends WorkspaceComment implements
    const size = this.getHeightWidth();

    // Add text area
-    this.createEditor_();
-    // AnyDuringMigration because:  Argument of type 'SVGForeignObjectElement |
-    // null' is not assignable to parameter of type 'Node'.
-    this.svgGroup_.appendChild(this.foreignObject_ as AnyDuringMigration);
+    const foreignObject = this.createEditor_();
+    this.svgGroup_.appendChild(foreignObject);

    this.svgHandleTarget_ = dom.createSvgElement(
        Svg.RECT, {'class': 'blocklyCommentHandleTarget', 'x': 0, 'y': 0});
-    // AnyDuringMigration because:  Argument of type 'SVGRectElement | null' is
-    // not assignable to parameter of type 'Node'.
-    this.svgGroup_.appendChild(this.svgHandleTarget_ as AnyDuringMigration);
+    this.svgGroup_.appendChild(this.svgHandleTarget_);
    this.svgRectTarget_ = dom.createSvgElement(Svg.RECT, {
      'class': 'blocklyCommentTarget',
      'x': 0,
@@ -605,9 +589,7 @@ export class WorkspaceCommentSvg extends WorkspaceComment implements
      'rx': BORDER_RADIUS,
      'ry': BORDER_RADIUS,
    });
-    // AnyDuringMigration because:  Argument of type 'SVGRectElement | null' is
-    // not assignable to parameter of type 'Node'.
-    this.svgGroup_.appendChild(this.svgRectTarget_ as AnyDuringMigration);
+    this.svgGroup_.appendChild(this.svgRectTarget_);

    // Add the resize icon
    this.addResizeDom_();
@@ -671,10 +653,10 @@ export class WorkspaceCommentSvg extends WorkspaceComment implements
    textarea.readOnly = !this.isEditable();
    body.appendChild(textarea);
    this.textarea_ = textarea;
-    this.foreignObject_!.appendChild(body);
+    this.foreignObject_.appendChild(body);
    // Don't zoom with mousewheel.
    browserEvents.conditionalBind(
-        textarea, 'wheel', this, function(e: AnyDuringMigration) {
+        textarea, 'wheel', this, function(e: WheelEvent) {
          e.stopPropagation();
        });
    browserEvents.conditionalBind(
@@ -682,9 +664,7 @@ export class WorkspaceCommentSvg extends WorkspaceComment implements
        function(this: WorkspaceCommentSvg, _e: Event) {
          this.setContent(textarea.value);
        });
-    // AnyDuringMigration because:  Type 'SVGForeignObjectElement | null' is not
-    // assignable to type 'Element'.
-    return this.foreignObject_ as AnyDuringMigration;
+    return this.foreignObject_;
  }

  /** Add the resize icon to the DOM */
@@ -692,14 +672,10 @@ export class WorkspaceCommentSvg extends WorkspaceComment implements
    this.resizeGroup_ = dom.createSvgElement(
        Svg.G, {'class': this.RTL ? 'blocklyResizeSW' : 'blocklyResizeSE'},
        this.svgGroup_);
-    // AnyDuringMigration because:  Argument of type 'SVGGElement | null' is not
-    // assignable to parameter of type 'Element | undefined'.
    dom.createSvgElement(
        Svg.POLYGON,
        {'points': '0,x x,x x,0'.replace(/x/g, RESIZE_SIZE.toString())},
-        this.resizeGroup_ as AnyDuringMigration);
-    // AnyDuringMigration because:  Argument of type 'SVGGElement | null' is not
-    // assignable to parameter of type 'Element | undefined'.
+        this.resizeGroup_);
    dom.createSvgElement(
        Svg.LINE, {
          'class': 'blocklyResizeLine',
@@ -708,9 +684,7 @@ export class WorkspaceCommentSvg extends WorkspaceComment implements
          'x2': RESIZE_SIZE - 1,
          'y2': RESIZE_SIZE / 3,
        },
-        this.resizeGroup_ as AnyDuringMigration);
-    // AnyDuringMigration because:  Argument of type 'SVGGElement | null' is not
-    // assignable to parameter of type 'Element | undefined'.
+        this.resizeGroup_);
    dom.createSvgElement(
        Svg.LINE, {
          'class': 'blocklyResizeLine',
@@ -719,22 +693,18 @@ export class WorkspaceCommentSvg extends WorkspaceComment implements
          'x2': RESIZE_SIZE - 1,
          'y2': RESIZE_SIZE * 2 / 3,
        },
-        this.resizeGroup_ as AnyDuringMigration);
+        this.resizeGroup_);
  }

  /** Add the delete icon to the DOM */
  private addDeleteDom_() {
    this.deleteGroup_ = dom.createSvgElement(
        Svg.G, {'class': 'blocklyCommentDeleteIcon'}, this.svgGroup_);
-    // AnyDuringMigration because:  Argument of type 'SVGGElement | null' is not
-    // assignable to parameter of type 'Element | undefined'.
    this.deleteIconBorder_ = dom.createSvgElement(
        Svg.CIRCLE,
        {'class': 'blocklyDeleteIconShape', 'r': '7', 'cx': '7.5', 'cy': '7.5'},
-        this.deleteGroup_ as AnyDuringMigration);
+        this.deleteGroup_);
    // x icon.
-    // AnyDuringMigration because:  Argument of type 'SVGGElement | null' is not
-    // assignable to parameter of type 'Element | undefined'.
    dom.createSvgElement(
        Svg.LINE, {
          'x1': '5',
@@ -744,9 +714,7 @@ export class WorkspaceCommentSvg extends WorkspaceComment implements
          'stroke': '#fff',
          'stroke-width': '2',
        },
-        this.deleteGroup_ as AnyDuringMigration);
-    // AnyDuringMigration because:  Argument of type 'SVGGElement | null' is not
-    // assignable to parameter of type 'Element | undefined'.
+        this.deleteGroup_);
    dom.createSvgElement(
        Svg.LINE, {
          'x1': '5',
@@ -756,7 +724,7 @@ export class WorkspaceCommentSvg extends WorkspaceComment implements
          'stroke': '#fff',
          'stroke-width': '2',
        },
-        this.deleteGroup_ as AnyDuringMigration);
+        this.deleteGroup_);
  }

  /**
@@ -867,17 +835,15 @@ export class WorkspaceCommentSvg extends WorkspaceComment implements
    const topOffset = WorkspaceCommentSvg.TOP_OFFSET;
    const textOffset = TEXTAREA_OFFSET * 2;

-    // AnyDuringMigration because:  Argument of type 'number' is not assignable
-    // to parameter of type 'string'.
-    this.foreignObject_!.setAttribute(
-        'width', size.width as AnyDuringMigration);
-    this.foreignObject_!.setAttribute(
-        'height', (size.height - topOffset).toString());
+    this.foreignObject_?.setAttribute('width', `${size.width}`);
+    this.foreignObject_?.setAttribute('height', `${size.height - topOffset}`);
    if (this.RTL) {
-      this.foreignObject_!.setAttribute('x', (-size.width).toString());
+      this.foreignObject_?.setAttribute('x', `${- size.width}`);
    }
-    this.textarea_!.style.width = size.width - textOffset + 'px';
-    this.textarea_!.style.height = size.height - textOffset - topOffset + 'px';
+
+    if (!this.textarea_) return;
+    this.textarea_.style.width = size.width - textOffset + 'px';
+    this.textarea_.style.height = size.height - textOffset - topOffset + 'px';
  }

  /**
@@ -892,24 +858,16 @@ export class WorkspaceCommentSvg extends WorkspaceComment implements
    height = Math.max(height, 20 + WorkspaceCommentSvg.TOP_OFFSET);
    this.width_ = width;
    this.height_ = height;
-    this.svgRect_.setAttribute('width', width);
-    this.svgRect_.setAttribute('height', height);
-    // AnyDuringMigration because:  Argument of type 'number' is not assignable
-    // to parameter of type 'string'.
-    this.svgRectTarget_!.setAttribute('width', width as AnyDuringMigration);
-    // AnyDuringMigration because:  Argument of type 'number' is not assignable
-    // to parameter of type 'string'.
-    this.svgRectTarget_!.setAttribute('height', height as AnyDuringMigration);
-    // AnyDuringMigration because:  Argument of type 'number' is not assignable
-    // to parameter of type 'string'.
-    this.svgHandleTarget_!.setAttribute('width', width as AnyDuringMigration);
-    // AnyDuringMigration because:  Argument of type 'number' is not assignable
-    // to parameter of type 'string'.
-    this.svgHandleTarget_!.setAttribute(
-        'height', WorkspaceCommentSvg.TOP_OFFSET as AnyDuringMigration);
+    this.svgRect_.setAttribute('width', `${width}`);
+    this.svgRect_.setAttribute('height', `${height}`);
+    this.svgRectTarget_?.setAttribute('width', `${width}`);
+    this.svgRectTarget_?.setAttribute('height', `${height}`);
+    this.svgHandleTarget_?.setAttribute('width', `${width}`);
+    this.svgHandleTarget_?.setAttribute(
+        'height', `${WorkspaceCommentSvg.TOP_OFFSET}`);
    if (this.RTL) {
      this.svgRect_.setAttribute('transform', 'scale(-1 1)');
-      this.svgRectTarget_!.setAttribute('transform', 'scale(-1 1)');
+      this.svgRectTarget_?.setAttribute('transform', 'scale(-1 1)');
    }

    if (this.resizeGroup_) {
@@ -919,7 +877,7 @@ export class WorkspaceCommentSvg extends WorkspaceComment implements
            'transform',
            'translate(' + (-width + RESIZE_SIZE) + ',' +
                (height - RESIZE_SIZE) + ') scale(-1 1)');
-        this.deleteGroup_!.setAttribute(
+        this.deleteGroup_?.setAttribute(
            'transform',
            'translate(' + (-width + RESIZE_SIZE) + ',' + -RESIZE_SIZE +
                ') scale(-1 1)');
@@ -928,7 +886,7 @@ export class WorkspaceCommentSvg extends WorkspaceComment implements
            'transform',
            'translate(' + (width - RESIZE_SIZE) + ',' +
                (height - RESIZE_SIZE) + ')');
-        this.deleteGroup_!.setAttribute(
+        this.deleteGroup_?.setAttribute(
            'transform',
            'translate(' + (width - RESIZE_SIZE) + ',' + -RESIZE_SIZE + ')');
      }
--- a/tests/mocha/workspace_comment_test.js
+++ b/tests/mocha/workspace_comment_test.js
@@ -152,14 +152,14 @@ suite('Workspace comment', function() {
    });

    test('Initial position', function() {
-      const xy = this.comment.getXY();
+      const xy = this.comment.getRelativeToSurfaceXY();
      chai.assert.equal(xy.x, 0, 'Initial X position');
      chai.assert.equal(xy.y, 0, 'Initial Y position');
    });

    test('moveBy', function() {
      this.comment.moveBy(10, 100);
-      const xy = this.comment.getXY();
+      const xy = this.comment.getRelativeToSurfaceXY();
      chai.assert.equal(xy.x, 10, 'New X position');
      chai.assert.equal(xy.y, 100, 'New Y position');
    });