зеркало из https://github.com/mozilla/gecko-dev.git
Bug 1525628 part 2: Generalize block-frame special case in scrollframe baseline code, so that it includes block subclasses like `<details>`. r=mats
Depends on D19083 Differential Revision: https://phabricator.services.mozilla.com/D19084 --HG-- extra : moz-landing-system : lando
This commit is contained in:
Daniel Holbert
Родитель
cd89295a59
Коммит
bce0e59a25
|
|
@ -987,7 +987,7 @@ nscoord nsHTMLScrollFrame::GetLogicalBaseline(WritingMode aWritingMode) const {
|
||||||
// GetLogicalBaseline() impl, which synthesizes a baseline from the
|
// GetLogicalBaseline() impl, which synthesizes a baseline from the
|
||||||
// margin-box. Otherwise, we defer to our scrolled frame, considering it
|
// margin-box. Otherwise, we defer to our scrolled frame, considering it
|
||||||
// to be scrolled to its initial scroll position.
|
// to be scrolled to its initial scroll position.
|
||||||
if (mHelper.mScrolledFrame->IsBlockFrame()) {
|
if (mHelper.mScrolledFrame->IsBlockFrameOrSubclass()) {
|
||||||
return nsContainerFrame::GetLogicalBaseline(aWritingMode);
|
return nsContainerFrame::GetLogicalBaseline(aWritingMode);
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|
|
||||||
|
|
@ -0,0 +1,70 @@
|
||||||
|
<!DOCTYPE html>
|
||||||
|
<html>
|
||||||
|
<head>
|
||||||
|
<meta charset="UTF-8">
|
||||||
|
<title>
|
||||||
|
CSS Test: baseline of scrollable "details" element should be derived
|
||||||
|
from its margin-box.
|
||||||
|
</title>
|
||||||
|
<link rel="author" title="Daniel Holbert" href="mailto:dholbert@mozilla.com">
|
||||||
|
<link rel="author" title="Mozilla" href="https://www.mozilla.org">
|
||||||
|
<link rel="help" href="https://drafts.csswg.org/css-align/#baseline-export">
|
||||||
|
<link rel="match" href="reference/baseline-of-scrollable-2-ref.html">
|
||||||
|
<style>
|
||||||
|
.overflow-ib {
|
||||||
|
overflow: hidden;
|
||||||
|
display: inline-block;
|
||||||
|
}
|
||||||
|
|
||||||
|
details {
|
||||||
|
height: 40px;
|
||||||
|
width: 100px;
|
||||||
|
/* Transparent text & "details-arrow", so that it's easier to make
|
||||||
|
a simple reference case: */
|
||||||
|
color: transparent;
|
||||||
|
border-color: gray;
|
||||||
|
border-style: solid;
|
||||||
|
border-width: 2px 3px 4px 5px;
|
||||||
|
padding: 4px 5px 7px 8px;
|
||||||
|
margin: 1px 2px 3px 4px;
|
||||||
|
}
|
||||||
|
</style>
|
||||||
|
</head>
|
||||||
|
<body>
|
||||||
|
Test passes if the a/b text aligns with the bottom margin-edge of the
|
||||||
|
gray rects.
|
||||||
|
<br><br>
|
||||||
|
|
||||||
|
a
|
||||||
|
<details class="overflow-ib">
|
||||||
|
c<br>d<br>e<br>f<br>g
|
||||||
|
</details>
|
||||||
|
b
|
||||||
|
<br>
|
||||||
|
|
||||||
|
a
|
||||||
|
<details class="overflow-ib" open>
|
||||||
|
c<br>d<br>e<br>f<br>g
|
||||||
|
</details>
|
||||||
|
b
|
||||||
|
<br>
|
||||||
|
|
||||||
|
a
|
||||||
|
<div class="overflow-ib">
|
||||||
|
<details>
|
||||||
|
c<br>d<br>e<br>f<br>g
|
||||||
|
</details>
|
||||||
|
</div>
|
||||||
|
b
|
||||||
|
<br>
|
||||||
|
|
||||||
|
a
|
||||||
|
<div class="overflow-ib">
|
||||||
|
<details open>
|
||||||
|
c<br>d<br>e<br>f<br>g
|
||||||
|
</details>
|
||||||
|
</div>
|
||||||
|
b
|
||||||
|
|
||||||
|
</body>
|
||||||
|
</html>
|
||||||
|
|
@ -0,0 +1,52 @@
|
||||||
|
<!DOCTYPE html>
|
||||||
|
<html>
|
||||||
|
<head>
|
||||||
|
<meta charset="UTF-8">
|
||||||
|
<title>
|
||||||
|
CSS Reference Case
|
||||||
|
</title>
|
||||||
|
<link rel="author" title="Daniel Holbert" href="mailto:dholbert@mozilla.com">
|
||||||
|
<link rel="author" title="Mozilla" href="https://www.mozilla.org">
|
||||||
|
<style>
|
||||||
|
/* For this reference case, we use an empty block in place of the testcase's
|
||||||
|
"details" element, because empty blocks derive their baseline from their
|
||||||
|
margin-box (and that's the behavior that we're expecting from the
|
||||||
|
"details" elements in our testcase). */
|
||||||
|
.details-ref {
|
||||||
|
display: inline-block;
|
||||||
|
height: 40px;
|
||||||
|
width: 100px;
|
||||||
|
border-color: gray;
|
||||||
|
border-style: solid;
|
||||||
|
border-width: 2px 3px 4px 5px;
|
||||||
|
padding: 4px 5px 7px 8px;
|
||||||
|
margin: 1px 2px 3px 4px;
|
||||||
|
}
|
||||||
|
</style>
|
||||||
|
</head>
|
||||||
|
<body>
|
||||||
|
Test passes if the a/b text aligns with the bottom margin-edge of the
|
||||||
|
gray rects.
|
||||||
|
<br><br>
|
||||||
|
|
||||||
|
a
|
||||||
|
<div class="details-ref"></div>
|
||||||
|
b
|
||||||
|
<br>
|
||||||
|
|
||||||
|
a
|
||||||
|
<div class="details-ref"></div>
|
||||||
|
b
|
||||||
|
<br>
|
||||||
|
|
||||||
|
a
|
||||||
|
<div class="details-ref"></div>
|
||||||
|
b
|
||||||
|
<br>
|
||||||
|
|
||||||
|
a
|
||||||
|
<div class="details-ref"></div>
|
||||||
|
b
|
||||||
|
|
||||||
|
</body>
|
||||||
|
</html>
|
||||||
Загрузка…
Ссылка в новой задаче