blipson89/Synthesis

Image in Editor adding width and height properties

Opened this issue · 3 comments

Do you want to request a feature or report a bug?
Reporting a bug.

What is the current behavior?
In edit mode, images are being given a width and height property which causes them to be stretched in the editor (in preview they look normal)

If the current behavior is a bug, please provide the steps to reproduce.
Insert Image into component calling RenderDpiAware(900, null, null, 2, false)
Editor HTML for image -
<img src="/sitecore/shell/~/media/ANS/Sites/ANS/Images/ScaryTurtle.ashx?h=600&amp;iar=0&amp;mw=900&amp;w=900" alt="" width="900" height="600">
Preview HTML for image -
<img src="/ans/~/media/ANS/Sites/ANS/Images/ScaryTurtle.ashx?mw=900&amp;hash=9698518DB916174D67CC382CCE240600" srcset="/ans/~/media/ANS/Sites/ANS/Images/ScaryTurtle.ashx?mw=1800&amp;hash=490C9FF1229D61E5EC3D0ABB2CC19AE2 2x">

Please mention your Sitecore version and Synthesis version.
10.1 SC, 9.1.6 syn
Screenshot 2023-08-24 at 10 36 45 AM
Screenshot 2023-08-24 at 10 36 55 AM

Thank you for reporting this issue. I'll look into it and provide you an update this week.

@steved-83 Sitecore is actually adding the height in there in experience editor. What's happening behind the scenes in Experience Editor mode is that Synthesis is wrapping Sitecore's field renderer and passing it in a few extra parameters.

If you don't set the maxHeight, Synthesis isn't passing any value for height to Sitecore's field renderer, and it seems Sitecore calculates the height and adds it on its own.

I have a potential solution that I want to run by you. I did notice that you're passing false to editable. Synthesis doesn't render DPI aware images in Edit mode because the Experience Editor doesn't know how to handle it. However, when editable is false, the Experience Editor doesn't need to know how to handle anything.

My proposal is this: I can update the code such that when editable is set to false, it renders the DPI aware images just as it would in preview mode. Would that work for you?

Hi Blipson! Sorry for the delay on this. Yes! that would absolutely work for our use-case! We tested it and it fixed the issue locally. Let me know if you need any other information on this.