mozilla
/
gecko-dev
зеркало из https://github.com/mozilla/gecko-dev.git
1
0
Форкнуть 0
Код Задачи Пакеты Проекты Релизы Вики Активность

Bug 1672793 - Treat 0 or infinity as auto for aspect-ratio on replaced elements. r=emilio 

For replaced elements, if <ratio> is not finite, we should treat is as
auto and just use its intrinic ratio.

Differential Revision: https://phabricator.services.mozilla.com/D95412
This commit is contained in:
Boris Chiou 2020-11-02 18:43:01 +00:00
Родитель 686b5fd424
Коммит 850434d326
8 изменённых файлов: 62 добавлений и 1 удалений
Показать статистику Скачать Patch файл Скачать Diff файл Показать все файлы Свернуть все файлы

7
layout/generic/nsIFrame.cpp
Просмотреть файл

@ -5975,7 +5975,9 @@ AspectRatio nsIFrame::GetAspectRatio() const {
// return here.
const StyleAspectRatio& aspectRatio = StylePosition()->mAspectRatio;
if (!aspectRatio.auto_) {
// If aspect-ratio is infinite, it behaves as auto.
// https://github.com/w3c/csswg-drafts/issues/4572
if (!aspectRatio.BehavesAsAuto()) {
// Non-auto. Return the preferred aspect ratio from the aspect-ratio style.
return aspectRatio.ratio.AsRatio().ToLayoutRatio();
}
@ -5984,7 +5986,10 @@ AspectRatio nsIFrame::GetAspectRatio() const {
if (auto intrinsicRatio = GetIntrinsicRatio()) {
return intrinsicRatio;
}
if (aspectRatio.HasRatio()) {
// If there is no finite ratio, this returns 0. Just the same as the auto
// case.
return aspectRatio.ratio.AsRatio().ToLayoutRatio();
}

1
servo/ports/geckolib/cbindgen.toml
Просмотреть файл

@ -837,6 +837,7 @@ renaming_overrides_prefixing = true
bool HasFiniteRatio() const {
return HasRatio() && ratio.AsRatio().ToLayoutRatio();
}
bool BehavesAsAuto() const { return auto_ || !HasFiniteRatio(); }
static StyleGenericAspectRatio Auto() {
return {true, StylePreferredRatio<N>::None()};

Двоичные данные
testing/web-platform/tests/css/css-sizing/aspect-ratio/support/1x1-green.png Normal file
Просмотреть файл

Двоичный файл не отображается.
Режим "рядом"

После

Ширина:  |  Высота:  |  Размер: 135 B

11
testing/web-platform/tests/css/css-sizing/aspect-ratio/zero-or-infinity-006.html Normal file
Просмотреть файл

@ -0,0 +1,11 @@
<!DOCTYPE html>
<title>CSS aspect-ratio: zero aspect-ratio img</title>
<link rel="author" title="mozilla" href="https://www.mozilla.org/">
<link rel="help" href="https://drafts.csswg.org/css-sizing-4/#aspect-ratio">
<link rel="help" href="https://github.com/w3c/csswg-drafts/issues/4572">
<link rel="match" href="../../reference/ref-filled-green-100px-square.xht" />
<p>Test passes if there is a filled green square and <strong>no red</strong>.</p>
<img src="support/1x1-green.png" style="width: 100px; aspect-ratio: 0/1;">

11
testing/web-platform/tests/css/css-sizing/aspect-ratio/zero-or-infinity-007.html Normal file
Просмотреть файл

@ -0,0 +1,11 @@
<!DOCTYPE html>
<title>CSS aspect-ratio: zero aspect-ratio img</title>
<link rel="author" title="mozilla" href="https://www.mozilla.org/">
<link rel="help" href="https://drafts.csswg.org/css-sizing-4/#aspect-ratio">
<link rel="help" href="https://github.com/w3c/csswg-drafts/issues/4572">
<link rel="match" href="../../reference/ref-filled-green-100px-square.xht" />
<p>Test passes if there is a filled green square and <strong>no red</strong>.</p>
<img src="support/1x1-green.png" style="height: 100px; aspect-ratio: 0/1;">

11
testing/web-platform/tests/css/css-sizing/aspect-ratio/zero-or-infinity-008.html Normal file
Просмотреть файл

@ -0,0 +1,11 @@
<!DOCTYPE html>
<title>CSS aspect-ratio: infinite aspect-ratio img</title>
<link rel="author" title="mozilla" href="https://www.mozilla.org/">
<link rel="help" href="https://drafts.csswg.org/css-sizing-4/#aspect-ratio">
<link rel="help" href="https://github.com/w3c/csswg-drafts/issues/4572">
<link rel="match" href="../../reference/ref-filled-green-100px-square.xht" />
<p>Test passes if there is a filled green square and <strong>no red</strong>.</p>
<img src="support/1x1-green.png" style="width: 100px; aspect-ratio: 1/0;">

11
testing/web-platform/tests/css/css-sizing/aspect-ratio/zero-or-infinity-009.html Normal file
Просмотреть файл

@ -0,0 +1,11 @@
<!DOCTYPE html>
<title>CSS aspect-ratio: infinite aspect-ratio img</title>
<link rel="author" title="mozilla" href="https://www.mozilla.org/">
<link rel="help" href="https://drafts.csswg.org/css-sizing-4/#aspect-ratio">
<link rel="help" href="https://github.com/w3c/csswg-drafts/issues/4572">
<link rel="match" href="../../reference/ref-filled-green-100px-square.xht" />
<p>Test passes if there is a filled green square and <strong>no red</strong>.</p>
<img src="support/1x1-green.png" style="height: 100px; aspect-ratio: 1/0;">

11
testing/web-platform/tests/css/css-sizing/aspect-ratio/zero-or-infinity-010.html Normal file
Просмотреть файл

@ -0,0 +1,11 @@
<!DOCTYPE html>
<title>CSS aspect-ratio: 0/0 aspect-ratio img</title>
<link rel="author" title="mozilla" href="https://www.mozilla.org/">
<link rel="help" href="https://drafts.csswg.org/css-sizing-4/#aspect-ratio">
<link rel="help" href="https://github.com/w3c/csswg-drafts/issues/4572">
<link rel="match" href="../../reference/ref-filled-green-100px-square.xht" />
<p>Test passes if there is a filled green square and <strong>no red</strong>.</p>
<img src="support/1x1-green.png" style="width: 100px; aspect-ratio: 0/0;">