Text with text-overflow:ellipsis and text-align:right is left aligned

https://bugs.webkit.org/show_bug.cgi?id=88705

Patch by Benjamin Poulain <bpoulain@apple.com> on 2012-06-22
Reviewed by Dan Bernstein.

Source/WebCore:

When building the line of a text with overflow, we do not know if we can place
an ellipsis and where it should be. Because of that, text is laid out as if it does
not have text-overflow: ellipsis.

This causes problems with text-alignement right in LTR and left in RTL. The shortened text
did not follow the allignment.

This patch changes the position of lines with ellipsis after layout to follow the allignment.
In RenderBlock::checkLinesForTextOverflow(), the call to RootInlineBox::placeEllipsis() now
also gives the width of the truncated text. We use this width to re-compute the alignement and
shift the box if necessary.

In RenderBlock::deleteEllipsisLineBoxes() we revert the text to the position computed with the
total width. This way all layout computation is done as usual.

Tests: fast/css/text-overflow-ellipsis-text-align-left.html
       fast/css/text-overflow-ellipsis-text-align-right.html

* rendering/InlineBox.cpp:
(WebCore::InlineBox::canAccommodateEllipsis): Make the method const for readability, truncating is
done later in placeEllipsisBox().
(WebCore::InlineBox::placeEllipsisBox): Add an output argument, truncatedWidth, giving the width
of the text + ellipsis after truncation (if any truncation can be done).
* rendering/InlineBox.h:
(InlineBox):
* rendering/InlineFlowBox.cpp:
(WebCore::InlineBox::adjustLogicalPosition): adjustPosition() logical coordinates.
(WebCore::InlineFlowBox::canAccommodateEllipsis):
(WebCore::InlineFlowBox::placeEllipsisBox):
* rendering/InlineFlowBox.h:
(InlineFlowBox):
* rendering/InlineTextBox.cpp:
(WebCore::InlineTextBox::placeEllipsisBox):
* rendering/InlineTextBox.h:
(InlineTextBox):
* rendering/RenderBlockLineLayout.cpp:
(WebCore::RenderBlock::deleteEllipsisLineBoxes): In addition to removing the truncation, we
need to revert the shift introduced by checkLinesForTextOverflow(). This restore the lines
to its original, untruncated position in order to layout the block correctly in RenderBlock::layoutInlineChildren().
(WebCore::RenderBlock::checkLinesForTextOverflow): After we truncate the text, we now recompute the shift we need
for alignment, and move the line accordingly.
* rendering/RenderDeprecatedFlexibleBox.cpp:
(WebCore::RenderDeprecatedFlexibleBox::applyLineClamp):
* rendering/RootInlineBox.cpp:
(WebCore::RootInlineBox::placeEllipsis): Return the width of the truncated text + the width of the ellipsis.
(WebCore::RootInlineBox::placeEllipsisBox):
(WebCore::RootInlineBox::adjustPosition):
* rendering/RootInlineBox.h:
(RootInlineBox):

LayoutTests:

* fast/css/text-overflow-ellipsis-text-align-center.html: Added.
* fast/css/text-overflow-ellipsis-text-align-justify.html: Added.
* fast/css/text-overflow-ellipsis-text-align-left.html: Added.
* fast/css/text-overflow-ellipsis-text-align-right.html: Added.
* fast/css/vertical-text-overflow-ellipsis-text-align-center.html: Added.
* fast/css/vertical-text-overflow-ellipsis-text-align-justify.html: Added.
* fast/css/vertical-text-overflow-ellipsis-text-align-left.html: Added.
* fast/css/vertical-text-overflow-ellipsis-text-align-right.html: Added.
The vertical-text tests are incorrect due to other bugs. Add they to track regressions/progressions
going forward.

* platform/chromium/TestExpectations: The tests need platform specific results.
* platform/mac/fast/css/text-overflow-ellipsis-text-align-center-expected.txt: Added.
* platform/mac/fast/css/text-overflow-ellipsis-text-align-justify-expected.txt: Added.
* platform/mac/fast/css/text-overflow-ellipsis-text-align-left-expected.txt: Added.
* platform/mac/fast/css/text-overflow-ellipsis-text-align-right-expected.txt: Added.
* platform/mac/fast/css/text-overflow-ellipsis-text-align-center-expected.txt: Added.
* platform/mac/fast/css/text-overflow-ellipsis-text-align-justify-expected.txt: Added.
* platform/mac/fast/css/text-overflow-ellipsis-text-align-left-expected.txt: Added.
* platform/mac/fast/css/text-overflow-ellipsis-text-align-right-expected.txt: Added.

git-svn-id: http://svn.webkit.org/repository/webkit/trunk@121085 268f45cc-cd09-0410-ab3c-d52691b4dbfc

diff --git a/LayoutTests/ChangeLog b/LayoutTests/ChangeLog
index fce4b07..b08c314 100644 (file)
--- a/LayoutTests/ChangeLog
+++ b/LayoutTests/ChangeLog
@@ -1,3 +1,31 @@
+2012-06-22  Benjamin Poulain  <bpoulain@apple.com>
+
+        Text with text-overflow:ellipsis and text-align:right is left aligned
+        https://bugs.webkit.org/show_bug.cgi?id=88705
+
+        Reviewed by Dan Bernstein.
+
+        * fast/css/text-overflow-ellipsis-text-align-center.html: Added.
+        * fast/css/text-overflow-ellipsis-text-align-justify.html: Added.
+        * fast/css/text-overflow-ellipsis-text-align-left.html: Added.
+        * fast/css/text-overflow-ellipsis-text-align-right.html: Added.
+        * fast/css/vertical-text-overflow-ellipsis-text-align-center.html: Added.
+        * fast/css/vertical-text-overflow-ellipsis-text-align-justify.html: Added.
+        * fast/css/vertical-text-overflow-ellipsis-text-align-left.html: Added.
+        * fast/css/vertical-text-overflow-ellipsis-text-align-right.html: Added.
+        The vertical-text tests are incorrect due to other bugs. Add they to track regressions/progressions
+        going forward.
+
+        * platform/chromium/TestExpectations: The tests need platform specific results.
+        * platform/mac/fast/css/text-overflow-ellipsis-text-align-center-expected.txt: Added.
+        * platform/mac/fast/css/text-overflow-ellipsis-text-align-justify-expected.txt: Added.
+        * platform/mac/fast/css/text-overflow-ellipsis-text-align-left-expected.txt: Added.
+        * platform/mac/fast/css/text-overflow-ellipsis-text-align-right-expected.txt: Added.
+        * platform/mac/fast/css/text-overflow-ellipsis-text-align-center-expected.txt: Added.
+        * platform/mac/fast/css/text-overflow-ellipsis-text-align-justify-expected.txt: Added.
+        * platform/mac/fast/css/text-overflow-ellipsis-text-align-left-expected.txt: Added.
+        * platform/mac/fast/css/text-overflow-ellipsis-text-align-right-expected.txt: Added.
+
 2012-06-22  Alexandru Chiculita  <achicu@adobe.com>
 
         [CSS Shaders] Re-enable the CSS Shaders compile time flag on Safari Mac

diff --git a/LayoutTests/fast/css/text-overflow-ellipsis-text-align-center.html b/LayoutTests/fast/css/text-overflow-ellipsis-text-align-center.html
new file mode 100644 (file)
index 0000000..372028f
--- /dev/null
+++ b/LayoutTests/fast/css/text-overflow-ellipsis-text-align-center.html
@@ -0,0 +1,65 @@
+<META HTTP-EQUIV="CONTENT-TYPE" CONTENT="TEXT/HTML; CHARSET=utf8">
+<head>
+<style>
+.testDiv {
+    width: 308px;
+    border: 1px solid black;
+    white-space: nowrap;
+    overflow: hidden;
+    margin: 0 0 20px 0;
+    text-align: center;
+    text-overflow: ellipsis;
+}
+
+.rtl {
+    direction: rtl;
+    unicode-bidi: bidi-override;
+}
+</style>
+</head>
+<body>
+
+<p>This test checks that text with text-overflow:ellipsis follows 'text-align: center' correctly.</p>
+
+<p>The text in all boxes should have the text centered in the box.</p>
+
+<h3>Single line</h3>
+<div class="testDiv">Lorem ipsum dolor sit amet, consectetur adipiscing elit. Vivamus vitae eros non libero faucibus sagittis sed ut eros.</div>
+
+<h3>Multi line</h3>
+<div class="testDiv">
+       Lorem ipsum dolor sit amet, consectetur adipiscing elit. Vivamus vitae eros non libero faucibus sagittis sed ut eros.<br>
+       orem ipsum dolor sit amet, consectetur adipiscing elit. Vivamus vitae eros non libero faucibus sagittis sed ut eros.<br>
+    rem ipsum dolor sit amet, consectetur adipiscing elit. Vivamus vitae eros non libero faucibus sagittis sed ut eros.<br>
+       em ipsum dolor sit amet, consectetur adipiscing elit. Vivamus vitae eros non libero faucibus sagittis sed ut eros.<br>
+</div>
+
+<h3>Containing replaced content</h3>
+<div class="testDiv">Lorem ipsum dolor sit amet, <img src="resources/greenbox.png"> consectetur adipiscing elit. Vivamus vitae eros non libero faucibus sagittis sed ut eros.</div>
+
+
+<h3>Containing replaced content blocking the ellipsis</h3>
+<div class="testDiv">Lorem ipsum dolor sit amet, consectetur ad<img src="resources/greenbox.png">ipiscing elit. Vivamus vitae eros non libero faucibus sagittis sed ut eros.</div>
+
+
+<h3>Right-To-Left single line</h3>
+<div class="testDiv rtl">Lorem ipsum dolor sit amet, consectetur adipiscing elit. Vivamus vitae eros non libero faucibus sagittis sed ut eros.</div>
+
+
+<h3>Right-To-Left Multi line</h3>
+<div class="testDiv rtl">
+       Lorem ipsum dolor sit amet, consectetur adipiscing elit. Vivamus vitae eros non libero faucibus sagittis sed ut eros.<br>
+       orem ipsum dolor sit amet, consectetur adipiscing elit. Vivamus vitae eros non libero faucibus sagittis sed ut eros.<br>
+    rem ipsum dolor sit amet, consectetur adipiscing elit. Vivamus vitae eros non libero faucibus sagittis sed ut eros.<br>
+       em ipsum dolor sit amet, consectetur adipiscing elit. Vivamus vitae eros non libero faucibus sagittis sed ut eros.<br>
+</div>
+
+
+<h3>Right-To-Left containing replaced content</h3>
+<div class="testDiv rtl">Lorem ipsum dolor sit amet, <img src="resources/greenbox.png"> consectetur adipiscing elit. Vivamus vitae eros non libero faucibus sagittis sed ut eros.</div>
+
+<h3>Right-To-Left containing replaced content blocking the ellipsis</h3>
+<div class="testDiv rtl">Lorem ipsum dolor sit amet, consectetur ad<img src="resources/greenbox.png">ipiscing elit. Vivamus vitae eros non libero faucibus sagittis sed ut eros.</div>
+
+</body>
+</html>

diff --git a/LayoutTests/fast/css/text-overflow-ellipsis-text-align-justify.html b/LayoutTests/fast/css/text-overflow-ellipsis-text-align-justify.html
new file mode 100644 (file)
index 0000000..d899da3
--- /dev/null
+++ b/LayoutTests/fast/css/text-overflow-ellipsis-text-align-justify.html
@@ -0,0 +1,65 @@
+<META HTTP-EQUIV="CONTENT-TYPE" CONTENT="TEXT/HTML; CHARSET=utf8">
+<head>
+<style>
+.testDiv {
+    width: 308px;
+    border: 1px solid black;
+    white-space: nowrap;
+    overflow: hidden;
+    margin: 0 0 20px 0;
+    text-align: justify;
+    text-overflow: ellipsis;
+}
+
+.rtl {
+    direction: rtl;
+    unicode-bidi: bidi-override;
+}
+</style>
+</head>
+<body>
+
+<p>This test checks that text with text-overflow:ellipsis follows 'text-align: justify' correctly.</p>
+
+<p>LTR text should be aligned with the left hand side of their box. RTL text should be aligned with the right hand side of their box.</p>
+
+<h3>Single line</h3>
+<div class="testDiv">Lorem ipsum dolor sit amet, consectetur adipiscing elit. Vivamus vitae eros non libero faucibus sagittis sed ut eros.</div>
+
+<h3>Multi line</h3>
+<div class="testDiv">
+       Lorem ipsum dolor sit amet, consectetur adipiscing elit. Vivamus vitae eros non libero faucibus sagittis sed ut eros.<br>
+       orem ipsum dolor sit amet, consectetur adipiscing elit. Vivamus vitae eros non libero faucibus sagittis sed ut eros.<br>
+    rem ipsum dolor sit amet, consectetur adipiscing elit. Vivamus vitae eros non libero faucibus sagittis sed ut eros.<br>
+       em ipsum dolor sit amet, consectetur adipiscing elit. Vivamus vitae eros non libero faucibus sagittis sed ut eros.<br>
+</div>
+
+<h3>Containing replaced content</h3>
+<div class="testDiv">Lorem ipsum dolor sit amet, <img src="resources/greenbox.png"> consectetur adipiscing elit. Vivamus vitae eros non libero faucibus sagittis sed ut eros.</div>
+
+
+<h3>Containing replaced content blocking the ellipsis</h3>
+<div class="testDiv">Lorem ipsum dolor sit amet, consectetur ad<img src="resources/greenbox.png">ipiscing elit. Vivamus vitae eros non libero faucibus sagittis sed ut eros.</div>
+
+
+<h3>Right-To-Left single line</h3>
+<div class="testDiv rtl">Lorem ipsum dolor sit amet, consectetur adipiscing elit. Vivamus vitae eros non libero faucibus sagittis sed ut eros.</div>
+
+
+<h3>Right-To-Left Multi line</h3>
+<div class="testDiv rtl">
+       Lorem ipsum dolor sit amet, consectetur adipiscing elit. Vivamus vitae eros non libero faucibus sagittis sed ut eros.<br>
+       orem ipsum dolor sit amet, consectetur adipiscing elit. Vivamus vitae eros non libero faucibus sagittis sed ut eros.<br>
+    rem ipsum dolor sit amet, consectetur adipiscing elit. Vivamus vitae eros non libero faucibus sagittis sed ut eros.<br>
+       em ipsum dolor sit amet, consectetur adipiscing elit. Vivamus vitae eros non libero faucibus sagittis sed ut eros.<br>
+</div>
+
+
+<h3>Right-To-Left containing replaced content</h3>
+<div class="testDiv rtl">Lorem ipsum dolor sit amet, <img src="resources/greenbox.png"> consectetur adipiscing elit. Vivamus vitae eros non libero faucibus sagittis sed ut eros.</div>
+
+<h3>Right-To-Left containing replaced content blocking the ellipsis</h3>
+<div class="testDiv rtl">Lorem ipsum dolor sit amet, consectetur ad<img src="resources/greenbox.png">ipiscing elit. Vivamus vitae eros non libero faucibus sagittis sed ut eros.</div>
+
+</body>
+</html>

