refactor: remove AnyDuringMigration from the block drag surface (#6302)

* fix: unnecessary nullability

* fix: rename SVG_ to svg_

* fix: add deprecation warning

* chore: format

core/block_drag_surface.ts

@@ -26,6 +26,7 @@ import * as goog from '../closure/goog/goog.js';
 goog.declareModuleId('Blockly.BlockDragSurfaceSvg');
 
 import {Coordinate} from './utils/coordinate.js';
+import * as deprecation from './utils/deprecation.js';
 import * as dom from './utils/dom.js';
 import {Svg} from './utils/svg.js';
 import * as svgMath from './utils/svg_math.js';
@@ -38,13 +39,13 @@ import * as svgMath from './utils/svg_math.js';
  */
 export class BlockDragSurfaceSvg {
   /** The SVG drag surface. Set once by BlockDragSurfaceSvg.createDom. */
-  private SVG_: SVGElement|null = null;
+  private svg_: SVGElement;
 
   /**
    * This is where blocks live while they are being dragged if the drag
    * surface is enabled.
    */
-  private dragGroup_: SVGElement|null = null;
+  private dragGroup_: SVGElement;
 
   /**
    * Cached value for the scale of the drag surface.
@@ -57,7 +58,7 @@ export class BlockDragSurfaceSvg {
    * This translation is in pixel units, because the scale is applied to the
    * drag group rather than the top-level SVG.
    */
-  private surfaceXY_: Coordinate|null = null;
+  private surfaceXY_: Coordinate = new Coordinate(0, 0);
   private readonly childSurfaceXY_: Coordinate;
 
   /** @param container Containing element. */
@@ -69,16 +70,7 @@ export class BlockDragSurfaceSvg {
      */
     this.childSurfaceXY_ = new Coordinate(0, 0);
 
-    this.createDom();
-  }
-
-  /** Create the drag surface and inject it into the container. */
-  createDom() {
-    if (this.SVG_) {
-      return;
-    }
-    // Already created.
-    this.SVG_ = dom.createSvgElement(
+    this.svg_ = dom.createSvgElement(
         Svg.SVG, {
           'xmlns': dom.SVG_NS,
           'xmlns:html': dom.HTML_NS,
@@ -87,10 +79,14 @@ export class BlockDragSurfaceSvg {
           'class': 'blocklyBlockDragSurface',
         },
         this.container);
-    // AnyDuringMigration because:  Argument of type 'SVGElement | null' is not
-    // assignable to parameter of type 'Element | undefined'.
-    this.dragGroup_ =
-        dom.createSvgElement(Svg.G, {}, this.SVG_ as AnyDuringMigration);
+    this.dragGroup_ = dom.createSvgElement(Svg.G, {}, this.svg_ as SVGElement);
+  }
+
+  /** Create the drag surface and inject it into the container. */
+  createDom() {
+    // No alternative provided, because now the dom is just automatically
+    // created in the constructor now.
+    deprecation.warn('BlockDragSurfaceSvg createDom', 'June 2022', 'June 2023');
   }
 
   /**
@@ -99,12 +95,12 @@ export class BlockDragSurfaceSvg {
    * @param blocks Block or group of blocks to place on the drag surface.
    */
   setBlocksAndShow(blocks: SVGElement) {
-    if (this.dragGroup_!.childNodes.length) {
+    if (this.dragGroup_.childNodes.length) {
       throw Error('Already dragging a block.');
     }
     // appendChild removes the blocks from the previous parent
-    this.dragGroup_!.appendChild(blocks);
-    this.SVG_!.style.display = 'block';
+    this.dragGroup_.appendChild(blocks);
+    this.svg_.style.display = 'block';
     this.surfaceXY_ = new Coordinate(0, 0);
   }
 
@@ -137,13 +133,8 @@ export class BlockDragSurfaceSvg {
     // Make sure the svg exists on a pixel boundary so that it is not fuzzy.
     x = Math.round(x);
     y = Math.round(y);
-    this.SVG_!.style.display = 'block';
-
-    // AnyDuringMigration because:  Argument of type 'SVGElement | null' is not
-    // assignable to parameter of type 'Element'.
-    dom.setCssTransform(
-        this.SVG_ as AnyDuringMigration,
-        'translate3d(' + x + 'px, ' + y + 'px, 0)');
+    this.svg_.style.display = 'block';
+    dom.setCssTransform(this.svg_, 'translate3d(' + x + 'px, ' + y + 'px, 0)');
   }
 
   /**
@@ -152,8 +143,8 @@ export class BlockDragSurfaceSvg {
    * @param deltaY Vertical offset in pixel units.
    */
   translateBy(deltaX: number, deltaY: number) {
-    const x = this.surfaceXY_!.x + deltaX;
-    const y = this.surfaceXY_!.y + deltaY;
+    const x = this.surfaceXY_.x + deltaX;
+    const y = this.surfaceXY_.y + deltaY;
     this.surfaceXY_ = new Coordinate(x, y);
     this.translateSurfaceInternal_();
   }
@@ -177,7 +168,7 @@ export class BlockDragSurfaceSvg {
    * @return Current translation of the surface.
    */
   getSurfaceTranslation(): Coordinate {
-    const xy = svgMath.getRelativeXY(this.SVG_ as SVGElement);
+    const xy = svgMath.getRelativeXY(this.svg_ as SVGElement);
     return new Coordinate(xy.x / this.scale_, xy.y / this.scale_);
   }
 
@@ -195,7 +186,7 @@ export class BlockDragSurfaceSvg {
    * @returns The SVG drag surface.
    */
   getSvgRoot(): SVGElement|null {
-    return this.SVG_;
+    return this.svg_;
   }
 
   /**
@@ -204,7 +195,7 @@ export class BlockDragSurfaceSvg {
    * @return Drag surface block DOM element, or null if no blocks exist.
    */
   getCurrentBlock(): Element|null {
-    return this.dragGroup_!.firstChild as Element;
+    return this.dragGroup_.firstChild as Element;
   }
 
   /**
@@ -234,13 +225,13 @@ export class BlockDragSurfaceSvg {
         // appendChild removes the node from this.dragGroup_
         opt_newSurface.appendChild(currentBlockElement);
       } else {
-        this.dragGroup_!.removeChild(currentBlockElement);
+        this.dragGroup_.removeChild(currentBlockElement);
       }
     }
-    this.SVG_!.style.display = 'none';
-    if (this.dragGroup_!.childNodes.length) {
+    this.svg_.style.display = 'none';
+    if (this.dragGroup_.childNodes.length) {
       throw Error('Drag group was not cleared.');
     }
-    this.surfaceXY_ = null;
+    this.surfaceXY_ = new Coordinate(0, 0);
   }
 }