Issues with TinyMCE CSS

Short description of the issue

My objective is to be able add CSS to InputfieldTinyMCE that can be edited in my IDE rather than entered into a config field in the PW admin. In attempting to do this I found some issues with the CSS features of InputfieldTinyMCE.

1. If you choose the "Custom" option for "Content style", the CSS file doesn't get any cache-busting treatment so when the file is updated users will continue to see outdated CSS if the file is in their browser cache.

2024-10-28_190021

2. It doesn't seem to be possible to set InputfieldTinyMCE settings in a hook to renderReadyHook, as per other PW inputfields.

$wire->addHookBefore('InputfieldTinyMCE::renderReadyHook', function(HookEvent $event) {
    $inputfield = $event->object;
    // The below has no effect
    $inputfield->content_css_url = '/site/templates/TinyMCE/contents.css?v=2';
    $inputfield->extraCSS = "h2 {color: red;}";
});

3. According to the TinyMCE docs, the content_css setting accepts an array of CSS file URLs. But when an array is used for this setting in the JSON file defined in "Default setting overrides JSON file", an error occurs.

2024-10-28_200607

4. The TinyMCE docs mention a common problem with browser caching for content_css and suggests adding a dynamic datetime value in the query string: https://www.tiny.cloud/docs/tinymce/latest/add-css-options/#browser-caching But this isn't possible with InputfieldTinyMCE because the full range of TinyMCE settings are only settable via JSON.

This last one is probably an issue for more than just the custom_css setting - there will be cases where you want to set any of the full range of TinyMCE setting dynamically at runtime. So it would be good if PW provided a way to do this, e.g. a hookable method that gets the TinyMCE settings array before it goes to $config->js().

Setup/Environment

ProcessWire version: 3.0.241

processwire / processwire-issues

Issues with TinyMCE CSS #1981

Short description of the issue

Setup/Environment