Commit db937eab authored by robert@webkit.org's avatar robert@webkit.org

Avoid painting every non-edge collapsed border twice over

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

Reviewed by David Hyatt.

Source/WebCore:

Every collapsed border that isn't on the edge of a table gets painted at least twice, once by each
adjacent cell. The joins are painted four times. This is unnecessary and results in tables with semi-transparent
borders getting rendered incorrectly - each border adjoing two cells is painted twice and ends up darker than it should be.

Fixing the overpainting at joins is another day's work. This patch ensures each collapsed border inside a table is only
painted once. It does this by only allowing cells at the top and left edge of the table to paint their top and left collapsed borders.
All the others can only paint their right and bottom collapsed border. This works because the borders are painted from bottom right to top left.

Tests: fast/table/border-collapsing/collapsed-borders-adjoining-sections-vertical-rl.html
       fast/table/border-collapsing/collapsed-borders-adjoining-sections.html

* rendering/RenderTableCell.cpp:
(WebCore::RenderTableCell::paintCollapsedBorders):

LayoutTests:

* fast/table/border-collapsing/collapsed-borders-adjoining-sections-expected.html: Added.
* fast/table/border-collapsing/collapsed-borders-adjoining-sections-vertical-rl-expected.png: Added.
* fast/table/border-collapsing/collapsed-borders-adjoining-sections-vertical-rl-expected.txt: Added.
    The painting here, though still wrong, is a progression on the behaviour prior to bug 11759 where
    the left border was painted twice. The painting can be resolved completely when we no longer paint
    twice at the border joins.
* fast/table/border-collapsing/collapsed-borders-adjoining-sections-vertical-rl.html: Added.
* fast/table/border-collapsing/collapsed-borders-adjoining-sections.html: Added.
* fast/table/border-collapsing/collapsed-borders-painted-once-on-inner-cells-expected.png: Added.
* fast/table/border-collapsing/collapsed-borders-painted-once-on-inner-cells-expected.txt: Added.
* fast/table/border-collapsing/collapsed-borders-painted-once-on-inner-cells.html: Added.