diff --git a/LayoutTests/fast/css/text-overflow-ellipsis-text-align-left.html b/LayoutTests/fast/css/text-overflow-ellipsis-text-align-left.html
new file mode 100644 (file)
index 0000000..d856feb
--- /dev/null
+++ b/LayoutTests/fast/css/text-overflow-ellipsis-text-align-left.html
@@ -0,0 +1,65 @@
+<META HTTP-EQUIV="CONTENT-TYPE" CONTENT="TEXT/HTML; CHARSET=utf8">
+<head>
+<style>
+.testDiv {
+    width: 308px;
+    border: 1px solid black;
+    white-space: nowrap;
+    overflow: hidden;
+    margin: 0 0 20px 0;
+    text-align: left;
+    text-overflow: ellipsis;
+}
+
+.rtl {
+    direction: rtl;
+    unicode-bidi: bidi-override;
+}
+</style>
+</head>
+<body>
+
+<p>This test checks that text with text-overflow:ellipsis follows 'text-align: left' correctly.</p>
+
+<p>The text in all boxes should be left aligned, sticking to the left side of the box</p>
+
+<h3>Single line</h3>
+<div class="testDiv">Lorem ipsum dolor sit amet, consectetur adipiscing elit. Vivamus vitae eros non libero faucibus sagittis sed ut eros.</div>
+
+<h3>Multi line</h3>
+<div class="testDiv">
+       Lorem ipsum dolor sit amet, consectetur adipiscing elit. Vivamus vitae eros non libero faucibus sagittis sed ut eros.<br>
+       orem ipsum dolor sit amet, consectetur adipiscing elit. Vivamus vitae eros non libero faucibus sagittis sed ut eros.<br>
+    rem ipsum dolor sit amet, consectetur adipiscing elit. Vivamus vitae eros non libero faucibus sagittis sed ut eros.<br>
+       em ipsum dolor sit amet, consectetur adipiscing elit. Vivamus vitae eros non libero faucibus sagittis sed ut eros.<br>
+</div>
+
+<h3>Containing replaced content</h3>
+<div class="testDiv">Lorem ipsum dolor sit amet, <img src="resources/greenbox.png"> consectetur adipiscing elit. Vivamus vitae eros non libero faucibus sagittis sed ut eros.</div>
+
+
+<h3>Containing replaced content blocking the ellipsis</h3>
+<div class="testDiv">Lorem ipsum dolor sit amet, consectetur ad<img src="resources/greenbox.png">ipiscing elit. Vivamus vitae eros non libero faucibus sagittis sed ut eros.</div>
+
+
+<h3>Right-To-Left single line</h3>
+<div class="testDiv rtl">Lorem ipsum dolor sit amet, consectetur adipiscing elit. Vivamus vitae eros non libero faucibus sagittis sed ut eros.</div>
+
+
+<h3>Right-To-Left Multi line</h3>
+<div class="testDiv rtl">
+       Lorem ipsum dolor sit amet, consectetur adipiscing elit. Vivamus vitae eros non libero faucibus sagittis sed ut eros.<br>
+       orem ipsum dolor sit amet, consectetur adipiscing elit. Vivamus vitae eros non libero faucibus sagittis sed ut eros.<br>
+    rem ipsum dolor sit amet, consectetur adipiscing elit. Vivamus vitae eros non libero faucibus sagittis sed ut eros.<br>
+       em ipsum dolor sit amet, consectetur adipiscing elit. Vivamus vitae eros non libero faucibus sagittis sed ut eros.<br>
+</div>
+
+
+<h3>Right-To-Left containing replaced content</h3>
+<div class="testDiv rtl">Lorem ipsum dolor sit amet, <img src="resources/greenbox.png"> consectetur adipiscing elit. Vivamus vitae eros non libero faucibus sagittis sed ut eros.</div>
+
+<h3>Right-To-Left containing replaced content blocking the ellipsis</h3>
+<div class="testDiv rtl">Lorem ipsum dolor sit amet, consectetur ad<img src="resources/greenbox.png">ipiscing elit. Vivamus vitae eros non libero faucibus sagittis sed ut eros.</div>
+
+</body>
+</html>

diff --git a/LayoutTests/fast/css/text-overflow-ellipsis-text-align-right.html b/LayoutTests/fast/css/text-overflow-ellipsis-text-align-right.html
new file mode 100644 (file)
index 0000000..57cf1d9
--- /dev/null
+++ b/LayoutTests/fast/css/text-overflow-ellipsis-text-align-right.html
@@ -0,0 +1,65 @@
+<META HTTP-EQUIV="CONTENT-TYPE" CONTENT="TEXT/HTML; CHARSET=utf8">
+<head>
+<style>
+.testDiv {
+    width: 308px;
+    border: 1px solid black;
+    white-space: nowrap;
+    overflow: hidden;
+    margin: 0 0 20px 0;
+    text-align: right;
+    text-overflow: ellipsis;
+}
+
+.rtl {
+    direction: rtl;
+    unicode-bidi: bidi-override;
+}
+</style>
+</head>
+<body>
+
+<p>This test checks that text with text-overflow:ellipsis follows 'text-align: right' correctly.</p>
+
+<p>The text in all boxes should be right aligned, sticking to the right side of the box</p>
+
+<h3>Single line</h3>
+<div class="testDiv">Lorem ipsum dolor sit amet, consectetur adipiscing elit. Vivamus vitae eros non libero faucibus sagittis sed ut eros.</div>
+
+<h3>Multi line</h3>
+<div class="testDiv">
+       Lorem ipsum dolor sit amet, consectetur adipiscing elit. Vivamus vitae eros non libero faucibus sagittis sed ut eros.<br>
+       orem ipsum dolor sit amet, consectetur adipiscing elit. Vivamus vitae eros non libero faucibus sagittis sed ut eros.<br>
+    rem ipsum dolor sit amet, consectetur adipiscing elit. Vivamus vitae eros non libero faucibus sagittis sed ut eros.<br>
+       em ipsum dolor sit amet, consectetur adipiscing elit. Vivamus vitae eros non libero faucibus sagittis sed ut eros.<br>
+</div>
+
+<h3>Containing replaced content</h3>
+<div class="testDiv">Lorem ipsum dolor sit amet, <img src="resources/greenbox.png"> consectetur adipiscing elit. Vivamus vitae eros non libero faucibus sagittis sed ut eros.</div>
+
+
+<h3>Containing replaced content blocking the ellipsis</h3>
+<div class="testDiv">Lorem ipsum dolor sit amet, consectetur ad<img src="resources/greenbox.png">ipiscing elit. Vivamus vitae eros non libero faucibus sagittis sed ut eros.</div>
+
+
+<h3>Right-To-Left single line</h3>
+<div class="testDiv rtl">Lorem ipsum dolor sit amet, consectetur adipiscing elit. Vivamus vitae eros non libero faucibus sagittis sed ut eros.</div>
+
+
+<h3>Right-To-Left Multi line</h3>
+<div class="testDiv rtl">
+       Lorem ipsum dolor sit amet, consectetur adipiscing elit. Vivamus vitae eros non libero faucibus sagittis sed ut eros.<br>
+       orem ipsum dolor sit amet, consectetur adipiscing elit. Vivamus vitae eros non libero faucibus sagittis sed ut eros.<br>
+    rem ipsum dolor sit amet, consectetur adipiscing elit. Vivamus vitae eros non libero faucibus sagittis sed ut eros.<br>
+       em ipsum dolor sit amet, consectetur adipiscing elit. Vivamus vitae eros non libero faucibus sagittis sed ut eros.<br>
+</div>
+
+
+<h3>Right-To-Left containing replaced content</h3>
+<div class="testDiv rtl">Lorem ipsum dolor sit amet, <img src="resources/greenbox.png"> consectetur adipiscing elit. Vivamus vitae eros non libero faucibus sagittis sed ut eros.</div>
+
+<h3>Right-To-Left containing replaced content blocking the ellipsis</h3>
+<div class="testDiv rtl">Lorem ipsum dolor sit amet, consectetur ad<img src="resources/greenbox.png">ipiscing elit. Vivamus vitae eros non libero faucibus sagittis sed ut eros.</div>
+
+</body>
+</html>

diff --git a/LayoutTests/fast/css/vertical-text-overflow-ellipsis-text-align-center.html b/LayoutTests/fast/css/vertical-text-overflow-ellipsis-text-align-center.html
new file mode 100644 (file)
index 0000000..ace64e6
--- /dev/null
+++ b/LayoutTests/fast/css/vertical-text-overflow-ellipsis-text-align-center.html
@@ -0,0 +1,62 @@
+<META HTTP-EQUIV="CONTENT-TYPE" CONTENT="TEXT/HTML; CHARSET=utf8">
+<head>
+<style>
+.testDiv {
+    height: 308px;
+    border: 1px solid black;
+    white-space: nowrap;
+    overflow: hidden;
+    margin: 0 0 20px 0;
+    text-align: center;
+    text-overflow: ellipsis;
+    -webkit-writing-mode: vertical-rl;
+}
+
+.rtl {
+    direction: rtl;
+    unicode-bidi: bidi-override;
+}
+</style>
+</head>
+<body>
+
+<h3>Single line</h3>
+<div class="testDiv">Lorem ipsum dolor sit amet, consectetur adipiscing elit. Vivamus vitae eros non libero faucibus sagittis sed ut eros.</div>
+
+<h3>Multi line</h3>
+<div class="testDiv">
+       Lorem ipsum dolor sit amet, consectetur adipiscing elit. Vivamus vitae eros non libero faucibus sagittis sed ut eros.<br>
+       orem ipsum dolor sit amet, consectetur adipiscing elit. Vivamus vitae eros non libero faucibus sagittis sed ut eros.<br>
+    rem ipsum dolor sit amet, consectetur adipiscing elit. Vivamus vitae eros non libero faucibus sagittis sed ut eros.<br>
+       em ipsum dolor sit amet, consectetur adipiscing elit. Vivamus vitae eros non libero faucibus sagittis sed ut eros.<br>
+</div>
+
+<h3>Containing replaced content</h3>
+<div class="testDiv">Lorem ipsum dolor sit amet, <img src="resources/greenbox.png"> consectetur adipiscing elit. Vivamus vitae eros non libero faucibus sagittis sed ut eros.</div>
+
+
+<h3>Containing replaced content blocking the ellipsis</h3>
+<div class="testDiv">Lorem ipsum dolor sit amet, consectetur ad<img src="resources/greenbox.png">ipiscing elit. Vivamus vitae eros non libero faucibus sagittis sed ut eros.</div>
+
+
+<h3>Right-To-Left single line</h3>
+<div class="testDiv rtl">Lorem ipsum dolor sit amet, consectetur adipiscing elit. Vivamus vitae eros non libero faucibus sagittis sed ut eros.</div>
+
+
+<h3>Right-To-Left Multi line</h3>
+<div class="testDiv rtl">
+       Lorem ipsum dolor sit amet, consectetur adipiscing elit. Vivamus vitae eros non libero faucibus sagittis sed ut eros.<br>
+       orem ipsum dolor sit amet, consectetur adipiscing elit. Vivamus vitae eros non libero faucibus sagittis sed ut eros.<br>
+    rem ipsum dolor sit amet, consectetur adipiscing elit. Vivamus vitae eros non libero faucibus sagittis sed ut eros.<br>
+       em ipsum dolor sit amet, consectetur adipiscing elit. Vivamus vitae eros non libero faucibus sagittis sed ut eros.<br>
+</div>
+
+
+<h3>Right-To-Left containing replaced content</h3>
+<div class="testDiv rtl">Lorem ipsum dolor sit amet, <img src="resources/greenbox.png"> consectetur adipiscing elit. Vivamus vitae eros non libero faucibus sagittis sed ut eros.</div>
+
+<h3>Right-To-Left containing replaced content blocking the ellipsis</h3>
+<div class="testDiv rtl">Lorem ipsum dolor sit amet, consectetur ad<img src="resources/greenbox.png">ipiscing elit. Vivamus vitae eros non libero faucibus sagittis sed ut eros.</div>
+
+</body>
+</html>

diff --git a/LayoutTests/fast/css/vertical-text-overflow-ellipsis-text-align-justify.html b/LayoutTests/fast/css/vertical-text-overflow-ellipsis-text-align-justify.html
new file mode 100644 (file)
index 0000000..0920a71
--- /dev/null
+++ b/LayoutTests/fast/css/vertical-text-overflow-ellipsis-text-align-justify.html
@@ -0,0 +1,62 @@
+<META HTTP-EQUIV="CONTENT-TYPE" CONTENT="TEXT/HTML; CHARSET=utf8">
+<head>
+<style>
+.testDiv {
+    height: 308px;
+    border: 1px solid black;
+    white-space: nowrap;
+    overflow: hidden;
+    margin: 0 0 20px 0;
+    text-align: justify;
+    text-overflow: ellipsis;
+    -webkit-writing-mode: vertical-rl;
+}
+
+.rtl {
+    direction: rtl;
+    unicode-bidi: bidi-override;
+}
+</style>
+</head>
+<body>
+
+<h3>Single line</h3>
+<div class="testDiv">Lorem ipsum dolor sit amet, consectetur adipiscing elit. Vivamus vitae eros non libero faucibus sagittis sed ut eros.</div>
+
+<h3>Multi line</h3>
+<div class="testDiv">
+       Lorem ipsum dolor sit amet, consectetur adipiscing elit. Vivamus vitae eros non libero faucibus sagittis sed ut eros.<br>
+       orem ipsum dolor sit amet, consectetur adipiscing elit. Vivamus vitae eros non libero faucibus sagittis sed ut eros.<br>
+    rem ipsum dolor sit amet, consectetur adipiscing elit. Vivamus vitae eros non libero faucibus sagittis sed ut eros.<br>
+       em ipsum dolor sit amet, consectetur adipiscing elit. Vivamus vitae eros non libero faucibus sagittis sed ut eros.<br>
+</div>
+
+<h3>Containing replaced content</h3>
+<div class="testDiv">Lorem ipsum dolor sit amet, <img src="resources/greenbox.png"> consectetur adipiscing elit. Vivamus vitae eros non libero faucibus sagittis sed ut eros.</div>
+
+
+<h3>Containing replaced content blocking the ellipsis</h3>
+<div class="testDiv">Lorem ipsum dolor sit amet, consectetur ad<img src="resources/greenbox.png">ipiscing elit. Vivamus vitae eros non libero faucibus sagittis sed ut eros.</div>
+
+
+<h3>Right-To-Left single line</h3>
+<div class="testDiv rtl">Lorem ipsum dolor sit amet, consectetur adipiscing elit. Vivamus vitae eros non libero faucibus sagittis sed ut eros.</div>
+
+
+<h3>Right-To-Left Multi line</h3>
+<div class="testDiv rtl">
+       Lorem ipsum dolor sit amet, consectetur adipiscing elit. Vivamus vitae eros non libero faucibus sagittis sed ut eros.<br>
+       orem ipsum dolor sit amet, consectetur adipiscing elit. Vivamus vitae eros non libero faucibus sagittis sed ut eros.<br>
+    rem ipsum dolor sit amet, consectetur adipiscing elit. Vivamus vitae eros non libero faucibus sagittis sed ut eros.<br>
+       em ipsum dolor sit amet, consectetur adipiscing elit. Vivamus vitae eros non libero faucibus sagittis sed ut eros.<br>
+</div>
+
+
+<h3>Right-To-Left containing replaced content</h3>
+<div class="testDiv rtl">Lorem ipsum dolor sit amet, <img src="resources/greenbox.png"> consectetur adipiscing elit. Vivamus vitae eros non libero faucibus sagittis sed ut eros.</div>
+
+<h3>Right-To-Left containing replaced content blocking the ellipsis</h3>
+<div class="testDiv rtl">Lorem ipsum dolor sit amet, consectetur ad<img src="resources/greenbox.png">ipiscing elit. Vivamus vitae eros non libero faucibus sagittis sed ut eros.</div>
+
+</body>
+</html>

