fix: make insertion markers reflect the actual size of the block

src/css.ts

@@ -1197,6 +1197,10 @@ const styles = `
     stroke: revert-layer;
     stroke-width: 1;
   }
+
+  .blocklyInsertionMarker > g:not(:last-child) {
+    visibility: hidden;
+  }
 `;
 
 Blockly.Css.register(styles);

src/index.ts

@@ -37,6 +37,7 @@ import "./scratch_dragger";
 import "./scratch_variable_map";
 import "./scratch_variable_model";
 import "./scratch_connection_checker";
+import "./scratch_insertion_marker_previewer";
 import "./flyout_checkbox_icon";
 import "./events/events_block_comment_change";
 import "./events/events_block_comment_collapse";

src/scratch_insertion_marker_previewer.ts

@@ -0,0 +1,45 @@
+/**
+ * @license
+ * Copyright 2025 Google LLC
+ * SPDX-License-Identifier: Apache-2.0
+ */
+
+import * as Blockly from "blockly/core";
+
+/**
+ * Displays an indicator of where a block being dragged will be connected.
+ */
+class ScratchInsertionMarkerPreviewer extends Blockly.InsertionMarkerPreviewer {
+  /**
+   * Transforms the given block into a JSON representation used to construct an
+   * insertion marker.
+   *
+   * @param block The block to serialize and use as an insertion marker.
+   * @returns A JSON-formatted string corresponding to a serialized
+   *     representation of the given block suitable for use as an insertion
+   *     marker.
+   */
+  protected override serializeBlockToInsertionMarker(block: Blockly.BlockSvg) {
+    const blockJson = Blockly.serialization.blocks.save(block, {
+      addCoordinates: false,
+      addInputBlocks: true,
+      addNextBlocks: false,
+      doFullSerialization: false,
+    });
+
+    if (!blockJson) {
+      throw new Error(
+        `Failed to serialize source block. ${block.toDevString()}`
+      );
+    }
+
+    return blockJson;
+  }
+}
+
+Blockly.registry.register(
+  Blockly.registry.Type.CONNECTION_PREVIEWER,
+  Blockly.registry.DEFAULT,
+  ScratchInsertionMarkerPreviewer,
+  true
+);