U4-5334 - Richtext editor inserts extra p - tags to html output

Created by Marc Kristensen 11 Aug 2014, 12:12:05 Updated by Kamila Mielczarek 23 Feb 2018, 11:04:32

Is duplicated by: U4-4356

Is duplicated by: U4-4815

Relates to: U4-8543

Relates to: U4-4085

Sometimes the rich text editor in umbraco 7.1.1 inserts extra blank p tags between other p tags. It usually happens when: 1 inserting macro in rte. 2 saving and publishing. 3 changing some of the text followed by a save and publish.

It happens quite randomly. I tried just with text, no problems. But when i insert a macro it usually inserts the extra p-tags, resulting in extra line changes.

1 Attachments

Comments

Marc Kristensen 11 Aug 2014, 12:53:41

Forgot to mention, browser and version. Chrome version 36.0.1985.125 m Firefox version 31.0


Timo 23 Sep 2014, 08:21:17

We've got the exact same issue. In our case it happens when we're editing a macro. This macro has multiple content pickers, once we empty the value in one of the content pickers the

tags show up (not always).

Umbraco 7.1.4 Chrome 37.0.2062.120 m


Arjan Woldring 26 Sep 2014, 12:51:58

Our customers are reporting this issue too in 7.1.6. The only consistent way to reproduce is when text and a macro is inserted in the RTE and you hit save and publish it adds extra

's. When you hit save and publish again it duplicates the

's.


Joost Klein 28 Sep 2014, 07:42:48

The same here. After inserting a macro and hitting save and publish everything looks fine. But when some text is added and save and publish is hit again, it dublicates the existing

's. After removing them and hitting save and publish again.... the

's come back again in double amounts!


Timo 29 Oct 2014, 11:06:19

Any update on this issue? Our clients are having this issue and it hurts their experience.


Nicklas Gavelin 14 Nov 2014, 10:07:11

Having the same issue in the 7.1.8 release.


charles afford 17 Nov 2014, 19:51:47

Has this been fixed? Ok reproduced it


Tommy Enger 01 Dec 2014, 08:41:25

Anyone tested this in 7.2.0?


andrew shearer 20 Jan 2015, 02:11:16

hi Tommy - yes still an issue in 7.2.1


Matthew 20 Jan 2015, 20:11:11

I also had this issue a while back and a bit of Googling turned up a solution for this that involved editing the tinyMceConfig.config file in the Configs directory of your site.

The default setting for p tags is: #p[id|style|dir|class|align]. Try replacing the pound symbol with a dash like so: -p[id|style|dir|class|align]. According to the TinyMCE [http://www.tinymce.com/wiki.php/Configuration:valid_elements valid_elements doc], the pound symbol will fill empty elements with padding ( ), whereas the dash will simply remove empty elements.


andrew shearer 28 Jan 2015, 03:42:01

thanks for that info, Matthew. Core team - should this be an update to the main repo?


Marc Kristensen 28 Jan 2015, 17:49:00

I can confirm the solution @Matthew suggested works.


suzyb 23 Mar 2015, 16:05:58

I'm having this issue in 7.2.2 but it only seems to happen when a macro is edited. When the macro is added to the RTE no empty paragraphs are added, the first time it is edited is the same. However each subsequent time the macro is edited empty paragraphs are added to the content.

Matthew's solution didn't seem to work for me.


Wesley de Roo 04 Aug 2015, 14:18:38

Also affected in version 7.2.8. I've a macro and some text. Macro has some parameters, a textbox and a content picker. After saved and published, going back to edit the page and edit the macro. Save and publish the page results in adding empty

to the source.


Richard Chamorro 18 Aug 2015, 16:09:41

Also suffering this bug with version 7.2.8. If I make two consecutive "save and publish", multiple empty p tags are added to the source.


Anthony Chudley 21 Aug 2015, 15:15:51

Same issue here, again related to editing a Macro and saving again afterwards.


Anthony Chudley 21 Aug 2015, 15:16:34

@suzyb Same issue here, again related to editing a Macro and saving again afterwards. Occurs in V7.2.4.


Thomas Kjær Nielsen 07 Sep 2015, 13:45:45

Also experience the same problem. Hope to get a fix soon.


Shane 23 Nov 2015, 17:15:20

