Hello, please could you assess the “Mozilla Splash Page” task which i did.
You can access it live HERE and the source code is HERE.
One issue i believe i am experiencing is that with 320px viewport width, the image called “mozilla-dinosaur-head-400w.png” is loaded instead of “mozilla-dinosaur-head-120w.png”.
Hello @mystiquewolf
you doing great
do you use chrome ? if yes then when the page load and if it size is big it load the bigger edition as expected but when you resize the window it does not reload the smaller image it just resize it
if you want to test that then clear your cache/history then open new window and resize it to be small then go to the page you will notice it load the smaller version and when you increase the window it will load the bigger version
you can test that on firefox and you would not have this behaviour
hope that help and have a nice day 
I use Firefox. I am loading it in “Responsive Design Mode” from the Firefox DevTools at width 280px. I have <meta name="viewport" content="width=device-width" />. I have also checked the option “Disable Cache” in Network tab. It still loads mozilla-dinosaur-head-400w.png and i have no idea why.
Chrome also loads mozilla-dinosaur-head-400w.png, seems like the error is somewhere in my code.
i also use firefox
and i open in in normal mode no need to use responsive mode
then just simply resize the window
then right click on image then copy image link paste it any where and you will see which image it point to
It point to mozilla-dinosaur-head-400w.png when it should really point to mozilla-dinosaur-head-120w.png.
try the following
if this did not work
2) write this in the address bar about:profiles then create new profile and open that new profile in new window test it there and see if it work fine or not maybe issue on your profile
So it loads mozilla-dinosaur-head-120w.png on your PC? Because on mine it doesn’t load it no matter what i try, even in Chrome it doesn’t load it. I tried both steps and it still loads mozilla-dinosaur-head-400w.png. I’m pretty sure the issue is with the code as it doesn’t load neither in Firefox nor in Chrome.
As i think about it filling a bug with Firefox will be stupid IMO.
Okay, there is progress. Chrome downloads 120w, i’ll investigate further.
for me it load the https://liubomirwm.gitlab.io/mozilla-splash-page/originals/mozilla-dinosaur-head-120w.png
when i resize the window and i use firefox 89 on linux centos
According to Mozilla devs this is a real issue, albeit an “enhancement” one, because:
Spec doesn’t define how should ua select source if there are multiple sources available.
// Per spec, “In a UA-specific manner, choose one image source”
// - For now, select the lowest density greater than displayDensity, otherwise
// the greatest density available
Damn, i thought i found a proof for me being crazy.
what ua mean
looooool
Short for User Agent. Also known as a browser for people outside W3C (smart people who write HTML specifications).
aha got it
but i still get the right behavior for firefox 89 on linux that behaviour you mention is expected for chrome based browser
what is your firefox version and which os you use
Apparently you have to zoom the page and/or use display scaling with your OS.
so if you did not use any of those it work fine ?
I haven’t tested myself without but Mozilla could not reproduce if not using them.
thanks for the info and let me know if you have any update about this
