Skip to content

GitLab

T
tangled
Commit d8a71cdb authored by pdr@chromium.org's avatar pdr@chromium.org
Browse files
Options

[FastTextAutosizer] Fix the inline overlap issue. 

Inline renderers have preferred logical widths that end up depending on
the autosizing font scale. This patch forces these preferred widths to
be recomputed. This recomputation is not necessary for text in blocks
because the block layout algorithm does not depend on the text width.
The parent null check (renderer->parent()...) is for list markers
which, interestingly, can not be in the render tree.

This patch fixes rendering on many sites, including hacker news.

BUG=338494

Review URL: https://codereview.chromium.org/218863002

git-svn-id: svn://svn.chromium.org/blink/trunk@170638 bbb929c8-8fbe-4397-9dbb-9b2b20218538
parent ad270fbe
Hide whitespace changes
Inline Side-by-side
Showing with 153 additions and 0 deletions
third_party/WebKit/LayoutTests/fast/text-autosizing/inline-width.html 0 → 100644
View file @ d8a71cdb
<!DOCTYPE html>
<html>
<head>
<meta name="viewport" content="width=800">
<style>
body, html {
overflow: hidden;
}
html {
font-size: small;
}
.inline {
display: inline;
font-weight: normal;
font-style: normal;
background-color: green;
}
i.inline {
background-color: blue;
}
b {
font-weight: normal;
font-style: normal;
background-color: purple;
}
</style>
<script src="resources/autosizingTest.js"></script>
</head>
<body>
This test passes if all lines have the same width.<br/>
<div class="inline">
AutosizeAutosizeAutosizeAutosize<br/>
AutosizeAutosizeAutosizeAutosize<br/>
AutosizeAutosizeAutosizeAutosize<br/>
AutosizeAutosizeAutosizeAutosize<br/>
<i class="inline">AutosizeAutosizeAutosizeAutosize</i><br/>
AutosizeAutosizeAutosizeAutosize<br/>
AutosizeAutosizeAutosizeAutosize<br/>
AutosizeAutosizeAutosizeAutosize<br/>
<b><b><b><i class="inline"><b><b><b>AutosizeAutosizeAutosizeAutosize</b></b></b></i></b></b></b><br/>
AutosizeAutosizeAutosizeAutosize<br/>
AutosizeAutosizeAutosizeAutosize<br/>
AutosizeAutosizeAutosizeAutosize<br/>
AutosizeAutosizeAutosizeAutosize<br/>
AutosizeAutosizeAutosizeAutosize<br/>
AutosizeAutosizeAutosizeAutosize<br/>
AutosizeAutosizeAutosizeAutosize<br/>
AutosizeAutosizeAutosizeAutosize<br/>
AutosizeAutosizeAutosizeAutosize
</div>
<script>
if (window.testRunner)
testRunner.dumpAsText();
var pass = true;
var inlines = document.getElementsByClassName('inline');
var referenceWidth = inlines[0].offsetWidth;
for (var i = 1; i < inlines.length; i++) {
if (inlines[i].offsetWidth != referenceWidth)
pass = false;
}
if (pass)
document.body.innerText = 'PASS: All inlines have the same width.';
else
document.body.innerText = 'FAIL: All inlines do not have the same width.';
</script>
</body>
</html>
\ No newline at end of file
third_party/WebKit/LayoutTests/fast/text-autosizing/table-inline-width.html 0 → 100644
View file @ d8a71cdb
<!DOCTYPE html>
<html>
<head>
<meta name="viewport" content="width=800">
<style>
body, html {
overflow: hidden;
}
html {
font-size: small;
}
.inline {
display: inline;
font-weight: normal;
font-style: normal;
background-color: green;
}
i.inline {
background-color: blue;
}
b {
font-weight: normal;
font-style: normal;
background-color: purple;
}
</style>
<script src="resources/autosizingTest.js"></script>
</head>
<body>
This test passes if all lines have the same width.<br/>
<table>
<tr>
<td>a</td>
<td>
<div class="inline">
AutosizeAutosizeAutosizeAutosize<br/>
AutosizeAutosizeAutosizeAutosize<br/>
AutosizeAutosizeAutosizeAutosize<br/>
AutosizeAutosizeAutosizeAutosize<br/>
</div>
<i class="inline">AutosizeAutosizeAutosizeAutosize</i><br/>
AutosizeAutosizeAutosizeAutosize<br/>
AutosizeAutosizeAutosizeAutosize<br/>
AutosizeAutosizeAutosizeAutosize<br/>
<b><b><b><i class="inline"><b><b><b>AutosizeAutosizeAutosizeAutosize</b></b></b></i></b></b></b><br/>
AutosizeAutosizeAutosizeAutosize<br/>
AutosizeAutosizeAutosizeAutosize<br/>
AutosizeAutosizeAutosizeAutosize<br/>
AutosizeAutosizeAutosizeAutosize<br/>
AutosizeAutosizeAutosizeAutosize<br/>
AutosizeAutosizeAutosizeAutosize<br/>
AutosizeAutosizeAutosizeAutosize<br/>
AutosizeAutosizeAutosizeAutosize<br/>
AutosizeAutosizeAutosizeAutosize
</td>
</tr>
</table>
<script>
if (window.testRunner)
testRunner.dumpAsText();
var pass = true;
var inlines = document.getElementsByClassName('inline');
var referenceWidth = inlines[0].offsetWidth;
for (var i = 1; i < inlines.length; i++) {
if (inlines[i].offsetWidth != referenceWidth)
pass = false;
}
if (pass)
document.body.innerText = 'PASS: All inlines have the same width.';
else
document.body.innerText = 'FAIL: All inlines do not have the same width.';
</script>
</body>
</html>
\ No newline at end of file
third_party/WebKit/Source/core/rendering/FastTextAutosizer.cpp
View file @ d8a71cdb
...@@ -412,6 +412,9 @@ void FastTextAutosizer::inflate(RenderBlock* block) ...@@ -412,6 +412,9 @@ void FastTextAutosizer::inflate(RenderBlock* block)
multiplier = cluster->m_autosize ? clusterMultiplier(cluster) : 1.0f; multiplier = cluster->m_autosize ? clusterMultiplier(cluster) : 1.0f;
applyMultiplier(descendant, multiplier); applyMultiplier(descendant, multiplier);
applyMultiplier(descendant->parent(), multiplier); // Parent handles line spacing. applyMultiplier(descendant->parent(), multiplier); // Parent handles line spacing.
// FIXME: Investigate why MarkOnlyThis is sufficient.
if (descendant->parent()->isRenderInline())
descendant->setPreferredLogicalWidthsDirty(MarkOnlyThis);
} }
descendant = descendant->nextInPreOrder(block); descendant = descendant->nextInPreOrder(block);
} }
......
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