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.