Clarification on the synchronisation with the textarea

[dgrammatiko]

What is the current behavior? Describe the bug
TinyMCE has been the core editor for Joomla for very long time. We're happy and very thankful for your awesome product. As we're in the process of developing our next version we encounter a weird behaviour break. In all our instances we always render a simple button bellow the editor that was switching the UI on and off (basically switching TinyMCE to textarea and the other way around). That was working fine for 3,4 but it seems broken in version 5. With some search in Stackoverflow I saw that the only way around that others found was to destroy and recreate the instance.

The question: Is there any API calls that could sync the content from tiny to textarea and the other way around without destroying and recreating the instance?

For reference: joomla/joomla-cms#26579

code we used before:

tinyMCE.execCommand('mceToggleEditor', false, 'editorId');return false;

EDIT. The functions isHidden, hide, show are working perfectly on the button. The breaking part is when we try to apply the show function on a form submit event. Even with a specific function eg

options.init_instance_callback = (editor) => {
        editor.on('submit', (event) => {
          debugger
          if (editor.isHidden()) {
            editor.show();
          }
        });
      }

the editor seems to synchronise its current data to the textarea before reaching this code. I would expect that this code ran before any internal functions so I could simply switch the editor with show() and trigger the textarea to Editor data update.

Which versions of TinyMCE, and which browser / OS are affected by this issue? Did this work in previous versions of TinyMCE?
TinyMCE 5+

[dgrammatiko]

Playing a little bit more with this one I traced the odd behaviour here:

tinymce/modules/tinymce/src/core/main/ts/init/Render.ts

Lines 248 to 254 in ded8355

	if (settings.add_form_submit_trigger) {
	editor.on('submit', function () {
	if (editor.initialized) {
	editor.save();
	}
	});
	}

I have no clue if this will cause undesired behaviours in other modes but for the default this seems to work fine:

    if (settings.add_form_submit_trigger) {
      editor.on('submit', function () {
        if (editor.initialized) {
          if (editor.isHidden()) {
            editor.load();
          }
          editor.save();
        }
      });
    }

[lnewson]

@dgrammatiko I'll have to look into this more before I can comment too much sorry, but I immediately see one issue in your edit. Your show function will almost definitely be the last callback to run as it's in the init_instance_callback, which is executed after the editor and plugins have setup their handlers.

So there's 2 options available to attempt to solve that:

• a) Move that logic into the setup callback instead, as setup is called before the editor or plugins register handlers.
• b) Add true as a second argument to your on callback, as it'll force the handler to be added to the start of the submit handlers list.

[lnewson]

Here's an example of the two options mentioned above:

a) Use the setup init callback:

setup: function(editor) {
  editor.on('submit', function() {
    if (editor.isHidden()) {
      editor.show();
    }
  });
}

b) Force the handler to the start of the handlers list:

init_instance_callback: function(editor) {
  editor.on('submit', function() {
    if (editor.isHidden()) {
      editor.show();
    }
  }, true);
}

[dgrammatiko]

@lnewson thank you very much, it works fine (picked the 2nd option as we're doing some work already in the setup).