fix(blocks): trigger onChange for insertMany

docs/CHANGELOG.md

@@ -5,6 +5,7 @@
 - `Improvement` - Removed "Narrow" ("Thin") mode. On non-mobile viewports, Plus and Block Tunes controls now use a responsive action rail beside the editor content.
 - `Improvement` - `paste` config supports filter functions for tag-based substitution
 - `Fix` - "Convert to" is not shown in the Inline Toolbar when there are no tools to convert to
+- `Fix` - `blocks.insertMany()` now triggers `onChange` with a `block-added` event for each inserted block
 
 ### 2.31.7
 

src/components/modules/blockManager.ts

@@ -331,6 +331,14 @@ export default class BlockManager extends Module {
    */
   public insertMany(blocks: Block[], index = 0): void {
     this._blocks.insertMany(blocks, index);
+
+    const firstBlockIndex = this.getBlockIndex(blocks[0]);
+
+    blocks.forEach((block, blockIndex) => {
+      this.blockDidMutated(BlockAddedMutationType, block, {
+        index: firstBlockIndex + blockIndex,
+      });
+    });
   }
 
   /**

src/components/modules/modificationsObserver.ts

@@ -18,7 +18,7 @@ export default class ModificationsObserver extends Module {
   /**
    * Flag shows onChange event is disabled
    */
-  private disabled = false;
+  private disabled = true;
 
   /**
    * Blocks wrapper mutation observer instance

test/cypress/tests/onchange.cy.ts

@@ -1111,6 +1111,61 @@ describe('onChange callback', () => {
     }));
   });
 
+  it('should batch block-added events with their targets and indices on insertMany', () => {
+    cy.createEditor({
+      onChange: cy.stub().as('onChange'),
+      data: {
+        blocks: [
+          {
+            type: 'paragraph',
+            data: { text: 'First block' },
+          },
+          {
+            type: 'paragraph',
+            data: { text: 'Last block' },
+          },
+        ],
+      },
+    }).as('editorInstance');
+
+    cy.wait(modificationsObserverBatchTimeout);
+    cy.get('@onChange').should('not.be.called');
+
+    cy.get<EditorJS>('@editorInstance').then(editor => {
+      editor.blocks.insertMany([
+        {
+          id: 'bulk-first',
+          type: 'paragraph',
+          data: { text: 'Inserted first' },
+        },
+        {
+          id: 'bulk-second',
+          type: 'paragraph',
+          data: { text: 'Inserted second' },
+        },
+      ], 1);
+    });
+
+    cy.get('@onChange').should('be.calledWithBatchedEvents', [
+      {
+        type: BlockAddedMutationType,
+        detail: {
+          index: 1,
+          target: { id: 'bulk-first' },
+        },
+      },
+      {
+        type: BlockAddedMutationType,
+        detail: {
+          index: 2,
+          target: { id: 'bulk-second' },
+        },
+      },
+    ]);
+    cy.get('@onChange').its('firstCall.args.1')
+      .should('have.length', 2);
+  });
+
   it('should not be called when editor is initialized with readOnly mode', () => {
     const config = {
       readOnly: true,