IE Rich Text Editor (RTE - TinyMCE) source code issues
I am having an issue with the TinyMCE rich text editor (RTE) in Umbraco 7.2. The issue affects IE10 and IE11 (possibly older versions too).
When I view the source of the RTE, the formatting is stripped of all return breaks in the code. The HTML renders fine, but the markup is difficult to read without any return breaks (similar to a minified js file).
Even if I press the return key whilst viewing the source, a space appears rather than a return.
If I view the source code in Chrome or Firefox, the return breaks show as normal.
I also tested the latest version of TinyMCE on their website (4.1.7) and it works fine in IE. I think Umbraco 7.2 is using TinyMCE 3.5.10, so it could be a TinyMCE issue.
Is anyone else having this issue? If this is a TinyMCE problem, can I update my version in Umbraco without breaking anything else?
FYI I upgraded my installation via Nuget from 7.1.9 to 7.2.
Since Umbraco 7 version 4 of TinyMce has been used. Older version of Umbraco use 3.x.
Apart from the "minified" rendering does the HTML then actually work? Or does it cause rendering issues? I'm not sure I understand what the problem caused by this is? :)
I'm not sure exactly what version of TinyMCE I am using but I checked the following file: UmbracoClient/Tinymce3/tinymce_src.js and it reads 3.5.10, therefore I assumed that was the version. How do I check the version otherwise?
As for the issue, there is no actual problem with the HTML rendering in both the HTML view and when published on the site. The issue is only when you view the source through the RTE. It doesn't actually stop anything from working on the front end, it's just not easy to use when editing the source code directly. It's not a show stopper by any means, but it's annoying and doesn't occur when you demo TinyMCE 4.1.7 via the TinyMCE website.
Yeah, it's a bit confusing but there still is some legacy code in the v7 branch - Even though the code for v3.5.10 is there it's not what Umbraco is using.
Try having a look at /Umbraco/Lib/TinyMce - This is v4.0.11 in 7.2.
I don't know if the issue you're writing about has been fixed with 4.0.11 of tinymce though. So it could be a tinymce issue, which is fixed once the tinymce source is upgraded in the core.
I have checked the TinyMCE release notes for versions post 4.0.11 and I can't see any mention of it there. I don't have time to look into this any further as it's more a quirk than a bug. I was just curious if there was a quick fix.
You're welcome - One can always file a feature request or bug at the issue tracker or go vote up already created issues if there is something you would like to see fixed or changed. It's no guarantee that it's something that HQ will prioritize though depending on the impact of the issue etc. but perhaps other people from the community will contribute and make a PR fixing it for instance.
I guess I should also re-minify the js file. I wonder if the fix is as simple as just the addition of the line:
settings.skin = undefined;
Or if the non-minified file has something else that makes this work? But either way I'm happy - now.
Not to others with this problem: To download, choose the [DEV] link on http://www.tinymce.com/download/older.php and open /tinymce/js/tinymce/tinymce.js in your favourite editor.
Add the line settings.skin = undefined; as described in Glenn's post above. Then rename/save elsewhere the existing /umbraco/lib/tinlmce/tinymce.min.js and copy the file you have just edited into its place. Check if it works and then minify this file using a tool such as http://jscompress.com/ and resave
Note to Umbraco Devs:
Please implement this fix because it is a fundamental flaw.
I have a new website v7.7.6 and blow me the SAME issue. The problem now is that the tinymce.min.js is completely different but with the same "feature".
Surely I'm not the only user who likes to add code in the HTML view?
I can't put lines breaks in even if I wanted to.
IE Rich Text Editor (RTE - TinyMCE) source code issues
I am having an issue with the TinyMCE rich text editor (RTE) in Umbraco 7.2. The issue affects IE10 and IE11 (possibly older versions too).
When I view the source of the RTE, the formatting is stripped of all return breaks in the code. The HTML renders fine, but the markup is difficult to read without any return breaks (similar to a minified js file).
Even if I press the return key whilst viewing the source, a space appears rather than a return.
If I view the source code in Chrome or Firefox, the return breaks show as normal.
I also tested the latest version of TinyMCE on their website (4.1.7) and it works fine in IE. I think Umbraco 7.2 is using TinyMCE 3.5.10, so it could be a TinyMCE issue.
Is anyone else having this issue? If this is a TinyMCE problem, can I update my version in Umbraco without breaking anything else?
FYI I upgraded my installation via Nuget from 7.1.9 to 7.2.
Thanks in advance.
Hi Nathan
Since Umbraco 7 version 4 of TinyMce has been used. Older version of Umbraco use 3.x.
Apart from the "minified" rendering does the HTML then actually work? Or does it cause rendering issues? I'm not sure I understand what the problem caused by this is? :)
/Jan
Hi Jan,
I'm not sure exactly what version of TinyMCE I am using but I checked the following file: UmbracoClient/Tinymce3/tinymce_src.js and it reads 3.5.10, therefore I assumed that was the version. How do I check the version otherwise?
As for the issue, there is no actual problem with the HTML rendering in both the HTML view and when published on the site. The issue is only when you view the source through the RTE. It doesn't actually stop anything from working on the front end, it's just not easy to use when editing the source code directly. It's not a show stopper by any means, but it's annoying and doesn't occur when you demo TinyMCE 4.1.7 via the TinyMCE website.
Cheers, Nathan
Hi Nathan
Yeah, it's a bit confusing but there still is some legacy code in the v7 branch - Even though the code for v3.5.10 is there it's not what Umbraco is using.
Try having a look at /Umbraco/Lib/TinyMce - This is v4.0.11 in 7.2.
I don't know if the issue you're writing about has been fixed with 4.0.11 of tinymce though. So it could be a tinymce issue, which is fixed once the tinymce source is upgraded in the core.
Hope this helps.
/Jan
Thanks Jan.
I have checked the TinyMCE release notes for versions post 4.0.11 and I can't see any mention of it there. I don't have time to look into this any further as it's more a quirk than a bug. I was just curious if there was a quick fix.
Cheers for the help. Nathan
Hi Nathan
You're welcome - One can always file a feature request or bug at the issue tracker or go vote up already created issues if there is something you would like to see fixed or changed. It's no guarantee that it's something that HQ will prioritize though depending on the impact of the issue etc. but perhaps other people from the community will contribute and make a PR fixing it for instance.
Happy umbracoing :)
/Jan
I have the same problem. Not only are all the liner breaks and returns removed but you can't type them in to even make editing easier - it's a pain.
Screenshot below.
This is a retrograde step, certainly not an improvement.
This "bug" is back with us (I have new set-up using v7.7.6) - am I the only one who edits in HTML view every now and again?
My "fix" below won't work because the tinymce.min.js file is now completely different.
Just to add that we have had this reported by a content manager to us tooo as a bug. I have upvoted this original post.
I have found this on issue tracker at: http://issues.umbraco.org/issue/U4-6592 and will assess the fix suggested
Thanks, Luciox
Hi Luciox,
I have just tried the fix posted by Glenn on https://our.umbraco.org/forum/umbraco-7/using-umbraco-7/59380-Umbraco-and-TinyMce-Richtext-editor-adding-in-nbsp-to-replace-whitespace and it seems to work.Thanks Glenn!
I guess I should also re-minify the js file. I wonder if the fix is as simple as just the addition of the line:
settings.skin = undefined;
Or if the non-minified file has something else that makes this work? But either way I'm happy - now.
Not to others with this problem: To download, choose the [DEV] link on http://www.tinymce.com/download/older.php and open /tinymce/js/tinymce/tinymce.js in your favourite editor.
Add the line settings.skin = undefined; as described in Glenn's post above. Then rename/save elsewhere the existing /umbraco/lib/tinlmce/tinymce.min.js and copy the file you have just edited into its place. Check if it works and then minify this file using a tool such as http://jscompress.com/ and resave
Note to Umbraco Devs:
Please implement this fix because it is a fundamental flaw.
Thanks William for your comments :-)
I have now applied and it's done the trick.
Thanks, Luciox
I have a new website v7.7.6 and blow me the SAME issue. The problem now is that the tinymce.min.js is completely different but with the same "feature".
Surely I'm not the only user who likes to add code in the HTML view? I can't put lines breaks in even if I wanted to.
Note to Umbraco Devs:
Please fix this because it is a fundamental flaw.
is working on a reply...