Dispatch per-instance tinyMceEditorInit and batch tinyMceAllEditorsInit events

* Add event dispatch for TinyMCE editor initialization

Introduced a new function to dispatch a custom event when the TinyMCE editor initializes, enhancing integration capabilities.

Author: john-psina

CHANGELOG.rst

@@ -3,6 +3,12 @@ Changelog
 
 This document describes changes between each past release.
 
+Unreleased
+==========
+
+- Add `tinyMceEditorInit` and `tinyMceAllEditorsInit` events
+
+
 5.0.0 (2025-10-21)
 ==================
 

tinymce/static/django_tinymce/init_tinymce.js

@@ -1,7 +1,11 @@
 'use strict';
 
 {
-  function initTinyMCE(el) {
+  function onEditorInit(editor) {
+    const event = new CustomEvent('tinyMceEditorInit', { detail: editor });
+    document.dispatchEvent(event);
+  }
+  async function initTinyMCE(el) {
     if (el.closest('.empty-form') === null) {  // Don't do empty inlines
       var mce_conf = JSON.parse(el.dataset.mceConf);
 
@@ -15,6 +19,7 @@
         'images_upload_handler',
         'paste_postprocess',
         'paste_preprocess',
+        'init_instance_callback',
         'setup',
         'urlconverter_callback',
         'media_url_resolver',
@@ -40,10 +45,19 @@
       if (el.dataset.mceGzConf) {
         tinyMCE_GZ.init(JSON.parse(el.dataset.mceGzConf));
       }
+      // Dispatch per-instance event while preserving user callback
+      const userInitInstanceCallback = mce_conf.init_instance_callback;
+      mce_conf.init_instance_callback = function(editor) {
+        if (typeof userInitInstanceCallback === 'function') {
+          userInitInstanceCallback(editor);
+        }
+        onEditorInit(editor);
+      };
       if (!tinyMCE.get(el.id)) {
-        tinyMCE.init(mce_conf);
+        return await tinyMCE.init(mce_conf);
       }
     }
+    return [];
   }
 
   // Call function fn when the DOM is loaded and ready. If it is already
@@ -56,8 +70,17 @@
     }
   }
 
-  function initializeTinyMCE(element, formsetName) {
-    Array.from(element.querySelectorAll('.tinymce')).forEach(area => initTinyMCE(area));
+  async function initializeTinyMCE(element, formsetName) {
+    const areas = Array.from(element.querySelectorAll('.tinymce'));
+    const initPromises = areas.map(area => initTinyMCE(area));
+
+    const results = await Promise.all(initPromises);
+    const allEditors = results.flat();
+    if (allEditors.length) {
+      const event = new CustomEvent('tinyMceAllEditorsInit', { detail: allEditors });
+      document.dispatchEvent(event);
+    }
+    return allEditors;
   }
 
   ready(function() {