Hello,
we're doing a lot of customizations of the TinyMCE editor, one example is the syntax highlighting languages of the "codesample" plugin. A lof of usefull languages are missing in the default.
Previously on TinyMCE 5.10, I could overwrite the default configuration like this:
var pluginBaseDir =
"/connections/resources/web/tiny.editors.connections/tinymce-6/plugins/"
...
externalPlugins: [{
name: "codesample",
url: pluginBaseDir + "codesample/plugin.js",
settings: {
codesample_global_prismjs: true,
codesample_languages: [
{ text: 'Apache', value: 'apacheconf'},
{ text: 'Bash', value: 'bash'},
{ text: 'Dockerfile', value: 'docker'},
{ text: 'HTML/XML', value: 'markup' },
{ text: 'CSS', value: 'css' },
{ text: 'C', value: 'c' },
{ text: 'C#', value: 'csharp' },
{ text: 'C++', value: 'cpp' },
{ text: 'JSON', value: 'json' },
{ text: 'JavaScript', value: 'javascript' },
{ text: 'Java', value: 'java' },
{ text: 'Nginx', value: 'nginx' },
{ text: 'PowerShell', value: 'powershell' },
{ text: 'PHP', value: 'php' },
{ text: 'Python', value: 'python' },
{ text: 'Ruby', value: 'ruby' },
{ text: 'Regex', value: 'regex' },
{ text: 'SQL', value: 'sql' },
{ text: 'YAML', value: 'yaml' }
]
}
}, ...
]
This doesn't work on TinyMCE 6 any more, the plugin.js of the codesample plugin isn't loaded any more. I analyzed the TinyEditorForConnections archive and found out that the content of the codesample plugin is present in tinymce-bundle.min.js.
So it looks like that the behavior of the external_plugins array has changed and it won't reload plugins again, if they're already present in the main bundle. While this itself is usefull, do we have another method of overriding at least the configuration of already loaded plugins? I don't see another way if external_plugins is completely ignored.
This is also the case even if the new allowOverride: true setting is set to true. It mentions externalPlugins[x].settings, however it still seems only to apply to those, who are not already loaded.
// Allow overriding integration settings in the `additionalSettings`
// or in `externalPlugins.[x].settings`.
// WARNING: overriding integration settings could break the integration.
allowOverride: true,
Even when I remove the minified plugin from tinymce-bundle.min.js (which itself is no very clean way), the plugin file is at least loded. However, I still have the limited default languages. It makes no difference if I provide the settings as object, or the new documented way using a wrapper function:
externalPlugins: [{
name: "codesample",
url: pluginBaseDir + "codesample/plugin.min.js",
settings: function() {
console.log('codesample custom settings wrapper function for codesample_languages modifications called');
return {
codesample_global_prismjs: true,
codesample_languages: [
{ text: 'Apache', value: 'apacheconf'},
{ text: 'Bash', value: 'bash'},
{ text: 'Dockerfile', value: 'docker'},
{ text: 'HTML/XML', value: 'markup' },
{ text: 'CSS', value: 'css' },
{ text: 'C', value: 'c' },
{ text: 'C#', value: 'csharp' },
{ text: 'C++', value: 'cpp' },
{ text: 'JSON', value: 'json' },
{ text: 'JavaScript', value: 'javascript' },
{ text: 'Java', value: 'java' },
{ text: 'Nginx', value: 'nginx' },
{ text: 'PowerShell', value: 'powershell' },
{ text: 'PHP', value: 'php' },
{ text: 'Python', value: 'python' },
{ text: 'Ruby', value: 'ruby' },
{ text: 'Regex', value: 'regex' },
{ text: 'SQL', value: 'sql' },
{ text: 'YAML', value: 'yaml' }
]
};
}
}
The console.log call got printed twice, but still getting the default languages.
I could only modify the codesample_languages by searching the default array in tinymce-bundle.min.js
and replacing them with my own:
Am I missing something or is the newly introduced allowOverride broken, at least for already loaded plugins?
Edit: Hack for the preview
Since codesample_global_prismjs: true is not respected any more, we need to hack this in the tinymce-bundle.min.js as well (Prism lighight needs to be attached of course). Otherwise, the highlighting doesn't work in the editor mode (but at least rendered when added to renderer/prism.js).
To apply this fix, we need to replace
t("codesample_global_prismjs",{processor:"boolean",default:!1})
with
t("codesample_global_prismjs",{processor:"boolean",default:true})
to have the same experience as with the overwritten plugin previously.