Same issue here. Has this been fixed in 7.3+? @Matthew solution doesn't work for me :(


James Coxhead 25 Nov 2015, 10:03:10

We've noticed this in 7.3.1, and have had a number of clients on various versions of 7 mention it to us.


Brian Powell 09 Dec 2015, 06:40:07

Seeing this problem in 7.3.3 with Chrome 47. It doesn't matter if I have macros or not on the page.


Brian Powell 14 Dec 2015, 15:45:47

I changed my TinyMCE config to strip out empty P tags and they're still being created, at least when macros are involved.


Simon Dingley 13 Jan 2016, 17:34:12

Try adding this to your customConfig in tinyMceConfig.config

''


Hannes Wegner 14 Jan 2016, 20:09:12

I can also confirm this issue using 7.3.4. Happens to us only in combination with a macro and if two empty paragraph tags exists anywhere inside the editor. This is a major issue for our client. Please fix this Umbraco team. Also, tried the above fixes with no success.

@bitmapped, what config change did you make to strip out empty P tags. Is that an even that's fired on "Save"? Thanks!

Additional note: the change from Matthew, changing #p to -p is working ok for me. I forgot to recycle my app pool to see the new change. Thanks!


Brian Powell 14 Jan 2016, 20:40:59

@Hannes I changed to -p in the allowed tags in the TinyMCE config file. I don't know if the code is firing or not but it wasn't working.


Hannes Wegner 14 Jan 2016, 20:44:02

@bitmapped yes, did does now. Thanks for the speedy response!


Joey Kincer 12 Mar 2016, 05:39:18

I can confirm the same issue with 7.4.1. This really needs to be prioritized, it's gone on way too long without a permanent fix.


Sebastiaan Janssen 12 Mar 2016, 11:58:39

@ProNotion's solution seems to work, the problem with -p vs #p that it also removes empty p tags that people want to put there (a blank line is sometimes desirable).

''


Sebastiaan Janssen 12 Mar 2016, 11:58:49

Commit made by '''Sebastiaan Janssen''' on ''2016-03-12T12:58:53+01:00'' https://github.com/umbraco/Umbraco-CMS/commit/9ad3b6a337e0d87dbd0d5d6388d7e97aaf4e47e5

U4-5334 Richtext editor inserts extra p - tags to html output

#U4-5334 Fixed


Sebastiaan Janssen 12 Mar 2016, 12:02:51

To test (even before 7.4.2 is released): add the config in tinyMce.config and make sure to recycle your application pool after applying it. If debug mode is false in web.config, then also make sure to update ClientDependency.config with a new version number (just make it 1 higher or lower) in order for browser cache to be cleared.


Joey Kincer 12 Mar 2016, 17:26:10

@sebastiaan Thanks for taking care of this. I agree that empty

