plone/plone.namedfile

Picture tag broken when pointing to original image

mauritsvanrees opened this issue · 0 comments

I am upgrading a site from Plone 6.0.0a3 to 6.0.4.
We have a page with rich text that points to a full image, instead of to a scale, so @@images/image:

<img
 alt=""
 class="image-richtext image-inline"
 data-linktype="image"
 data-scale=""
 data-val="a980702c15584a8e8b4a64df0e6ddbdd"
 src="../resolveuid/a980702c15584a8e8b4a64df0e6ddbdd"
 data-mce-src="../resolveuid/a980702c15584a8e8b4a64df0e6ddbdd"
 data-mce-selected="1"
 width="168"
 height="28">

As you can see, this has no picture variant information yet. I guess you can't create html like this anymore in TinyMCE if you use the normal UI, but it can be in existing content, or when you directly edit the html code.
In an upgrade step I use from collective.exportimport.fix_html import fix_html_in_content_fields to update the image tags, and it becomes this:

<img
 alt=""
 class="image-richtext image-inline picture-variant-medium"
 data-linktype="image"
 data-picturevariant="medium"
 data-scale=""
 data-val="a980702c15584a8e8b4a64df0e6ddbdd"
 src="resolveuid/a980702c15584a8e8b4a64df0e6ddbdd/@@images/image"
 data-mce-src="resolveuid/a980702c15584a8e8b4a64df0e6ddbdd/@@images/image"
 data-mce-selected="1"
 width="168"
 height="28">

Both this and the original shows up fine when editing, but after saving the new text, the image does not show up. This is because plone.outputfilters transforms it, with the picture variants and resolveuid transforms. Result:

<picture>
 <source
 srcset="resolveuid/a980702c15584a8e8b4a64df0e6ddbdd/@@images/teaser 600w,
         resolveuid/a980702c15584a8e8b4a64df0e6ddbdd/@@images/preview 400w,
         resolveuid/a980702c15584a8e8b4a64df0e6ddbdd/@@images/large 768w,
         resolveuid/a980702c15584a8e8b4a64df0e6ddbdd/@@images/larger 1000w,
         resolveuid/a980702c15584a8e8b4a64df0e6ddbdd/@@images/great 1200w">
 <img alt="" class="image-richtext image-inline picture-variant-medium" loading="lazy"
    src="resolveuid/a980702c15584a8e8b4a64df0e6ddbdd/@@images/teaser"
 width="168"
 height="28">
</picture>

As you can see, this has @@images/scale-name which does not work. Instead it should be @@images/image/scale-name.

Also, it still has resolveuid in there, instead of an absolute url, so something has gone wrong in the resolveuid transform as well.

Maybe exportimport needs to do something different, starting here or here, but it looks okay to me.

So I think a fix in plone.namedfile is needed. I have a patch and will make a PR.