Bug 24764 - TinyMCE shouldnt do automatic code cleanup when editing HTML in News Feature
Summary: TinyMCE shouldnt do automatic code cleanup when editing HTML in News Feature
Status: Pushed to oldstable
Alias: None
Product: Koha
Classification: Unclassified
Component: Tools (show other bugs)
Version: master
Hardware: All All
: P5 - low normal (vote)
Assignee: Lucas Gass
QA Contact: Testopia
URL:
Keywords:
Depends on:
Blocks:
 
Reported: 2020-02-28 19:16 UTC by Lucas Gass
Modified: 2020-05-13 21:52 UTC (History)
5 users (show)

See Also:
Change sponsored?: ---
Patch complexity: Small patch
Who signed the patch off:
Text to go in the release notes:
Version(s) released in:
20.05.00, 19.11.06, 19.05.11


Attachments
Bug 24764: TinyMCE shouldnt do automatic code cleanup when editing HTML in News Feature (1.68 KB, patch)
2020-03-26 22:50 UTC, Lucas Gass
Details | Diff | Splinter Review
Bug 24764: TinyMCE shouldnt do automatic code cleanup when editing HTML in News Feature (1.73 KB, patch)
2020-03-27 00:19 UTC, David Cook
Details | Diff | Splinter Review
Bug 24764: TinyMCE shouldnt do automatic code cleanup when editing HTML in News Feature (1.90 KB, patch)
2020-04-12 22:49 UTC, Katrin Fischer
Details | Diff | Splinter Review

Note You need to log in before you can comment on or make changes to this bug.
Description Lucas Gass 2020-02-28 19:16:37 UTC
Currently if you use the HTML option in the news tool TinyMCE does automatic code cleanup and this can be problematic. 

If I enter into the HTML field:

<i class="fa fa-facebook-official" aria-hidden="true"></i>

The editor thinks this is nothing and won't update code at all. 

IF I enter:

<i class="fa fa-facebook-official" aria-hidden="true">TEST</i>

the editor changes it to: 

<p><em class="fa fa-facebook-official">TEST</em></p>


It would be better if the feature didn't auto cleanup HTML.
Comment 1 Katrin Fischer 2020-02-29 21:53:05 UTC
+1
Comment 2 Margaret 2020-03-09 23:30:23 UTC
+1
Comment 3 Lucas Gass 2020-03-26 22:18:37 UTC
In my opinion we should replace TinyMCE with CodeMirror here.
Comment 4 Katrin Fischer 2020-03-26 22:34:02 UTC
(In reply to Lucas Gass from comment #3)
> In my opinion we should replace TinyMCE with CodeMirror here.

Making it an option like the WYSIQY editor for prefs is might be nice.
So you can switch if you want to do more elaborate things and keep the editor for people not fond of code?
Comment 5 Lucas Gass 2020-03-26 22:50:04 UTC
Created attachment 101917 [details] [review]
Bug 24764: TinyMCE shouldnt do automatic code cleanup when editing HTML in News Feature

TEST PLAN:
1. Make a new news item and use the TinyMCE editor, click on the <> icon to go to the Source code editor
2. Add some HTML like <i class="fa fa-facebook-official" aria-hidden="true">TEST</i> and save it.
3. Go back in and notice that TinyMCE has changed it to: <p><em class="fa fa-facebook-official">TEST</em></p>
4. It should not auto clean up and also it should not autowrap with <p> tag.
5. Apply patch patch, and repeat step 2. Save again.
6. It should not have automatiicly changed any HTML or added any <p> wrapper.
Comment 6 Lucas Gass 2020-03-26 22:51:41 UTC
This patch fixes the automatic code clean up problem with tinyMCE. A discussion of wether CodeMirror might be a better option (or ability to use either) is for a different bug, I think.
Comment 7 Katrin Fischer 2020-03-26 22:54:08 UTC
(In reply to Lucas Gass from comment #6)
> This patch fixes the automatic code clean up problem with tinyMCE. A
> discussion of wether CodeMirror might be a better option (or ability to use
> either) is for a different bug, I think.

Agreed, I filed bug 22660 :)
Comment 8 David Cook 2020-03-26 23:42:33 UTC
Awesome! I'm going to put this on my todo list. In the middle of something else at the moment, but hoping to sign this off today. Been bitten by this issue more often than I'd like.
Comment 9 David Cook 2020-03-27 00:19:48 UTC
Created attachment 101929 [details] [review]
Bug 24764: TinyMCE shouldnt do automatic code cleanup when editing HTML in News Feature

TEST PLAN:
1. Make a new news item and use the TinyMCE editor, click on the <> icon to go to the Source code editor
2. Add some HTML like <i class="fa fa-facebook-official" aria-hidden="true">TEST</i> and save it.
3. Go back in and notice that TinyMCE has changed it to: <p><em class="fa fa-facebook-official">TEST</em></p>
4. It should not auto clean up and also it should not autowrap with <p> tag.
5. Apply patch patch, and repeat step 2. Save again.
6. It should not have automatiicly changed any HTML or added any <p> wrapper.

Signed-off-by: David Cook <dcook@prosentient.com.au>
Comment 10 Katrin Fischer 2020-04-12 22:49:23 UTC
Created attachment 102778 [details] [review]
Bug 24764: TinyMCE shouldnt do automatic code cleanup when editing HTML in News Feature

TEST PLAN:
1. Make a new news item and use the TinyMCE editor, click on the <> icon to go to the Source code editor
2. Add some HTML like <i class="fa fa-facebook-official" aria-hidden="true">TEST</i> and save it.
3. Go back in and notice that TinyMCE has changed it to: <p><em class="fa fa-facebook-official">TEST</em></p>
4. It should not auto clean up and also it should not autowrap with <p> tag.
5. Apply patch patch, and repeat step 2. Save again.
6. It should not have automatiicly changed any HTML or added any <p> wrapper.

Signed-off-by: David Cook <dcook@prosentient.com.au>

Signed-off-by: Katrin Fischer <katrin.fischer.83@web.de>

https://bugs.koha-community.org/show_bug.cgi?id=24709

https://bugs.koha-community.org/show_bug.cgi?id=24706
Comment 11 Martin Renvoize 2020-04-14 07:36:55 UTC
Nice work everyone!

Pushed to master for 20.05
Comment 12 Joy Nelson 2020-05-04 21:40:53 UTC
backported to 19.11.x for 19.11.06
Comment 13 Lucas Gass 2020-05-13 21:52:15 UTC
backported to 19.05.x for 19.05.11