tags used as extra line breaks can be useful in the RTE environment, so I wouldn't want them stripped out either. Is there nothing in between #p and -p? Seems strange there isn't an option for the RTE to just leave it alone by default (neither # nor -) instead of assuming we want or don't want extra

lines.


Sebastiaan Janssen 12 Mar 2016, 17:51:04

It just leaves them alone with the forced_root_block setting


Tor-Erik Klausen 12 Mar 2016, 19:16:39

Turning off forced_root_block has some side-effects though. An example: copy/paste something like this into an empty editor:

Lorem ipsum dolor sit
{code}

Press enter a few time to add more paragraphs and you will see something like this:

Lorem ipsum dolor sit
{code}

Using the remove formatting button leaves you with this:

Lorem ipsum dolor sit
{code}

And since divs lack the styling if p elements this will not look good in a browser.


Sebastiaan Janssen 12 Mar 2016, 20:00:58

Okay, I'll revert and leave this open then, don't know what to do about this. People can manually apply the forced_root_block if they want.


Sebastiaan Janssen 12 Mar 2016, 20:03:43

And for the people asking for a fix: we have no other idea how to fix this properly, we're open to ideas that don't have weird side-effects.


Joey Kincer 12 Mar 2016, 21:05:48

Hmm, well the problem is only there if a macro is inserted in the RTE (at least for me and a few others in this thread). If I go into Code Mirror and remove the HTML code referencing the macro then everything returns to normal. Could it be something in that macro code interfering with TinyMCE doing its root_block thing? I wouldn't expect so as the macro is wrapped in a

block tag, but maybe there's a bug in TinyMCE somewhere that doesn't know how to handle the injected macro code.

The biggest issue is that empty

tags keep multiplying every time a change is made in the editor then Saved/Published (again, only if a macro is embedded), which is definitely something that needs to be addressed sooner or later. We appreciate your efforts so far to eradicate this issue. I see now why it's been on the bug list for so long.


Matthew 27 Apr 2016, 13:58:26

This happened to me when adding a table in code mirror. The empty

tag shows up above the table every time I save and publish. Deleting the tag and re-saving causes the tag to pop right back in there. Like Poe's Tell-Tale Heart, the tag follows me wherever I go... What did I do to deserve this?


Jeremy Pyne 02 Jun 2016, 03:24:26

Fixes in http://issues.umbraco.org/issue/U4-8543 may resolve these issues as a script level. I have done some testing in Chrome with Div and Embedded Macro's and am not having extra P's now.


Tim Murphy 02 Jun 2016, 06:52:05

After a lot of trial and error (mainly error) I discovered that if you view the RTE in HTML mode, remove the extraneous p tags and then place the cursor immediately inside any tag (i.e. immediately to the right of the >, not in the attribute bit), it won't add the extra p. The extra p tags seem to be added only if you leave the cursor outside of a tag container.


Frans Jan Poort 13 Dec 2016, 09:11:43

Hi guys,

Any updates on this issue? Recently I experienced this as well. Chrome 54.0.2840.99; Umbraco 7.5.6


Joey Kincer 13 Dec 2016, 17:31:59

@tmurphy@museum.vic.gov.au You're definitely on to something here, and I'm able to duplicate in 7.5.6. This happens regardless of whether a macro is inserted in the RTE. The issue you describe is similar to something else I reported a while back ([U4-8044|http://issues.umbraco.org/issue/U4-8044]) where it was inserting junk code if the cursor was inside an element tag. It seems the extra tags are dependent on where the cursor is in HTML mode.

I have observed the following scenarios when placing the cursor in HTML mode then saving:

Cursor inside a block (

|

) - all is well, cursor stays in place Cursor inside a tag (<p|>

) - all is well, cursor moved to the first element on the page, strange but of no consequence Cursor outside any block (

|) - adds an extra set of tags at the cursor's location.

So the current workaround is to check HTML mode in the RTE editor and make sure the cursor is inside a block element before saving/publishing, definitely annoying but it guarantees your code will stay as is. Don't know if that analysis helps our Umbraco dev friends, but at least the culprit could be narrowed down.


Chriztian Steinmeier 24 Dec 2016, 07:25:17

Just chipping in that this also happens on Preview or Save (not only Save and Publish) and not just when editing a macro. If the RTE contains a macro and I hit the Preview button, then when I close the preview window, the RTE has been "enhanced" with empty paragraphs...


Henrik Stig Møller 05 Apr 2017, 21:34:05

Umbraco can also remove the

again. After random times 'save and publish'.


Henrik Stig Møller 08 May 2017, 09:49:07

The random

are added by Umbraco in Chrome, Firefox and IE.


Murray Roke 31 Aug 2017, 01:30:08

still in 7.6.5


Chriztian Steinmeier 02 Dec 2017, 19:05:16

Umbraco 7.7.6 does this too - RTE with macros, Save it and there you go. Extra p tags everywhere. Thankfully, we're stripping them when rendering in frontend, but looks horrible to the editor who thinks Umbraco just threw up on their content.


Santhoshkumar N 22 Dec 2017, 14:41:44

Sampe problem with v7.5.14 as well. Any fix found?


Kamila Mielczarek 23 Feb 2018, 11:04:32

I've encountered the same issue in 7.8.1. Any workarounds?


Priority: Major

Type: Bug

State: Open

Assignee:

Difficulty: Normal

Category:

Backwards Compatible: True

Fix Submitted:

Affected versions: 7.1.4, 7.2.4, 7.2.8, 7.3.1, 7.3.3, 7.3.4, 7.4.1, 7.3.5, 7.5.6, 7.5.14, 7.6.5, 7.7.6, 7.8.1

Due in version:

Sprint:

Story Points:

Cycle: