scratch-blocks 2.0.0 → 2.0.2

package/src/fields/field_matrix.ts

@@ -39,7 +39,7 @@ enum LEDState {
  * Class for a matrix field.
  */
 class FieldMatrix extends Blockly.Field<string> {
-  private originalStyle?: string;
+  private originalStyle = "";
 
   /**
    * Array of SVGElement<rect> for matrix thumbnail image on block field.
@@ -215,7 +215,7 @@ class FieldMatrix extends Blockly.Field<string> {
       this.arrow_.setAttributeNS(
         "http://www.w3.org/1999/xlink",
         "xlink:href",
-        this.getConstants().FIELD_DROPDOWN_SVG_ARROW_DATAURI
+        this.getConstants()!.FIELD_DROPDOWN_SVG_ARROW_DATAURI
       );
       this.arrow_.style.cursor = "default";
     }
@@ -348,7 +348,7 @@ class FieldMatrix extends Blockly.Field<string> {
   }
 
   dropdownDispose_() {
-    const sourceBlock = this.getSourceBlock();
+    const sourceBlock = this.getSourceBlock()!;
     if (sourceBlock.isShadow()) {
       sourceBlock.setStyle(this.originalStyle);
     }
@@ -396,8 +396,8 @@ class FieldMatrix extends Blockly.Field<string> {
    * Redraw the matrix with the current value.
    */
   private updateMatrix_() {
-    const matrix = this.getValue();
-    const sourceBlock = this.getSourceBlock() as Blockly.BlockSvg;
+    const matrix = this.getValue()!;
+    const sourceBlock = this.getSourceBlock()! as Blockly.BlockSvg;
     for (let i = 0; i < matrix.length; i++) {
       if (matrix[i] === LEDState.OFF) {
         this.fillMatrixNode_(
@@ -451,7 +451,7 @@ class FieldMatrix extends Blockly.Field<string> {
 
   setLEDNode_(led: number, state: LEDState) {
     if (led < 0 || led > 24) return;
-    const oldMatrix = this.getValue();
+    const oldMatrix = this.getValue()!;
     const newMatrix =
       oldMatrix.substr(0, led) + state + oldMatrix.substr(led + 1);
     this.setValue(newMatrix);
@@ -469,7 +469,7 @@ class FieldMatrix extends Blockly.Field<string> {
 
   toggleLEDNode_(led: number) {
     if (led < 0 || led > 24) return;
-    if (this.getValue().charAt(led) === LEDState.OFF) {
+    if (this.getValue()!.charAt(led) === LEDState.OFF) {
       this.setLEDNode_(led, LEDState.ON);
     } else {
       this.setLEDNode_(led, LEDState.OFF);
@@ -496,7 +496,7 @@ class FieldMatrix extends Blockly.Field<string> {
     );
     const ledHit = this.checkForLED_(e);
     if (ledHit > -1) {
-      if (this.getValue().charAt(ledHit) === LEDState.OFF) {
+      if (this.getValue()!.charAt(ledHit) === LEDState.OFF) {
         this.paintStyle_ = PaintStyle.FILL;
       } else {
         this.paintStyle_ = PaintStyle.CLEAR;
@@ -548,6 +548,7 @@ class FieldMatrix extends Blockly.Field<string> {
    * @returns The matching matrix node or -1 for none.
    */
   checkForLED_(e: PointerEvent): number {
+    if (!this.matrixStage_) return -1;
     const bBox = this.matrixStage_.getBoundingClientRect();
     const nodeSize = FieldMatrix.MATRIX_NODE_SIZE;
     const nodePad = FieldMatrix.MATRIX_NODE_PAD;

package/src/fields/field_note.ts

@@ -369,7 +369,7 @@ export class FieldNote extends Blockly.FieldTextInput {
       "line",
       {
         stroke: (
-          this.sourceBlock_.getParent() as Blockly.BlockSvg
+          this.sourceBlock_!.getParent() as Blockly.BlockSvg
         ).getColourTertiary(),
         x1: 0,
         y1: FieldNote.TOP_MENU_HEIGHT,
@@ -407,7 +407,7 @@ export class FieldNote extends Blockly.FieldTextInput {
       octaveDownButton,
       "mousedown",
       this,
-      function () {
+      () => {
         this.changeOctaveBy_(-1);
       }
     );
@@ -415,14 +415,14 @@ export class FieldNote extends Blockly.FieldTextInput {
       octaveUpButton,
       "mousedown",
       this,
-      function () {
+      () => {
         this.changeOctaveBy_(1);
       }
     );
     const sourceBlock = this.getSourceBlock() as Blockly.BlockSvg;
     Blockly.DropDownDiv.setColour(
-      sourceBlock.getParent().getColour(),
-      sourceBlock.getParent().getColourTertiary()
+      (sourceBlock.getParent() as Blockly.BlockSvg).getColour(),
+      (sourceBlock.getParent() as Blockly.BlockSvg).getColourTertiary()
     );
     Blockly.DropDownDiv.showPositionedByBlock(this, sourceBlock);
 
@@ -441,7 +441,7 @@ export class FieldNote extends Blockly.FieldTextInput {
     x: number,
     whiteKeyGroup: SVGElement,
     blackKeyGroup: SVGElement,
-    keySVGarray: SVGElement[]
+    keySVGarray: SVGElement[] | null
   ) {
     let xIncrement, width, height, fill, stroke, group;
     x += FieldNote.EDGE_PADDING / 2;
@@ -463,7 +463,7 @@ export class FieldNote extends Blockly.FieldTextInput {
         height = FieldNote.WHITE_KEY_HEIGHT;
         fill = FieldNote.WHITE_KEY_COLOR;
         stroke = (
-          this.sourceBlock_.getParent() as Blockly.BlockSvg
+          this.sourceBlock_!.getParent() as Blockly.BlockSvg
         ).getColourTertiary();
         group = whiteKeyGroup;
       }
@@ -594,7 +594,7 @@ export class FieldNote extends Blockly.FieldTextInput {
       "line",
       {
         stroke: (
-          this.sourceBlock_.getParent() as Blockly.BlockSvg
+          this.sourceBlock_!.getParent() as Blockly.BlockSvg
         ).getColourTertiary(),
         x1: x - FieldNote.INSET,
         y1: 0,
@@ -643,13 +643,15 @@ export class FieldNote extends Blockly.FieldTextInput {
    * @param visible If true, set labels to be visible.
    */
   private setCKeyLabelsVisible_(visible: boolean) {
-    if (visible) {
-      this.fadeSvgToOpacity_(this.lowCText_, 1);
-      this.fadeSvgToOpacity_(this.highCText_, 1);
-    } else {
-      this.fadeSvgToOpacity_(this.lowCText_, 0);
-      this.fadeSvgToOpacity_(this.highCText_, 0);
+    if (!this.lowCText_ || !this.highCText_) {
+      console.warn(
+        "FieldNote.setCKeyLabelsVisible_: C-key label DOM is not fully initialized"
+      );
+      return;
     }
+    const opacity = visible ? 1 : 0;
+    this.fadeSvgToOpacity_(this.lowCText_, opacity);
+    this.fadeSvgToOpacity_(this.highCText_, opacity);
   }
 
   /**
@@ -686,8 +688,10 @@ export class FieldNote extends Blockly.FieldTextInput {
    */
   private onMouseUp_() {
     this.mouseIsDown_ = false;
-    Blockly.browserEvents.unbind(this.mouseUpWrapper_);
-    this.mouseUpWrapper_ = null;
+    if (this.mouseUpWrapper_) {
+      Blockly.browserEvents.unbind(this.mouseUpWrapper_);
+      this.mouseUpWrapper_ = null;
+    }
   }
 
   /**
@@ -709,7 +713,7 @@ export class FieldNote extends Blockly.FieldTextInput {
   private selectNoteWithMouseEvent_(e: PointerEvent) {
     const newNoteNum =
       Number((e.target as HTMLElement).getAttribute("data-pitch")) +
-      this.displayedOctave_ * 12;
+      (this.displayedOctave_ ?? 0) * 12;
     this.setEditorValue_(newNoteNum);
     this.playNoteInternal_();
   }
@@ -719,7 +723,7 @@ export class FieldNote extends Blockly.FieldTextInput {
    */
   private playNoteInternal_() {
     if (FieldNote.playNote_) {
-      FieldNote.playNote_(Number(this.getValue()), "Music");
+      FieldNote.playNote_(Number(this.getValue()!), "Music");
     }
   }
 
@@ -740,7 +744,7 @@ export class FieldNote extends Blockly.FieldTextInput {
    * @param octaves The number of octaves to change by.
    */
   private changeOctaveBy_(octaves: number) {
-    this.displayedOctave_ += octaves;
+    this.displayedOctave_ = (this.displayedOctave_ ?? 0) + octaves;
     if (this.displayedOctave_ < 0) {
       this.displayedOctave_ = 0;
       return;
@@ -766,7 +770,7 @@ export class FieldNote extends Blockly.FieldTextInput {
   private stepOctaveAnimation_() {
     const absDiff = Math.abs(this.animationPos_ - this.animationTarget_);
     if (absDiff < 1) {
-      this.pianoSVG_.setAttribute("transform", "translate(0, 0)");
+      this.pianoSVG_?.setAttribute("transform", "translate(0, 0)");
       this.setCKeyLabelsVisible_(true);
       this.playNoteInternal_();
       return;
@@ -774,7 +778,7 @@ export class FieldNote extends Blockly.FieldTextInput {
     this.animationPos_ +=
       (this.animationTarget_ - this.animationPos_) *
       FieldNote.ANIMATION_FRACTION;
-    this.pianoSVG_.setAttribute(
+    this.pianoSVG_?.setAttribute(
       "transform",
       "translate(" + this.animationPos_ + ",0)"
     );
@@ -799,7 +803,7 @@ export class FieldNote extends Blockly.FieldTextInput {
    * @returns The index of the piano key.
    */
   private noteNumToKeyIndex_(noteNum: number): number {
-    return Math.floor(noteNum) - this.displayedOctave_ * 12;
+    return Math.floor(noteNum) - (this.displayedOctave_ ?? 0) * 12;
   }
 
   /**
@@ -833,12 +837,15 @@ export class FieldNote extends Blockly.FieldTextInput {
       this.keySVGs_[index].setAttribute("fill", FieldNote.KEY_SELECTED_COLOR);
       // Update the note name text
       const noteName = FieldNote.KEY_INFO[index].name;
-      this.noteNameText_.textContent =
-        noteName + " (" + Math.floor(noteNum) + ")";
+      if (this.noteNameText_) {
+        this.noteNameText_.textContent =
+          noteName + " (" + Math.floor(noteNum) + ")";
+      }
       // Update the low and high C note names
-      const lowCNum = this.displayedOctave_ * 12;
-      this.lowCText_.textContent = "C(" + lowCNum + ")";
-      this.highCText_.textContent = "C(" + (lowCNum + 12) + ")";
+      const lowCNum = (this.displayedOctave_ ?? 0) * 12;
+      if (this.lowCText_) this.lowCText_.textContent = "C(" + lowCNum + ")";
+      if (this.highCText_)
+        this.highCText_.textContent = "C(" + (lowCNum + 12) + ")";
     }
   }
 

package/src/fields/field_textinput_removable.ts

@@ -40,13 +40,13 @@ export class FieldTextInputRemovable extends Blockly.FieldTextInput {
     Blockly.renderManagement.finishQueuedRenders().then(() => {
       super.showEditor_();
 
-      const div = Blockly.WidgetDiv.getDiv();
+      const div = Blockly.WidgetDiv.getDiv()!;
       div.className += " removableTextInput";
       const removeButton = document.createElement("img");
       removeButton.className = "blocklyTextRemoveIcon";
       removeButton.setAttribute(
         "src",
-        this.sourceBlock_.workspace.options.pathToMedia + "icons/remove.svg"
+        this.sourceBlock_!.workspace.options.pathToMedia + "icons/remove.svg"
       );
       this.removeButtonMouseWrapper_ = Blockly.browserEvents.bind(
         removeButton,

package/src/fields/field_variable_getter.ts

@@ -78,7 +78,7 @@ class FieldVariableGetter extends Blockly.FieldLabel {
    */
   doValueUpdate_(newVariableId: string) {
     super.doValueUpdate_(newVariableId);
-    const workspace = this.getSourceBlock().workspace;
+    const workspace = this.getSourceBlock()!.workspace;
     this.variable = Blockly.Variables.getVariable(workspace, newVariableId);
   }
 
@@ -97,13 +97,13 @@ class FieldVariableGetter extends Blockly.FieldLabel {
   }
 
   fromXml(element: Element) {
-    this.setValue(element.getAttribute("id"));
+    this.setValue(element.getAttribute("id")!);
   }
 
   toXml(element: Element): Element {
-    element.setAttribute("id", this.variable.getId());
-    element.setAttribute("variabletype", this.variable.getType());
-    element.textContent = this.variable.getName();
+    element.setAttribute("id", this.variable!.getId());
+    element.setAttribute("variabletype", this.variable!.getType());
+    element.textContent = this.variable!.getName();
     return element;
   }
 }

package/src/fields/field_vertical_separator.ts

@@ -76,7 +76,7 @@ class FieldVerticalSeparator extends Blockly.Field {
    * @package
    */
   setLineHeight(newHeight: number) {
-    this.lineElement.setAttribute("y2", `${newHeight}`);
+    this.lineElement!.setAttribute("y2", `${newHeight}`);
   }
 
   /**

package/src/fields/scratch_field_angle.ts

@@ -51,17 +51,17 @@ class ScratchFieldAngle extends Blockly.FieldNumber {
   /**
    * Opaque identifier used to unbind event listener in dispose().
    */
-  private mouseDownWrapper_: Blockly.browserEvents.Data;
+  private mouseDownWrapper_!: Blockly.browserEvents.Data;
 
   /**
    * Opaque identifier used to unbind event listener in dispose().
    */
-  private mouseMoveWrapper: Blockly.browserEvents.Data;
+  private mouseMoveWrapper!: Blockly.browserEvents.Data;
 
   /**
    * Opaque identifier used to unbind event listener in dispose().
    */
-  private mouseUpWrapper: Blockly.browserEvents.Data;
+  private mouseUpWrapper!: Blockly.browserEvents.Data;
 
   /**
    * Round angles to the nearest 15 degrees when using mouse.
@@ -141,7 +141,7 @@ class ScratchFieldAngle extends Blockly.FieldNumber {
    */
   dispose() {
     super.dispose();
-    this.gauge = null;
+    this.gauge = undefined;
     if (this.mouseDownWrapper_) {
       Blockly.browserEvents.unbind(this.mouseDownWrapper_);
     }
@@ -190,10 +190,10 @@ class ScratchFieldAngle extends Blockly.FieldNumber {
         cy: this.HALF,
         r: this.RADIUS,
         fill: (
-          this.getSourceBlock().getParent() as Blockly.BlockSvg
+          this.getSourceBlock()!.getParent() as Blockly.BlockSvg
         ).getColourSecondary(),
         stroke: (
-          this.getSourceBlock().getParent() as Blockly.BlockSvg
+          this.getSourceBlock()!.getParent() as Blockly.BlockSvg
         ).getColourTertiary(),
         class: "blocklyAngleCircle",
       },
@@ -284,9 +284,9 @@ class ScratchFieldAngle extends Blockly.FieldNumber {
     );
 
     Blockly.DropDownDiv.setColour(
-      this.getSourceBlock().getParent().getColour(),
+      (this.getSourceBlock()!.getParent() as Blockly.BlockSvg).getColour(),
       (
-        this.getSourceBlock().getParent() as Blockly.BlockSvg
+        this.getSourceBlock()!.getParent() as Blockly.BlockSvg
       ).getColourTertiary()
     );
     Blockly.DropDownDiv.showPositionedByBlock(
@@ -336,7 +336,7 @@ class ScratchFieldAngle extends Blockly.FieldNumber {
    */
   onMouseMove(e: PointerEvent) {
     e.preventDefault();
-    const bBox = this.gauge.ownerSVGElement.getBoundingClientRect();
+    const bBox = this.gauge!.ownerSVGElement!.getBoundingClientRect();
     const dx = e.clientX - bBox.left - this.HALF;
     const dy = e.clientY - bBox.top - this.HALF;
     let angle = Math.atan(-dy / dx);
@@ -418,12 +418,12 @@ class ScratchFieldAngle extends Blockly.FieldNumber {
       } else {
         imageRotation = -angleDegrees;
       }
-      this.arrow.setAttribute("transform", "rotate(" + imageRotation + ")");
+      this.arrow!.setAttribute("transform", "rotate(" + imageRotation + ")");
     }
-    this.gauge.setAttribute("d", path.join(""));
-    this.line.setAttribute("x2", `${x2}`);
-    this.line.setAttribute("y2", `${y2}`);
-    this.handle.setAttribute("transform", "translate(" + x2 + "," + y2 + ")");
+    this.gauge!.setAttribute("d", path.join(""));
+    this.line!.setAttribute("x2", `${x2}`);
+    this.line!.setAttribute("y2", `${y2}`);
+    this.handle!.setAttribute("transform", "translate(" + x2 + "," + y2 + ")");
   }
 
   /**

package/src/fields/scratch_field_dropdown.ts

@@ -7,7 +7,7 @@
 import * as Blockly from "blockly/core";
 
 class ScratchFieldDropdown extends Blockly.FieldDropdown {
-  private originalStyle: string;
+  private originalStyle!: string;
 
   showEditor_(event: PointerEvent) {
     super.showEditor_(event);
@@ -28,7 +28,7 @@ class ScratchFieldDropdown extends Blockly.FieldDropdown {
 
   dropdownDispose_() {
     super.dropdownDispose_();
-    const sourceBlock = this.getSourceBlock();
+    const sourceBlock = this.getSourceBlock()!;
     if (sourceBlock.isShadow()) {
       sourceBlock.setStyle(this.originalStyle);
     }

package/src/fields/scratch_field_number.ts

@@ -141,7 +141,7 @@ class ScratchFieldNumber extends Blockly.FieldTextInput {
 
     // Show a numeric keypad in the drop-down on touch
     if (showNumPad) {
-      this.htmlInput_.select();
+      this.htmlInput_!.select();
       this.showNumPad_();
     }
   }
@@ -173,7 +173,7 @@ class ScratchFieldNumber extends Blockly.FieldTextInput {
     // Set colour and size of drop-down
     const sourceBlock = this.getSourceBlock() as Blockly.BlockSvg;
     Blockly.DropDownDiv.setColour(
-      sourceBlock.getParent().getColour(),
+      (sourceBlock.getParent() as Blockly.BlockSvg).getColour(),
       sourceBlock.getColourTertiary()
     );
     contentDiv.style.width = ScratchFieldNumber.DROPDOWN_WIDTH + "px";
@@ -205,11 +205,12 @@ class ScratchFieldNumber extends Blockly.FieldTextInput {
     );
     Blockly.DropDownDiv.show(
       this,
-      this.getSourceBlock().RTL,
+      this.getSourceBlock()!.RTL,
       primaryX,
       primaryY,
       secondaryX,
       secondaryY,
+      false,
       this.onHide_.bind(this)
     );
   }
@@ -222,8 +223,8 @@ class ScratchFieldNumber extends Blockly.FieldTextInput {
    */
   private addButtons_(contentDiv: Element) {
     const sourceBlock = this.getSourceBlock() as Blockly.BlockSvg;
-    const buttonColour = sourceBlock.getParent().getColour();
-    const buttonBorderColour = sourceBlock.getParent().getColourTertiary();
+    const buttonColour = (sourceBlock.getParent() as Blockly.BlockSvg).getColour();
+    const buttonBorderColour = (sourceBlock.getParent() as Blockly.BlockSvg).getColourTertiary();
 
     // Add numeric keypad buttons
     const buttons = ScratchFieldNumber.NUMPAD_BUTTONS;
@@ -298,10 +299,10 @@ class ScratchFieldNumber extends Blockly.FieldTextInput {
     // String of the button (e.g., '7')
     const spliceValue = (e.target as HTMLElement).innerText;
     // Old value of the text field
-    const oldValue = this.htmlInput_.value;
+    const oldValue = this.htmlInput_!.value;
     // Determine the selected portion of the text field
-    const selectionStart = this.htmlInput_.selectionStart;
-    const selectionEnd = this.htmlInput_.selectionEnd;
+    const selectionStart = this.htmlInput_!.selectionStart ?? 0;
+    const selectionEnd = this.htmlInput_!.selectionEnd ?? 0;
 
     // Splice in the new value
     const newValue =
@@ -327,10 +328,10 @@ class ScratchFieldNumber extends Blockly.FieldTextInput {
    */
   numPadEraseButtonTouch(e: PointerEvent) {
     // Old value of the text field
-    const oldValue = this.htmlInput_.value;
+    const oldValue = this.htmlInput_!.value;
     // Determine what is selected to erase (if anything)
-    let selectionStart = this.htmlInput_.selectionStart;
-    const selectionEnd = this.htmlInput_.selectionEnd;
+    let selectionStart = this.htmlInput_!.selectionStart ?? 0;
+    const selectionEnd = this.htmlInput_!.selectionEnd ?? 0;
 
     // If selection is zero-length, shift start to the left 1 character
     if (selectionStart == selectionEnd) {
@@ -359,7 +360,7 @@ class ScratchFieldNumber extends Blockly.FieldTextInput {
   private updateDisplay_(newValue: string, newSelection: number) {
     this.setEditorValue_(newValue);
     // Resize and scroll the text field appropriately
-    const htmlInput = this.htmlInput_;
+    const htmlInput = this.htmlInput_!;
     htmlInput.setSelectionRange(newSelection, newSelection);
     htmlInput.scrollLeft = htmlInput.scrollWidth;
   }

package/src/fields/scratch_field_variable.ts

@@ -29,7 +29,7 @@ import { createVariable, renameVariable } from "../variables";
 import type { ScratchVariableModel } from "../scratch_variable_model";
 
 export class ScratchFieldVariable extends Blockly.FieldVariable {
-  private originalStyle: string;
+  private originalStyle!: string;
 
   constructor(
     varName: string | null | typeof Blockly.Field.SKIP_SETUP,
@@ -39,7 +39,10 @@ export class ScratchFieldVariable extends Blockly.FieldVariable {
     config?: Blockly.FieldVariableConfig
   ) {
     super(varName, validator, variableTypes, defaultType, config);
-    this.menuGenerator_ = ScratchFieldVariable.dropdownCreate;
+    // dropdownCreate returns MenuOption[] rather than Blockly.MenuGenerator's
+    // MenuOption[][] variant; the cast is needed to satisfy FieldVariable's
+    // menuGenerator_ type while the actual runtime shape is compatible.
+    this.menuGenerator_ = ScratchFieldVariable.dropdownCreate as unknown as Blockly.MenuGenerator;
   }
 
   initModel() {
@@ -73,7 +76,7 @@ export class ScratchFieldVariable extends Blockly.FieldVariable {
    */
   initFlyoutBroadcast(
     workspace: Blockly.WorkspaceSvg
-  ): Blockly.IVariableModel<Blockly.IVariableState> {
+  ): Blockly.IVariableModel<Blockly.IVariableState> | undefined {
     const broadcastVars = workspace.getVariablesOfType(
       Constants.BROADCAST_MESSAGE_VARIABLE_TYPE
     );
@@ -154,7 +157,7 @@ export class ScratchFieldVariable extends Blockly.FieldVariable {
 
   showEditor_(event: PointerEvent) {
     super.showEditor_(event);
-    const sourceBlock = this.getSourceBlock();
+    const sourceBlock = this.getSourceBlock()!;
     const styleName = sourceBlock.getStyleName();
     const style = (sourceBlock.workspace as Blockly.WorkspaceSvg)
       .getRenderer()
@@ -175,7 +178,7 @@ export class ScratchFieldVariable extends Blockly.FieldVariable {
 
   dropdownDispose_() {
     super.dropdownDispose_();
-    const sourceBlock = this.getSourceBlock();
+    const sourceBlock = this.getSourceBlock()!;
     if (sourceBlock.isShadow()) {
       sourceBlock.setStyle(this.originalStyle);
     }

package/src/flyout_checkbox_icon.ts

@@ -14,7 +14,7 @@ export class FlyoutCheckboxIcon
   extends Blockly.icons.Icon
   implements Blockly.IHasBubble
 {
-  private checkboxBubble: CheckboxBubble;
+  private checkboxBubble!: CheckboxBubble;
   private type = new Blockly.icons.IconType("checkbox");
 
   constructor(protected override sourceBlock: Blockly.BlockSvg) {

package/src/glows.ts

@@ -17,8 +17,8 @@ export function glowStack(id: string, isGlowingStack: boolean) {
   const block = (Blockly.getMainWorkspace().getBlockById(id) ||
     (Blockly.getMainWorkspace() as Blockly.WorkspaceSvg)
       .getFlyout()
-      .getWorkspace()
-      .getBlockById(id)) as Blockly.BlockSvg;
+      ?.getWorkspace()
+      ?.getBlockById(id)) as Blockly.BlockSvg;
   if (!block) {
     throw "Tried to glow block that does not exist.";
   }

package/src/procedures.ts

@@ -36,7 +36,7 @@ function allProcedureMutations(root: Blockly.WorkspaceSvg): Element[] {
   const blocks = root.getAllBlocks();
   return blocks
     .filter((b) => b.type === Constants.PROCEDURES_PROTOTYPE_BLOCK_TYPE)
-    .map((b) => b.mutationToDom(/* opt_generateShadows */ true));
+    .map((b) => b.mutationToDom!(/* opt_generateShadows */ true) as Element);
 }
 
 /**
@@ -47,8 +47,8 @@ function allProcedureMutations(root: Blockly.WorkspaceSvg): Element[] {
  */
 function sortProcedureMutations(mutations: Element[]): Element[] {
   return mutations.slice().sort(function (a, b) {
-    const procCodeA = a.getAttribute("proccode");
-    const procCodeB = b.getAttribute("proccode");
+    const procCodeA = a.getAttribute("proccode")!;
+    const procCodeB = b.getAttribute("proccode")!;
 
     return scratchBlocksUtils.compareStrings(procCodeA, procCodeB);
   });
@@ -163,10 +163,10 @@ function mutateCallersAndPrototype(
   callers.push(prototypeBlock);
   Blockly.Events.setGroup(true);
   callers.forEach((caller) => {
-    const oldMutationDom = caller.mutationToDom();
+    const oldMutationDom = caller.mutationToDom!();
     const oldMutation = oldMutationDom && Blockly.Xml.domToText(oldMutationDom);
-    caller.domToMutation(mutation);
-    const newMutationDom = caller.mutationToDom();
+    caller.domToMutation!(mutation);
+    const newMutationDom = caller.mutationToDom!();
     const newMutation = newMutationDom && Blockly.Xml.domToText(newMutationDom);
     if (oldMutation !== newMutation) {
       Blockly.Events.fire(
@@ -197,8 +197,8 @@ function getDefineBlock(
   return workspace.getTopBlocks(false).find((block) => {
     if (block.type === Constants.PROCEDURES_DEFINITION_BLOCK_TYPE) {
       const prototypeBlock = block
-        .getInput("custom_block")
-        .connection.targetBlock() as Blockly.BlockSvg;
+        .getInput("custom_block")!
+        .connection!.targetBlock() as Blockly.BlockSvg;
       return (
         isProcedureBlock(prototypeBlock) &&
         prototypeBlock.getProcCode() === procCode
@@ -222,8 +222,8 @@ function getPrototypeBlock(
   const defineBlock = getDefineBlock(procCode, workspace);
   if (defineBlock) {
     return defineBlock
-      .getInput("custom_block")
-      .connection.targetBlock() as Blockly.BlockSvg;
+      .getInput("custom_block")!
+      .connection!.targetBlock() as Blockly.BlockSvg;
   }
   return undefined;
 }
@@ -243,7 +243,7 @@ function newProcedureMutation(): Element {
         warp="false">
       </mutation>
     </xml>`;
-  return Blockly.utils.xml.textToDom(mutationText).firstElementChild;
+  return Blockly.utils.xml.textToDom(mutationText).firstElementChild!;
 }
 
 /**
@@ -251,7 +251,7 @@ function newProcedureMutation(): Element {
  * @param workspace The workspace to create the new procedure on.
  */
 function createProcedureDefCallback(workspace: Blockly.WorkspaceSvg) {
-  ScratchProcedures.externalProcedureDefCallback(
+  ScratchProcedures.externalProcedureDefCallback!(
     newProcedureMutation(),
     createProcedureCallbackFactory(workspace)
   );
@@ -278,7 +278,7 @@ function createProcedureCallbackFactory(
           </statement>
         </block>
       </xml>`;
-    const blockDom = Blockly.utils.xml.textToDom(blockText).firstElementChild;
+    const blockDom = Blockly.utils.xml.textToDom(blockText).firstElementChild!;
     Blockly.Events.setGroup(true);
     const block = Blockly.Xml.domToBlock(
       blockDom,
@@ -338,15 +338,23 @@ function editProcedureCallback(block: Blockly.BlockSvg) {
     // This is a call block, find the prototype corresponding to the procCode.
     // Make sure to search the correct workspace, call block can be in flyout.
     const workspaceToSearch = block.workspace.isFlyout
-      ? block.workspace.targetWorkspace
+      ? block.workspace.targetWorkspace!
       : block.workspace;
-    prototypeBlock = getPrototypeBlock(block.getProcCode(), workspaceToSearch);
+    const foundBlock = getPrototypeBlock(block.getProcCode(), workspaceToSearch);
+    if (!foundBlock) {
+      console.warn(
+        "editProcedureCallback: could not find prototype for",
+        block.getProcCode()
+      );
+      return;
+    }
+    prototypeBlock = foundBlock;
   } else {
     prototypeBlock = block;
   }
   // Block now refers to the procedure prototype block, it is safe to proceed.
-  ScratchProcedures.externalProcedureDefCallback(
-    prototypeBlock.mutationToDom(),
+  ScratchProcedures.externalProcedureDefCallback!(
+    prototypeBlock.mutationToDom!(),
     editProcedureCallbackFactory(prototypeBlock)
   );
 }

package/src/renderer/cat/cat_face.ts

@@ -36,7 +36,7 @@ const setVisibility = (element: SVGElement, visible: boolean) => {
  * Owned by the PathObject with similar lifetime.
  */
 export class CatFace {
-  faceGroup_: SVGElement;
+  faceGroup_!: SVGElement;
   parts_ = {} as Record<FacePart, SVGElement>;
   pathEarState: CatPathState;
   constants_: ConstantProvider;