TinyMCE adds additional ul tags if successive list items contain script tags

[modernnerd]

TinyMCE duplicates unordered lists when toggling between Text and Visual mode if two successive list items contain script tags.

To reproduce:

Tested in Chrome 46.0.2490.86 / Mac OS 10.11.1

1. Paste the following sample HTML in Text mode:

<ul>
	<li>Test 1<script src="http://example.com/notfound.js"></script></li>
</ul>

<ul>
	<li>Test 2<script src="http://example.com/notfound.js"></script></li>
</ul>

This HTML will also generate the same unexpected result shown below:

<ul>
	<li>Test 1<script src="http://example.com/notfound.js"></script></li>
	<li>Test 2<script src="http://example.com/notfound.js"></script></li>
</ul>

2. Switch to visual mode and back to text mode again.

Expected result:

<ul>
	<li>Test 1<script src="http://example.com/notfound.js"></script></li>
</ul>

&nbsp;

<ul>
	<li>Test 2<script src="http://example.com/notfound.js"></script></li>
</ul>

Actual result:

<ul>
<ul>
	<li>Test 1<script src="http://example.com/notfound.js"></script></li>
</ul>
</ul>

&nbsp;

<ul>
	<li>Test 2<script src="http://example.com/notfound.js"></script></li>
</ul>

The first list's ul tags become doubled in the case of the first HTML sample supplied. With the second sample, the two list items are split into two unordered lists, and the first list's ul tags are doubled.

Each time you switch from Text to Visual mode, the first list gains an extra pair of ul tags.

Scripts inside list items are valid HTML: ​http://www.w3.org/TR/html5/grouping-content.html#the-li-element. (Note “content model: flow content”. Flow content includes the script tag: ​http://www.w3.org/TR/html5/dom.html#flow-content-1.)

The most common reason I've seen for users to include script tags in list items is to embed a GitHub Gist.

[azaozz]

@modernnerd thanks for the bug report.

This is an interesting edge case in the JS wpautop. Happens when there are two <script> tags that load external scripts. The regexp that is used to protect line breaks inside <script> grabs everything from the start of the first tag to the end of the second tag and "protects" the line breaks breaking the rest of wpautop for that fragment.

[azaozz]

In 35727:

TinyMCE: fix the regexp used to protect line breaks inside script and pre tags to match <script> that load external scripts.

Fixes #34760.

[modernnerd]

@azaozz You're welcome! Well done with your elegant fix; have tested and is working great for me.

[zfilinger]

Hello,

I'm having the same issue. Although I followed the solution (https://core.trac.wordpress.org/changeset/35727), when I opened the editor.js file and scrolled down on line 239, I noticed the code was already fixed (having the * instead of + in the regex). However I'm still facing the same issue - number of ul tags being increased every time I switch from Visual to Text editor. Is there anything else that might be causing this behavior?

Wordpress is in version 4.4.2. I'd be happy to provide more information, if needed.

Thank you

Replying to azaozz:

In 35727:

TinyMCE: fix the regexp used to protect line breaks inside script and pre tags to match <script> that load external scripts.

Fixes #34760.