Empty paragraph added when switching to and from source view

[Russ Tennant]

Start with the following HTML

<h1>Submit A Ticket</h1>
<div>
 <div>&nbsp;</div>
</div>

In content editing mode, click on the "Submit A Ticket" text. Click the source button. There is an empty paragraph added to the end of the HTML. Appears to be related to having the last element having nested tags.

Related empty paragraph problem, if you press the down arrow to the bottom of the document in content editing mode you will get an empty paragraph as well. This also only occurs if the last element is nested.

[Jakub Ś]

This is how CKEditor works by default. If you don't want those paragraphs to show try to use in E.g. your config.js: config.enterMode = CKEDITOR.ENTER_BR; config.shiftEnterMode = CKEDITOR.ENTER_P; ​http://docs.cksource.com/ckeditor_api/symbols/CKEDITOR.config.html#.enterMode ​http://docs.cksource.com/ckeditor_api/symbols/CKEDITOR.config.html#.shiftEnterMode

Or config.autoParagraph = false; ​http://docs.cksource.com/ckeditor_api/symbols/CKEDITOR.config.html#.autoParagraph

Or combine those two.

[Russ Tennant]

I'm a little confused about your response. I looked at all the configuration options before submitting and...

We are not pressing enter, so the enter mode options are not an appropriate remedy. Also, we don't want to change the default behavior for enter mode.

The autoParagraph option warns not to change the default for usability reasons. Also, according to the documentation it shouldn't event apply in this case and we also want this option enabled.

Whether automatically create wrapping blocks around inline contents
inside document body, this helps to ensure the integrality of the 
block enter mode. Note: Changing the default value might introduce 
unpredictable usability issues. 

What users don't expect is for the content to change when they haven't type anything in or otherwise initiated any action that should modify the content.

• I am just toggling the source view to inspect the content.
• I'm not changing any content.
• Toggling the source view should not modify the content, but it now does in newer versions.
• This causes a functional issue because it ends up adding extra content, height, to the HTML that is captured.

[Jakub Ś]

Sorry for that. I have checked the issue again and this is a valid bug.

[Jakub Ś]

Reproducible from rev [6698]

[Jakub Ś]

Another TC:

1.Paste in the following code:

<div id="body">
	<ul>
		<li>
			foo</li>
	</ul>
</div>

2. Click behind foo
3. Switch to source

Empty paragraph is added.

[Jakub Ś]

#8436 is a DUP

---

More code allowing to reproduce the issue:

<p>
	&nbsp;</p>
<p>
	some text</p>
<div class="reply">
	<p>
		test</p>
</div>

1. Paste the code in source
2. Switch to WYSIWYG and click or type something inside first paragraph
3. Switch to Source

[Ildefonse]

Is anyone looking into this?

[timkelty]

Really annoying bug, anyone working on it?

[Garry Yao]

The patch introduces an additionally configuration for it.

Additionally as a forecast, we have re-invented the solution to leave cursor from non-paragraphing block in a new way, by creating the paragraph only on demand when user request it explicitly, without always creating the padding block, a beta-release will arrive soon in July to demonstrate this cool feature, stay tuned.

[Frederico Caldeira Knabben]

This patch is not a solution for this issue as, depending on the configuration value, you have either this issue or a different one (not being able to type after tables).

A definitive solution for this will be on CKEditor 4.

[Jean-Philippe Doyle]

As a workaround for this issue in 3.6.4 I am using a quick custom filter on <p> elements to remove empty <p> at the start or end of the content :

elements : {
  p : function( element ) {
    var child = element.children[0];
      if (!(element.previous && element.next) && child && !child.children
          && (!child.value || CKEDITOR.tools.trim( child.value ).match( /^(?:&nbsp;|\xa0|<br \/>)$/ ))) {
        return false;
      }
    return element;
  }
}

I have wrap this in a plugin :

var removeEmptyPFilter = {
  elements : {
    p : function( element ) {
      var child = element.children[0];
        if (!(element.previous && element.next) && child && !child.children
            && (!child.value || CKEDITOR.tools.trim( child.value ).match( /^(?:&nbsp;|\xa0|<br \/>)$/ ))) {
          return false;
        }
      return element;
    }
  }
};

CKEDITOR.plugins.add( 'removeEmptyP',
{
  init: function( editor )
  {
     // Give the filters lower priority makes it get applied after the default ones.
     editor.dataProcessor.htmlFilter.addRules( removeEmptyPFilter, 100 );
     editor.dataProcessor.dataFilter.addRules( removeEmptyPFilter, 100 );
  }
});


CKEDITOR.editorConfig = function( config )
{
  config.extraPlugins = 'removeEmptyP';
};

[Jakub Ś]

Other tickets caused by revision [6698] - #7917, #8231, #8253, #9500.

[Piotrek Koszuliński]

Not reproducible on master as all other issues introduced by [6698].