[wp-trac] [WordPress Trac] #51328: Classic Editor adds extra p tags to Instagram Embed

[WordPress Trac]

#51328: Classic Editor adds extra p tags to Instagram Embed
------------------------------+-------------------------------------------
 Reporter:  HannaIris         |      Owner:  (none)
     Type:  defect (bug)      |     Status:  new
 Priority:  normal            |  Milestone:  Awaiting Review
Component:  Embeds            |    Version:  5.5.1
 Severity:  normal            |   Keywords:  embeds wpautop classic-editor
  Focuses:  coding-standards  |
------------------------------+-------------------------------------------
 Issue:

 On Classic editor with wpautop enabled, when adding an Instagram url to be
 embedded, the editor adds extra p tags.

 Steps to replicate:

 1. Use Classic Editor.
 2. Place Instagram post url to editor (doesn't matter Visual, Text, with
 or without p tags)
 3. Save Post.
 4. Check frontend code.

 The output:

 1. Closing </p> tag after the first link:


 {{{
 <blockquote class="instagram-media" data-instgrm-captioned data-instgrm-
 permalink="https://www.instagram.com/p/XXX" data-instgrm-version="12"
 style=" background:#FFF; border:0; border-radius:3px; box-shadow:0 0 1px 0
 rgba(0,0,0,0.5),0 1px 10px 0 rgba(0,0,0,0.15); margin: 1px; max-
 width:640px; min-width:326px; padding:0; width:99.375%; width:-webkit-
 calc(100% - 2px); width:calc(100% - 2px);">
 <div style="padding:16px;"> <a href="https://www.instagram.com/p/XXX
 style=" background:#FFFFFF; line-height:0; padding:0 0; text-align:center;
 text-decoration:none; width:100%;" target="_blank"> </p>
 }}}


 2. Closing </a> is inside p tag: {{{<p></a> </p>}}}

 3. Script tag is inside p tag: {{{<p><script async
 src="//www.instagram.com/embed.js"></script></p>}}}

 Expected output:

 No extra p tags, eg what you get with {{{remove_filter( 'the_content',
 'wpautop' );}}}.

-- 
Ticket URL: <https://core.trac.wordpress.org/ticket/51328>
WordPress Trac <https://core.trac.wordpress.org/>
WordPress publishing platform