iOS downloading fallback srcset image

Created on 16 January 2015, over 9 years ago
Updated 19 September 2023, 9 months ago

I may be doing something wrong, but it seems like Safari in iOS(8.1.2) is downloading the fallback version of a Picture.
Can someone take a look at what I have and confirm the bug, or correct me if I've done something wrong?

Website is at http://capacitytrucks.anakin.encoredemo.com/ (temp testing URL, will die later, but will update with new URL once it's live)
The header hero slider is the issue here.

Outputted code for one of the hero images

<picture>
<!--[if IE 9]><video style="display: none;"><![endif]-->
<source srcset="http://capacitytrucks.anakin.encoredemo.com/sites/default/files/styles/home_slider_respcustom_user_jabba_1_5x/public/sliders/hero_new.jpg?itok=cDtrNzaD 1.5x, http://capacitytrucks.anakin.encoredemo.com/sites/default/files/styles/home_slider_respcustom_user_jabba_1x/public/sliders/hero_new.jpg?itok=R4z0JRuK 1x" media="(min-width: 63.75em)">
<source srcset="http://capacitytrucks.anakin.encoredemo.com/sites/default/files/styles/home_slider_respcustom_user_vader_1_5x/public/sliders/hero_new.jpg?itok=lrzmAIWH 1.5x, http://capacitytrucks.anakin.encoredemo.com/sites/default/files/styles/home_slider_respcustom_user_vader_1x/public/sliders/hero_new.jpg?itok=52MDMlEZ 1x" media="(min-width: 53.75em)">
<source srcset="http://capacitytrucks.anakin.encoredemo.com/sites/default/files/styles/home_slider_respcustom_user_ewok_1_5x/public/sliders/hero_new.jpg?itok=OY9SUd7E 1.5x, http://capacitytrucks.anakin.encoredemo.com/sites/default/files/styles/home_slider_respcustom_user_ewok_1x/public/sliders/hero_new.jpg?itok=DdFqQHwG 1x" media="(min-width: 42.5em)">
<source srcset="http://capacitytrucks.anakin.encoredemo.com/sites/default/files/styles/home_slider_respcustom_user_yoda_1_5x/public/sliders/hero_new.jpg?itok=QDs7LY1c 1.5x, http://capacitytrucks.anakin.encoredemo.com/sites/default/files/styles/home_slider_respcustom_user_yoda_1x/public/sliders/hero_new.jpg?itok=zw48IrLo 1x" media="(min-width: 28.75em)">
<source srcset="http://capacitytrucks.anakin.encoredemo.com/sites/default/files/styles/home_slider_respcustom_user_yoda_max_1_5x/public/sliders/hero_new.jpg?itok=N5kcCLs1 1.5x, http://capacitytrucks.anakin.encoredemo.com/sites/default/files/styles/home_slider_respcustom_user_yoda_max_1x/public/sliders/hero_new.jpg?itok=pMk_HveY 1x" media="(max-width: 28.6875em)">
<!--[if IE 9]></video><![endif]-->
<!--[if lt IE 9]>
<img typeof="foaf:Image" src="http://capacitytrucks.anakin.encoredemo.com/sites/default/files/styles/home_slider/public/sliders/hero_new.jpg?itok=Mw4cIsjf" alt="" title="" />
<![endif]-->
<!--[if !lt IE 9]><!-->
<img srcset="http://capacitytrucks.anakin.encoredemo.com/sites/default/files/styles/home_slider/public/sliders/hero_new.jpg?itok=Mw4cIsjf 1560w" alt="" title="">
<!-- <![endif]-->
</picture>

Snapshot of the downloaded images in Safari Dev Tools, connected to my phone:
https://www.dropbox.com/s/n0cqgths0ln30cv/Screenshot%202015-01-16%2011.3...

The only images downloaded are the fallbacks, there aren't any double-downloads for the mobile versions.
Snapshot proof here: https://www.dropbox.com/s/g3y2dgu8tmieqmf/Screenshot%202015-01-16%2011.3...

Chrome and Safari on OS X download the proper image when the window is shrunk down to 320px wide.

πŸ› Bug report
Status

Closed: outdated

Version

2.9

Component

Code

Created by

πŸ‡ΊπŸ‡ΈUnited States johnny5th

Live updates comments and jobs are added and updated live.
Sign in to follow issues

Comments & Activities

Not all content is available!

It's likely this issue predates Contrib.social: some issue and comment data are missing.

Production build 0.69.0 2024