Bug 244386 – aspect-ratio should work on errored images that have display:block

• Status: NEW
• Component: Layout and Rendering

[Jake Archibald]

https://github.com/web-platform-tests/wpt/pull/35612 - Safari fails this test, as it seems to force failed images to have a 1:1 aspect ratio.

However, there's a test that suggests failed images should ignore aspect-ratio http://wpt.live/css/css-sizing/aspect-ratio/replaced-element-028.html, but I haven't found the spec-text for this. All browsers pass this test, but Chrome & Firefox respect aspect-ratio if the image is display:block or display:inline-block.

[Karl Dubost]

I wonder if it relates to https://drafts.csswg.org/css-sizing-4/#aspect-ratio-automatic

[Radar WebKit Bug Importer]

<rdar://problem/99258406>

[cathiechen]

I checked the test in https://github.com/web-platform-tests/wpt/pull/35612 locally, it seems the cases are passed in Release 152 (Safari 16.0, WebKit 17615.1.2.3).

It seems the wpt pipeline fails to install Safari Technology Preview.
https://dev.azure.com/web-platform-tests/wpt/_build/results?buildId=86190&view=logs&jobId=bf8f5026-3d1f-5955-26be-17f9e1ef0bb3

Maybe it's an environmental issue, not specific to the test case?

[Karl Dubost]

Loading locally the test http://wpt.live/css/css-sizing/aspect-ratio/replaced-element-028.html

shows that Safari displays the image with a 1:1 aspect ratio by default and I think this is what Jake is pointing.

[cathiechen]

(In reply to Karl Dubost from comment #4)
> Loading locally the test
> http://wpt.live/css/css-sizing/aspect-ratio/replaced-element-028.html
> 
> shows that Safari displays the image with a 1:1 aspect ratio by default and
> I think this is what Jake is pointing.

I see... Yes, 1:1 aspect ratio seems not very reasonable.
I think I can take a look:)

[Jake Archibald]

Safari is passing http://wpt.live/css/css-sizing/aspect-ratio/replaced-element-028.html (as is Chrome and Firefox, although they pass it in a different way). I'm not actually sure what the correct behaviour should be for that test, other than it should ignore the aspect-ratio given by the developer.

However, I think the test in https://github.com/web-platform-tests/wpt/pull/35612 is a more obvious fail. Are you sure it's passing for you? It's failing when I try it in Release 152.

Another version: https://jsbin.com/zipolaj/2/edit?html,css,output.

In Chrome and Firefox, the image uses the aspect ratio provided by the CSS - 2:1. In Safari it uses 1:1.

[cathiechen]

(In reply to Jake Archibald from comment #6)
> Safari is passing
> http://wpt.live/css/css-sizing/aspect-ratio/replaced-element-028.html (as is
> Chrome and Firefox, although they pass it in a different way). I'm not
> actually sure what the correct behaviour should be for that test, other than
> it should ignore the aspect-ratio given by the developer.

Yeah, do we need to file a bug in GitHub to discuss the expected behavior?
It seems Chrome and Firefox do not apply aspect-ratio if the error images are with alt.
https://jsbin.com/yanocayapi/1/edit?html,css,output

> 
> However, I think the test in
> https://github.com/web-platform-tests/wpt/pull/35612 is a more obvious fail.
> Are you sure it's passing for you? It's failing when I try it in Release 152.
> 

It passes if I download the test and load it with file:///

> Another version: https://jsbin.com/zipolaj/2/edit?html,css,output.
> 
> In Chrome and Firefox, the image uses the aspect ratio provided by the CSS -
> 2:1. In Safari it uses 1:1.

Yeah, it's 1:1. Again, if I download the test and load it with file:///, it's 2:1. Something might go wrong if trying to download the error image from network.

[Jake Archibald]

Ohhh, that's fun! I bet it avoids going into an errored state as it leaks details about the file system.

[cathiechen]

Created attachment 462186 [details]
WIP-patch

[cathiechen]

Filed a new bug for the file:// and http:// issue:) https://bugs.webkit.org/show_bug.cgi?id=245136

I think the cases in replaced-element-028.html and replaced-element-036.html are correct. Explained a little in GitHub. https://github.com/web-platform-tests/wpt/pull/35612#issuecomment-1245268327