search

craftcms / cms

Build bespoke content experiences with Craft.
https://craftcms.com
Other
3.29k stars 637 forks source link

Craft3: Image with transform broken in richtext fields #1804

Closed virtualize closed 7 years ago

virtualize commented 7 years ago

Description

When inserting images with transforms into richtext field the image is not shown after saving the richtext field. Richtext content before saving:

<figure><img src="/uploads/_richtext/dummy.jpg#asset:86:richtext">​</figure>

and after

<p><img src="#asset:86:richtext" alt="dummy.jpg#asset:86:richtext"></p>

The image itself is correctly transformed and saved to disk.

If I output the richtext content in a template, the image is also broken <img src="" alt="dummy.jpg#asset:86:richtext" />

Steps to reproduce

  1. Create a Image Transform and Asset Volume.
  2. Create a Entry single type that has a Rich text field with Available Transforms
  3. Insert image into entry richtext field, select a transform
  4. After saving the entry the image the image is not show anymore,

Additional info

brandonkelly commented 7 years ago

I wasn’t able to reproduce this. How did that alt tag get in there? If you had added it with Redactor’s image modal via the Title field, it would have also added a title attribute with the same text, so guessing you added it yourself? I’m wondering if maybe something got screwed up when that happened?

virtualize commented 7 years ago

@brandonkelly Thanks for looking into this.

I was able to reproduce the bug on fresh install via composer create-project craftcms/craft craftcms -s beta. I got beta.21

Thats a funny one: the bug only occurs if the transformation has the exact same handle as the richtext field. I my case both were called richtext. If I rename any of them everything works as expected.

brandonkelly commented 7 years ago

Ahh, interesting. I’ll try again with identical field/transform handles

brandonkelly commented 7 years ago

Issue is that if your transform uses the same handle as any custom field, then the {asset:123:handle} reference tag will get swapped with the value of that custom field (even if not included in your volume’s field layout).

I just tweaked the reference tag that gets generated when selecting an image with a transform, so it’s more explicit and doesn’t chance conflicting with custom fields. You’ll need to reattach any broken images, though.

brandonkelly commented 7 years ago

Also was able to fix the crazy alt tag – that turned out to be an issue with the default HTMLPurifier config (c851713f05e87ffd728e142cdf16c2734f524d60).

virtualize commented 7 years ago

Thanks a lot. Works now as expected.