layout: Add line height from preserved segment breaks in quirks mode (#31419)

In quirks mode, preserved segment breaks should add line height to
lines. This matches the behavior of WebKit and Blink, but not Gecko.

This also handles the special-case of `<br>` elements, which are
implemented with preserved segment breaks via `white-space: pre-line`.
This is an implementation detail though because `<br>` has a special
behavior if the line isn't empty -- it doesn't add any line height in
this case.
This commit is contained in:
Martin Robinson 2024-02-26 18:26:41 +01:00 committed by GitHub
parent a9a7e8a5cf
commit e5598590ba
No known key found for this signature in database
GPG key ID: B5690EEEBB952194
12 changed files with 158 additions and 10 deletions

View file

@ -0,0 +1,2 @@
[line-height-preserved-segment-break.html]
expected: FAIL

View file

@ -340751,6 +340751,19 @@
{}
]
],
"line-height-preserved-segment-break.html": [
"8ad2651f4b999091996682be72745e31e0ce559a",
[
null,
[
[
"/css/reference/ref-filled-green-100px-square.xht",
"=="
]
],
{}
]
],
"line-height-quirks-mode.html": [
"9e9baf62226dfccc15f81b6d22edb87a29e2d313",
[

View file

@ -0,0 +1,2 @@
[quirks-mode-br-line-height.html]
expected: FAIL

View file

@ -5402,6 +5402,19 @@
{}
]
],
"quirks-mode-br-line-height.html": [
"ecb49833f809e72cd57772e7a98085e787cb8baa",
[
null,
[
[
"/_mozilla/css/quirks-mode-br-line-height-ref.html",
"=="
]
],
{}
]
],
"quotes_none_a.html": [
"c37ff23e9084d7d198b3c97e14d2e00ab417dd6c",
[
@ -9673,6 +9686,10 @@
"0195f154cf3c4303e5aaf4fc9e7cfa358b8386d7",
[]
],
"quirks-mode-br-line-height-ref.html": [
"2108a4ae5e1f823cf2a3923070d54c42487fd8c6",
[]
],
"quotes_none_ref.html": [
"85f3cf14ca2da71a45efd75803e84e7b5dc23a85",
[]

View file

@ -0,0 +1,17 @@
<link rel="author" href="mrobinson@igalia.com">
<style>
span {
display: inline-block;
width: 50px;
height: 50px;
background: green;
color: transparent;
}
</style>
<body>
<div style="width: 100px; border: solid; line-height: 50px;">
<span></span><br>
<span style="background: transparent; color: transparent;">A</span>
<span></span>
</div>
</body>

View file

@ -0,0 +1,35 @@
<!-- quirks mode -->
<link rel="match" href="quirks-mode-br-line-height-ref.html">
<link rel="author" href="mrobinson@igalia.com">
<!--
Normally in quirks, only text and uncollapsible white space in inline boxes
adds the inline box line height to the line. A forced line break is a kind of
uncollapsible white space, so it should add line height to the line box.
We implement <br> in Servo with `white-space: pre-line`, but <br> doesn't act
like a preserved line break. It only adds its line height to the line if its
on an empty line.
This behavior doesn't seem to be specified, so is part of the "magic" behavior
of <br> elements.
-->
<style>
span {
display: inline-block;
width: 50px;
height: 50px;
background: green;
color: transparent;
}
</style>
<body>
<div style="width: 100px; border: solid; line-height: 50px;">
<span>A</span>
<!-- The first <br> ends the line and the second <br> adds 50px
of block size, because it inherits `line-height` from the
parent <div> -->
<br>
<br>
<span>A</span>
</div>
</body>

View file

@ -0,0 +1,24 @@
<!-- quirks mode -->
<link rel="author" title="Martin Robinson" href="mrobinson@igalia.com">
<link rel="help" href="https://quirks.spec.whatwg.org/#the-line-height-calculation-quirk">
<link rel="help" href="https://drafts.csswg.org/css-text/#valdef-white-space-pre-line">
<link rel="match" href="../css/reference/ref-filled-green-100px-square.xht">
<style>
.container {
width: 100px;
background: green;
white-space: pre-line;
}
.inline-box {
line-height: 100px;
}
</style>
<p>Test passes if there is a filled green square and <strong>no red</strong>.</p>
<div style="width: 100px; height: 100px; background: red;">
<!-- The preserved segment break in the span should mean that "The line height calculation
quirk" does not apply. -->
<div class="container"><span class="inline-box">&#xA;</span></div>
</div>