git-svn-id: http://svn.webkit.org/repository/webkit/trunk@154622 268f45cc-cd09-0410-ab3c-d52691b4dbfc
parent ccc2ab74
2013-08-26 Robert Hogan <robert@webkit.org>
Avoid painting every non-edge collapsed border twice over
https://bugs.webkit.org/show_bug.cgi?id=119759
Reviewed by David Hyatt.
* fast/table/border-collapsing/collapsed-borders-adjoining-sections-expected.html: Added.
* fast/table/border-collapsing/collapsed-borders-adjoining-sections-vertical-rl-expected.png: Added.
* fast/table/border-collapsing/collapsed-borders-adjoining-sections-vertical-rl-expected.txt: Added.
The painting here, though still wrong, is a progression on the behaviour prior to bug 11759 where
the left border was painted twice. The painting can be resolved completely when we no longer paint
twice at the border joins.
* fast/table/border-collapsing/collapsed-borders-adjoining-sections-vertical-rl.html: Added.
* fast/table/border-collapsing/collapsed-borders-adjoining-sections.html: Added.
* fast/table/border-collapsing/collapsed-borders-painted-once-on-inner-cells-expected.png: Added.
* fast/table/border-collapsing/collapsed-borders-painted-once-on-inner-cells-expected.txt: Added.
* fast/table/border-collapsing/collapsed-borders-painted-once-on-inner-cells.html: Added.
2013-08-26 Gurpreet Kaur <gur.trio@gmail.com>
<https://webkit.org/b/106133> document.body.scrollTop & document.documentElement.scrollTop differ cross-browser
<!doctype html>
<head>
<style>
table {
border-collapse: collapse;
}
#tbody1 {
border: solid 20px rgba(0,0,255,0.5);
}
td {
height: 20px;
width: 20px;
}
</style>
</head>
<body>
<table>
<p> webkit.org/b/119759: Collapsed borders on adjoining table sections should not overpaint each other.
<tbody id="tbody1">
<tr>
<td></td>
<td></td>
<td></td>
</tr>
<tr>
<td></td>
<td></td>
<td></td>
</tr>
<tr>
<td></td>
<td></td>
<td></td>
</tr>
</tbody>
</table>
</body
</html>
layer at (0,0) size 800x600
RenderView at (0,0) size 800x600
layer at (0,0) size 800x122
RenderBlock {HTML} at (0,0) size 800x122
RenderBody {BODY} at (8,8) size 784x106
RenderTable {TABLE} at (0,0) size 128x106 [border: (10px none #808080)]
RenderTableSection {TBODY} at (10,10) size 86x86 [border: (20px solid #0000FF7F)]
RenderTableRow {TR} at (0,0) size 32x86
RenderTableCell {TD} at (0,10) size 32x12 [border: (10px none #000000)] [r=0 c=0 rs=1 cs=1]
RenderTableCell {TD} at (0,42) size 32x2 [border: none] [r=0 c=1 rs=1 cs=1]
RenderTableCell {TD} at (0,64) size 32x12 [border: none] [r=0 c=2 rs=1 cs=1]
RenderTableRow {TR} at (0,32) size 22x86
RenderTableCell {TD} at (32,10) size 22x12 [border: (10px none #000000)] [r=1 c=0 rs=1 cs=1]
RenderTableCell {TD} at (32,42) size 22x2 [r=1 c=1 rs=1 cs=1]
RenderTableCell {TD} at (32,64) size 22x12 [border: none] [r=1 c=2 rs=1 cs=1]
RenderTableRow {TR} at (0,54) size 32x86
RenderTableCell {TD} at (54,10) size 32x12 [border: (10px none #000000)] [r=2 c=0 rs=1 cs=1]
RenderTableCell {TD} at (54,42) size 32x2 [border: none] [r=2 c=1 rs=1 cs=1]
RenderTableCell {TD} at (54,64) size 32x12 [border: none] [r=2 c=2 rs=1 cs=1]
RenderTableSection {TBODY} at (96,10) size 32x86
RenderTableRow {TR} at (0,0) size 32x86
RenderTableCell {TD} at (0,10) size 32x12 [border: none] [r=0 c=0 rs=1 cs=1]
RenderTableCell {TD} at (0,42) size 32x2 [border: none] [r=0 c=1 rs=1 cs=1]
RenderTableCell {TD} at (0,64) size 32x12 [border: none] [r=0 c=2 rs=1 cs=1]
<!doctype html>
<head>
<style>
table {
border-collapse: collapse;
-webkit-writing-mode: vertical-rl;
}
#tbody1 {
border: solid 20px rgba(0,0,255,0.5);
}
td {
height: 20px;
width: 20px;
}
</style>
</head>
<body>
<table>
<!-- webkit.org/b/119759: Collapsed borders on adjoining table sections should not overpaint each other.
The painting here, though still wrong, is a progression on the behaviour prior to bug 11759 where
the left border was painted twice. The painting can be resolved completely when we no longer paint
twice at the border joins.-->
<tbody id="tbody1">
<tr>
<td></td>
<td></td>
<td></td>
</tr>
<tr>
<td></td>
<td></td>
<td></td>
</tr>
<tr>
<td></td>
<td></td>
<td></td>
</tr>
</tbody>
<tbody id="tbody2">
<tr>
<td></td>
<td></td>
<td></td>
</tr>
</tbody>
</table>
</body
</html>
<!doctype html>
<head>
<style>
table {
border-collapse: collapse;
}
#tbody1 {
border: solid 20px rgba(0,0,255,0.5);
}
#tbody2 {
border-top: solid 20px green;
}
td {
height: 20px;
width: 20px;
}
</style>
</head>
<body>
<table>
<p> webkit.org/b/119759: Collapsed borders on adjoining table sections should not overpaint each other.
<tbody id="tbody1">
<tr>
<td></td>
<td></td>
<td></td>
</tr>
<tr>
<td></td>
<td></td>
<td></td>
</tr>
<tr>
<td></td>
<td></td>
<td></td>
</tr>
</tbody>
<tbody id="tbody2">
<tr>
<td></td>
<td></td>
<td></td>
</tr>
</tbody>
</table>
</body
</html>
layer at (0,0) size 800x600
RenderView at (0,0) size 800x600
layer at (0,0) size 800x204
RenderBlock {HTML} at (0,0) size 800x204
RenderBody {BODY} at (8,8) size 784x188
RenderTable {TABLE} at (0,0) size 146x188 [border: (10px none #808080)]
RenderTableSection {TBODY} at (10,10) size 126x126
RenderTableRow {TR} at (0,0) size 126x42
RenderTableCell {TD} at (0,10) size 42x22 [border: (10px solid #0000FF7F)] [r=0 c=0 rs=1 cs=1]
RenderTableCell {TD} at (42,10) size 42x22 [border: (10px solid #0000FF7F)] [r=0 c=1 rs=1 cs=1]
RenderTableCell {TD} at (84,10) size 42x22 [border: (10px solid #0000FF7F)] [r=0 c=2 rs=1 cs=1]
RenderTableRow {TR} at (0,42) size 126x42
RenderTableCell {TD} at (0,52) size 42x22 [border: (10px solid #0000FF7F)] [r=1 c=0 rs=1 cs=1]
RenderTableCell {TD} at (42,52) size 42x22 [border: (10px solid #0000FF7F)] [r=1 c=1 rs=1 cs=1]
RenderTableCell {TD} at (84,52) size 42x22 [border: (10px solid #0000FF7F)] [r=1 c=2 rs=1 cs=1]
RenderTableRow {TR} at (0,84) size 126x42
RenderTableCell {TD} at (0,94) size 42x22 [border: (10px solid #0000FF7F)] [r=2 c=0 rs=1 cs=1]
RenderTableCell {TD} at (42,94) size 42x22 [border: (10px solid #0000FF7F)] [r=2 c=1 rs=1 cs=1]
RenderTableCell {TD} at (84,94) size 42x22 [border: (10px solid #0000FF7F)] [r=2 c=2 rs=1 cs=1]
RenderTableSection {TBODY} at (10,136) size 126x42
RenderTableRow {TR} at (0,0) size 126x42
RenderTableCell {TD} at (0,10) size 42x22 [border: (10px solid #0000FF7F)] [r=0 c=0 rs=1 cs=1]
RenderTableCell {TD} at (42,10) size 42x22 [border: (10px solid #0000FF7F)] [r=0 c=1 rs=1 cs=1]
RenderTableCell {TD} at (84,10) size 42x22 [border: (10px solid #0000FF7F)] [r=0 c=2 rs=1 cs=1]
<!doctype html>
<head>
<style>
table {
border-collapse: collapse;
}
td {
border: solid 20px rgba(0,0,255,0.5);
height: 20px;
width: 20px;
}
</style>
</head>
<body>
<table>
<!-- webkit.org/b/119759: Collapsed borders on non-edge cells should only be painted once. So adjoining borders
below should be semi-transparent rather than dark. The joins will be dark until that is fixed separately. -->
<tbody id="tbody1">
<tr>
<td></td>
<td></td>
<td></td>
</tr>
<tr>
<td></td>
<td></td>
<td></td>
</tr>
<tr>
<td></td>
<td></td>
<td></td>
</tr>
</tbody>
<tbody id="tbody2">
<tr>
<td></td>
<td></td>
<td></td>
</tr>
</tbody>
</table>
</body
</html>
2013-08-26 Robert Hogan <robert@webkit.org>
Avoid painting every non-edge collapsed border twice over
https://bugs.webkit.org/show_bug.cgi?id=119759
Reviewed by David Hyatt.
Every collapsed border that isn't on the edge of a table gets painted at least twice, once by each
adjacent cell. The joins are painted four times. This is unnecessary and results in tables with semi-transparent
borders getting rendered incorrectly - each border adjoing two cells is painted twice and ends up darker than it should be.
Fixing the overpainting at joins is another day's work. This patch ensures each collapsed border inside a table is only
painted once. It does this by only allowing cells at the top and left edge of the table to paint their top and left collapsed borders.
All the others can only paint their right and bottom collapsed border. This works because the borders are painted from bottom right to top left.
Tests: fast/table/border-collapsing/collapsed-borders-adjoining-sections-vertical-rl.html
fast/table/border-collapsing/collapsed-borders-adjoining-sections.html
* rendering/RenderTableCell.cpp:
(WebCore::RenderTableCell::paintCollapsedBorders):
2013-08-26 Andreas Kling <akling@apple.com>
Unreviewed build fix.
......@@ -1194,12 +1194,14 @@ void RenderTableCell::paintCollapsedBorders(PaintInfo& paintInfo, const LayoutPo
int bottomYOffsetLeft = bottomWidth;
int bottomYOffsetRight = bottomWidth;
bool shouldDrawTopBorder = true;
bool shouldDrawLeftBorder = true;
// We use the direction/writing-mode given by the section here because we want to know if we're
// at the section's edge.
bool shouldDrawTopBorder = !cellAtTop(section()->style());
bool shouldDrawLeftBorder = !cellAtLeft(section()->style());
bool shouldDrawRightBorder = true;
if (RenderTableCell* top = cellAtTop(styleForCellFlow)) {
shouldDrawTopBorder = top->alignLeftRightBorderPaintRect(leftXOffsetTop, rightXOffsetTop);
shouldDrawTopBorder = shouldDrawTopBorder && top->alignLeftRightBorderPaintRect(leftXOffsetTop, rightXOffsetTop);
if (this->colSpan() > 1)
shouldDrawTopBorder = false;
}
......@@ -1208,7 +1210,7 @@ void RenderTableCell::paintCollapsedBorders(PaintInfo& paintInfo, const LayoutPo
bottom->alignLeftRightBorderPaintRect(leftXOffsetBottom, rightXOffsetBottom);
if (RenderTableCell* left = cellAtLeft(styleForCellFlow))
shouldDrawLeftBorder = left->alignTopBottomBorderPaintRect(topYOffsetLeft, bottomYOffsetLeft);
shouldDrawLeftBorder = shouldDrawLeftBorder && left->alignTopBottomBorderPaintRect(topYOffsetLeft, bottomYOffsetLeft);
if (RenderTableCell* right = cellAtRight(styleForCellFlow))
shouldDrawRightBorder = right->alignTopBottomBorderPaintRect(topYOffsetRight, bottomYOffsetRight);
......
Markdown is supported
0% or .
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment