[wp-trac] [WordPress Trac] #51417: TinyMCE stripping <picture> tags

[WordPress Trac]

#51417: TinyMCE stripping <picture>  tags
-------------------------------+-----------------------------
 Reporter:  Grzegorz.Janoszka  |      Owner:  (none)
     Type:  defect (bug)       |     Status:  new
 Priority:  normal             |  Milestone:  Awaiting Review
Component:  TinyMCE            |    Version:  5.5.1
 Severity:  normal             |   Keywords:
  Focuses:                     |
-------------------------------+-----------------------------
 Hi,
 We have new, way more efficient graphic formats coming - avif and webp.
 They are already supported by Firefox and Chrome. The recommended and
 backwards compatible method of inserting them is using a picture tag with
 an img fallback, for example:

   <picture>
   <source srcset="example.avif" type="image/avif">
   <source srcset="fallback.webp" type="image/webp">
   <img src="fallback.jpg" alt="AVIF example with WebP and JPEG fallback">
   </picture>

 Using the filter tiny_mce_before_init I can make TinyMCE accept the code
 if it is not surrounded by caption shortcode. Unfortunately the editor
 handles the [caption] code in javascript, the file is wp-
 includes/js/tinymce/plugins/wpeditimage/plugin.js
 and it has a filter:

                         img = c.match( /((?:<a [^>]+>)?<img
 [^>]+>(?:<\/a>)?)([\s\S]*)/i );

 which removes everything except a and img tags. So <picture> and <source>
 become stripped. There is no filter nor configuration to modify how that
 JS works.

 I am not asking for a full <picture> support in WordPress. All I would
 love to see is to see TinyMCE not stripping <picture> and <source> tag
 when I place them inside caption. All the rest of WP support for AVIF can
 already be achieved using the existing filters like image_send_to_editor.

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