Images not displaying in UI with certain image markups (Irregular polygon, nested, or transformed images) when LL is enabled

[hanna-meda]

Before submitting an issue please check that you’ve completed the following steps:

• Made sure you’re on the latest version - 3.16-alpha1 ✓
• Used the search feature to ensure that the bug hasn’t been reported before ✓

Describe the bug Images not showing in UI for certain image markups (Irregular polygon, nested, or transformed images) when Lazyload for images feature is enabled.

To Reproduce Steps to reproduce the behavior:

1. Have page template(s) created with the following image markups:

• irregular polygon, using CSS clip-path property, https://rocketlabsqa.ovh/lcp_irregular_polygon (template)
• image as nested element, child elements partially overlap parent elements, https://rocketlabsqa.ovh/lcp_nested_images (template)
• image as transformed element, CSS transformations such as rotate, scale, https://rocketlabsqa.ovh/lcp_transformed_images (template)

2. Have Lazyload enabled for images.
3. Visit the page templates from step 1.
4. Notice that images are not visible in UI.

Expected behavior Images should be correctly displayed in UI.

Screenshots If applicable, add screenshots to help explain your problem.

Additional context Add any other context about the problem here.

Acceptance Criteria (for WP Media team use only) Clear instructions for developers, to be added before the grooming