WordPress.org

Make WordPress Core

Opened 2 years ago

Last modified 21 months ago

#42222 new defect (bug)

editor removing pre tag

Reported by: joyously Owned by:
Milestone: Awaiting Review Priority: normal
Severity: normal Version: 4.9
Component: Editor Keywords: close
Focuses: Cc:
PR Number:

Description

When in Text mode, I enter a <pre> tag, with text in it all spaced out.
Switch to Visual mode, and the pre tag is removed, and the text spacing is removed.
Switch back to Text mode, there is no pre tag or spacing.

I'm not sure when this changed. I only noticed it because I wanted to test editor styles and switched to Visual mode (I usually stay in Text mode all the time).
I got this in the trunk version, but also on a site that is using WP 4.7.6.

Attachments (2)

editor-4.7.6-pre.gif (190.4 KB) - added by joyously 2 years ago.
Here is how it looks in 4.7.6
editor-pre-without-h2.gif (68.4 KB) - added by joyously 2 years ago.
Here it is again with the H2 outside the pre tag. It does much better. The pre tag is not removed, but some of the entity replacement changes the white space that is supposed to be preserved.

Download all attachments as: .zip

Change History (7)

@joyously
2 years ago

Here is how it looks in 4.7.6

#1 follow-up: @iseulde
2 years ago

  • Keywords close added

Looking at the GIF, the HTML seems to be invalid. The H2 tag cannot be inside of a PRE tag: https://html.spec.whatwg.org/multipage/grouping-content.html#the-pre-element.

@joyously
2 years ago

Here it is again with the H2 outside the pre tag. It does much better. The pre tag is not removed, but some of the entity replacement changes the white space that is supposed to be preserved.

#2 in reply to: ↑ 1 @joyously
2 years ago

Replying to iseulde:

Looking at the GIF, the HTML seems to be invalid. The H2 tag cannot be inside of a PRE tag: https://html.spec.whatwg.org/multipage/grouping-content.html#the-pre-element.

Just because the HTML is invalid (although that HTML still displays correctly in the browser), is no reason to strip out the pre tag. Since the only way to get the pre tag in there is to switch to Text mode, and then switch back to Visual to see how it looks, the editor could easily mess up a user's hard work. Even if it gave an indication of the problem, that would be better than silently removing what the user chose to put.

As you can see in the second attachment, there is still a problem with how the pre tag is handled when the invalid tags are removed. The HTML entity replacement does not preserve the whitespace, which is the whole point of pre.

#3 @hdalive
2 years ago

Faced the same issue. The pre tag is getting removed when switched to visual mode.

But when I removed the Heading tag from pre tag there is no issue. 0_o

#4 @hdalive
2 years ago

When i add

<i class="fa fa-code"></i>

near a heading tag it gets removed as well. Magic !!!

#5 @dbodnariuc
21 months ago

I am also facing the same problem.
I use <pre> tag to tell WP I have some code and to not modify it.
When I switch to visual editor, the <pre> tag gets stripped and the code is modified.

Note: See TracTickets for help on using tickets.