Use queueRender rather than render (#10233)

* Use queueRender rather than render * add comment
microsoft · Oct 15, 2024 · 9d326fc · 9d326fc
1 parent cec05ce
commit 9d326fc
Show file tree

Hide file tree

Showing 9 changed files with 17 additions and 12 deletions.
diff --git a/pxtblocks/composableMutations.ts b/pxtblocks/composableMutations.ts
@@ -253,7 +253,7 @@ export function initExpandableBlock(info: pxtc.BlocksInfo, b: Blockly.Block, def
 
         updateButtons();
         if (variableInlineInputs) b.setInputsInline(visibleOptions < inlineInputModeLimit);
-        if (!skipRender) (b as Blockly.BlockSvg).render();
+        if (!skipRender) (b as Blockly.BlockSvg).queueRender();
     }
 
     function addButton(name: string, uri: string, alt: string, delta: number) {

diff --git a/pxtblocks/plugins/arrays/createList.ts b/pxtblocks/plugins/arrays/createList.ts
@@ -176,7 +176,7 @@ const LIST_CREATE_MIXIN = {
             }, Blockly.config.bumpDelay);
         }
         if (block.rendered && block instanceof Blockly.BlockSvg) {
-            block.render();
+            block.queueRender();
         }
         Blockly.Events.setGroup(false);
     },

diff --git a/pxtblocks/plugins/functions/blocks/functionCallBlocks.ts b/pxtblocks/plugins/functions/blocks/functionCallBlocks.ts
@@ -103,7 +103,7 @@ const FUNCTION_CALL_MIXIN: FunctionCallMixin = {
             newBlock.setShadow(shadowType !== "variables_get");
             if (!this.isInsertionMarker() && newBlock instanceof Blockly.BlockSvg) {
                 newBlock.initSvg();
-                newBlock.render();
+                newBlock.queueRender();
             }
         } finally {
             Blockly.Events.enable();

diff --git a/pxtblocks/plugins/functions/blocks/functionDeclarationBlock.ts b/pxtblocks/plugins/functions/blocks/functionDeclarationBlock.ts
@@ -16,7 +16,7 @@ import { MsgKey } from "../msg";
 
 interface FunctionDeclarationMixin extends CommonFunctionMixin {
     createArgumentEditor_(argumentType: string, displayName: string): Blockly.Block;
-    focusLastEditor_(): void;
+    focusLastEditorAsync_(): void;
     removeFieldCallback(field: Blockly.Field): void;
     addParam_(typeName: string, defaultName: string): void;
     addBooleanExternal(): void;
@@ -83,7 +83,7 @@ const FUNCTION_DECLARATION_MIXIN: FunctionDeclarationMixin = {
             newBlock.setShadow(true);
             if (!this.isInsertionMarker() && newBlock instanceof Blockly.BlockSvg) {
                 newBlock.initSvg();
-                newBlock.render();
+                newBlock.queueRender();
             }
         } finally {
             Blockly.Events.enable();
@@ -92,7 +92,12 @@ const FUNCTION_DECLARATION_MIXIN: FunctionDeclarationMixin = {
         return newBlock;
     },
 
-    focusLastEditor_(this: FunctionDeclarationBlock) {
+    async focusLastEditorAsync_(this: FunctionDeclarationBlock) {
+        // The argument editor block might still be rendering.
+        // Wait for the render queue to finish so that the centerOnBlock
+        // function is able to correctly position the editor scroll.
+        await Blockly.renderManagement.finishQueuedRenders();
+
         if (this.inputList.length > 0) {
             let newInput = this.inputList[this.inputList.length - 2];
             if (newInput.type == Blockly.inputs.inputTypes.DUMMY) {
@@ -157,7 +162,7 @@ const FUNCTION_DECLARATION_MIXIN: FunctionDeclarationMixin = {
             type: typeName,
         });
         this.updateDisplay_();
-        this.focusLastEditor_();
+        /* await */ this.focusLastEditorAsync_();
     },
 
     addBooleanExternal(this: FunctionDeclarationBlock) {

diff --git a/pxtblocks/plugins/functions/blocks/functionDefinitionBlock.ts b/pxtblocks/plugins/functions/blocks/functionDefinitionBlock.ts
@@ -126,7 +126,7 @@ const FUNCTION_DEFINITION_MIXIN: FunctionDefinitionMixin = {
             newBlock.setShadow(true);
             if (!this.isInsertionMarker() && newBlock instanceof Blockly.BlockSvg) {
                 newBlock.initSvg();
-                newBlock.render();
+                newBlock.queueRender();
             }
         } finally {
             Blockly.Events.enable();

diff --git a/pxtblocks/plugins/functions/commonFunctionMixin.ts b/pxtblocks/plugins/functions/commonFunctionMixin.ts
@@ -260,7 +260,7 @@ export const COMMON_FUNCTION_MIXIN = {
 
         if (wasRendered && !this.isInsertionMarker() && this instanceof Blockly.BlockSvg) {
             this.initSvg();
-            this.render();
+            this.queueRender();
         }
     },
 

diff --git a/pxtblocks/plugins/logic/ifElse.ts b/pxtblocks/plugins/logic/ifElse.ts
@@ -122,7 +122,7 @@ const IF_ELSE_MIXIN = {
             }, Blockly.config.bumpDelay);
         }
         if (block.rendered && block instanceof Blockly.BlockSvg) {
-            block.render();
+            block.queueRender();
         }
         this.restoreConnections_();
         Blockly.Events.setGroup(false);

diff --git a/pxtblocks/plugins/text/join.ts b/pxtblocks/plugins/text/join.ts
@@ -96,7 +96,7 @@ const TEXT_JOIN_MUTATOR_MIXIN = {
             }, Blockly.config.bumpDelay);
         }
         if (block.rendered && block instanceof Blockly.BlockSvg) {
-            block.render();
+            block.queueRender();
         }
         Blockly.Events.setGroup(false);
     },

diff --git a/webapp/src/blocks.tsx b/webapp/src/blocks.tsx
@@ -997,7 +997,7 @@ export class Editor extends toolboxeditor.ToolboxEditor {
         const m = this.editor.getMetrics();
         b.moveBy(m.viewWidth / 2, m.viewHeight / 3);
         b.initSvg();
-        b.render();
+        b.queueRender();
     }
 
     private _loadBlocklyPromise: Promise<void>;