diff --git a/core/workspace_drag_surface_svg.js b/core/workspace_drag_surface_svg.js
index cef1f7921..8cffb37d6 100644
--- a/core/workspace_drag_surface_svg.js
+++ b/core/workspace_drag_surface_svg.js
@@ -14,13 +14,14 @@
 
 'use strict';
 
-goog.provide('Blockly.WorkspaceDragSurfaceSvg');
+goog.module('Blockly.WorkspaceDragSurfaceSvg');
+goog.module.declareLegacyNamespace();
 
-goog.require('Blockly.utils');
-goog.require('Blockly.utils.dom');
-goog.require('Blockly.utils.Svg');
-
-goog.requireType('Blockly.utils.Coordinate');
+/* eslint-disable-next-line no-unused-vars */
+const Coordinate = goog.requireType('Blockly.utils.Coordinate');
+const Svg = goog.require('Blockly.utils.Svg');
+const dom = goog.require('Blockly.utils.dom');
+const utils = goog.require('Blockly.utils');
 
 
 /**
@@ -30,50 +31,50 @@ goog.requireType('Blockly.utils.Coordinate');
  * @param {!Element} container Containing element.
  * @constructor
  */
-Blockly.WorkspaceDragSurfaceSvg = function(container) {
+const WorkspaceDragSurfaceSvg = function(container) {
   this.container_ = container;
   this.createDom();
 };
 
 /**
- * The SVG drag surface. Set once by Blockly.WorkspaceDragSurfaceSvg.createDom.
+ * The SVG drag surface. Set once by WorkspaceDragSurfaceSvg.createDom.
  * @type {SVGElement}
  * @private
  */
-Blockly.WorkspaceDragSurfaceSvg.prototype.SVG_ = null;
+WorkspaceDragSurfaceSvg.prototype.SVG_ = null;
 
 /**
  * Containing HTML element; parent of the workspace and the drag surface.
  * @type {Element}
  * @private
  */
-Blockly.WorkspaceDragSurfaceSvg.prototype.container_ = null;
+WorkspaceDragSurfaceSvg.prototype.container_ = null;
 
 /**
  * Create the drag surface and inject it into the container.
  */
-Blockly.WorkspaceDragSurfaceSvg.prototype.createDom = function() {
+WorkspaceDragSurfaceSvg.prototype.createDom = function() {
   if (this.SVG_) {
     return;  // Already created.
   }
 
   /**
-  * Dom structure when the workspace is being dragged. If there is no drag in
-  * progress, the SVG is empty and display: none.
-  * <svg class="blocklyWsDragSurface" style=transform:translate3d(...)>
-  *   <g class="blocklyBlockCanvas"></g>
-  *   <g class="blocklyBubbleCanvas">/g>
-  * </svg>
-  */
-  this.SVG_ = Blockly.utils.dom.createSvgElement(
-      Blockly.utils.Svg.SVG,
-      {
-        'xmlns': Blockly.utils.dom.SVG_NS,
-        'xmlns:html': Blockly.utils.dom.HTML_NS,
-        'xmlns:xlink': Blockly.utils.dom.XLINK_NS,
+   * Dom structure when the workspace is being dragged. If there is no drag in
+   * progress, the SVG is empty and display: none.
+   * <svg class="blocklyWsDragSurface" style=transform:translate3d(...)>
+   *   <g class="blocklyBlockCanvas"></g>
+   *   <g class="blocklyBubbleCanvas">/g>
+   * </svg>
+   */
+  this.SVG_ = dom.createSvgElement(
+      Svg.SVG, {
+        'xmlns': dom.SVG_NS,
+        'xmlns:html': dom.HTML_NS,
+        'xmlns:xlink': dom.XLINK_NS,
         'version': '1.1',
         'class': 'blocklyWsDragSurface blocklyOverflowVisible'
-      }, null);
+      },
+      null);
   this.container_.appendChild(this.SVG_);
 };
 
@@ -86,25 +87,25 @@ Blockly.WorkspaceDragSurfaceSvg.prototype.createDom = function() {
  * @param {number} y Y translation for the entire surface
  * @package
  */
-Blockly.WorkspaceDragSurfaceSvg.prototype.translateSurface = function(x, y) {
+WorkspaceDragSurfaceSvg.prototype.translateSurface = function(x, y) {
   // This is a work-around to prevent a the blocks from rendering
   // fuzzy while they are being moved on the drag surface.
-  var fixedX = x.toFixed(0);
-  var fixedY = y.toFixed(0);
+  const fixedX = x.toFixed(0);
+  const fixedY = y.toFixed(0);
 
   this.SVG_.style.display = 'block';
-  Blockly.utils.dom.setCssTransform(
+  dom.setCssTransform(
       this.SVG_, 'translate3d(' + fixedX + 'px, ' + fixedY + 'px, 0)');
 };
 
 /**
  * Reports the surface translation in scaled workspace coordinates.
  * Use this when finishing a drag to return blocks to the correct position.
- * @return {!Blockly.utils.Coordinate} Current translation of the surface
+ * @return {!Coordinate} Current translation of the surface
  * @package
  */
-Blockly.WorkspaceDragSurfaceSvg.prototype.getSurfaceTranslation = function() {
-  return Blockly.utils.getRelativeXY(/** @type {!SVGElement} */ (this.SVG_));
+WorkspaceDragSurfaceSvg.prototype.getSurfaceTranslation = function() {
+  return utils.getRelativeXY(/** @type {!SVGElement} */ (this.SVG_));
 };
 
 /**
@@ -114,36 +115,36 @@ Blockly.WorkspaceDragSurfaceSvg.prototype.getSurfaceTranslation = function() {
  *     into.
  * @package
  */
-Blockly.WorkspaceDragSurfaceSvg.prototype.clearAndHide = function(newSurface) {
+WorkspaceDragSurfaceSvg.prototype.clearAndHide = function(newSurface) {
   if (!newSurface) {
-    throw Error('Couldn\'t clear and hide the drag surface: missing ' +
-        'new surface.');
+    throw Error(
+        'Couldn\'t clear and hide the drag surface: missing new surface.');
   }
-  var blockCanvas = /** @type {!Element} */ (this.SVG_.childNodes[0]);
-  var bubbleCanvas = /** @type {!Element} */ (this.SVG_.childNodes[1]);
+  const blockCanvas = /** @type {!Element} */ (this.SVG_.childNodes[0]);
+  const bubbleCanvas = /** @type {!Element} */ (this.SVG_.childNodes[1]);
   if (!blockCanvas || !bubbleCanvas ||
-      !Blockly.utils.dom.hasClass(blockCanvas, 'blocklyBlockCanvas') ||
-      !Blockly.utils.dom.hasClass(bubbleCanvas, 'blocklyBubbleCanvas')) {
-    throw Error('Couldn\'t clear and hide the drag surface. ' +
-        'A node was missing.');
+      !dom.hasClass(blockCanvas, 'blocklyBlockCanvas') ||
+      !dom.hasClass(bubbleCanvas, 'blocklyBubbleCanvas')) {
+    throw Error(
+        'Couldn\'t clear and hide the drag surface. A node was missing.');
   }
 
   // If there is a previous sibling, put the blockCanvas back right afterwards,
   // otherwise insert it as the first child node in newSurface.
   if (this.previousSibling_ != null) {
-    Blockly.utils.dom.insertAfter(blockCanvas, this.previousSibling_);
+    dom.insertAfter(blockCanvas, this.previousSibling_);
   } else {
     newSurface.insertBefore(blockCanvas, newSurface.firstChild);
   }
 
   // Reattach the bubble canvas after the blockCanvas.
-  Blockly.utils.dom.insertAfter(bubbleCanvas, blockCanvas);
+  dom.insertAfter(bubbleCanvas, blockCanvas);
   // Hide the drag surface.
   this.SVG_.style.display = 'none';
   if (this.SVG_.childNodes.length) {
     throw Error('Drag surface was not cleared.');
   }
-  Blockly.utils.dom.setCssTransform(this.SVG_, '');
+  dom.setCssTransform(this.SVG_, '');
   this.previousSibling_ = null;
 };
 
@@ -160,7 +161,7 @@ Blockly.WorkspaceDragSurfaceSvg.prototype.clearAndHide = function(newSurface) {
  * @param {number} scale The scale of the workspace being dragged.
  * @package
  */
-Blockly.WorkspaceDragSurfaceSvg.prototype.setContentsAndShow = function(
+WorkspaceDragSurfaceSvg.prototype.setContentsAndShow = function(
     blockCanvas, bubbleCanvas, previousSibling, width, height, scale) {
   if (this.SVG_.childNodes.length) {
     throw Error('Already dragging a block.');
@@ -176,3 +177,5 @@ Blockly.WorkspaceDragSurfaceSvg.prototype.setContentsAndShow = function(
   this.SVG_.appendChild(bubbleCanvas);
   this.SVG_.style.display = 'block';
 };
+
+exports = WorkspaceDragSurfaceSvg;
diff --git a/tests/deps.js b/tests/deps.js
index 69bb647ad..8cccc9ea1 100644
--- a/tests/deps.js
+++ b/tests/deps.js
@@ -208,9 +208,9 @@ goog.addDependency('../../core/workspace.js', ['Blockly.Workspace'], ['Blockly.C
 goog.addDependency('../../core/workspace_audio.js', ['Blockly.WorkspaceAudio'], ['Blockly.internalConstants', 'Blockly.utils.global', 'Blockly.utils.userAgent'], {'lang': 'es6', 'module': 'goog'});
 goog.addDependency('../../core/workspace_comment.js', ['Blockly.WorkspaceComment'], ['Blockly.Events', 'Blockly.Events.CommentChange', 'Blockly.Events.CommentCreate', 'Blockly.Events.CommentDelete', 'Blockly.Events.CommentMove', 'Blockly.utils', 'Blockly.utils.Coordinate', 'Blockly.utils.xml'], {'lang': 'es6', 'module': 'goog'});
 goog.addDependency('../../core/workspace_comment_svg.js', ['Blockly.WorkspaceCommentSvg'], ['Blockly', 'Blockly.ContextMenu', 'Blockly.Css', 'Blockly.Events', 'Blockly.Events.CommentCreate', 'Blockly.Events.CommentDelete', 'Blockly.Events.CommentMove', 'Blockly.Events.Selected', 'Blockly.IBoundedElement', 'Blockly.IBubble', 'Blockly.ICopyable', 'Blockly.Touch', 'Blockly.WorkspaceComment', 'Blockly.browserEvents', 'Blockly.utils', 'Blockly.utils.Coordinate', 'Blockly.utils.Rect', 'Blockly.utils.Svg', 'Blockly.utils.dom', 'Blockly.utils.object'], {'lang': 'es6', 'module': 'goog'});
-goog.addDependency('../../core/workspace_drag_surface_svg.js', ['Blockly.WorkspaceDragSurfaceSvg'], ['Blockly.utils', 'Blockly.utils.Svg', 'Blockly.utils.dom']);
+goog.addDependency('../../core/workspace_drag_surface_svg.js', ['Blockly.WorkspaceDragSurfaceSvg'], ['Blockly.utils', 'Blockly.utils.Svg', 'Blockly.utils.dom'], {'lang': 'es6', 'module': 'goog'});
 goog.addDependency('../../core/workspace_dragger.js', ['Blockly.WorkspaceDragger'], ['Blockly.utils.Coordinate'], {'lang': 'es6', 'module': 'goog'});
-goog.addDependency('../../core/workspace_svg.js', ['Blockly.WorkspaceSvg'], ['Blockly.BlockSvg', 'Blockly.ComponentManager', 'Blockly.ConnectionDB', 'Blockly.ContextMenu', 'Blockly.ContextMenuRegistry', 'Blockly.Events', 'Blockly.Events.BlockCreate', 'Blockly.Events.ThemeChange', 'Blockly.Events.ViewportChange', 'Blockly.Gesture', 'Blockly.Grid', 'Blockly.IASTNodeLocationSvg', 'Blockly.MarkerManager', 'Blockly.MetricsManager', 'Blockly.Msg', 'Blockly.Options', 'Blockly.ThemeManager', 'Blockly.Themes.Classic', 'Blockly.TouchGesture', 'Blockly.Workspace', 'Blockly.WorkspaceAudio', 'Blockly.WorkspaceDragSurfaceSvg', 'Blockly.Xml', 'Blockly.blockRendering', 'Blockly.browserEvents', 'Blockly.common', 'Blockly.internalConstants', 'Blockly.registry', 'Blockly.utils', 'Blockly.utils.Coordinate', 'Blockly.utils.Metrics', 'Blockly.utils.Rect', 'Blockly.utils.Size', 'Blockly.utils.Svg', 'Blockly.utils.dom', 'Blockly.utils.object', 'Blockly.utils.toolbox'], {'lang': 'es5'});
+goog.addDependency('../../core/workspace_svg.js', ['Blockly.WorkspaceSvg'], ['Blockly.BlockSvg', 'Blockly.ComponentManager', 'Blockly.ConnectionDB', 'Blockly.ContextMenu', 'Blockly.ContextMenuRegistry', 'Blockly.Events', 'Blockly.Events.BlockCreate', 'Blockly.Events.ThemeChange', 'Blockly.Events.ViewportChange', 'Blockly.Gesture', 'Blockly.Grid', 'Blockly.IASTNodeLocationSvg', 'Blockly.MarkerManager', 'Blockly.MetricsManager', 'Blockly.Msg', 'Blockly.Options', 'Blockly.ThemeManager', 'Blockly.Themes.Classic', 'Blockly.TouchGesture', 'Blockly.Workspace', 'Blockly.WorkspaceAudio', 'Blockly.WorkspaceDragSurfaceSvg', 'Blockly.Xml', 'Blockly.blockRendering', 'Blockly.browserEvents', 'Blockly.internalConstants', 'Blockly.registry', 'Blockly.utils', 'Blockly.utils.Coordinate', 'Blockly.utils.Metrics', 'Blockly.utils.Rect', 'Blockly.utils.Size', 'Blockly.utils.Svg', 'Blockly.utils.dom', 'Blockly.utils.object', 'Blockly.utils.toolbox'], {'lang': 'es5'});
 goog.addDependency('../../core/xml.js', ['Blockly.Xml'], ['Blockly.Events', 'Blockly.inputTypes', 'Blockly.utils', 'Blockly.utils.Size', 'Blockly.utils.dom', 'Blockly.utils.xml']);
 goog.addDependency('../../core/zoom_controls.js', ['Blockly.ZoomControls'], ['Blockly.ComponentManager', 'Blockly.Css', 'Blockly.Events', 'Blockly.Events.Click', 'Blockly.IPositionable', 'Blockly.Touch', 'Blockly.browserEvents', 'Blockly.internalConstants', 'Blockly.uiPosition', 'Blockly.utils', 'Blockly.utils.Rect', 'Blockly.utils.Svg', 'Blockly.utils.dom'], {'lang': 'es6', 'module': 'goog'});
 goog.addDependency('base.js', [], []);