diff --git a/LayoutTests/fast/css/vertical-text-overflow-ellipsis-text-align-left.html b/LayoutTests/fast/css/vertical-text-overflow-ellipsis-text-align-left.html
new file mode 100644 (file)
index 0000000..36c3fb1
--- /dev/null
+++ b/LayoutTests/fast/css/vertical-text-overflow-ellipsis-text-align-left.html
@@ -0,0 +1,62 @@
+<META HTTP-EQUIV="CONTENT-TYPE" CONTENT="TEXT/HTML; CHARSET=utf8">
+<head>
+<style>
+.testDiv {
+    height: 308px;
+    border: 1px solid black;
+    white-space: nowrap;
+    overflow: hidden;
+    margin: 0 0 20px 0;
+    text-align: left;
+    text-overflow: ellipsis;
+    -webkit-writing-mode: vertical-rl;
+}
+
+.rtl {
+    direction: rtl;
+    unicode-bidi: bidi-override;
+}
+</style>
+</head>
+<body>
+
+<h3>Single line</h3>
+<div class="testDiv">Lorem ipsum dolor sit amet, consectetur adipiscing elit. Vivamus vitae eros non libero faucibus sagittis sed ut eros.</div>
+
+<h3>Multi line</h3>
+<div class="testDiv">
+       Lorem ipsum dolor sit amet, consectetur adipiscing elit. Vivamus vitae eros non libero faucibus sagittis sed ut eros.<br>
+       orem ipsum dolor sit amet, consectetur adipiscing elit. Vivamus vitae eros non libero faucibus sagittis sed ut eros.<br>
+    rem ipsum dolor sit amet, consectetur adipiscing elit. Vivamus vitae eros non libero faucibus sagittis sed ut eros.<br>
+       em ipsum dolor sit amet, consectetur adipiscing elit. Vivamus vitae eros non libero faucibus sagittis sed ut eros.<br>
+</div>
+
+<h3>Containing replaced content</h3>
+<div class="testDiv">Lorem ipsum dolor sit amet, <img src="resources/greenbox.png"> consectetur adipiscing elit. Vivamus vitae eros non libero faucibus sagittis sed ut eros.</div>
+
+
+<h3>Containing replaced content blocking the ellipsis</h3>
+<div class="testDiv">Lorem ipsum dolor sit amet, consectetur ad<img src="resources/greenbox.png">ipiscing elit. Vivamus vitae eros non libero faucibus sagittis sed ut eros.</div>
+
+
+<h3>Right-To-Left single line</h3>
+<div class="testDiv rtl">Lorem ipsum dolor sit amet, consectetur adipiscing elit. Vivamus vitae eros non libero faucibus sagittis sed ut eros.</div>
+
+
+<h3>Right-To-Left Multi line</h3>
+<div class="testDiv rtl">
+       Lorem ipsum dolor sit amet, consectetur adipiscing elit. Vivamus vitae eros non libero faucibus sagittis sed ut eros.<br>
+       orem ipsum dolor sit amet, consectetur adipiscing elit. Vivamus vitae eros non libero faucibus sagittis sed ut eros.<br>
+    rem ipsum dolor sit amet, consectetur adipiscing elit. Vivamus vitae eros non libero faucibus sagittis sed ut eros.<br>
+       em ipsum dolor sit amet, consectetur adipiscing elit. Vivamus vitae eros non libero faucibus sagittis sed ut eros.<br>
+</div>
+
+
+<h3>Right-To-Left containing replaced content</h3>
+<div class="testDiv rtl">Lorem ipsum dolor sit amet, <img src="resources/greenbox.png"> consectetur adipiscing elit. Vivamus vitae eros non libero faucibus sagittis sed ut eros.</div>
+
+<h3>Right-To-Left containing replaced content blocking the ellipsis</h3>
+<div class="testDiv rtl">Lorem ipsum dolor sit amet, consectetur ad<img src="resources/greenbox.png">ipiscing elit. Vivamus vitae eros non libero faucibus sagittis sed ut eros.</div>
+
+</body>
+</html>

diff --git a/LayoutTests/fast/css/vertical-text-overflow-ellipsis-text-align-right.html b/LayoutTests/fast/css/vertical-text-overflow-ellipsis-text-align-right.html
new file mode 100644 (file)
index 0000000..8138682
--- /dev/null
+++ b/LayoutTests/fast/css/vertical-text-overflow-ellipsis-text-align-right.html
@@ -0,0 +1,62 @@
+<META HTTP-EQUIV="CONTENT-TYPE" CONTENT="TEXT/HTML; CHARSET=utf8">
+<head>
+<style>
+.testDiv {
+    height: 308px;
+    border: 1px solid black;
+    white-space: nowrap;
+    overflow: hidden;
+    margin: 0 0 20px 0;
+    text-align: right;
+    text-overflow: ellipsis;
+    -webkit-writing-mode: vertical-rl;
+}
+
+.rtl {
+    direction: rtl;
+    unicode-bidi: bidi-override;
+}
+</style>
+</head>
+<body>
+
+<h3>Single line</h3>
+<div class="testDiv">Lorem ipsum dolor sit amet, consectetur adipiscing elit. Vivamus vitae eros non libero faucibus sagittis sed ut eros.</div>
+
+<h3>Multi line</h3>
+<div class="testDiv">
+       Lorem ipsum dolor sit amet, consectetur adipiscing elit. Vivamus vitae eros non libero faucibus sagittis sed ut eros.<br>
+       orem ipsum dolor sit amet, consectetur adipiscing elit. Vivamus vitae eros non libero faucibus sagittis sed ut eros.<br>
+    rem ipsum dolor sit amet, consectetur adipiscing elit. Vivamus vitae eros non libero faucibus sagittis sed ut eros.<br>
+       em ipsum dolor sit amet, consectetur adipiscing elit. Vivamus vitae eros non libero faucibus sagittis sed ut eros.<br>
+</div>
+
+<h3>Containing replaced content</h3>
+<div class="testDiv">Lorem ipsum dolor sit amet, <img src="resources/greenbox.png"> consectetur adipiscing elit. Vivamus vitae eros non libero faucibus sagittis sed ut eros.</div>
+
+
+<h3>Containing replaced content blocking the ellipsis</h3>
+<div class="testDiv">Lorem ipsum dolor sit amet, consectetur ad<img src="resources/greenbox.png">ipiscing elit. Vivamus vitae eros non libero faucibus sagittis sed ut eros.</div>
+
+
+<h3>Right-To-Left single line</h3>
+<div class="testDiv rtl">Lorem ipsum dolor sit amet, consectetur adipiscing elit. Vivamus vitae eros non libero faucibus sagittis sed ut eros.</div>
+
+
+<h3>Right-To-Left Multi line</h3>
+<div class="testDiv rtl">
+       Lorem ipsum dolor sit amet, consectetur adipiscing elit. Vivamus vitae eros non libero faucibus sagittis sed ut eros.<br>
+       orem ipsum dolor sit amet, consectetur adipiscing elit. Vivamus vitae eros non libero faucibus sagittis sed ut eros.<br>
+    rem ipsum dolor sit amet, consectetur adipiscing elit. Vivamus vitae eros non libero faucibus sagittis sed ut eros.<br>
+       em ipsum dolor sit amet, consectetur adipiscing elit. Vivamus vitae eros non libero faucibus sagittis sed ut eros.<br>
+</div>
+
+
+<h3>Right-To-Left containing replaced content</h3>
+<div class="testDiv rtl">Lorem ipsum dolor sit amet, <img src="resources/greenbox.png"> consectetur adipiscing elit. Vivamus vitae eros non libero faucibus sagittis sed ut eros.</div>
+
+<h3>Right-To-Left containing replaced content blocking the ellipsis</h3>
+<div class="testDiv rtl">Lorem ipsum dolor sit amet, consectetur ad<img src="resources/greenbox.png">ipiscing elit. Vivamus vitae eros non libero faucibus sagittis sed ut eros.</div>
+
+</body>
+</html>
\ No newline at end of file

diff --git a/LayoutTests/platform/chromium/TestExpectations b/LayoutTests/platform/chromium/TestExpectations
index 193636a..8c3f2b6 100644 (file)
--- a/LayoutTests/platform/chromium/TestExpectations
+++ b/LayoutTests/platform/chromium/TestExpectations
@@ -3670,6 +3670,16 @@ BUGWK87652 SKIP : http/tests/appcache/load-from-appcache-defer-resume-crash.html
 // A few pixels off from the baseline, added by r118567.
 BUGWK87653 : compositing/geometry/composited-in-columns.html = IMAGE+TEXT
 
+// Needs Rebaseline.
+BUGWK88705 : fast/css/text-overflow-ellipsis-text-align-center-expected.txt = TEXT
+BUGWK88705 : fast/css/text-overflow-ellipsis-text-align-justify-expected.txt = TEXT
+BUGWK88705 : fast/css/text-overflow-ellipsis-text-align-left-expected.txt = TEXT
+BUGWK88705 : fast/css/text-overflow-ellipsis-text-align-right-expected.txt = TEXT
+BUGWK88705 : fast/css/vertical-text-overflow-ellipsis-text-align-center.html = TEXT
+BUGWK88705 : fast/css/vertical-text-overflow-ellipsis-text-align-justify.html = TEXT
+BUGWK88705 : fast/css/vertical-text-overflow-ellipsis-text-align-left.html = TEXT
+BUGWK88705 : fast/css/vertical-text-overflow-ellipsis-text-align-right.html = TEXT
+
 // Fails with a mismatch in $("menulist").selectedIndex
 BUGWK87748 MAC : fast/forms/select/optgroup-clicking.html = TEXT
 

