Added tinymce de-focus toolbar hack for drawing editor load

The tinymce event system would not pick up the focus within the loaded
draw.io instance, after the drawing toolbar button was clicked, hence
the toolbar would hang around.

This adds a hack to dispatch a mousedown event on the body to get the
toolbar to hide.

For #3597

diff --git a/resources/js/wysiwyg/plugin-codeeditor.js b/resources/js/wysiwyg/plugin-codeeditor.js
index db449021501fa72282ac63359c29242c2ed6ef53..82052a40d82bf167dda0f8577234c2145395c47d 100644 (file)
--- a/resources/js/wysiwyg/plugin-codeeditor.js
+++ b/resources/js/wysiwyg/plugin-codeeditor.js
@@ -165,7 +165,6 @@ function register(editor, url) {
             showPopup(editor, textContent, '', (newCode, newLang) => {
                 const pre = doc.createElement('pre');
                 const code = doc.createElement('code');
             showPopup(editor, textContent, '', (newCode, newLang) => {
                 const pre = doc.createElement('pre');
                 const code = doc.createElement('code');

-                console.log(newCode);

                 code.classList.add(`language-${newLang}`);
                 code.innerText = newCode;
                 pre.append(code);
                 code.classList.add(`language-${newLang}`);
                 code.innerText = newCode;
                 pre.append(code);

diff --git a/resources/js/wysiwyg/plugin-drawio.js b/resources/js/wysiwyg/plugin-drawio.js
index 7d679d539231ab822db3055ccfcb74cdc590f031..54a1609217b656ad5ff74bccada288b045df3d25 100644 (file)
--- a/resources/js/wysiwyg/plugin-drawio.js
+++ b/resources/js/wysiwyg/plugin-drawio.js
@@ -106,6 +106,8 @@ export function getPlugin(providedOptions) {
             icon: 'diagram',
             onAction() {
                 editor.execCommand('drawio');
             icon: 'diagram',
             onAction() {
                 editor.execCommand('drawio');

+                // Hack to de-focus the tinymce editor toolbar
+                window.document.body.dispatchEvent(new Event('mousedown', {bubbles: true}));

             },
             fetch(callback) {
                 callback([
             },
             fetch(callback) {
                 callback([