WordPress.org

Make WordPress Core

Opened 5 years ago

Closed 4 years ago

#15095 closed defect (bug) (fixed)

Visual Editor inserts empty paragraphs before/after captioned images

Reported by: markel Owned by: azaozz
Milestone: 3.1 Priority: normal
Severity: major Version: 3.1
Component: Editor Keywords: reporter-feedback
Focuses: Cc:

Description

Tested in Safari 5 and Firefox 3 on most recent nightly (as of 10/10/10) 3.1-alpha.

When adding an image with a caption using the Visual Editor, paragraphs containing non-breaking spaces are added before and after the image. This isn't readily apparent in the Editor itself, but is pretty clear when viewing the post.

To reproduce:

  1. Create a post that includes any image with a caption in it using the Visual Editor. Publish the post or save the draft.
  2. Check the resulting post. You will see the added paragraphs.

Sample code after publish:

Testing an image.

 

[caption id="attachment_48" align="alignnone" width="640" caption="I can rotate things."]<a href="http://26mag.com/wp-content/uploads/2010/10/bungienetshot.png"><img class="size-large wp-image-48" title="bungienetshot" src="http://26mag.com/wp-content/uploads/2010/10/bungienetshot-1024x575.png" alt="" width="640" height="359" /></a>[/caption]

&nbsp;

Change History (12)

comment:1 @westi5 years ago

  • Owner set to azaozz
  • Status changed from new to assigned

comment:2 follow-up: @markel5 years ago

  • Cc rmarkel@… added
  • Severity changed from normal to major

This also affects some styling created using the visual editor. Steps to reproduce:

  1. Enter a line of text, then return.
  2. Change the style to H3 or any other style, type a line of text, then return.
  3. Type a third line of text.
  4. Flip to the HTML editor and you will see the non-breaking space.

This doesn't occur in 2.9.2 and seems undesirable, so I'm nudging the severity.

comment:3 in reply to: ↑ 2 ; follow-up: @azaozz5 years ago

  • Keywords reporter-feedback added

Replying to markel:
Cannot reproduce either behavior. Are you using any TinyMCE plugins like TinyMCE Advanced with the "Preserve new lines" option turned on?

comment:4 in reply to: ↑ 3 @markel5 years ago

Replying to azaozz:

Cannot reproduce either behavior. Are you using any TinyMCE plugins like TinyMCE Advanced with the "Preserve new lines" option turned on?

I'm not using any TinyMCE-altering plugins; was just able to reproduce it with a captioned image with no plugins installed of any kind.

comment:5 @designsimply5 years ago

Reproduced with r15782.

Steps:

  1. Open any post with a captioned image.
  2. Click in the following order: Update button, HTML tab, Visual tab. Then repeat.

---> Each time you repeat, a non-breaking space is added above and below the captioned image.

Screencast example: http://screencast.com/t/6qVpiPPMQd

comment:6 @markel5 years ago

You can also cause this to happen by using Paste from Word. Click the button, paste some text, insert it, then publish. As long as you don't swap over to the HTML editor, non-breaking spaces will be added to the pasted text.

comment:7 @azaozz5 years ago

These problems seem to come from a change in behaviour in TinyMCE. When performing a cleanup things like <p><div>....</div></p> are converted to <p></p><div>..., i.e. the invalid <p> tag is closed properly instead of removed.

I'm still working on a proper fix for this.

comment:8 @azaozz5 years ago

(In [15822]) Editor: stop inserting empty paragraphs before/after captioned images, see #15095

comment:9 @azaozz5 years ago

The above patch fixes this when inserting the caption shortcode but is an "after the fact" fix. A proper solution would be part of TinyMCE in collaboration with their dev team.

comment:10 @nacin5 years ago

  • Milestone changed from Awaiting Review to 3.1

comment:11 @markel4 years ago

This is still affecting various things. A quick way to see it in action is to add a horizontal rule in the HTML editor, then flip to Visual and back again—two non-breaking spaces will be inserted into your code.

comment:12 @azaozz4 years ago

  • Resolution set to fixed
  • Status changed from assigned to closed

(In [16394]) Remove invalid parent paragraph when pasting in the visual editor or switching visual to HTML and back, keep multiple empty lines in a <pre> tag, fixes #15095 fixes #15367

Note: See TracTickets for help on using tickets.