diff --git a/LayoutTests/platform/mac/fast/css/text-overflow-ellipsis-text-align-center-expected.txt b/LayoutTests/platform/mac/fast/css/text-overflow-ellipsis-text-align-center-expected.txt
new file mode 100644 (file)
index 0000000..29a0ea6
--- /dev/null
+++ b/LayoutTests/platform/mac/fast/css/text-overflow-ellipsis-text-align-center-expected.txt
@@ -0,0 +1,99 @@
+layer at (0,0) size 785x870
+  RenderView at (0,0) size 785x600
+layer at (0,0) size 785x870
+  RenderBlock {HTML} at (0,0) size 785x870
+    RenderBody {BODY} at (8,8) size 769x842
+      RenderBlock {P} at (0,0) size 769x18
+        RenderText {#text} at (0,0) size 551x18
+          text run at (0,0) width 551: "This test checks that text with text-overflow:ellipsis follows 'text-align: center' correctly."
+      RenderBlock {P} at (0,34) size 769x18
+        RenderText {#text} at (0,0) size 386x18
+          text run at (0,0) width 386: "The text in all boxes should have the text centered in the box."
+      RenderBlock {H3} at (0,70) size 769x22
+        RenderText {#text} at (0,0) size 84x22
+          text run at (0,0) width 84: "Single line"
+      RenderBlock {H3} at (0,150) size 769x22
+        RenderText {#text} at (0,0) size 79x22
+          text run at (0,0) width 79: "Multi line"
+      RenderBlock {H3} at (0,284) size 769x22
+        RenderText {#text} at (0,0) size 232x22
+          text run at (0,0) width 232: "Containing replaced content"
+      RenderBlock {H3} at (0,375) size 769x22
+        RenderText {#text} at (0,0) size 396x22
+          text run at (0,0) width 396: "Containing replaced content blocking the ellipsis"
+      RenderBlock {H3} at (0,466) size 769x22
+        RenderText {#text} at (0,0) size 199x22
+          text run at (0,0) width 199: "Right-To-Left single line"
+      RenderBlock {H3} at (0,546) size 769x22
+        RenderText {#text} at (0,0) size 198x22
+          text run at (0,0) width 198: "Right-To-Left Multi line"
+      RenderBlock {H3} at (0,680) size 769x22
+        RenderText {#text} at (0,0) size 345x22
+          text run at (0,0) width 345: "Right-To-Left containing replaced content"
+      RenderBlock {H3} at (0,771) size 769x22
+        RenderText {#text} at (0,0) size 509x22
+          text run at (0,0) width 509: "Right-To-Left containing replaced content blocking the ellipsis"
+layer at (8,118) size 310x20 clip at (9,119) size 308x18 scrollWidth 722
+  RenderBlock {DIV} at (0,110) size 310x20 [border: (1px solid #000000)]
+    RenderText {#text} at (4,1) size 719x18
+      text run at (4,1) width 719: "Lorem ipsum dolor sit amet, consectetur adipiscing elit. Vivamus vitae eros non libero faucibus sagittis sed ut eros."
+layer at (8,198) size 310x74 clip at (9,199) size 308x72 scrollWidth 722
+  RenderBlock {DIV} at (0,190) size 310x74 [border: (1px solid #000000)]
+    RenderText {#text} at (4,1) size 719x18
+      text run at (4,1) width 719: "Lorem ipsum dolor sit amet, consectetur adipiscing elit. Vivamus vitae eros non libero faucibus sagittis sed ut eros."
+    RenderBR {BR} at (0,0) size 0x0
+    RenderText {#text} at (2,19) size 710x18
+      text run at (2,19) width 710: "orem ipsum dolor sit amet, consectetur adipiscing elit. Vivamus vitae eros non libero faucibus sagittis sed ut eros."
+    RenderBR {BR} at (0,0) size 0x0
+    RenderText {#text} at (4,37) size 702x18
+      text run at (4,37) width 702: "rem ipsum dolor sit amet, consectetur adipiscing elit. Vivamus vitae eros non libero faucibus sagittis sed ut eros."
+    RenderBR {BR} at (0,0) size 0x0
+    RenderText {#text} at (3,55) size 696x18
+      text run at (3,55) width 696: "em ipsum dolor sit amet, consectetur adipiscing elit. Vivamus vitae eros non libero faucibus sagittis sed ut eros."
+    RenderBR {BR} at (0,0) size 0x0
+layer at (8,332) size 310x31 clip at (9,333) size 308x29 scrollWidth 752
+  RenderBlock {DIV} at (0,324) size 310x31 [border: (1px solid #000000)]
+    RenderText {#text} at (5,12) size 181x18
+      text run at (5,12) width 181: "Lorem ipsum dolor sit amet, "
+    RenderImage {IMG} at (186,1) size 25x25
+    RenderText {#text} at (211,12) size 542x18
+      text run at (211,12) width 542: " consectetur adipiscing elit. Vivamus vitae eros non libero faucibus sagittis sed ut eros."
+layer at (8,423) size 310x31 clip at (9,424) size 308x29 scrollWidth 744
+  RenderBlock {DIV} at (0,415) size 310x31 [border: (1px solid #000000)]
+    RenderText {#text} at (1,12) size 271x18
+      text run at (1,12) width 271: "Lorem ipsum dolor sit amet, consectetur ad"
+    RenderImage {IMG} at (272,1) size 25x25
+    RenderText {#text} at (297,12) size 448x18
+      text run at (297,12) width 448: "ipiscing elit. Vivamus vitae eros non libero faucibus sagittis sed ut eros."
+layer at (8,514) size 310x20 clip at (9,515) size 308x18 scrollX 414 scrollWidth 722
+  RenderBlock {DIV} at (0,506) size 310x20 [border: (1px solid #000000)]
+    RenderText {#text} at (-413,1) size 719x18
+      text run at (-413,1) width 719 RTL override: "Lorem ipsum dolor sit amet, consectetur adipiscing elit. Vivamus vitae eros non libero faucibus sagittis sed ut eros."
+layer at (8,594) size 310x74 clip at (9,595) size 308x72 scrollX 414 scrollWidth 722
+  RenderBlock {DIV} at (0,586) size 310x74 [border: (1px solid #000000)]
+    RenderText {#text} at (-413,1) size 719x18
+      text run at (-413,1) width 719 RTL override: "Lorem ipsum dolor sit amet, consectetur adipiscing elit. Vivamus vitae eros non libero faucibus sagittis sed ut eros."
+    RenderBR {BR} at (0,0) size 0x0
+    RenderText {#text} at (-401,19) size 710x18
+      text run at (-401,19) width 709 RTL override: "orem ipsum dolor sit amet, consectetur adipiscing elit. Vivamus vitae eros non libero faucibus sagittis sed ut eros."
+    RenderBR {BR} at (0,0) size 0x0
+    RenderText {#text} at (-395,37) size 702x18
+      text run at (-395,37) width 701 RTL override: "rem ipsum dolor sit amet, consectetur adipiscing elit. Vivamus vitae eros non libero faucibus sagittis sed ut eros."
+    RenderBR {BR} at (0,0) size 0x0
+    RenderText {#text} at (-389,55) size 696x18
+      text run at (-389,55) width 696 RTL override: "em ipsum dolor sit amet, consectetur adipiscing elit. Vivamus vitae eros non libero faucibus sagittis sed ut eros."
+    RenderBR {BR} at (0,0) size 0x0
+layer at (8,728) size 310x31 clip at (9,729) size 308x29 scrollX 444 scrollWidth 752
+  RenderBlock {DIV} at (0,720) size 310x31 [border: (1px solid #000000)]
+    RenderText {#text} at (124,12) size 181x18
+      text run at (124,12) width 181 RTL override: "Lorem ipsum dolor sit amet, "
+    RenderImage {IMG} at (99,1) size 25x25
+    RenderText {#text} at (-443,12) size 542x18
+      text run at (-443,12) width 542 RTL override: " consectetur adipiscing elit. Vivamus vitae eros non libero faucibus sagittis sed ut eros."
+layer at (8,819) size 310x31 clip at (9,820) size 308x29 scrollX 436 scrollWidth 744
+  RenderBlock {DIV} at (0,811) size 310x31 [border: (1px solid #000000)]
+    RenderText {#text} at (38,12) size 271x18
+      text run at (38,12) width 271 RTL override: "Lorem ipsum dolor sit amet, consectetur ad"
+    RenderImage {IMG} at (13,1) size 25x25
+    RenderText {#text} at (-435,12) size 448x18
+      text run at (-435,12) width 448 RTL override: "ipiscing elit. Vivamus vitae eros non libero faucibus sagittis sed ut eros."

diff --git a/LayoutTests/platform/mac/fast/css/text-overflow-ellipsis-text-align-justify-expected.txt b/LayoutTests/platform/mac/fast/css/text-overflow-ellipsis-text-align-justify-expected.txt
new file mode 100644 (file)
index 0000000..391f39a
--- /dev/null
+++ b/LayoutTests/platform/mac/fast/css/text-overflow-ellipsis-text-align-justify-expected.txt
@@ -0,0 +1,100 @@
+layer at (0,0) size 785x888
+  RenderView at (0,0) size 785x600
+layer at (0,0) size 785x888
+  RenderBlock {HTML} at (0,0) size 785x888
+    RenderBody {BODY} at (8,8) size 769x860
+      RenderBlock {P} at (0,0) size 769x18
+        RenderText {#text} at (0,0) size 552x18
+          text run at (0,0) width 552: "This test checks that text with text-overflow:ellipsis follows 'text-align: justify' correctly."
+      RenderBlock {P} at (0,34) size 769x36
+        RenderText {#text} at (0,0) size 743x36
+          text run at (0,0) width 743: "LTR text should be aligned with the left hand side of their box. RTL text should be aligned with the right hand side of"
+          text run at (0,18) width 60: "their box."
+      RenderBlock {H3} at (0,88) size 769x22
+        RenderText {#text} at (0,0) size 84x22
+          text run at (0,0) width 84: "Single line"
+      RenderBlock {H3} at (0,168) size 769x22
+        RenderText {#text} at (0,0) size 79x22
+          text run at (0,0) width 79: "Multi line"
+      RenderBlock {H3} at (0,302) size 769x22
+        RenderText {#text} at (0,0) size 232x22
+          text run at (0,0) width 232: "Containing replaced content"
+      RenderBlock {H3} at (0,393) size 769x22
+        RenderText {#text} at (0,0) size 396x22
+          text run at (0,0) width 396: "Containing replaced content blocking the ellipsis"
+      RenderBlock {H3} at (0,484) size 769x22
+        RenderText {#text} at (0,0) size 199x22
+          text run at (0,0) width 199: "Right-To-Left single line"
+      RenderBlock {H3} at (0,564) size 769x22
+        RenderText {#text} at (0,0) size 198x22
+          text run at (0,0) width 198: "Right-To-Left Multi line"
+      RenderBlock {H3} at (0,698) size 769x22
+        RenderText {#text} at (0,0) size 345x22
+          text run at (0,0) width 345: "Right-To-Left containing replaced content"
+      RenderBlock {H3} at (0,789) size 769x22
+        RenderText {#text} at (0,0) size 509x22
+          text run at (0,0) width 509: "Right-To-Left containing replaced content blocking the ellipsis"
+layer at (8,136) size 310x20 clip at (9,137) size 308x18 scrollWidth 719
+  RenderBlock {DIV} at (0,128) size 310x20 [border: (1px solid #000000)]
+    RenderText {#text} at (1,1) size 719x18
+      text run at (1,1) width 719: "Lorem ipsum dolor sit amet, consectetur adipiscing elit. Vivamus vitae eros non libero faucibus sagittis sed ut eros."
+layer at (8,216) size 310x74 clip at (9,217) size 308x72 scrollWidth 719
+  RenderBlock {DIV} at (0,208) size 310x74 [border: (1px solid #000000)]
+    RenderText {#text} at (1,1) size 719x18
+      text run at (1,1) width 719: "Lorem ipsum dolor sit amet, consectetur adipiscing elit. Vivamus vitae eros non libero faucibus sagittis sed ut eros."
+    RenderBR {BR} at (0,0) size 0x0
+    RenderText {#text} at (1,19) size 709x18
+      text run at (1,19) width 709: "orem ipsum dolor sit amet, consectetur adipiscing elit. Vivamus vitae eros non libero faucibus sagittis sed ut eros."
+    RenderBR {BR} at (0,0) size 0x0
+    RenderText {#text} at (1,37) size 701x18
+      text run at (1,37) width 701: "rem ipsum dolor sit amet, consectetur adipiscing elit. Vivamus vitae eros non libero faucibus sagittis sed ut eros."
+    RenderBR {BR} at (0,0) size 0x0
+    RenderText {#text} at (1,55) size 696x18
+      text run at (1,55) width 696: "em ipsum dolor sit amet, consectetur adipiscing elit. Vivamus vitae eros non libero faucibus sagittis sed ut eros."
+    RenderBR {BR} at (0,0) size 0x0
+layer at (8,350) size 310x31 clip at (9,351) size 308x29 scrollWidth 748
+  RenderBlock {DIV} at (0,342) size 310x31 [border: (1px solid #000000)]
+    RenderText {#text} at (1,12) size 181x18
+      text run at (1,12) width 181: "Lorem ipsum dolor sit amet, "
+    RenderImage {IMG} at (182,1) size 25x25
+    RenderText {#text} at (207,12) size 542x18
+      text run at (207,12) width 542: " consectetur adipiscing elit. Vivamus vitae eros non libero faucibus sagittis sed ut eros."
+layer at (8,441) size 310x31 clip at (9,442) size 308x29 scrollWidth 744
+  RenderBlock {DIV} at (0,433) size 310x31 [border: (1px solid #000000)]
+    RenderText {#text} at (1,12) size 271x18
+      text run at (1,12) width 271: "Lorem ipsum dolor sit amet, consectetur ad"
+    RenderImage {IMG} at (272,1) size 25x25
+    RenderText {#text} at (297,12) size 448x18
+      text run at (297,12) width 448: "ipiscing elit. Vivamus vitae eros non libero faucibus sagittis sed ut eros."
+layer at (8,532) size 310x20 clip at (9,533) size 308x18 scrollX 411 scrollWidth 719
+  RenderBlock {DIV} at (0,524) size 310x20 [border: (1px solid #000000)]
+    RenderText {#text} at (-410,1) size 719x18
+      text run at (-410,1) width 719 RTL override: "Lorem ipsum dolor sit amet, consectetur adipiscing elit. Vivamus vitae eros non libero faucibus sagittis sed ut eros."
+layer at (8,612) size 310x74 clip at (9,613) size 308x72
+  RenderBlock {DIV} at (0,604) size 310x74 [border: (1px solid #000000)]
+    RenderText {#text} at (1,1) size 719x18
+      text run at (1,1) width 719 RTL override: "Lorem ipsum dolor sit amet, consectetur adipiscing elit. Vivamus vitae eros non libero faucibus sagittis sed ut eros."
+    RenderBR {BR} at (0,0) size 0x0
+    RenderText {#text} at (1,19) size 709x18
+      text run at (1,19) width 709 RTL override: "orem ipsum dolor sit amet, consectetur adipiscing elit. Vivamus vitae eros non libero faucibus sagittis sed ut eros."
+    RenderBR {BR} at (0,0) size 0x0
+    RenderText {#text} at (1,37) size 701x18
+      text run at (1,37) width 701 RTL override: "rem ipsum dolor sit amet, consectetur adipiscing elit. Vivamus vitae eros non libero faucibus sagittis sed ut eros."
+    RenderBR {BR} at (0,0) size 0x0
+    RenderText {#text} at (1,55) size 696x18
+      text run at (1,55) width 696 RTL override: "em ipsum dolor sit amet, consectetur adipiscing elit. Vivamus vitae eros non libero faucibus sagittis sed ut eros."
+    RenderBR {BR} at (0,0) size 0x0
+layer at (8,746) size 310x31 clip at (9,747) size 308x29 scrollX 440 scrollWidth 748
+  RenderBlock {DIV} at (0,738) size 310x31 [border: (1px solid #000000)]
+    RenderText {#text} at (128,12) size 181x18
+      text run at (128,12) width 181 RTL override: "Lorem ipsum dolor sit amet, "
+    RenderImage {IMG} at (103,1) size 25x25
+    RenderText {#text} at (-439,12) size 542x18
+      text run at (-439,12) width 542 RTL override: " consectetur adipiscing elit. Vivamus vitae eros non libero faucibus sagittis sed ut eros."
+layer at (8,837) size 310x31 clip at (9,838) size 308x29 scrollX 436 scrollWidth 744
+  RenderBlock {DIV} at (0,829) size 310x31 [border: (1px solid #000000)]
+    RenderText {#text} at (38,12) size 271x18
+      text run at (38,12) width 271 RTL override: "Lorem ipsum dolor sit amet, consectetur ad"
+    RenderImage {IMG} at (13,1) size 25x25
+    RenderText {#text} at (-435,12) size 448x18
+      text run at (-435,12) width 448 RTL override: "ipiscing elit. Vivamus vitae eros non libero faucibus sagittis sed ut eros."

diff --git a/LayoutTests/platform/mac/fast/css/text-overflow-ellipsis-text-align-left-expected.txt b/LayoutTests/platform/mac/fast/css/text-overflow-ellipsis-text-align-left-expected.txt
new file mode 100644 (file)
index 0000000..3df7394
--- /dev/null
+++ b/LayoutTests/platform/mac/fast/css/text-overflow-ellipsis-text-align-left-expected.txt
@@ -0,0 +1,99 @@
+layer at (0,0) size 785x870
+  RenderView at (0,0) size 785x600
+layer at (0,0) size 785x870
+  RenderBlock {HTML} at (0,0) size 785x870
+    RenderBody {BODY} at (8,8) size 769x842
+      RenderBlock {P} at (0,0) size 769x18
+        RenderText {#text} at (0,0) size 533x18
+          text run at (0,0) width 533: "This test checks that text with text-overflow:ellipsis follows 'text-align: left' correctly."
+      RenderBlock {P} at (0,34) size 769x18
+        RenderText {#text} at (0,0) size 484x18
+          text run at (0,0) width 484: "The text in all boxes should be left aligned, sticking to the left side of the box"
+      RenderBlock {H3} at (0,70) size 769x22
+        RenderText {#text} at (0,0) size 84x22
+          text run at (0,0) width 84: "Single line"
+      RenderBlock {H3} at (0,150) size 769x22
+        RenderText {#text} at (0,0) size 79x22
+          text run at (0,0) width 79: "Multi line"
+      RenderBlock {H3} at (0,284) size 769x22
+        RenderText {#text} at (0,0) size 232x22
+          text run at (0,0) width 232: "Containing replaced content"
+      RenderBlock {H3} at (0,375) size 769x22
+        RenderText {#text} at (0,0) size 396x22
+          text run at (0,0) width 396: "Containing replaced content blocking the ellipsis"
+      RenderBlock {H3} at (0,466) size 769x22
+        RenderText {#text} at (0,0) size 199x22
+          text run at (0,0) width 199: "Right-To-Left single line"
+      RenderBlock {H3} at (0,546) size 769x22
+        RenderText {#text} at (0,0) size 198x22
+          text run at (0,0) width 198: "Right-To-Left Multi line"
+      RenderBlock {H3} at (0,680) size 769x22
+        RenderText {#text} at (0,0) size 345x22
+          text run at (0,0) width 345: "Right-To-Left containing replaced content"
+      RenderBlock {H3} at (0,771) size 769x22
+        RenderText {#text} at (0,0) size 509x22
+          text run at (0,0) width 509: "Right-To-Left containing replaced content blocking the ellipsis"
+layer at (8,118) size 310x20 clip at (9,119) size 308x18 scrollWidth 719
+  RenderBlock {DIV} at (0,110) size 310x20 [border: (1px solid #000000)]
+    RenderText {#text} at (1,1) size 719x18
+      text run at (1,1) width 719: "Lorem ipsum dolor sit amet, consectetur adipiscing elit. Vivamus vitae eros non libero faucibus sagittis sed ut eros."
+layer at (8,198) size 310x74 clip at (9,199) size 308x72 scrollWidth 719
+  RenderBlock {DIV} at (0,190) size 310x74 [border: (1px solid #000000)]
+    RenderText {#text} at (1,1) size 719x18
+      text run at (1,1) width 719: "Lorem ipsum dolor sit amet, consectetur adipiscing elit. Vivamus vitae eros non libero faucibus sagittis sed ut eros."
+    RenderBR {BR} at (0,0) size 0x0
+    RenderText {#text} at (1,19) size 709x18
+      text run at (1,19) width 709: "orem ipsum dolor sit amet, consectetur adipiscing elit. Vivamus vitae eros non libero faucibus sagittis sed ut eros."
+    RenderBR {BR} at (0,0) size 0x0
+    RenderText {#text} at (1,37) size 701x18
+      text run at (1,37) width 701: "rem ipsum dolor sit amet, consectetur adipiscing elit. Vivamus vitae eros non libero faucibus sagittis sed ut eros."
+    RenderBR {BR} at (0,0) size 0x0
+    RenderText {#text} at (1,55) size 696x18
+      text run at (1,55) width 696: "em ipsum dolor sit amet, consectetur adipiscing elit. Vivamus vitae eros non libero faucibus sagittis sed ut eros."
+    RenderBR {BR} at (0,0) size 0x0
+layer at (8,332) size 310x31 clip at (9,333) size 308x29 scrollWidth 748
+  RenderBlock {DIV} at (0,324) size 310x31 [border: (1px solid #000000)]
+    RenderText {#text} at (1,12) size 181x18
+      text run at (1,12) width 181: "Lorem ipsum dolor sit amet, "
+    RenderImage {IMG} at (182,1) size 25x25
+    RenderText {#text} at (207,12) size 542x18
+      text run at (207,12) width 542: " consectetur adipiscing elit. Vivamus vitae eros non libero faucibus sagittis sed ut eros."
+layer at (8,423) size 310x31 clip at (9,424) size 308x29 scrollWidth 744
+  RenderBlock {DIV} at (0,415) size 310x31 [border: (1px solid #000000)]
+    RenderText {#text} at (1,12) size 271x18
+      text run at (1,12) width 271: "Lorem ipsum dolor sit amet, consectetur ad"
+    RenderImage {IMG} at (272,1) size 25x25
+    RenderText {#text} at (297,12) size 448x18
+      text run at (297,12) width 448: "ipiscing elit. Vivamus vitae eros non libero faucibus sagittis sed ut eros."
+layer at (8,514) size 310x20 clip at (9,515) size 308x18 scrollX 417 scrollWidth 725
+  RenderBlock {DIV} at (0,506) size 310x20 [border: (1px solid #000000)]
+    RenderText {#text} at (-416,1) size 719x18
+      text run at (-416,1) width 719 RTL override: "Lorem ipsum dolor sit amet, consectetur adipiscing elit. Vivamus vitae eros non libero faucibus sagittis sed ut eros."
+layer at (8,594) size 310x74 clip at (9,595) size 308x72 scrollX 417 scrollWidth 725
+  RenderBlock {DIV} at (0,586) size 310x74 [border: (1px solid #000000)]
+    RenderText {#text} at (-416,1) size 719x18
+      text run at (-416,1) width 719 RTL override: "Lorem ipsum dolor sit amet, consectetur adipiscing elit. Vivamus vitae eros non libero faucibus sagittis sed ut eros."
+    RenderBR {BR} at (0,0) size 0x0
+    RenderText {#text} at (-403,19) size 709x18
+      text run at (-403,19) width 709 RTL override: "orem ipsum dolor sit amet, consectetur adipiscing elit. Vivamus vitae eros non libero faucibus sagittis sed ut eros."
+    RenderBR {BR} at (0,0) size 0x0
+    RenderText {#text} at (-399,37) size 701x18
+      text run at (-399,37) width 701 RTL override: "rem ipsum dolor sit amet, consectetur adipiscing elit. Vivamus vitae eros non libero faucibus sagittis sed ut eros."
+    RenderBR {BR} at (0,0) size 0x0
+    RenderText {#text} at (-391,55) size 696x18
+      text run at (-391,55) width 696 RTL override: "em ipsum dolor sit amet, consectetur adipiscing elit. Vivamus vitae eros non libero faucibus sagittis sed ut eros."
+    RenderBR {BR} at (0,0) size 0x0
+layer at (8,728) size 310x31 clip at (9,729) size 308x29 scrollX 448 scrollWidth 756
+  RenderBlock {DIV} at (0,720) size 310x31 [border: (1px solid #000000)]
+    RenderText {#text} at (120,12) size 181x18
+      text run at (120,12) width 181 RTL override: "Lorem ipsum dolor sit amet, "
+    RenderImage {IMG} at (95,1) size 25x25
+    RenderText {#text} at (-447,12) size 542x18
+      text run at (-447,12) width 542 RTL override: " consectetur adipiscing elit. Vivamus vitae eros non libero faucibus sagittis sed ut eros."
+layer at (8,819) size 310x31 clip at (9,820) size 308x29 scrollX 436 scrollWidth 744
+  RenderBlock {DIV} at (0,811) size 310x31 [border: (1px solid #000000)]
+    RenderText {#text} at (38,12) size 271x18
+      text run at (38,12) width 271 RTL override: "Lorem ipsum dolor sit amet, consectetur ad"
+    RenderImage {IMG} at (13,1) size 25x25
+    RenderText {#text} at (-435,12) size 448x18
+      text run at (-435,12) width 448 RTL override: "ipiscing elit. Vivamus vitae eros non libero faucibus sagittis sed ut eros."

diff --git a/LayoutTests/platform/mac/fast/css/text-overflow-ellipsis-text-align-right-expected.txt b/LayoutTests/platform/mac/fast/css/text-overflow-ellipsis-text-align-right-expected.txt
new file mode 100644 (file)
index 0000000..f487ea6
--- /dev/null
+++ b/LayoutTests/platform/mac/fast/css/text-overflow-ellipsis-text-align-right-expected.txt
@@ -0,0 +1,99 @@
+layer at (0,0) size 785x870
+  RenderView at (0,0) size 785x600
+layer at (0,0) size 785x870
+  RenderBlock {HTML} at (0,0) size 785x870
+    RenderBody {BODY} at (8,8) size 769x842
+      RenderBlock {P} at (0,0) size 769x18
+        RenderText {#text} at (0,0) size 542x18
+          text run at (0,0) width 542: "This test checks that text with text-overflow:ellipsis follows 'text-align: right' correctly."
+      RenderBlock {P} at (0,34) size 769x18
+        RenderText {#text} at (0,0) size 502x18
+          text run at (0,0) width 502: "The text in all boxes should be right aligned, sticking to the right side of the box"
+      RenderBlock {H3} at (0,70) size 769x22
+        RenderText {#text} at (0,0) size 84x22
+          text run at (0,0) width 84: "Single line"
+      RenderBlock {H3} at (0,150) size 769x22
+        RenderText {#text} at (0,0) size 79x22
+          text run at (0,0) width 79: "Multi line"
+      RenderBlock {H3} at (0,284) size 769x22
+        RenderText {#text} at (0,0) size 232x22
+          text run at (0,0) width 232: "Containing replaced content"
+      RenderBlock {H3} at (0,375) size 769x22
+        RenderText {#text} at (0,0) size 396x22
+          text run at (0,0) width 396: "Containing replaced content blocking the ellipsis"
+      RenderBlock {H3} at (0,466) size 769x22
+        RenderText {#text} at (0,0) size 199x22
+          text run at (0,0) width 199: "Right-To-Left single line"
+      RenderBlock {H3} at (0,546) size 769x22
+        RenderText {#text} at (0,0) size 198x22
+          text run at (0,0) width 198: "Right-To-Left Multi line"
+      RenderBlock {H3} at (0,680) size 769x22
+        RenderText {#text} at (0,0) size 345x22
+          text run at (0,0) width 345: "Right-To-Left containing replaced content"
+      RenderBlock {H3} at (0,771) size 769x22
+        RenderText {#text} at (0,0) size 509x22
+          text run at (0,0) width 509: "Right-To-Left containing replaced content blocking the ellipsis"
+layer at (8,118) size 310x20 clip at (9,119) size 308x18 scrollWidth 725
+  RenderBlock {DIV} at (0,110) size 310x20 [border: (1px solid #000000)]
+    RenderText {#text} at (7,1) size 719x18
+      text run at (7,1) width 719: "Lorem ipsum dolor sit amet, consectetur adipiscing elit. Vivamus vitae eros non libero faucibus sagittis sed ut eros."
+layer at (8,198) size 310x74 clip at (9,199) size 308x72 scrollWidth 725
+  RenderBlock {DIV} at (0,190) size 310x74 [border: (1px solid #000000)]
+    RenderText {#text} at (7,1) size 719x18
+      text run at (7,1) width 719: "Lorem ipsum dolor sit amet, consectetur adipiscing elit. Vivamus vitae eros non libero faucibus sagittis sed ut eros."
+    RenderBR {BR} at (0,0) size 0x0
+    RenderText {#text} at (4,19) size 709x18
+      text run at (4,19) width 709: "orem ipsum dolor sit amet, consectetur adipiscing elit. Vivamus vitae eros non libero faucibus sagittis sed ut eros."
+    RenderBR {BR} at (0,0) size 0x0
+    RenderText {#text} at (8,37) size 701x18
+      text run at (8,37) width 701: "rem ipsum dolor sit amet, consectetur adipiscing elit. Vivamus vitae eros non libero faucibus sagittis sed ut eros."
+    RenderBR {BR} at (0,0) size 0x0
+    RenderText {#text} at (5,55) size 696x18
+      text run at (5,55) width 696: "em ipsum dolor sit amet, consectetur adipiscing elit. Vivamus vitae eros non libero faucibus sagittis sed ut eros."
+    RenderBR {BR} at (0,0) size 0x0
+layer at (8,332) size 310x31 clip at (9,333) size 308x29 scrollWidth 756
+  RenderBlock {DIV} at (0,324) size 310x31 [border: (1px solid #000000)]
+    RenderText {#text} at (9,12) size 181x18
+      text run at (9,12) width 181: "Lorem ipsum dolor sit amet, "
+    RenderImage {IMG} at (190,1) size 25x25
+    RenderText {#text} at (215,12) size 542x18
+      text run at (215,12) width 542: " consectetur adipiscing elit. Vivamus vitae eros non libero faucibus sagittis sed ut eros."
+layer at (8,423) size 310x31 clip at (9,424) size 308x29 scrollWidth 744
+  RenderBlock {DIV} at (0,415) size 310x31 [border: (1px solid #000000)]
+    RenderText {#text} at (1,12) size 271x18
+      text run at (1,12) width 271: "Lorem ipsum dolor sit amet, consectetur ad"
+    RenderImage {IMG} at (272,1) size 25x25
+    RenderText {#text} at (297,12) size 448x18
+      text run at (297,12) width 448: "ipiscing elit. Vivamus vitae eros non libero faucibus sagittis sed ut eros."
+layer at (8,514) size 310x20 clip at (9,515) size 308x18 scrollX 411 scrollWidth 719
+  RenderBlock {DIV} at (0,506) size 310x20 [border: (1px solid #000000)]
+    RenderText {#text} at (-410,1) size 719x18
+      text run at (-410,1) width 719 RTL override: "Lorem ipsum dolor sit amet, consectetur adipiscing elit. Vivamus vitae eros non libero faucibus sagittis sed ut eros."
+layer at (8,594) size 310x74 clip at (9,595) size 308x72 scrollX 411 scrollWidth 719
+  RenderBlock {DIV} at (0,586) size 310x74 [border: (1px solid #000000)]
+    RenderText {#text} at (-410,1) size 719x18
+      text run at (-410,1) width 719 RTL override: "Lorem ipsum dolor sit amet, consectetur adipiscing elit. Vivamus vitae eros non libero faucibus sagittis sed ut eros."
+    RenderBR {BR} at (0,0) size 0x0
+    RenderText {#text} at (-400,19) size 709x18
+      text run at (-400,19) width 709 RTL override: "orem ipsum dolor sit amet, consectetur adipiscing elit. Vivamus vitae eros non libero faucibus sagittis sed ut eros."
+    RenderBR {BR} at (0,0) size 0x0
+    RenderText {#text} at (-392,37) size 701x18
+      text run at (-392,37) width 701 RTL override: "rem ipsum dolor sit amet, consectetur adipiscing elit. Vivamus vitae eros non libero faucibus sagittis sed ut eros."
+    RenderBR {BR} at (0,0) size 0x0
+    RenderText {#text} at (-387,55) size 696x18
+      text run at (-387,55) width 696 RTL override: "em ipsum dolor sit amet, consectetur adipiscing elit. Vivamus vitae eros non libero faucibus sagittis sed ut eros."
+    RenderBR {BR} at (0,0) size 0x0
+layer at (8,728) size 310x31 clip at (9,729) size 308x29 scrollX 440 scrollWidth 748
+  RenderBlock {DIV} at (0,720) size 310x31 [border: (1px solid #000000)]
+    RenderText {#text} at (128,12) size 181x18
+      text run at (128,12) width 181 RTL override: "Lorem ipsum dolor sit amet, "
+    RenderImage {IMG} at (103,1) size 25x25
+    RenderText {#text} at (-439,12) size 542x18
+      text run at (-439,12) width 542 RTL override: " consectetur adipiscing elit. Vivamus vitae eros non libero faucibus sagittis sed ut eros."
+layer at (8,819) size 310x31 clip at (9,820) size 308x29 scrollX 436 scrollWidth 744
+  RenderBlock {DIV} at (0,811) size 310x31 [border: (1px solid #000000)]
+    RenderText {#text} at (38,12) size 271x18
+      text run at (38,12) width 271 RTL override: "Lorem ipsum dolor sit amet, consectetur ad"
+    RenderImage {IMG} at (13,1) size 25x25
+    RenderText {#text} at (-435,12) size 448x18
+      text run at (-435,12) width 448 RTL override: "ipiscing elit. Vivamus vitae eros non libero faucibus sagittis sed ut eros."

diff --git a/LayoutTests/platform/mac/fast/css/vertical-text-overflow-ellipsis-text-align-center-expected.txt b/LayoutTests/platform/mac/fast/css/vertical-text-overflow-ellipsis-text-align-center-expected.txt
new file mode 100644 (file)
index 0000000..649d0fc
--- /dev/null
+++ b/LayoutTests/platform/mac/fast/css/vertical-text-overflow-ellipsis-text-align-center-expected.txt
@@ -0,0 +1,93 @@
+layer at (0,0) size 785x2968
+  RenderView at (0,0) size 785x600
+layer at (0,0) size 785x2968
+  RenderBlock {HTML} at (0,0) size 785x2968
+    RenderBody {BODY} at (8,8) size 769x2940
+      RenderBlock {H3} at (0,0) size 769x22
+        RenderText {#text} at (0,0) size 84x22
+          text run at (0,0) width 84: "Single line"
+      RenderBlock {H3} at (0,370) size 769x22
+        RenderText {#text} at (0,0) size 79x22
+          text run at (0,0) width 79: "Multi line"
+      RenderBlock {H3} at (0,740) size 769x22
+        RenderText {#text} at (0,0) size 232x22
+          text run at (0,0) width 232: "Containing replaced content"
+      RenderBlock {H3} at (0,1110) size 769x22
+        RenderText {#text} at (0,0) size 396x22
+          text run at (0,0) width 396: "Containing replaced content blocking the ellipsis"
+      RenderBlock {H3} at (0,1480) size 769x22
+        RenderText {#text} at (0,0) size 199x22
+          text run at (0,0) width 199: "Right-To-Left single line"
+      RenderBlock {H3} at (0,1850) size 769x22
+        RenderText {#text} at (0,0) size 198x22
+          text run at (0,0) width 198: "Right-To-Left Multi line"
+      RenderBlock {H3} at (0,2220) size 769x22
+        RenderText {#text} at (0,0) size 345x22
+          text run at (0,0) width 345: "Right-To-Left containing replaced content"
+      RenderBlock {H3} at (0,2590) size 769x22
+        RenderText {#text} at (0,0) size 509x22
+          text run at (0,0) width 509: "Right-To-Left containing replaced content blocking the ellipsis"
+layer at (8,48) size 20x310 clip at (9,49) size 18x308 scrollHeight 720
+  RenderBlock {DIV} at (0,40) size 20x310 [border: (1px solid #000000)]
+    RenderText {#text} at (1,1) size 18x720
+      text run at (1,1) width 719: "Lorem ipsum dolor sit amet, consectetur adipiscing elit. Vivamus vitae eros non libero faucibus sagittis sed ut eros."
+layer at (8,418) size 74x310 clip at (9,419) size 72x308 scrollHeight 720
+  RenderBlock {DIV} at (0,410) size 74x310 [border: (1px solid #000000)]
+    RenderText {#text} at (1,1) size 18x720
+      text run at (1,1) width 719: "Lorem ipsum dolor sit amet, consectetur adipiscing elit. Vivamus vitae eros non libero faucibus sagittis sed ut eros."
+    RenderBR {BR} at (0,0) size 0x0
+    RenderText {#text} at (19,1) size 18x710
+      text run at (19,1) width 709: "orem ipsum dolor sit amet, consectetur adipiscing elit. Vivamus vitae eros non libero faucibus sagittis sed ut eros."
+    RenderBR {BR} at (0,0) size 0x0
+    RenderText {#text} at (37,1) size 18x702
+      text run at (37,1) width 701: "rem ipsum dolor sit amet, consectetur adipiscing elit. Vivamus vitae eros non libero faucibus sagittis sed ut eros."
+    RenderBR {BR} at (0,0) size 0x0
+    RenderText {#text} at (55,1) size 18x697
+      text run at (55,1) width 696: "em ipsum dolor sit amet, consectetur adipiscing elit. Vivamus vitae eros non libero faucibus sagittis sed ut eros."
+    RenderBR {BR} at (0,0) size 0x0
+layer at (8,788) size 31x310 clip at (9,789) size 29x308 scrollHeight 749
+  RenderBlock {DIV} at (0,780) size 31x310 [border: (1px solid #000000)]
+    RenderText {#text} at (12,1) size 18x182
+      text run at (12,1) width 181: "Lorem ipsum dolor sit amet, "
+    RenderImage {IMG} at (1,182) size 25x25
+    RenderText {#text} at (12,207) size 18x543
+      text run at (12,207) width 542: " consectetur adipiscing elit. Vivamus vitae eros non libero faucibus sagittis sed ut eros."
+layer at (8,1158) size 31x310 clip at (9,1159) size 29x308 scrollHeight 745
+  RenderBlock {DIV} at (0,1150) size 31x310 [border: (1px solid #000000)]
+    RenderText {#text} at (12,1) size 18x272
+      text run at (12,1) width 271: "Lorem ipsum dolor sit amet, consectetur ad"
+    RenderImage {IMG} at (1,272) size 25x25
+    RenderText {#text} at (12,297) size 18x449
+      text run at (12,297) width 448: "ipiscing elit. Vivamus vitae eros non libero faucibus sagittis sed ut eros."
+layer at (8,1528) size 20x310 clip at (9,1529) size 18x308 scrollY 411 scrollHeight 719
+  RenderBlock {DIV} at (0,1520) size 20x310 [border: (1px solid #000000)]
+    RenderText {#text} at (1,-410) size 18x719
+      text run at (1,-410) width 719 RTL override: "Lorem ipsum dolor sit amet, consectetur adipiscing elit. Vivamus vitae eros non libero faucibus sagittis sed ut eros."
+layer at (8,1898) size 74x310 clip at (9,1899) size 72x308 scrollY 411 scrollHeight 719
+  RenderBlock {DIV} at (0,1890) size 74x310 [border: (1px solid #000000)]
+    RenderText {#text} at (1,-410) size 18x719
+      text run at (1,-410) width 719 RTL override: "Lorem ipsum dolor sit amet, consectetur adipiscing elit. Vivamus vitae eros non libero faucibus sagittis sed ut eros."
+    RenderBR {BR} at (0,0) size 0x0
+    RenderText {#text} at (19,-400) size 18x709
+      text run at (19,-400) width 709 RTL override: "orem ipsum dolor sit amet, consectetur adipiscing elit. Vivamus vitae eros non libero faucibus sagittis sed ut eros."
+    RenderBR {BR} at (0,0) size 0x0
+    RenderText {#text} at (37,-392) size 18x701
+      text run at (37,-392) width 701 RTL override: "rem ipsum dolor sit amet, consectetur adipiscing elit. Vivamus vitae eros non libero faucibus sagittis sed ut eros."
+    RenderBR {BR} at (0,0) size 0x0
+    RenderText {#text} at (55,-387) size 18x696
+      text run at (55,-387) width 696 RTL override: "em ipsum dolor sit amet, consectetur adipiscing elit. Vivamus vitae eros non libero faucibus sagittis sed ut eros."
+    RenderBR {BR} at (0,0) size 0x0
+layer at (8,2268) size 31x310 clip at (9,2269) size 29x308 scrollY 440 scrollHeight 748
+  RenderBlock {DIV} at (0,2260) size 31x310 [border: (1px solid #000000)]
+    RenderText {#text} at (12,128) size 18x181
+      text run at (12,128) width 181 RTL override: "Lorem ipsum dolor sit amet, "
+    RenderImage {IMG} at (1,103) size 25x25
+    RenderText {#text} at (12,-439) size 18x542
+      text run at (12,-439) width 542 RTL override: " consectetur adipiscing elit. Vivamus vitae eros non libero faucibus sagittis sed ut eros."
+layer at (8,2638) size 31x310 clip at (9,2639) size 29x308 scrollY 436 scrollHeight 744
+  RenderBlock {DIV} at (0,2630) size 31x310 [border: (1px solid #000000)]
+    RenderText {#text} at (12,38) size 18x271
+      text run at (12,38) width 271 RTL override: "Lorem ipsum dolor sit amet, consectetur ad"
+    RenderImage {IMG} at (1,13) size 25x25
+    RenderText {#text} at (12,-435) size 18x448
+      text run at (12,-435) width 448 RTL override: "ipiscing elit. Vivamus vitae eros non libero faucibus sagittis sed ut eros."

diff --git a/LayoutTests/platform/mac/fast/css/vertical-text-overflow-ellipsis-text-align-justify-expected.txt b/LayoutTests/platform/mac/fast/css/vertical-text-overflow-ellipsis-text-align-justify-expected.txt
new file mode 100644 (file)
index 0000000..0a0e382
--- /dev/null
+++ b/LayoutTests/platform/mac/fast/css/vertical-text-overflow-ellipsis-text-align-justify-expected.txt
@@ -0,0 +1,93 @@
+layer at (0,0) size 785x2968
+  RenderView at (0,0) size 785x600
+layer at (0,0) size 785x2968
+  RenderBlock {HTML} at (0,0) size 785x2968
+    RenderBody {BODY} at (8,8) size 769x2940
+      RenderBlock {H3} at (0,0) size 769x22
+        RenderText {#text} at (0,0) size 84x22
+          text run at (0,0) width 84: "Single line"
+      RenderBlock {H3} at (0,370) size 769x22
+        RenderText {#text} at (0,0) size 79x22
+          text run at (0,0) width 79: "Multi line"
+      RenderBlock {H3} at (0,740) size 769x22
+        RenderText {#text} at (0,0) size 232x22
+          text run at (0,0) width 232: "Containing replaced content"
+      RenderBlock {H3} at (0,1110) size 769x22
+        RenderText {#text} at (0,0) size 396x22
+          text run at (0,0) width 396: "Containing replaced content blocking the ellipsis"
+      RenderBlock {H3} at (0,1480) size 769x22
+        RenderText {#text} at (0,0) size 199x22
+          text run at (0,0) width 199: "Right-To-Left single line"
+      RenderBlock {H3} at (0,1850) size 769x22
+        RenderText {#text} at (0,0) size 198x22
+          text run at (0,0) width 198: "Right-To-Left Multi line"
+      RenderBlock {H3} at (0,2220) size 769x22
+        RenderText {#text} at (0,0) size 345x22
+          text run at (0,0) width 345: "Right-To-Left containing replaced content"
+      RenderBlock {H3} at (0,2590) size 769x22
+        RenderText {#text} at (0,0) size 509x22
+          text run at (0,0) width 509: "Right-To-Left containing replaced content blocking the ellipsis"
+layer at (8,48) size 20x310 clip at (9,49) size 18x308 scrollHeight 719
+  RenderBlock {DIV} at (0,40) size 20x310 [border: (1px solid #000000)]
+    RenderText {#text} at (1,1) size 18x719
+      text run at (1,1) width 719: "Lorem ipsum dolor sit amet, consectetur adipiscing elit. Vivamus vitae eros non libero faucibus sagittis sed ut eros."
+layer at (8,418) size 74x310 clip at (9,419) size 72x308 scrollHeight 719
+  RenderBlock {DIV} at (0,410) size 74x310 [border: (1px solid #000000)]
+    RenderText {#text} at (1,1) size 18x719
+      text run at (1,1) width 719: "Lorem ipsum dolor sit amet, consectetur adipiscing elit. Vivamus vitae eros non libero faucibus sagittis sed ut eros."
+    RenderBR {BR} at (0,0) size 0x0
+    RenderText {#text} at (19,1) size 18x709
+      text run at (19,1) width 709: "orem ipsum dolor sit amet, consectetur adipiscing elit. Vivamus vitae eros non libero faucibus sagittis sed ut eros."
+    RenderBR {BR} at (0,0) size 0x0
+    RenderText {#text} at (37,1) size 18x701
+      text run at (37,1) width 701: "rem ipsum dolor sit amet, consectetur adipiscing elit. Vivamus vitae eros non libero faucibus sagittis sed ut eros."
+    RenderBR {BR} at (0,0) size 0x0
+    RenderText {#text} at (55,1) size 18x696
+      text run at (55,1) width 696: "em ipsum dolor sit amet, consectetur adipiscing elit. Vivamus vitae eros non libero faucibus sagittis sed ut eros."
+    RenderBR {BR} at (0,0) size 0x0
+layer at (8,788) size 31x310 clip at (9,789) size 29x308 scrollHeight 748
+  RenderBlock {DIV} at (0,780) size 31x310 [border: (1px solid #000000)]
+    RenderText {#text} at (12,1) size 18x181
+      text run at (12,1) width 181: "Lorem ipsum dolor sit amet, "
+    RenderImage {IMG} at (1,182) size 25x25
+    RenderText {#text} at (12,207) size 18x542
+      text run at (12,207) width 542: " consectetur adipiscing elit. Vivamus vitae eros non libero faucibus sagittis sed ut eros."
+layer at (8,1158) size 31x310 clip at (9,1159) size 29x308 scrollHeight 744
+  RenderBlock {DIV} at (0,1150) size 31x310 [border: (1px solid #000000)]
+    RenderText {#text} at (12,1) size 18x271
+      text run at (12,1) width 271: "Lorem ipsum dolor sit amet, consectetur ad"
+    RenderImage {IMG} at (1,272) size 25x25
+    RenderText {#text} at (12,297) size 18x448
+      text run at (12,297) width 448: "ipiscing elit. Vivamus vitae eros non libero faucibus sagittis sed ut eros."
+layer at (8,1528) size 20x310 clip at (9,1529) size 18x308 scrollY 411 scrollHeight 719
+  RenderBlock {DIV} at (0,1520) size 20x310 [border: (1px solid #000000)]
+    RenderText {#text} at (1,-410) size 18x719
+      text run at (1,-410) width 719 RTL override: "Lorem ipsum dolor sit amet, consectetur adipiscing elit. Vivamus vitae eros non libero faucibus sagittis sed ut eros."
+layer at (8,1898) size 74x310 clip at (9,1899) size 72x308
+  RenderBlock {DIV} at (0,1890) size 74x310 [border: (1px solid #000000)]
+    RenderText {#text} at (1,1) size 18x719
+      text run at (1,1) width 719 RTL override: "Lorem ipsum dolor sit amet, consectetur adipiscing elit. Vivamus vitae eros non libero faucibus sagittis sed ut eros."
+    RenderBR {BR} at (0,0) size 0x0
+    RenderText {#text} at (19,1) size 18x709
+      text run at (19,1) width 709 RTL override: "orem ipsum dolor sit amet, consectetur adipiscing elit. Vivamus vitae eros non libero faucibus sagittis sed ut eros."
+    RenderBR {BR} at (0,0) size 0x0
+    RenderText {#text} at (37,1) size 18x701
+      text run at (37,1) width 701 RTL override: "rem ipsum dolor sit amet, consectetur adipiscing elit. Vivamus vitae eros non libero faucibus sagittis sed ut eros."
+    RenderBR {BR} at (0,0) size 0x0
+    RenderText {#text} at (55,1) size 18x696
+      text run at (55,1) width 696 RTL override: "em ipsum dolor sit amet, consectetur adipiscing elit. Vivamus vitae eros non libero faucibus sagittis sed ut eros."
+    RenderBR {BR} at (0,0) size 0x0
+layer at (8,2268) size 31x310 clip at (9,2269) size 29x308 scrollY 440 scrollHeight 748
+  RenderBlock {DIV} at (0,2260) size 31x310 [border: (1px solid #000000)]
+    RenderText {#text} at (12,128) size 18x181
+      text run at (12,128) width 181 RTL override: "Lorem ipsum dolor sit amet, "
+    RenderImage {IMG} at (1,103) size 25x25
+    RenderText {#text} at (12,-439) size 18x542
+      text run at (12,-439) width 542 RTL override: " consectetur adipiscing elit. Vivamus vitae eros non libero faucibus sagittis sed ut eros."
+layer at (8,2638) size 31x310 clip at (9,2639) size 29x308 scrollY 436 scrollHeight 744
+  RenderBlock {DIV} at (0,2630) size 31x310 [border: (1px solid #000000)]
+    RenderText {#text} at (12,38) size 18x271
+      text run at (12,38) width 271 RTL override: "Lorem ipsum dolor sit amet, consectetur ad"
+    RenderImage {IMG} at (1,13) size 25x25
+    RenderText {#text} at (12,-435) size 18x448
+      text run at (12,-435) width 448 RTL override: "ipiscing elit. Vivamus vitae eros non libero faucibus sagittis sed ut eros."

diff --git a/LayoutTests/platform/mac/fast/css/vertical-text-overflow-ellipsis-text-align-left-expected.txt b/LayoutTests/platform/mac/fast/css/vertical-text-overflow-ellipsis-text-align-left-expected.txt
new file mode 100644 (file)
index 0000000..3a022c4
--- /dev/null
+++ b/LayoutTests/platform/mac/fast/css/vertical-text-overflow-ellipsis-text-align-left-expected.txt
@@ -0,0 +1,93 @@
+layer at (0,0) size 785x2968
+  RenderView at (0,0) size 785x600
+layer at (0,0) size 785x2968
+  RenderBlock {HTML} at (0,0) size 785x2968
+    RenderBody {BODY} at (8,8) size 769x2940
+      RenderBlock {H3} at (0,0) size 769x22
+        RenderText {#text} at (0,0) size 84x22
+          text run at (0,0) width 84: "Single line"
+      RenderBlock {H3} at (0,370) size 769x22
+        RenderText {#text} at (0,0) size 79x22
+          text run at (0,0) width 79: "Multi line"
+      RenderBlock {H3} at (0,740) size 769x22
+        RenderText {#text} at (0,0) size 232x22
+          text run at (0,0) width 232: "Containing replaced content"
+      RenderBlock {H3} at (0,1110) size 769x22
+        RenderText {#text} at (0,0) size 396x22
+          text run at (0,0) width 396: "Containing replaced content blocking the ellipsis"
+      RenderBlock {H3} at (0,1480) size 769x22
+        RenderText {#text} at (0,0) size 199x22
+          text run at (0,0) width 199: "Right-To-Left single line"
+      RenderBlock {H3} at (0,1850) size 769x22
+        RenderText {#text} at (0,0) size 198x22
+          text run at (0,0) width 198: "Right-To-Left Multi line"
+      RenderBlock {H3} at (0,2220) size 769x22
+        RenderText {#text} at (0,0) size 345x22
+          text run at (0,0) width 345: "Right-To-Left containing replaced content"
+      RenderBlock {H3} at (0,2590) size 769x22
+        RenderText {#text} at (0,0) size 509x22
+          text run at (0,0) width 509: "Right-To-Left containing replaced content blocking the ellipsis"
+layer at (8,48) size 20x310 clip at (9,49) size 18x308 scrollHeight 719
+  RenderBlock {DIV} at (0,40) size 20x310 [border: (1px solid #000000)]
+    RenderText {#text} at (1,1) size 18x719
+      text run at (1,1) width 719: "Lorem ipsum dolor sit amet, consectetur adipiscing elit. Vivamus vitae eros non libero faucibus sagittis sed ut eros."
+layer at (8,418) size 74x310 clip at (9,419) size 72x308 scrollHeight 719
+  RenderBlock {DIV} at (0,410) size 74x310 [border: (1px solid #000000)]
+    RenderText {#text} at (1,1) size 18x719
+      text run at (1,1) width 719: "Lorem ipsum dolor sit amet, consectetur adipiscing elit. Vivamus vitae eros non libero faucibus sagittis sed ut eros."
+    RenderBR {BR} at (0,0) size 0x0
+    RenderText {#text} at (19,1) size 18x709
+      text run at (19,1) width 709: "orem ipsum dolor sit amet, consectetur adipiscing elit. Vivamus vitae eros non libero faucibus sagittis sed ut eros."
+    RenderBR {BR} at (0,0) size 0x0
+    RenderText {#text} at (37,1) size 18x701
+      text run at (37,1) width 701: "rem ipsum dolor sit amet, consectetur adipiscing elit. Vivamus vitae eros non libero faucibus sagittis sed ut eros."
+    RenderBR {BR} at (0,0) size 0x0
+    RenderText {#text} at (55,1) size 18x696
+      text run at (55,1) width 696: "em ipsum dolor sit amet, consectetur adipiscing elit. Vivamus vitae eros non libero faucibus sagittis sed ut eros."
+    RenderBR {BR} at (0,0) size 0x0
+layer at (8,788) size 31x310 clip at (9,789) size 29x308 scrollHeight 748
+  RenderBlock {DIV} at (0,780) size 31x310 [border: (1px solid #000000)]
+    RenderText {#text} at (12,1) size 18x181
+      text run at (12,1) width 181: "Lorem ipsum dolor sit amet, "
+    RenderImage {IMG} at (1,182) size 25x25
+    RenderText {#text} at (12,207) size 18x542
+      text run at (12,207) width 542: " consectetur adipiscing elit. Vivamus vitae eros non libero faucibus sagittis sed ut eros."
+layer at (8,1158) size 31x310 clip at (9,1159) size 29x308 scrollHeight 744
+  RenderBlock {DIV} at (0,1150) size 31x310 [border: (1px solid #000000)]
+    RenderText {#text} at (12,1) size 18x271
+      text run at (12,1) width 271: "Lorem ipsum dolor sit amet, consectetur ad"
+    RenderImage {IMG} at (1,272) size 25x25
+    RenderText {#text} at (12,297) size 18x448
+      text run at (12,297) width 448: "ipiscing elit. Vivamus vitae eros non libero faucibus sagittis sed ut eros."
+layer at (8,1528) size 20x310 clip at (9,1529) size 18x308 scrollY 411 scrollHeight 719
+  RenderBlock {DIV} at (0,1520) size 20x310 [border: (1px solid #000000)]
+    RenderText {#text} at (1,-410) size 18x719
+      text run at (1,-410) width 719 RTL override: "Lorem ipsum dolor sit amet, consectetur adipiscing elit. Vivamus vitae eros non libero faucibus sagittis sed ut eros."
+layer at (8,1898) size 74x310 clip at (9,1899) size 72x308 scrollY 411 scrollHeight 719
+  RenderBlock {DIV} at (0,1890) size 74x310 [border: (1px solid #000000)]
+    RenderText {#text} at (1,-410) size 18x719
+      text run at (1,-410) width 719 RTL override: "Lorem ipsum dolor sit amet, consectetur adipiscing elit. Vivamus vitae eros non libero faucibus sagittis sed ut eros."
+    RenderBR {BR} at (0,0) size 0x0
+    RenderText {#text} at (19,-400) size 18x709
+      text run at (19,-400) width 709 RTL override: "orem ipsum dolor sit amet, consectetur adipiscing elit. Vivamus vitae eros non libero faucibus sagittis sed ut eros."
+    RenderBR {BR} at (0,0) size 0x0
+    RenderText {#text} at (37,-392) size 18x701
+      text run at (37,-392) width 701 RTL override: "rem ipsum dolor sit amet, consectetur adipiscing elit. Vivamus vitae eros non libero faucibus sagittis sed ut eros."
+    RenderBR {BR} at (0,0) size 0x0
+    RenderText {#text} at (55,-387) size 18x696
+      text run at (55,-387) width 696 RTL override: "em ipsum dolor sit amet, consectetur adipiscing elit. Vivamus vitae eros non libero faucibus sagittis sed ut eros."
+    RenderBR {BR} at (0,0) size 0x0
+layer at (8,2268) size 31x310 clip at (9,2269) size 29x308 scrollY 440 scrollHeight 748
+  RenderBlock {DIV} at (0,2260) size 31x310 [border: (1px solid #000000)]
+    RenderText {#text} at (12,128) size 18x181
+      text run at (12,128) width 181 RTL override: "Lorem ipsum dolor sit amet, "
+    RenderImage {IMG} at (1,103) size 25x25
+    RenderText {#text} at (12,-439) size 18x542
+      text run at (12,-439) width 542 RTL override: " consectetur adipiscing elit. Vivamus vitae eros non libero faucibus sagittis sed ut eros."
+layer at (8,2638) size 31x310 clip at (9,2639) size 29x308 scrollY 436 scrollHeight 744
+  RenderBlock {DIV} at (0,2630) size 31x310 [border: (1px solid #000000)]
+    RenderText {#text} at (12,38) size 18x271
+      text run at (12,38) width 271 RTL override: "Lorem ipsum dolor sit amet, consectetur ad"
+    RenderImage {IMG} at (1,13) size 25x25
+    RenderText {#text} at (12,-435) size 18x448
+      text run at (12,-435) width 448 RTL override: "ipiscing elit. Vivamus vitae eros non libero faucibus sagittis sed ut eros."

diff --git a/LayoutTests/platform/mac/fast/css/vertical-text-overflow-ellipsis-text-align-right-expected.txt b/LayoutTests/platform/mac/fast/css/vertical-text-overflow-ellipsis-text-align-right-expected.txt
new file mode 100644 (file)
index 0000000..58f80e3
--- /dev/null
+++ b/LayoutTests/platform/mac/fast/css/vertical-text-overflow-ellipsis-text-align-right-expected.txt
@@ -0,0 +1,93 @@
+layer at (0,0) size 785x2968
+  RenderView at (0,0) size 785x600
+layer at (0,0) size 785x2968
+  RenderBlock {HTML} at (0,0) size 785x2968
+    RenderBody {BODY} at (8,8) size 769x2940
+      RenderBlock {H3} at (0,0) size 769x22
+        RenderText {#text} at (0,0) size 84x22
+          text run at (0,0) width 84: "Single line"
+      RenderBlock {H3} at (0,370) size 769x22
+        RenderText {#text} at (0,0) size 79x22
+          text run at (0,0) width 79: "Multi line"
+      RenderBlock {H3} at (0,740) size 769x22
+        RenderText {#text} at (0,0) size 232x22
+          text run at (0,0) width 232: "Containing replaced content"
+      RenderBlock {H3} at (0,1110) size 769x22
+        RenderText {#text} at (0,0) size 396x22
+          text run at (0,0) width 396: "Containing replaced content blocking the ellipsis"
+      RenderBlock {H3} at (0,1480) size 769x22
+        RenderText {#text} at (0,0) size 199x22
+          text run at (0,0) width 199: "Right-To-Left single line"
+      RenderBlock {H3} at (0,1850) size 769x22
+        RenderText {#text} at (0,0) size 198x22
+          text run at (0,0) width 198: "Right-To-Left Multi line"
+      RenderBlock {H3} at (0,2220) size 769x22
+        RenderText {#text} at (0,0) size 345x22
+          text run at (0,0) width 345: "Right-To-Left containing replaced content"
+      RenderBlock {H3} at (0,2590) size 769x22
+        RenderText {#text} at (0,0) size 509x22
+          text run at (0,0) width 509: "Right-To-Left containing replaced content blocking the ellipsis"
+layer at (8,48) size 20x310 clip at (9,49) size 18x308 scrollHeight 720
+  RenderBlock {DIV} at (0,40) size 20x310 [border: (1px solid #000000)]
+    RenderText {#text} at (1,2) size 18x719
+      text run at (1,2) width 719: "Lorem ipsum dolor sit amet, consectetur adipiscing elit. Vivamus vitae eros non libero faucibus sagittis sed ut eros."
+layer at (8,418) size 74x310 clip at (9,419) size 72x308 scrollHeight 720
+  RenderBlock {DIV} at (0,410) size 74x310 [border: (1px solid #000000)]
+    RenderText {#text} at (1,2) size 18x719
+      text run at (1,2) width 719: "Lorem ipsum dolor sit amet, consectetur adipiscing elit. Vivamus vitae eros non libero faucibus sagittis sed ut eros."
+    RenderBR {BR} at (0,0) size 0x0
+    RenderText {#text} at (19,2) size 18x709
+      text run at (19,2) width 709: "orem ipsum dolor sit amet, consectetur adipiscing elit. Vivamus vitae eros non libero faucibus sagittis sed ut eros."
+    RenderBR {BR} at (0,0) size 0x0
+    RenderText {#text} at (37,2) size 18x701
+      text run at (37,2) width 701: "rem ipsum dolor sit amet, consectetur adipiscing elit. Vivamus vitae eros non libero faucibus sagittis sed ut eros."
+    RenderBR {BR} at (0,0) size 0x0
+    RenderText {#text} at (55,2) size 18x696
+      text run at (55,2) width 696: "em ipsum dolor sit amet, consectetur adipiscing elit. Vivamus vitae eros non libero faucibus sagittis sed ut eros."
+    RenderBR {BR} at (0,0) size 0x0
+layer at (8,788) size 31x310 clip at (9,789) size 29x308 scrollHeight 749
+  RenderBlock {DIV} at (0,780) size 31x310 [border: (1px solid #000000)]
+    RenderText {#text} at (12,2) size 18x181
+      text run at (12,2) width 181: "Lorem ipsum dolor sit amet, "
+    RenderImage {IMG} at (1,183) size 25x25
+    RenderText {#text} at (12,208) size 18x542
+      text run at (12,208) width 542: " consectetur adipiscing elit. Vivamus vitae eros non libero faucibus sagittis sed ut eros."
+layer at (8,1158) size 31x310 clip at (9,1159) size 29x308 scrollHeight 745
+  RenderBlock {DIV} at (0,1150) size 31x310 [border: (1px solid #000000)]
+    RenderText {#text} at (12,2) size 18x271
+      text run at (12,2) width 271: "Lorem ipsum dolor sit amet, consectetur ad"
+    RenderImage {IMG} at (1,273) size 25x25
+    RenderText {#text} at (12,298) size 18x448
+      text run at (12,298) width 448: "ipiscing elit. Vivamus vitae eros non libero faucibus sagittis sed ut eros."
+layer at (8,1528) size 20x310 clip at (9,1529) size 18x308 scrollY 411 scrollHeight 719
+  RenderBlock {DIV} at (0,1520) size 20x310 [border: (1px solid #000000)]
+    RenderText {#text} at (1,-410) size 18x719
+      text run at (1,-410) width 719 RTL override: "Lorem ipsum dolor sit amet, consectetur adipiscing elit. Vivamus vitae eros non libero faucibus sagittis sed ut eros."
+layer at (8,1898) size 74x310 clip at (9,1899) size 72x308 scrollY 411 scrollHeight 719
+  RenderBlock {DIV} at (0,1890) size 74x310 [border: (1px solid #000000)]
+    RenderText {#text} at (1,-410) size 18x719
+      text run at (1,-410) width 719 RTL override: "Lorem ipsum dolor sit amet, consectetur adipiscing elit. Vivamus vitae eros non libero faucibus sagittis sed ut eros."
+    RenderBR {BR} at (0,0) size 0x0
+    RenderText {#text} at (19,-400) size 18x709
+      text run at (19,-400) width 709 RTL override: "orem ipsum dolor sit amet, consectetur adipiscing elit. Vivamus vitae eros non libero faucibus sagittis sed ut eros."
+    RenderBR {BR} at (0,0) size 0x0
+    RenderText {#text} at (37,-392) size 18x701
+      text run at (37,-392) width 701 RTL override: "rem ipsum dolor sit amet, consectetur adipiscing elit. Vivamus vitae eros non libero faucibus sagittis sed ut eros."
+    RenderBR {BR} at (0,0) size 0x0
+    RenderText {#text} at (55,-387) size 18x696
+      text run at (55,-387) width 696 RTL override: "em ipsum dolor sit amet, consectetur adipiscing elit. Vivamus vitae eros non libero faucibus sagittis sed ut eros."
+    RenderBR {BR} at (0,0) size 0x0
+layer at (8,2268) size 31x310 clip at (9,2269) size 29x308 scrollY 440 scrollHeight 748
+  RenderBlock {DIV} at (0,2260) size 31x310 [border: (1px solid #000000)]
+    RenderText {#text} at (12,128) size 18x181
+      text run at (12,128) width 181 RTL override: "Lorem ipsum dolor sit amet, "
+    RenderImage {IMG} at (1,103) size 25x25
+    RenderText {#text} at (12,-439) size 18x542
+      text run at (12,-439) width 542 RTL override: " consectetur adipiscing elit. Vivamus vitae eros non libero faucibus sagittis sed ut eros."
+layer at (8,2638) size 31x310 clip at (9,2639) size 29x308 scrollY 436 scrollHeight 744
+  RenderBlock {DIV} at (0,2630) size 31x310 [border: (1px solid #000000)]
+    RenderText {#text} at (12,38) size 18x271
+      text run at (12,38) width 271 RTL override: "Lorem ipsum dolor sit amet, consectetur ad"
+    RenderImage {IMG} at (1,13) size 25x25
+    RenderText {#text} at (12,-435) size 18x448
+      text run at (12,-435) width 448 RTL override: "ipiscing elit. Vivamus vitae eros non libero faucibus sagittis sed ut eros."

diff --git a/Source/WebCore/ChangeLog b/Source/WebCore/ChangeLog
index 890fca2..b972b30 100644 (file)
--- a/Source/WebCore/ChangeLog
+++ b/Source/WebCore/ChangeLog
@@ -1,3 +1,60 @@
+2012-06-22  Benjamin Poulain  <bpoulain@apple.com>
+
+        Text with text-overflow:ellipsis and text-align:right is left aligned
+        https://bugs.webkit.org/show_bug.cgi?id=88705
+
+        Reviewed by Dan Bernstein.
+
+        When building the line of a text with overflow, we do not know if we can place
+        an ellipsis and where it should be. Because of that, text is laid out as if it does
+        not have text-overflow: ellipsis.
+
+        This causes problems with text-alignement right in LTR and left in RTL. The shortened text
+        did not follow the allignment.
+
+        This patch changes the position of lines with ellipsis after layout to follow the allignment.
+        In RenderBlock::checkLinesForTextOverflow(), the call to RootInlineBox::placeEllipsis() now
+        also gives the width of the truncated text. We use this width to re-compute the alignement and
+        shift the box if necessary.
+
+        In RenderBlock::deleteEllipsisLineBoxes() we revert the text to the position computed with the
+        total width. This way all layout computation is done as usual.
+
+        Tests: fast/css/text-overflow-ellipsis-text-align-left.html
+               fast/css/text-overflow-ellipsis-text-align-right.html
+
+        * rendering/InlineBox.cpp:
+        (WebCore::InlineBox::canAccommodateEllipsis): Make the method const for readability, truncating is
+        done later in placeEllipsisBox().
+        (WebCore::InlineBox::placeEllipsisBox): Add an output argument, truncatedWidth, giving the width
+        of the text + ellipsis after truncation (if any truncation can be done).
+        * rendering/InlineBox.h:
+        (InlineBox):
+        * rendering/InlineFlowBox.cpp:
+        (WebCore::InlineBox::adjustLogicalPosition): adjustPosition() logical coordinates.
+        (WebCore::InlineFlowBox::canAccommodateEllipsis):
+        (WebCore::InlineFlowBox::placeEllipsisBox):
+        * rendering/InlineFlowBox.h:
+        (InlineFlowBox):
+        * rendering/InlineTextBox.cpp:
+        (WebCore::InlineTextBox::placeEllipsisBox):
+        * rendering/InlineTextBox.h:
+        (InlineTextBox):
+        * rendering/RenderBlockLineLayout.cpp:
+        (WebCore::RenderBlock::deleteEllipsisLineBoxes): In addition to removing the truncation, we
+        need to revert the shift introduced by checkLinesForTextOverflow(). This restore the lines
+        to its original, untruncated position in order to layout the block correctly in RenderBlock::layoutInlineChildren().
+        (WebCore::RenderBlock::checkLinesForTextOverflow): After we truncate the text, we now recompute the shift we need
+        for alignment, and move the line accordingly.
+        * rendering/RenderDeprecatedFlexibleBox.cpp:
+        (WebCore::RenderDeprecatedFlexibleBox::applyLineClamp):
+        * rendering/RootInlineBox.cpp:
+        (WebCore::RootInlineBox::placeEllipsis): Return the width of the truncated text + the width of the ellipsis.
+        (WebCore::RootInlineBox::placeEllipsisBox):
+        (WebCore::RootInlineBox::adjustPosition):
+        * rendering/RootInlineBox.h:
+        (RootInlineBox):
+
 2012-06-22  Eugene Klyuchnikov  <eustas.big@gmail.com>
 
         Web Inspector: Fix negative time interval on zoom-in

diff --git a/Source/WebCore/rendering/InlineBox.cpp b/Source/WebCore/rendering/InlineBox.cpp
index b7713d0..08bfd69 100644 (file)
--- a/Source/WebCore/rendering/InlineBox.cpp
+++ b/Source/WebCore/rendering/InlineBox.cpp
@@ -322,7 +322,7 @@ RenderObject::SelectionState InlineBox::selectionState()
     return renderer()->selectionState();
 }
 
-bool InlineBox::canAccommodateEllipsis(bool ltr, int blockEdge, int ellipsisWidth)
+bool InlineBox::canAccommodateEllipsis(bool ltr, int blockEdge, int ellipsisWidth) const
 {
     // Non-replaced elements can always accommodate an ellipsis.
     if (!m_renderer || !m_renderer->isReplaced())
@@ -333,9 +333,10 @@ bool InlineBox::canAccommodateEllipsis(bool ltr, int blockEdge, int ellipsisWidt
     return !(boxRect.intersects(ellipsisRect));
 }
 
-float InlineBox::placeEllipsisBox(bool, float, float, float, bool&)
+float InlineBox::placeEllipsisBox(bool, float, float, float, float& truncatedWidth, bool&)
 {
     // Use -1 to mean "we didn't set the position."
+    truncatedWidth += logicalWidth();
     return -1;
 }
 

diff --git a/Source/WebCore/rendering/InlineBox.h b/Source/WebCore/rendering/InlineBox.h
index ca2ba6f..a888205 100644 (file)
--- a/Source/WebCore/rendering/InlineBox.h
+++ b/Source/WebCore/rendering/InlineBox.h
@@ -72,6 +72,13 @@ public:
     virtual bool isLineBreak() const { return false; }
 
     virtual void adjustPosition(float dx, float dy);
+    void adjustLogicalPosition(float deltaLogicalLeft, float deltaLogicalTop)
+    {
+        if (isHorizontal())
+            adjustPosition(deltaLogicalLeft, deltaLogicalTop);
+        else
+            adjustPosition(deltaLogicalTop, deltaLogicalLeft);
+    }
     void adjustLineDirectionPosition(float delta)
     {
         if (isHorizontal())
@@ -261,9 +268,9 @@ public:
     
     virtual RenderObject::SelectionState selectionState();
 
-    virtual bool canAccommodateEllipsis(bool ltr, int blockEdge, int ellipsisWidth);
+    virtual bool canAccommodateEllipsis(bool ltr, int blockEdge, int ellipsisWidth) const;
     // visibleLeftEdge, visibleRightEdge are in the parent's coordinate system.
-    virtual float placeEllipsisBox(bool ltr, float visibleLeftEdge, float visibleRightEdge, float ellipsisWidth, bool&);
+    virtual float placeEllipsisBox(bool ltr, float visibleLeftEdge, float visibleRightEdge, float ellipsisWidth, float &truncatedWidth, bool&);
 
 #ifndef NDEBUG
     void setHasBadParent();

diff --git a/Source/WebCore/rendering/InlineFlowBox.cpp b/Source/WebCore/rendering/InlineFlowBox.cpp
index 90c7067..727e4ea 100644 (file)
--- a/Source/WebCore/rendering/InlineFlowBox.cpp
+++ b/Source/WebCore/rendering/InlineFlowBox.cpp
@@ -1380,7 +1380,7 @@ RenderObject::SelectionState InlineFlowBox::selectionState()
     return RenderObject::SelectionNone;
 }
 
-bool InlineFlowBox::canAccommodateEllipsis(bool ltr, int blockEdge, int ellipsisWidth)
+bool InlineFlowBox::canAccommodateEllipsis(bool ltr, int blockEdge, int ellipsisWidth) const
 {
     for (InlineBox *box = firstChild(); box; box = box->nextOnLine()) {
         if (!box->canAccommodateEllipsis(ltr, blockEdge, ellipsisWidth))
@@ -1389,7 +1389,7 @@ bool InlineFlowBox::canAccommodateEllipsis(bool ltr, int blockEdge, int ellipsis
     return true;
 }
 
-float InlineFlowBox::placeEllipsisBox(bool ltr, float blockLeftEdge, float blockRightEdge, float ellipsisWidth, bool& foundBox)
+float InlineFlowBox::placeEllipsisBox(bool ltr, float blockLeftEdge, float blockRightEdge, float ellipsisWidth, float &truncatedWidth, bool& foundBox)
 {
     float result = -1;
     // We iterate over all children, the foundBox variable tells us when we've found the
@@ -1403,7 +1403,7 @@ float InlineFlowBox::placeEllipsisBox(bool ltr, float blockLeftEdge, float block
     int visibleRightEdge = blockRightEdge;
 
     while (box) {
-        int currResult = box->placeEllipsisBox(ltr, visibleLeftEdge, visibleRightEdge, ellipsisWidth, foundBox);
+        int currResult = box->placeEllipsisBox(ltr, visibleLeftEdge, visibleRightEdge, ellipsisWidth, truncatedWidth, foundBox);
         if (currResult != -1 && result == -1)
             result = currResult;
 

diff --git a/Source/WebCore/rendering/InlineFlowBox.h b/Source/WebCore/rendering/InlineFlowBox.h
index b821da3..35df784 100644 (file)
--- a/Source/WebCore/rendering/InlineFlowBox.h
+++ b/Source/WebCore/rendering/InlineFlowBox.h
@@ -102,7 +102,7 @@ public:
     virtual void attachLineBoxToRenderObject();
     virtual void removeLineBoxFromRenderObject();
 
-    virtual void clearTruncation();
+    virtual void clearTruncation() OVERRIDE;
 
     IntRect roundedFrameRect() const;
     
@@ -189,8 +189,8 @@ public:
 
     virtual RenderObject::SelectionState selectionState();
 
-    virtual bool canAccommodateEllipsis(bool ltr, int blockEdge, int ellipsisWidth);
-    virtual float placeEllipsisBox(bool ltr, float blockLeftEdge, float blockRightEdge, float ellipsisWidth, bool&);
+    virtual bool canAccommodateEllipsis(bool ltr, int blockEdge, int ellipsisWidth) const OVERRIDE;
+    virtual float placeEllipsisBox(bool ltr, float blockLeftEdge, float blockRightEdge, float ellipsisWidth, float &truncatedWidth, bool&) OVERRIDE;
 
     bool hasTextChildren() const { return m_hasTextChildren; }
     bool hasTextDescendants() const { return m_hasTextDescendants; }

diff --git a/Source/WebCore/rendering/InlineTextBox.cpp b/Source/WebCore/rendering/InlineTextBox.cpp
index 21478ab..7d63031 100644 (file)
--- a/Source/WebCore/rendering/InlineTextBox.cpp
+++ b/Source/WebCore/rendering/InlineTextBox.cpp
@@ -233,7 +233,7 @@ void InlineTextBox::attachLine()
     toRenderText(renderer())->attachTextBox(this);
 }
 
-float InlineTextBox::placeEllipsisBox(bool flowIsLTR, float visibleLeftEdge, float visibleRightEdge, float ellipsisWidth, bool& foundBox)
+float InlineTextBox::placeEllipsisBox(bool flowIsLTR, float visibleLeftEdge, float visibleRightEdge, float ellipsisWidth, float &truncatedWidth, bool& foundBox)
 {
     if (foundBox) {
         m_truncation = cFullTruncation;
@@ -275,6 +275,7 @@ float InlineTextBox::placeEllipsisBox(bool flowIsLTR, float visibleLeftEdge, flo
             // No characters should be rendered.  Set ourselves to full truncation and place the ellipsis at the min of our start
             // and the ellipsis edge.
             m_truncation = cFullTruncation;
+            truncatedWidth += ellipsisWidth;
             return min(ellipsisX, x());
         }
 
@@ -290,11 +291,13 @@ float InlineTextBox::placeEllipsisBox(bool flowIsLTR, float visibleLeftEdge, flo
         // box directionality.
         // e.g. In the case of an LTR inline box truncated in an RTL flow then we can
         // have a situation such as |Hello| -> |...He|
+        truncatedWidth += widthOfVisibleText + ellipsisWidth;
         if (flowIsLTR)
             return left() + widthOfVisibleText;
         else
             return right() - widthOfVisibleText - ellipsisWidth;
     }
+    truncatedWidth += logicalWidth();
     return -1;
 }
 

diff --git a/Source/WebCore/rendering/InlineTextBox.h b/Source/WebCore/rendering/InlineTextBox.h
index ff1ae61..a3e7630 100644 (file)
--- a/Source/WebCore/rendering/InlineTextBox.h
+++ b/Source/WebCore/rendering/InlineTextBox.h
@@ -130,7 +130,7 @@ public:
 
 private:
     virtual void clearTruncation() { m_truncation = cNoTruncation; }
-    virtual float placeEllipsisBox(bool flowIsLTR, float visibleLeftEdge, float visibleRightEdge, float ellipsisWidth, bool& foundBox);
+    virtual float placeEllipsisBox(bool flowIsLTR, float visibleLeftEdge, float visibleRightEdge, float ellipsisWidth, float &truncatedWidth, bool& foundBox) OVERRIDE;
 
 public:
     virtual bool isLineBreak() const;

diff --git a/Source/WebCore/rendering/RenderBlockLineLayout.cpp b/Source/WebCore/rendering/RenderBlockLineLayout.cpp
index 046ffef..b40aec3 100755 (executable)
--- a/Source/WebCore/rendering/RenderBlockLineLayout.cpp
+++ b/Source/WebCore/rendering/RenderBlockLineLayout.cpp
@@ -2675,8 +2675,26 @@ void RenderBlock::addOverflowFromInlineChildren()
 
 void RenderBlock::deleteEllipsisLineBoxes()
 {
-    for (RootInlineBox* curr = firstRootBox(); curr; curr = curr->nextRootBox())
-        curr->clearTruncation();
+    ETextAlign textAlign = style()->textAlign();
+    bool ltr = style()->isLeftToRightDirection();
+    bool firstLine = true;
+    for (RootInlineBox* curr = firstRootBox(); curr; curr = curr->nextRootBox()) {
+        if (curr->hasEllipsisBox()) {
+            curr->clearTruncation();
+
+            // Shift the line back where it belongs if we cannot accomodate an ellipsis.
+            float logicalLeft = pixelSnappedLogicalLeftOffsetForLine(curr->lineTop(), firstLine);
+            float availableLogicalWidth = logicalRightOffsetForLine(curr->lineTop(), false) - logicalLeft;
+            float totalLogicalWidth = curr->logicalWidth();
+            updateLogicalWidthForAlignment(textAlign, 0, logicalLeft, totalLogicalWidth, availableLogicalWidth, 0);
+
+            if (ltr)
+                curr->adjustLogicalPosition((logicalLeft - curr->logicalLeft()), 0);
+            else
+                curr->adjustLogicalPosition(-(curr->logicalLeft() - logicalLeft), 0);
+        }
+        firstLine = false;
+    }
 }
 
 void RenderBlock::checkLinesForTextOverflow()
@@ -2694,20 +2712,33 @@ void RenderBlock::checkLinesForTextOverflow()
     // check the left edge of the line box to see if it is less
     // Include the scrollbar for overflow blocks, which means we want to use "contentWidth()"
     bool ltr = style()->isLeftToRightDirection();
+    ETextAlign textAlign = style()->textAlign();
+    bool firstLine = true;
     for (RootInlineBox* curr = firstRootBox(); curr; curr = curr->nextRootBox()) {
-        LayoutUnit blockRightEdge = logicalRightOffsetForLine(curr->y(), curr == firstRootBox());
-        LayoutUnit blockLeftEdge = logicalLeftOffsetForLine(curr->y(), curr == firstRootBox());
+        LayoutUnit blockRightEdge = logicalRightOffsetForLine(curr->lineTop(), firstLine);
+        LayoutUnit blockLeftEdge = logicalLeftOffsetForLine(curr->lineTop(), firstLine);
         LayoutUnit lineBoxEdge = ltr ? curr->x() + curr->logicalWidth() : curr->x();
         if ((ltr && lineBoxEdge > blockRightEdge) || (!ltr && lineBoxEdge < blockLeftEdge)) {
             // This line spills out of our box in the appropriate direction.  Now we need to see if the line
             // can be truncated.  In order for truncation to be possible, the line must have sufficient space to
             // accommodate our truncation string, and no replaced elements (images, tables) can overlap the ellipsis
             // space.
-            LayoutUnit width = curr == firstRootBox() ? firstLineEllipsisWidth : ellipsisWidth;
+
+            LayoutUnit width = firstLine ? firstLineEllipsisWidth : ellipsisWidth;
             LayoutUnit blockEdge = ltr ? blockRightEdge : blockLeftEdge;
-            if (curr->lineCanAccommodateEllipsis(ltr, blockEdge, lineBoxEdge, width))
-                curr->placeEllipsis(ellipsisStr, ltr, blockLeftEdge, blockRightEdge, width);
+            if (curr->lineCanAccommodateEllipsis(ltr, blockEdge, lineBoxEdge, width)) {
+                float totalLogicalWidth = curr->placeEllipsis(ellipsisStr, ltr, blockLeftEdge, blockRightEdge, width);
+
+                float logicalLeft = 0; // We are only intersted in the delta from the base position.
+                float truncatedWidth = pixelSnappedLogicalRightOffsetForLine(curr->lineTop(), firstLine);
+                updateLogicalWidthForAlignment(textAlign, 0, logicalLeft, totalLogicalWidth, truncatedWidth, 0);
+                if (ltr)
+                    curr->adjustLogicalPosition(logicalLeft, 0);
+                else
+                    curr->adjustLogicalPosition(-(truncatedWidth - (logicalLeft + totalLogicalWidth)), 0);
+            }
         }
+        firstLine = false;
     }
 }
 
@@ -2776,7 +2807,7 @@ LayoutUnit RenderBlock::startAlignedOffsetForLine(RenderBox* child, LayoutUnit p
     logicalLeft = logicalLeftOffsetForLine(logicalHeight(), false);
     availableLogicalWidth = logicalRightOffsetForLine(logicalHeight(), false) - logicalLeft;
     float totalLogicalWidth = logicalWidthForChild(child);
-    updateLogicalWidthForAlignment(textAlign, 0l, logicalLeft, totalLogicalWidth, availableLogicalWidth, 0);
+    updateLogicalWidthForAlignment(textAlign, 0, logicalLeft, totalLogicalWidth, availableLogicalWidth, 0);
 
     if (!style()->isLeftToRightDirection())
         return logicalWidth() - (logicalLeft + totalLogicalWidth);

diff --git a/Source/WebCore/rendering/RenderDeprecatedFlexibleBox.cpp b/Source/WebCore/rendering/RenderDeprecatedFlexibleBox.cpp
index a4c4b89..61ce3ae 100644 (file)
--- a/Source/WebCore/rendering/RenderDeprecatedFlexibleBox.cpp
+++ b/Source/WebCore/rendering/RenderDeprecatedFlexibleBox.cpp
@@ -979,6 +979,7 @@ void RenderDeprecatedFlexibleBox::applyLineClamp(FlexBoxIterator& iterator, bool
             continue;
 
         // Let the truncation code kick in.
+        // FIXME: the text alignment should be recomputed after the width changes due to truncation.
         lastVisibleLine->placeEllipsis(anchorBox ? ellipsisAndSpaceStr : ellipsisStr, leftToRight, blockLeftEdge, blockRightEdge, totalWidth, anchorBox);
         destBlock->setHasMarkupTruncation(true);
     }

diff --git a/Source/WebCore/rendering/RootInlineBox.cpp b/Source/WebCore/rendering/RootInlineBox.cpp
index a5000b7..e410be0 100644 (file)
--- a/Source/WebCore/rendering/RootInlineBox.cpp
+++ b/Source/WebCore/rendering/RootInlineBox.cpp
@@ -122,7 +122,7 @@ bool RootInlineBox::lineCanAccommodateEllipsis(bool ltr, int blockEdge, int line
     return InlineFlowBox::canAccommodateEllipsis(ltr, blockEdge, ellipsisWidth);
 }
 
-void RootInlineBox::placeEllipsis(const AtomicString& ellipsisStr,  bool ltr, float blockLeftEdge, float blockRightEdge, float ellipsisWidth,
+float RootInlineBox::placeEllipsis(const AtomicString& ellipsisStr,  bool ltr, float blockLeftEdge, float blockRightEdge, float ellipsisWidth,
                                   InlineBox* markupBox)
 {
     // Create an ellipsis box.
@@ -138,21 +138,26 @@ void RootInlineBox::placeEllipsis(const AtomicString& ellipsisStr,  bool ltr, fl
     // FIXME: Do we need an RTL version of this?
     if (ltr && (x() + logicalWidth() + ellipsisWidth) <= blockRightEdge) {
         ellipsisBox->setX(x() + logicalWidth());
-        return;
+        return logicalWidth() + ellipsisWidth;
     }
 
     // Now attempt to find the nearest glyph horizontally and place just to the right (or left in RTL)
     // of that glyph.  Mark all of the objects that intersect the ellipsis box as not painting (as being
     // truncated).
     bool foundBox = false;
-    ellipsisBox->setX(placeEllipsisBox(ltr, blockLeftEdge, blockRightEdge, ellipsisWidth, foundBox));
+    float truncatedWidth = 0;
+    float position = placeEllipsisBox(ltr, blockLeftEdge, blockRightEdge, ellipsisWidth, truncatedWidth, foundBox);
+    ellipsisBox->setX(position);
+    return truncatedWidth;
 }
 
-float RootInlineBox::placeEllipsisBox(bool ltr, float blockLeftEdge, float blockRightEdge, float ellipsisWidth, bool& foundBox)
+float RootInlineBox::placeEllipsisBox(bool ltr, float blockLeftEdge, float blockRightEdge, float ellipsisWidth, float &truncatedWidth, bool& foundBox)
 {
-    float result = InlineFlowBox::placeEllipsisBox(ltr, blockLeftEdge, blockRightEdge, ellipsisWidth, foundBox);
-    if (result == -1)
+    float result = InlineFlowBox::placeEllipsisBox(ltr, blockLeftEdge, blockRightEdge, ellipsisWidth, truncatedWidth, foundBox);
+    if (result == -1) {
         result = ltr ? blockRightEdge - ellipsisWidth : blockLeftEdge;
+        truncatedWidth = blockRightEdge - blockLeftEdge;
+    }
     return result;
 }
 
@@ -231,6 +236,8 @@ void RootInlineBox::adjustPosition(float dx, float dy)
     m_lineBottom += blockDirectionDelta;
     m_lineTopWithLeading += blockDirectionDelta;
     m_lineBottomWithLeading += blockDirectionDelta;
+    if (hasEllipsisBox())
+        ellipsisBox()->adjustPosition(dx, dy);
 }
 
 void RootInlineBox::childRemoved(InlineBox* box)

diff --git a/Source/WebCore/rendering/RootInlineBox.h b/Source/WebCore/rendering/RootInlineBox.h
index a1507a1..dee490f 100644 (file)
--- a/Source/WebCore/rendering/RootInlineBox.h
+++ b/Source/WebCore/rendering/RootInlineBox.h
@@ -92,15 +92,17 @@ public:
     void childRemoved(InlineBox* box);
 
     bool lineCanAccommodateEllipsis(bool ltr, int blockEdge, int lineBoxEdge, int ellipsisWidth);
-    void placeEllipsis(const AtomicString& ellipsisStr, bool ltr, float blockLeftEdge, float blockRightEdge, float ellipsisWidth, InlineBox* markupBox = 0);
-    virtual float placeEllipsisBox(bool ltr, float blockLeftEdge, float blockRightEdge, float ellipsisWidth, bool& foundBox);
+    // Return the truncatedWidth, the width of the truncated text + ellipsis.
+    float placeEllipsis(const AtomicString& ellipsisStr, bool ltr, float blockLeftEdge, float blockRightEdge, float ellipsisWidth, InlineBox* markupBox = 0);
+    // Return the position of the EllipsisBox or -1.
+    virtual float placeEllipsisBox(bool ltr, float blockLeftEdge, float blockRightEdge, float ellipsisWidth, float &truncatedWidth, bool& foundBox) OVERRIDE;
 
     using InlineBox::hasEllipsisBox;
     EllipsisBox* ellipsisBox() const;
 
     void paintEllipsisBox(PaintInfo&, const LayoutPoint&, LayoutUnit lineTop, LayoutUnit lineBottom) const;
 
-    virtual void clearTruncation();
+    virtual void clearTruncation() OVERRIDE;
 
     bool isHyphenated() const;
 
@@ -184,7 +186,6 @@ public:
     virtual const char* boxName() const;
 #endif
 private:
-
     LayoutUnit lineSnapAdjustment(LayoutUnit delta = 0) const;
 
     LayoutUnit beforeAnnotationsAdjustment() const;