Upgrade Blockly to v13.0.0-beta.5

localtypings/pxtarget.d.ts

@@ -397,7 +397,6 @@ declare namespace pxt {
         lightToc?: boolean; // if true: do NOT use inverted style in docs toc
         // FIXME (riknoll): Can't use Blockly types here
         blocklyOptions?: any; // Blockly options, see Configuration: https://developers.google.com/blockly/guides/get-started/web
-        blocklyKeyboardControlsByDefault?: boolean; // if true, keyboard controls will be enabled by default in the blockly editor
         hideFlyoutHeadings?: boolean; // Hide the flyout headings at the top of the flyout when on a mobile device.
         monacoColors?: pxt.Map<string>; // Monaco theme colors, see https://code.visualstudio.com/docs/getstarted/theme-color-reference
         simAnimationEnter?: string; // Simulator enter animation

localtypings/pxteditor.d.ts

@@ -813,7 +813,6 @@ declare namespace pxt.editor {
         editorOffset?: string;
         print?: boolean;
         greenScreen?: boolean;
-        accessibleBlocks?: boolean;
         home?: boolean;
         hasError?: boolean;
         cancelledDownload?: boolean;
@@ -1049,8 +1048,6 @@ declare namespace pxt.editor {
         toggleHighContrast(): void;
         setHighContrast(on: boolean): void;
         toggleGreenScreen(): void;
-        toggleAccessibleBlocks(eventSource: string): void;
-        isAccessibleBlocks(): boolean;
         launchFullEditor(): void;
         resetWorkspace(): void;
 

package.json

@@ -61,7 +61,6 @@
   },
   "dependencies": {
     "@blockly/field-grid-dropdown": "6.0.4",
-    "@blockly/keyboard-navigation": "3.0.3",
     "@blockly/plugin-workspace-search": "10.1.2",
     "@crowdin/crowdin-api-client": "^1.33.0",
     "@fortawesome/fontawesome-free": "^5.15.4",
@@ -72,7 +71,7 @@
     "@zip.js/zip.js": "2.4.20",
     "adm-zip": "^0.5.12",
     "axios": "^1.12.2",
-    "blockly": "12.3.1",
+    "blockly": "13.0.0-beta.5",
     "browserify": "17.0.0",
     "chai": "^3.5.0",
     "chalk": "^4.1.2",
@@ -151,6 +150,12 @@
     "yargs": "^17.7.2"
   },
   "overrides": {
+    "@blockly/field-grid-dropdown": {
+      "blockly": "13.0.0-beta.5"
+    },
+    "@blockly/plugin-workspace-search": {
+      "blockly": "13.0.0-beta.5"
+    },
     "combine-source-map": {
       "source-map": "0.4.4"
     },

pxtblocks/builtins/variables.ts

@@ -2,8 +2,6 @@ import * as Blockly from "blockly";
 import { createFlyoutGroupLabel, createFlyoutHeadingLabel, mkVariableFieldBlock } from "../toolbox";
 import { installBuiltinHelpInfo, setBuiltinHelpInfo } from "../help";
 
-export const CREATE_VAR_BTN_ID = 'create-variable-btn';
-
 export function initVariables() {
     let varname = lf("{id:var}item");
     Blockly.Variables.flyoutCategory = flyoutCategory;
@@ -242,8 +240,6 @@ function flyoutCategory(workspace: Blockly.WorkspaceSvg, useXml: boolean): Eleme
     const button = document.createElement('button') as HTMLElement;
     button.setAttribute('text', lf("Make a Variable..."));
     button.setAttribute('callbackKey', 'CREATE_VARIABLE');
-    // This id is used to re-focus the create variable button after the dialog is closed.
-    button.setAttribute('id', CREATE_VAR_BTN_ID);
 
     workspace.registerButtonCallback('CREATE_VARIABLE', function (button) {
         Blockly.Variables.createVariableButtonHandler(button.getTargetWorkspace());

pxtblocks/contextMenu/blockItems.ts

@@ -147,6 +147,7 @@ function registerDuplicate() {
         scopeType: Blockly.ContextMenuRegistry.ScopeType.BLOCK,
         id: 'blockDuplicate',
         weight: BlockContextWeight.Duplicate,
+        associatedKeyboardShortcut: Blockly.ShortcutItems.names.DUPLICATE,
     };
     Blockly.ContextMenuRegistry.registry.register(duplicateOption);
-}
+}

pxtblocks/contextMenu/workspaceItems.ts

@@ -54,6 +54,8 @@ function registerFormatCode() {
         scopeType: Blockly.ContextMenuRegistry.ScopeType.WORKSPACE,
         id: 'pxtFormatCode',
         weight: WorkspaceContextWeight.FormatCode,
+        // Re-registered with key F by webapp blocks.tsx initKeyboardControls.
+        associatedKeyboardShortcut: Blockly.ShortcutItems.names.CLEANUP,
     };
     Blockly.ContextMenuRegistry.registry.register(formatOption);
 }
@@ -290,4 +292,4 @@ function registerFind() {
         weight: WorkspaceContextWeight.Find,
     };
     Blockly.ContextMenuRegistry.registry.register(findOption);
-}
+}

pxtblocks/copyPaste.ts

@@ -8,7 +8,7 @@ let oldCopy: Blockly.ShortcutRegistry.KeyboardShortcut;
 let oldCut: Blockly.ShortcutRegistry.KeyboardShortcut;
 let oldPaste: Blockly.ShortcutRegistry.KeyboardShortcut;
 
-export function initCopyPaste(accessibleBlocksEnabled: boolean, forceRefresh: boolean = false) {
+export function initCopyPaste(forceRefresh: boolean = false) {
     if (!getCopyPasteHandlers()) return;
 
     if (oldCopy && !forceRefresh) return;
@@ -27,65 +27,8 @@ export function initCopyPaste(accessibleBlocksEnabled: boolean, forceRefresh: bo
     registerCut();
     registerPaste();
 
-    if (!accessibleBlocksEnabled) {
-        registerCopyContextMenu();
-        registerPasteContextMenu();
-    }
-}
-
-export function initAccessibleBlocksCopyPasteContextMenu() {
-    overridePasteContextMenuItem();
-    overrideCutContextMenuItem();
-}
-
-function overridePasteContextMenuItem() {
-    const oldPasteOption = Blockly.ContextMenuRegistry.registry.getItem("blockPasteFromContextMenu");
-
-    if ("separator" in oldPasteOption) {
-        throw new Error(`RegistryItem ${oldPasteOption.id} is not of type ActionRegistryItem`);
-    };
-
-    const pasteOption: Blockly.ContextMenuRegistry.RegistryItem = {
-        ...oldPasteOption,
-        preconditionFn: pasteContextMenuPreconditionFn,
-    };
-
-    Blockly.ContextMenuRegistry.registry.unregister("blockPasteFromContextMenu");
-    Blockly.ContextMenuRegistry.registry.register(pasteOption);
-}
-
-function overrideCutContextMenuItem() {
-    const oldCutOption = Blockly.ContextMenuRegistry.registry.getItem("blockCutFromContextMenu");
-
-    if ("separator" in oldCutOption) {
-        throw new Error(`RegistryItem ${oldCutOption.id} is not of type ActionRegistryItem`);
-    };
-
-    const cutOption: Blockly.ContextMenuRegistry.RegistryItem = {
-        ...oldCutOption,
-        preconditionFn: (scope: Blockly.ContextMenuRegistry.Scope) => {
-            const focused = scope.focusedNode;
-            if (!focused || !Blockly.isCopyable(focused)) return "hidden";
-
-            const workspace = focused.workspace;
-
-            if (focused.workspace.isFlyout)
-                return "hidden";
-
-            if (!(workspace instanceof Blockly.WorkspaceSvg)) return 'hidden';
-
-            if (
-                oldCut.preconditionFn(workspace, scope)
-            ) {
-                return 'enabled';
-            }
-
-            return "hidden";
-        },
-    };
-
-    Blockly.ContextMenuRegistry.registry.unregister("blockCutFromContextMenu");
-    Blockly.ContextMenuRegistry.registry.register(cutOption);
+    registerCopyContextMenu();
+    registerPasteContextMenu();
 }
 
 function registerCopy() {
@@ -167,7 +110,8 @@ function registerCopyContextMenu() {
         },
         scopeType: Blockly.ContextMenuRegistry.ScopeType.BLOCK,
         weight: BlockContextWeight.Copy,
-        id: "makecode-copy-block"
+        id: "makecode-copy-block",
+        associatedKeyboardShortcut: Blockly.ShortcutItems.names.COPY,
     };
 
     const copyCommentOption: Blockly.ContextMenuRegistry.RegistryItem = {
@@ -196,7 +140,8 @@ function registerCopyContextMenu() {
         },
         scopeType: Blockly.ContextMenuRegistry.ScopeType.COMMENT,
         weight: BlockContextWeight.Copy,
-        id: "makecode-copy-comment"
+        id: "makecode-copy-comment",
+        associatedKeyboardShortcut: Blockly.ShortcutItems.names.COPY,
     };
 
     if (Blockly.ContextMenuRegistry.registry.getItem(copyOption.id)) {
@@ -222,7 +167,8 @@ function registerPasteContextMenu() {
         },
         scopeType: Blockly.ContextMenuRegistry.ScopeType.WORKSPACE,
         weight: WorkspaceContextWeight.Paste,
-        id: "makecode-paste"
+        id: "makecode-paste",
+        associatedKeyboardShortcut: Blockly.ShortcutItems.names.PASTE,
     };
 
     if (Blockly.ContextMenuRegistry.registry.getItem(pasteOption.id)) {
@@ -286,4 +232,4 @@ function runCopyPreconditionFunction(
 
     updateDuplicateOnDragState(toCopy as Blockly.BlockSvg);
     return result;
-}
+}

pxtblocks/fields/field_asset.ts

@@ -242,7 +242,6 @@ export abstract class FieldAssetEditor<U extends FieldAssetEditorOptions, V exte
         }
 
         const toolboxWidth = block.workspace.getToolbox().getWidth();
-        const workspaceLeft = injectDivBounds.left + toolboxWidth;
 
         if (divBounds.width > injectDivBounds.width - toolboxWidth) {
             widgetDiv.style.width = "";
@@ -256,16 +255,16 @@ export abstract class FieldAssetEditor<U extends FieldAssetEditorOptions, V exte
                 const blockLeft = workspaceToScreenCoordinates(block.workspace as Blockly.WorkspaceSvg,
                     new Blockly.utils.Coordinate(bounds.left, bounds.top));
 
-                if (blockLeft.x - divBounds.width - 20 > workspaceLeft) {
+                if (blockLeft.x - divBounds.width - 20 > toolboxWidth) {
                     widgetDiv.style.left = (blockLeft.x - divBounds.width - 20) + "px"
                 }
                 else {
                     // As a last resort, just center on the inject div
-                    widgetDiv.style.left = (workspaceLeft + ((injectDivBounds.width - toolboxWidth) / 2) - divBounds.width / 2) + "px";
+                    widgetDiv.style.left = (toolboxWidth + ((injectDivBounds.width - toolboxWidth) / 2) - divBounds.width / 2) + "px";
                 }
             }
             else if (divBounds.left < injectDivBounds.left) {
-                widgetDiv.style.left = workspaceLeft + "px"
+                widgetDiv.style.left = toolboxWidth + "px"
             }
         }
 

pxtblocks/fields/field_ledmatrix.ts

@@ -142,13 +142,14 @@ export class FieldLedMatrix extends FieldMatrix implements FieldCustom {
         this.selected = [0, 0];
 
         const matrixRect = this.matrixSvg.getBoundingClientRect();
+        const injectDivBounds = (this.getSourceBlock().workspace as Blockly.WorkspaceSvg).getInjectionDiv().getBoundingClientRect();
 
         const widgetDiv = Blockly.WidgetDiv.getDiv();
         widgetDiv.append(this.matrixSvg);
         this.addKeyboardFocusHandlers();
 
-        widgetDiv.style.left = matrixRect.left + "px";
-        widgetDiv.style.top = matrixRect.top + "px";
+        widgetDiv.style.left = matrixRect.left - injectDivBounds.left + "px";
+        widgetDiv.style.top = matrixRect.top - injectDivBounds.top + "px";
         widgetDiv.style.transform = `scale(${(Blockly.getMainWorkspace() as Blockly.WorkspaceSvg).getScale()})`;
         widgetDiv.style.transformOrigin = "0 0";
 
@@ -486,4 +487,4 @@ Blockly.Css.register(`
 }
 .blocklyFieldLedMatrixGroup > .blocklyFieldRect {
     fill: none !important;
-}`);
+}`);

pxtblocks/fields/field_sound_effect.ts

@@ -245,14 +245,13 @@ export class FieldSoundEffect extends FieldBase<FieldSoundEffectParams> {
                 const blockLeft = workspaceToScreenCoordinates(block.workspace as Blockly.WorkspaceSvg,
                     new Blockly.utils.Coordinate(bounds.left, bounds.top));
 
-                const workspaceLeft = injectDivBounds.left + toolboxWidth;
 
-                if (blockLeft.x - divBounds.width - 20 > workspaceLeft) {
+                if (blockLeft.x - divBounds.width - 20 > toolboxWidth) {
                     widgetDiv.style.left = (blockLeft.x - divBounds.width - 20) + "px"
                 }
                 else {
                     // As a last resort, just center on the inject div
-                    widgetDiv.style.left = (workspaceLeft + ((injectDivBounds.width - toolboxWidth) / 2) - divBounds.width / 2) + "px";
+                    widgetDiv.style.left = (toolboxWidth + ((injectDivBounds.width - toolboxWidth) / 2) - divBounds.width / 2) + "px";
                 }
             }
         }
@@ -442,4 +441,4 @@ function isTrue(value: any) {
     }
 
     return !!value;
-}
+}

pxtblocks/fields/field_utils.ts

@@ -582,16 +582,8 @@ export function workspaceToScreenCoordinates(ws: Blockly.WorkspaceSvg, wsCoordin
     const clientOffsetPixels = Blockly.utils.Coordinate.sum(
         scaledWS, mainOffsetPixels);
 
-
-    const injectionDiv = ws.getInjectionDiv();
-
-    // Bounding rect coordinates are in client coordinates, meaning that they
-    // are in pixels relative to the upper left corner of the visible browser
-    // window.  These coordinates change when you scroll the browser window.
-    const boundingRect = injectionDiv.getBoundingClientRect();
-
-    return new Blockly.utils.Coordinate(clientOffsetPixels.x + boundingRect.left,
-        clientOffsetPixels.y + boundingRect.top)
+    return new Blockly.utils.Coordinate(clientOffsetPixels.x,
+        clientOffsetPixels.y)
 }
 
 export function getBlockData(block: Blockly.Block): PXTBlockData {
@@ -720,4 +712,4 @@ export function isImageProperties(obj: any): obj is Blockly.ImageProperties {
     'height' in obj &&
     typeof obj.height === 'number'
   );
-}
+}