-
Notifications
You must be signed in to change notification settings - Fork 8
Open
Description
When using both variants and useRetina="true", the generated srcset incorrectly mixes width (w) and density (x) descriptors, which is invalid HTML.
Example Output (Invalid)
<source
media="(max-width: 768px)"
sizes="100vw"
srcset="/fileadmin/_processed_/c/d/….jpg 400w, /fileadmin/_processed_/c/d/csm….jpg 768w 1x, /fileadmin/_processed_/c/d/csm….jpg 2x">Problem: Contains both 768w and 1x, 2x — this violates HTML spec.
Reproduction
<b13:image
sources="{
0: {
width: '768c', media: 'max-width: 768px', cropVariant: 'mobile', variants: '400, 768', sizes: '100vw'
}
}"
useRetina="{true}"
src="…" />Root Cause
addRetina() method blindly appends density descriptors to existing srcset without checking if width descriptors are already present.
Expected behavior
When variants are present, skip adding density descriptors entirely. Browsers automatically handle retina/high-DPI displays when using width descriptors with the sizes attribute.
Plus a warning log entry or hint in the documentation would be helpful.
Metadata
Metadata
Assignees
Labels
No labels