Inserting image with srcset into dynamically created iframe results in invisible image

• Component: Images
• Status: NEW ---

[Comandeer]

Demo of the bug: https://jsfiddle.net/6Le9nwx7/

Inserting image with [srcset] attribute into dynamically created iframe results in the image that has its natural dimensions set to 0, therefore – it's not visible.

Tested on Safari 13.1.2 (15609.3.5.1.3).

[Radar WebKit Bug Importer]

<rdar://problem/66849050>

[Simon Fraser (smfr)]

Chrome also says 0x0. Firefox gives a size.

[Said Abou-Hallawa]

(In reply to Simon Fraser (smfr) from comment #2)
> Chrome also says 0x0. Firefox gives a size.

This happens because the 'sizes' attribute is missing from the <img> tag. So in HTMLImageElement::selectImageSource(), we end up having sourceSize = 0.

And in pickBestImageCandidate(), we do this calculation:

    candidate.density = static_cast<float>(candidate.resourceWidth) / sourceSize;

but because sourceSize = 0, we calculate candidate.density = +inf.

And in HTMLImageElement::setBestFitURLAndDPRFromImageCandidate(), we do this calculation:

    m_imageDevicePixelRatio = 1 / candidate.density;

So we end up having m_imageDevicePixelRatio = 0. And this is why HTMLImageElement::naturalWidth() returns zero.

[Ahmad Saleem]

(In reply to Comandeer from comment #0)
> Demo of the bug: https://jsfiddle.net/6Le9nwx7/
> 
> Inserting image with [srcset] attribute into dynamically created iframe
> results in the image that has its natural dimensions set to 0, therefore –
> it's not visible.
> 
> Tested on Safari 13.1.2 (15609.3.5.1.3).

Firefox Nightly 113: 300x372

Chrome Canary 113: 300x372 

Safari Technology Preview 166: 0x0