When using a Freemarker rendering template that has an <src> element with "loading=lazy" attribute, it is no longer possible to make edits in the Experience Manager after a new component is added to a container.
This happens when all of the following conditions are met:
1. Before editing, the container already has a component with an image.
2. The image has the following HTML attribute: loading="lazy"
3. The image is outside of the browser's current viewport.
4. The image is not yet stored in the browser cache.
Use case: loading="lazy" attribute is used for performance reasons.
Please see the attached sample project (which is a gogreen adaptation) and reproduction steps. This can be reproduced since version 14.7.1.
Steps to Reproduce
- Run the attached sample project.
- Use incognito mode and open the "news" page in the experience manager.
- Add a new component to the container as it's first item (above the news list).
Result: Unable to make edits anymore without having to first scroll to the bottom of the page or completely refresh the browser window.