Skip to content

GitLab

T
tangled
Commit c0061058 authored by Koji Ishii's avatar Koji Ishii Committed by Commit Bot
Browse files
Options

[LayoutNG] Fix vertical-align: text-top in quirks mode 

When in quirks mode and there are no text siblings; e.g.:
  <div><img><span>text</span></div>
and 'vertical-align: text-top' applied to <img> hits
DCHECK failure and results in incorrect position.

The test ensures that results are the same with the standard
mode.

Bug: 901123
Change-Id: I30564c66d5847f09caf3672ba3d456c0eb798d3e
Reviewed-on: https://chromium-review.googlesource.com/c/1320529
Commit-Queue: Koji Ishii <kojii@chromium.org>
Reviewed-by: default avatarEmil A Eklund <eae@chromium.org>
Cr-Commit-Position: refs/heads/master@{#605965}
parent c0147f42
Hide whitespace changes
Inline Side-by-side
Showing with 121 additions and 2 deletions
third_party/WebKit/LayoutTests/external/wpt/quirks/reference/vertical-align-in-quirks-ref.html 0 → 100644
View file @ c0061058
<!DOCTYPE html>
<style>
div {
font-size: 10px;
line-height: 50px;
border: 1px solid blue;
}
img {
width: 1em;
height: 2em;
background: orange;
border: 1px solid black;
}
.text-top {
vertical-align: text-top;
}
.text-bottom {
vertical-align: text-bottom;
}
.top {
vertical-align: top;
}
.bottom {
vertical-align: bottom;
}
</style>
<body>
<div>
<img class="text-top" src="../../css/support/60x60-red.png">Y
</div>
<div>
<img class="text-bottom" src="../../css/support/60x60-red.png">Y
</div>
<div>
<img class="top" src="../../css/support/60x60-red.png">Y
</div>
<div>
<img class="bottom" src="../../css/support/60x60-red.png">Y
</div>
<div>
<img class="text-top" src="../../css/support/60x60-red.png"><span>Y</span>
</div>
<div>
<img class="text-bottom" src="../../css/support/60x60-red.png"><span>Y</span>
</div>
<div>
<img class="top" src="../../css/support/60x60-red.png"><span>Y</span>
</div>
<div>
<img class="bottom" src="../../css/support/60x60-red.png"><span>Y</span>
</div>
</body>
third_party/WebKit/LayoutTests/external/wpt/quirks/vertical-align-in-quirks.html 0 → 100644
View file @ c0061058
<meta charset="utf-8">
<title>CSS Text level 3 Test: letter spacing after bidi</title>
<link rel="author" href="kojii@chromium.org">
<link rel="match" href="reference/vertical-align-in-quirks-ref.html">
<meta name="assert" content="Tests some vertical-align values match in quirks and standard modes.">
<style>
div {
font-size: 10px;
line-height: 50px;
border: 1px solid blue;
}
img {
width: 1em;
height: 2em;
background: orange;
border: 1px solid black;
}
.text-top {
vertical-align: text-top;
}
.text-bottom {
vertical-align: text-bottom;
}
.top {
vertical-align: top;
}
.bottom {
vertical-align: bottom;
}
</style>
<body>
<div>
<img class="text-top" src="../css/support/60x60-red.png">Y
</div>
<div>
<img class="text-bottom" src="../css/support/60x60-red.png">Y
</div>
<div>
<img class="top" src="../css/support/60x60-red.png">Y
</div>
<div>
<img class="bottom" src="../css/support/60x60-red.png">Y
</div>
<div>
<img class="text-top" src="../css/support/60x60-red.png"><span>Y</span>
</div>
<div>
<img class="text-bottom" src="../css/support/60x60-red.png"><span>Y</span>
</div>
<div>
<img class="top" src="../css/support/60x60-red.png"><span>Y</span>
</div>
<div>
<img class="bottom" src="../css/support/60x60-red.png"><span>Y</span>
</div>
</body>
third_party/blink/renderer/core/layout/ng/inline/ng_inline_box_state.cc
View file @ c0061058
...@@ -80,6 +80,15 @@ void NGInlineBoxState::AccumulateUsedFonts(const ShapeResult* shape_result, ...@@ -80,6 +80,15 @@ void NGInlineBoxState::AccumulateUsedFonts(const ShapeResult* shape_result,
} }
} }
LayoutUnit NGInlineBoxState::TextTop(FontBaseline baseline_type) const {
if (!text_metrics.IsEmpty())
return text_top;
if (const SimpleFontData* font_data = style->GetFont().PrimaryFont())
return -font_data->GetFontMetrics().FixedAscent(baseline_type);
NOTREACHED();
return LayoutUnit();
}
bool NGInlineBoxState::CanAddTextOfStyle( bool NGInlineBoxState::CanAddTextOfStyle(
const ComputedStyle& text_style) const { const ComputedStyle& text_style) const {
if (text_style.VerticalAlign() != EVerticalAlign::kBaseline) if (text_style.VerticalAlign() != EVerticalAlign::kBaseline)
...@@ -552,8 +561,7 @@ NGInlineLayoutStateStack::ApplyBaselineShift( ...@@ -552,8 +561,7 @@ NGInlineLayoutStateStack::ApplyBaselineShift(
child.metrics = NGLineHeightMetrics::Zero(); child.metrics = NGLineHeightMetrics::Zero();
switch (child.vertical_align) { switch (child.vertical_align) {
case EVerticalAlign::kTextTop: case EVerticalAlign::kTextTop:
DCHECK(!box->text_metrics.IsEmpty()); baseline_shift = child.metrics.ascent + box->TextTop(baseline_type);
baseline_shift = child.metrics.ascent + box->text_top;
break; break;
case EVerticalAlign::kTop: case EVerticalAlign::kTop:
baseline_shift = child.metrics.ascent - max.ascent; baseline_shift = child.metrics.ascent - max.ascent;
......
third_party/blink/renderer/core/layout/ng/inline/ng_inline_box_state.h
View file @ c0061058
...@@ -87,6 +87,9 @@ struct NGInlineBoxState { ...@@ -87,6 +87,9 @@ struct NGInlineBoxState {
void AccumulateUsedFonts(const ShapeResult*, FontBaseline); void AccumulateUsedFonts(const ShapeResult*, FontBaseline);
// 'text-top' offset for 'vertical-align'.
LayoutUnit TextTop(FontBaseline baseline_type) const;
// Create a box fragment for this box. // Create a box fragment for this box.
void SetNeedsBoxFragment(const LayoutObject* inline_container); void SetNeedsBoxFragment(const LayoutObject* inline_container);
......
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment