? Pending

User tests: Successful: Unsuccessful:

avatar DerinMavi
DerinMavi
25 Oct 2019

Summary of Changes

Fix for JoomlaTinyMCE.setupEditors() overwriting element style(width & height) with default values

Testing Instructions

Create a page with element:

<div class="js-editor-tinymce"><textarea style="width: 1234px; height: 345px;"></textarea></div>

Make sure tinymce.min.js is included inside the head:

<script src="/<joomla root>/media/editors/tinymce/js/tinymce.min.js?165d29f84be303af93c70376b473e0fb" type="text/javascript"></script>

Expected result

Inline element style is used instead of default values

Actual result

Default values are used

Documentation Changes Required

avatar DerinMavi DerinMavi - open - 25 Oct 2019
avatar DerinMavi DerinMavi - change - 25 Oct 2019
Status New Pending
avatar joomla-cms-bot joomla-cms-bot - change - 25 Oct 2019
Category JavaScript External Library
avatar DerinMavi DerinMavi - change - 25 Oct 2019
The description was changed
avatar DerinMavi DerinMavi - edited - 25 Oct 2019
avatar DerinMavi DerinMavi - change - 25 Oct 2019
The description was changed
avatar DerinMavi DerinMavi - edited - 25 Oct 2019
avatar DerinMavi DerinMavi - change - 25 Oct 2019
The description was changed
avatar DerinMavi DerinMavi - edited - 25 Oct 2019
avatar schnuti
schnuti - comment - 27 Oct 2019

Maybe you should explain how you use the PHP part of the editor.
I think you fix an issue with changes in the Javascript where the problem is created in the PHP plugin.
For a quick fix I edited the core code (4.0) yesterday to make it possible to set a custom (form field) height. I think those parameters are removed in 4.0 but they are still used in the code.
You're fine with a width of 100%. Set a div container around the editor if you need to control the width.
If you need to control the height, you have to explicitly set a height. And that seems not to be possible.

avatar Fedik
Fedik - comment - 29 Oct 2019

sorry, this is a wrong fix,
you have to use TinyMCE width/height options, instead of hacking around

avatar schnuti
schnuti - comment - 29 Oct 2019

@Fedik
You are right but there is and was a problem in the tinyMCE plugin. line 366 and following in J4.0

 $html_height = $this->params->get('html_height', '550');
 $html_width  = $this->params->get('html_width', '');

You can't find those params in 4.0 i understand- thank God - but used in the code.

Used in line 595, 596

 'height'             => $html_height,
 'width'              => $html_width,

When I change this to use $width and $height, it works as expected for me.
You can skip the width as tinyMCE sets a default to 100%. This leaves it to the Html to set a div container around the editor if needed. The height has to be set if you want to restrict it. The height is the height of the editor including the toolbar and buttons used internally by tinyMCE. You can still resize the area if option is set.
I so far use a plugin to override this behavior as needed.

Please check this.

avatar DerinMavi DerinMavi - change - 29 Oct 2019
Labels Added: ?
avatar DerinMavi
DerinMavi - comment - 29 Oct 2019

@schnuti , i have another PR, i believe it probably fixes your issue as well. see #26755

avatar DerinMavi
DerinMavi - comment - 29 Oct 2019

sorry, this is a wrong fix,
you have to use TinyMCE width/height options, instead of hacking around

Those options cannot be used for dynamically created editors.

avatar Fedik
Fedik - comment - 29 Oct 2019

Those options cannot be used for dynamically created editors.

what do you mean with "dynamically created editors" ?
you should show full example of your code

avatar DerinMavi
DerinMavi - comment - 29 Oct 2019

Those options cannot be used for dynamically created editors.

what do you mean with "dynamically created editors" ?
you should show full example of your code

I meant if the editor is created via javascript.

avatar schnuti
schnuti - comment - 29 Oct 2019

@DerinMavi
You can instantiate tinyMCE with Javascript without using Joomla PHP-methods. I do that for inline editing in frontend. Set your own selector and any options you need.

avatar Fedik
Fedik - comment - 30 Oct 2019

I meant if the editor is created via javascript

That not an answer, but if you instantiate tinyMCE with your own JavaScript then how it related to JoomlaTinyMCE.setupEditors?
as @schnuti already wrote, in your own code you free to do anything

avatar DerinMavi
DerinMavi - comment - 30 Oct 2019

That not an answer, but if you instantiate tinyMCE with your own JavaScript then how it related to JoomlaTinyMCE.setupEditors?
as @schnuti already wrote, in your own code you free to do anything

Yes, but I can't. JoomlaTinyMCE.setupEditors() is attached to DOMContentLoaded. After that event triggers; it replaces all textarea's with TinyMCE's, and because it has no prior knowledge of dynamically created textarea's - it uses default settings to configure TinyMCE; overwriting inline attributes of textarea elements. Inline attributes should be #1 in order of precedence.

avatar schnuti
schnuti - comment - 30 Oct 2019

@DerinMavi
And what happens when you change the selector in your example "js-editor-tinymce" to "my-editor-tinymce"? Still touched by Joomla? Then this should be wrong.

avatar Fedik
Fedik - comment - 30 Oct 2019

As far as I can see it not Joomla! issue (you did not provide any code that can prove opposite)

avatar DerinMavi
DerinMavi - comment - 30 Oct 2019

@Fedik yes, I think we can close this

avatar DerinMavi DerinMavi - change - 30 Oct 2019
Status Pending Closed
Closed_Date 0000-00-00 00:00:00 2019-10-30 20:13:06
Closed_By DerinMavi
avatar DerinMavi DerinMavi - close - 30 Oct 2019

Add a Comment

Login with GitHub to post a comment