fix: convert the Workspace class to an ES6 class (#5977)

* fix: run conversion script on workspace

* fix: cleanup from conversion script

* fix: make debug build happy

* fix: tests

* fix: format

* fix: format

core/blockly.js

@@ -307,7 +307,8 @@ exports.svgResize = common.svgResize;
  * @alias Blockly.hideChaff
  */
 const hideChaff = function(opt_onlyClosePopups) {
-  common.getMainWorkspace().hideChaff(opt_onlyClosePopups);
+  /** @type {!WorkspaceSvg} */ (common.getMainWorkspace())
+      .hideChaff(opt_onlyClosePopups);
 };
 exports.hideChaff = hideChaff;
 

core/events/utils.js

@@ -37,6 +37,8 @@ const {CommentMove} = goog.requireType('Blockly.Events.CommentMove');
 const {ViewportChange} = goog.requireType('Blockly.Events.ViewportChange');
 /* eslint-disable-next-line no-unused-vars */
 const {Workspace} = goog.requireType('Blockly.Workspace');
+/* eslint-disable-next-line no-unused-vars */
+const {WorkspaceSvg} = goog.requireType('Blockly.WorkspaceSvg');
 
 
 /**
@@ -561,7 +563,9 @@ const disableOrphans = function(event) {
       return;
     }
     const {Workspace} = goog.module.get('Blockly.Workspace');
-    const eventWorkspace = Workspace.getById(blockEvent.workspaceId);
+    const eventWorkspace =
+        /** @type {!WorkspaceSvg} */ (
+            Workspace.getById(blockEvent.workspaceId));
     let block = eventWorkspace.getBlockById(blockEvent.blockId);
     if (block) {
       // Changing blocks as part of this event shouldn't be undoable.

core/field.js

@@ -309,7 +309,9 @@ class Field {
     if (!this.constants_ && this.sourceBlock_ && this.sourceBlock_.workspace &&
         this.sourceBlock_.workspace.rendered) {
       this.constants_ =
-          this.sourceBlock_.workspace.getRenderer().getConstants();
+          /** @type {!WorkspaceSvg} */ (this.sourceBlock_.workspace)
+              .getRenderer()
+              .getConstants();
     }
     return this.constants_;
   }
@@ -834,7 +836,8 @@ class Field {
       // - Webkit / Blink: fill-box / object bounding box
       // - Gecko / Triden / EdgeHTML: stroke-box
       const bBox = this.sourceBlock_.getHeightWidth();
-      const scale = this.sourceBlock_.workspace.scale;
+      const scale =
+          /** @type {!WorkspaceSvg} */ (this.sourceBlock_.workspace).scale;
       xy = this.getAbsoluteXY_();
       scaledWidth = bBox.width * scale;
       scaledHeight = bBox.height * scale;
@@ -1072,7 +1075,9 @@ class Field {
     if (!this.sourceBlock_ || !this.sourceBlock_.workspace) {
       return;
     }
-    const gesture = this.sourceBlock_.workspace.getGesture(e);
+    const gesture =
+        /** @type {!WorkspaceSvg} */ (this.sourceBlock_.workspace)
+            .getGesture(e);
     if (gesture) {
       gesture.setStartField(this);
     }

core/gesture.js

@@ -1012,7 +1012,10 @@ class Gesture {
   static inProgress() {
     const workspaces = Workspace.getAll();
     for (let i = 0, workspace; (workspace = workspaces[i]); i++) {
-      if (workspace.currentGesture_) {
+      // Not actually necessarily a WorkspaceSvg, but it doesn't matter b/c
+      // we're just checking if the property exists. Theoretically we would
+      // want to use instanceof, but that causes a circular dependency.
+      if (/** @type {!WorkspaceSvg} */ (workspace).currentGesture_) {
         return true;
       }
     }

core/inject.js

@@ -275,7 +275,8 @@ const init = function(mainWorkspace) {
 // TODO (https://github.com/google/blockly/issues/1998) handle cases where there
 // are multiple workspaces and non-main workspaces are able to accept input.
 const onKeyDown = function(e) {
-  const mainWorkspace = common.getMainWorkspace();
+  const mainWorkspace =
+      /** @type {!WorkspaceSvg} */ (common.getMainWorkspace());
   if (!mainWorkspace) {
     return;
   }
@@ -338,7 +339,7 @@ const bindDocumentEvents = function() {
 /**
  * Load sounds for the given workspace.
  * @param {string} pathToMedia The path to the media directory.
- * @param {!Workspace} workspace The workspace to load sounds for.
+ * @param {!WorkspaceSvg} workspace The workspace to load sounds for.
  */
 const loadSounds = function(pathToMedia, workspace) {
   const audioMgr = workspace.getAudioManager();

core/mutator.js

@@ -40,8 +40,6 @@ const {Icon} = goog.require('Blockly.Icon');
 const {Options} = goog.require('Blockly.Options');
 const {Svg} = goog.require('Blockly.utils.Svg');
 const {WorkspaceSvg} = goog.require('Blockly.WorkspaceSvg');
-/* eslint-disable-next-line no-unused-vars */
-const {Workspace} = goog.requireType('Blockly.Workspace');
 /** @suppress {extraRequire} */
 goog.require('Blockly.Events.BubbleOpen');
 
@@ -550,8 +548,8 @@ class Mutator extends Icon {
   /**
    * Get the parent workspace of a workspace that is inside a mutator, taking
    * into account whether it is a flyout.
-   * @param {Workspace} workspace The workspace that is inside a mutator.
-   * @return {?Workspace} The mutator's parent workspace or null.
+   * @param {WorkspaceSvg} workspace The workspace that is inside a mutator.
+   * @return {?WorkspaceSvg} The mutator's parent workspace or null.
    * @public
    */
   static findParentWs(workspace) {

core/procedures.js

@@ -210,7 +210,7 @@ exports.rename = rename;
 
 /**
  * Construct the blocks required by the flyout for the procedure category.
- * @param {!Workspace} workspace The workspace containing procedures.
+ * @param {!WorkspaceSvg} workspace The workspace containing procedures.
  * @return {!Array<!Element>} Array of XML block elements.
  * @alias Blockly.Procedures.flyoutCategory
  */
@@ -297,7 +297,7 @@ exports.flyoutCategory = flyoutCategory;
 /**
  * Updates the procedure mutator's flyout so that the arg block is not a
  * duplicate of another arg.
- * @param {!Workspace} workspace The procedure mutator's workspace. This
+ * @param {!WorkspaceSvg} workspace The procedure mutator's workspace. This
  *     workspace's flyout is what is being updated.
  */
 const updateMutatorFlyout = function(workspace) {

core/serialization/workspaces.js

@@ -22,6 +22,7 @@ const eventUtils = goog.require('Blockly.Events.utils');
 const registry = goog.require('Blockly.registry');
 // eslint-disable-next-line no-unused-vars
 const {Workspace} = goog.require('Blockly.Workspace');
+const {WorkspaceSvg} = goog.require('Blockly.WorkspaceSvg');
 
 
 /**
@@ -70,7 +71,7 @@ const load = function(state, workspace, {recordUndo = false} = {}) {
   }
 
   dom.startTextWidthCache();
-  if (workspace.setResizesEnabled) {
+  if (workspace instanceof WorkspaceSvg) {
     workspace.setResizesEnabled(false);
   }
 
@@ -89,7 +90,7 @@ const load = function(state, workspace, {recordUndo = false} = {}) {
     }
   }
 
-  if (workspace.setResizesEnabled) {
+  if (workspace instanceof WorkspaceSvg) {
     workspace.setResizesEnabled(true);
   }
   dom.stopTextWidthCache();

core/theme_manager.js

@@ -97,7 +97,7 @@ class ThemeManager {
     // Refresh all subscribed workspaces.
     for (let i = 0, workspace; (workspace = this.subscribedWorkspaces_[i]);
          i++) {
-      workspace.refreshTheme();
+      /** @type {!WorkspaceSvg} */ (workspace).refreshTheme();
     }
 
     // Refresh all registered Blockly UI components.
@@ -112,7 +112,7 @@ class ThemeManager {
     }
 
     for (const workspace of this.subscribedWorkspaces_) {
-      workspace.hideChaff();
+      /** @type {!WorkspaceSvg} */ (workspace).hideChaff();
     }
   }
 

core/toolbox/toolbox.js

@@ -320,7 +320,7 @@ class Toolbox extends DeleteArea {
   onClick_(e) {
     if (browserEvents.isRightButton(e) || e.target === this.HtmlDiv) {
       // Close flyout.
-      common.getMainWorkspace().hideChaff(false);
+      /** @type {!WorkspaceSvg} */ (common.getMainWorkspace()).hideChaff(false);
     } else {
       const targetElement = e.target;
       const itemId = targetElement.getAttribute('id');
@@ -332,7 +332,7 @@ class Toolbox extends DeleteArea {
         }
       }
       // Just close popups.
-      common.getMainWorkspace().hideChaff(true);
+      /** @type {!WorkspaceSvg} */ (common.getMainWorkspace()).hideChaff(true);
     }
     Touch.clearTouchIdentifier();  // Don't block future drags.
   }

core/variables.js

@@ -23,6 +23,8 @@ const {Msg} = goog.require('Blockly.Msg');
 const {VariableModel} = goog.require('Blockly.VariableModel');
 /* eslint-disable-next-line no-unused-vars */
 const {Workspace} = goog.requireType('Blockly.Workspace');
+/* eslint-disable-next-line no-unused-vars */
+const {WorkspaceSvg} = goog.requireType('Blockly.WorkspaceSvg');
 
 /**
  * String for use in the "custom" attribute of a category in toolbox XML.
@@ -118,7 +120,7 @@ exports.allDeveloperVariables = allDeveloperVariables;
 /**
  * Construct the elements (blocks and button) required by the flyout for the
  * variable category.
- * @param {!Workspace} workspace The workspace containing variables.
+ * @param {!WorkspaceSvg} workspace The workspace containing variables.
  * @return {!Array<!Element>} Array of XML elements.
  * @alias Blockly.Variables.flyoutCategory
  */
@@ -526,7 +528,12 @@ const createVariable = function(workspace, id, opt_name, opt_type) {
   const potentialVariableMap = workspace.getPotentialVariableMap();
   // Variables without names get uniquely named for this workspace.
   if (!opt_name) {
-    const ws = workspace.isFlyout ? workspace.targetWorkspace : workspace;
+    const ws =
+        /** @type {!Workspace} */ (
+            workspace.isFlyout ?
+                /** @type {!WorkspaceSvg} */ (workspace).targetWorkspace :
+                workspace);
+    // Must call version on exports to allow for mocking in tests. See #5321
     opt_name = exports.generateUniqueName(ws);
   }
 

core/variables_dynamic.js

@@ -24,6 +24,8 @@ const {Msg} = goog.require('Blockly.Msg');
 const {VariableModel} = goog.require('Blockly.VariableModel');
 /* eslint-disable-next-line no-unused-vars */
 const {Workspace} = goog.requireType('Blockly.Workspace');
+/* eslint-disable-next-line no-unused-vars */
+const {WorkspaceSvg} = goog.requireType('Blockly.WorkspaceSvg');
 
 
 /**
@@ -59,7 +61,7 @@ exports.onCreateVariableButtonClick_Colour = colourButtonClickHandler;
 /**
  * Construct the elements (blocks and button) required by the flyout for the
  * variable category.
- * @param {!Workspace} workspace The workspace containing variables.
+ * @param {!WorkspaceSvg} workspace The workspace containing variables.
  * @return {!Array<!Element>} Array of XML elements.
  * @alias Blockly.VariablesDynamic.flyoutCategory
  */

core/workspace_svg.js

@@ -158,19 +158,6 @@ class WorkspaceSvg extends Workspace {
      */
     this.isVisible_ = true;
 
-    /**
-     * Is this workspace the surface for a flyout?
-     * @type {boolean}
-     */
-    this.isFlyout = false;
-
-    /**
-     * Is this workspace the surface for a mutator?
-     * @type {boolean}
-     * @package
-     */
-    this.isMutator = false;
-
     /**
      * Whether this workspace has resizes enabled.
      * Disable during batch operations for a performance improvement.
@@ -323,7 +310,7 @@ class WorkspaceSvg extends Workspace {
     /**
      * The current gesture in progress on this workspace, if any.
      * @type {TouchGesture}
-     * @private
+     * @package
      */
     this.currentGesture_ = null;
 
@@ -486,7 +473,7 @@ class WorkspaceSvg extends Workspace {
     /**
      * Map from function names to callbacks, for deciding what to do when a
      * custom toolbox category is opened.
-     * @type {!Object<string, ?function(!Workspace):
+     * @type {!Object<string, ?function(!WorkspaceSvg):
      *     !toolbox.FlyoutDefinition>}
      * @private
      */
@@ -2589,8 +2576,8 @@ class WorkspaceSvg extends Workspace {
    * custom toolbox categories in this workspace.  See the variable and
    * procedure categories as an example.
    * @param {string} key The name to use to look up this function.
-   * @param {function(!Workspace): !toolbox.FlyoutDefinition} func The function
-   *     to call when the given toolbox category is opened.
+   * @param {function(!WorkspaceSvg): !toolbox.FlyoutDefinition} func The
+   *     function to call when the given toolbox category is opened.
    */
   registerToolboxCategoryCallback(key, func) {
     if (typeof func !== 'function') {
@@ -2603,7 +2590,7 @@ class WorkspaceSvg extends Workspace {
    * Get the callback function associated with a given key, for populating
    * custom toolbox categories in this workspace.
    * @param {string} key The name to use to look up the function.
-   * @return {?function(!Workspace): !toolbox.FlyoutDefinition} The function
+   * @return {?function(!WorkspaceSvg): !toolbox.FlyoutDefinition} The function
    *     corresponding to the given key for this workspace, or null if no
    * function is registered.
    */

core/xml.js

@@ -398,7 +398,7 @@ exports.textToDom = textToDom;
  * Clear the given workspace then decode an XML DOM and
  * create blocks on the workspace.
  * @param {!Element} xml XML DOM.
- * @param {!Workspace} workspace The workspace.
+ * @param {!WorkspaceSvg} workspace The workspace.
  * @return {!Array<string>} An array containing new block IDs.
  * @alias Blockly.Xml.clearWorkspaceAndLoadFromXml
  */
@@ -445,8 +445,9 @@ const domToWorkspace = function(xml, workspace) {
   }
 
   // Disable workspace resizes as an optimization.
-  if (workspace.setResizesEnabled) {
-    workspace.setResizesEnabled(false);
+  // Assume it is rendered so we can check.
+  if (/** @type {!WorkspaceSvg} */ (workspace).setResizesEnabled) {
+    /** @type {!WorkspaceSvg} */ (workspace).setResizesEnabled(false);
   }
   let variablesFirst = true;
   try {
@@ -515,8 +516,8 @@ const domToWorkspace = function(xml, workspace) {
     dom.stopTextWidthCache();
   }
   // Re-enable workspace resizing.
-  if (workspace.setResizesEnabled) {
-    workspace.setResizesEnabled(true);
+  if (/** @type {!WorkspaceSvg} */ (workspace).setResizesEnabled) {
+    /** @type {!WorkspaceSvg} */ (workspace).setResizesEnabled(true);
   }
   eventUtils.fire(new (eventUtils.get(eventUtils.FINISHED_LOADING))(workspace));
   return newBlockIds;
@@ -532,12 +533,14 @@ exports.domToWorkspace = domToWorkspace;
  * @alias Blockly.Xml.appendDomToWorkspace
  */
 const appendDomToWorkspace = function(xml, workspace) {
-  let bbox;  // Bounding box of the current blocks.
-  // First check if we have a workspaceSvg, otherwise the blocks have no shape
+  // First check if we have a WorkspaceSvg, otherwise the blocks have no shape
   // and the position does not matter.
-  if (Object.prototype.hasOwnProperty.call(workspace, 'scale')) {
-    bbox = workspace.getBlocksBoundingBox();
+  // Assume it is rendered so we can check.
+  if (!/** @type {!WorkspaceSvg} */ (workspace).getBlocksBoundingBox) {
+    return domToWorkspace(xml, workspace);
   }
+
+  const bbox = /** @type {!WorkspaceSvg} */ (workspace).getBlocksBoundingBox();
   // Load the new blocks into the workspace and get the IDs of the new blocks.
   const newBlockIds = domToWorkspace(xml, workspace);
   if (bbox && bbox.top !== bbox.bottom) {  // check if any previous block
@@ -622,7 +625,7 @@ const domToBlock = function(xmlBlock, workspace) {
       topBlockSvg.updateDisabled();
       // Allow the scrollbars to resize and move based on the new contents.
       // TODO(@picklesrus): #387. Remove when domToBlock avoids resizing.
-      workspace.resizeContents();
+      /** @type {!WorkspaceSvg} */ (workspace).resizeContents();
     } else {
       const blocks = topBlock.getDescendants(false);
       for (let i = blocks.length - 1; i >= 0; i--) {

tests/deps.js

@@ -209,7 +209,7 @@ goog.addDependency('../../core/serialization/exceptions.js', ['Blockly.serializa
 goog.addDependency('../../core/serialization/priorities.js', ['Blockly.serialization.priorities'], [], {'module': 'goog'});
 goog.addDependency('../../core/serialization/registry.js', ['Blockly.serialization.registry'], ['Blockly.registry'], {'lang': 'es6', 'module': 'goog'});
 goog.addDependency('../../core/serialization/variables.js', ['Blockly.serialization.variables'], ['Blockly.serialization.ISerializer', 'Blockly.serialization.priorities', 'Blockly.serialization.registry'], {'lang': 'es6', 'module': 'goog'});
-goog.addDependency('../../core/serialization/workspaces.js', ['Blockly.serialization.workspaces'], ['Blockly.Events.utils', 'Blockly.Workspace', 'Blockly.registry', 'Blockly.utils.dom'], {'lang': 'es6', 'module': 'goog'});
+goog.addDependency('../../core/serialization/workspaces.js', ['Blockly.serialization.workspaces'], ['Blockly.Events.utils', 'Blockly.Workspace', 'Blockly.WorkspaceSvg', 'Blockly.registry', 'Blockly.utils.dom'], {'lang': 'es6', 'module': 'goog'});
 goog.addDependency('../../core/shortcut_items.js', ['Blockly.ShortcutItems'], ['Blockly.Gesture', 'Blockly.ShortcutRegistry', 'Blockly.clipboard', 'Blockly.common', 'Blockly.utils.KeyCodes'], {'lang': 'es6', 'module': 'goog'});
 goog.addDependency('../../core/shortcut_registry.js', ['Blockly.ShortcutRegistry'], ['Blockly.utils.KeyCodes', 'Blockly.utils.object'], {'lang': 'es6', 'module': 'goog'});
 goog.addDependency('../../core/sprites.js', ['Blockly.sprite'], [], {'lang': 'es6', 'module': 'goog'});