[tables] Fix painting of table-cols with complex writing-mode direction
The logic within NGTableRowPainter::PaintColumnsBackground was doing
some incorrect Logical->Physical conversions. Instead of the previous
logic use the standard WritingModeConverter to do these conversions.
Additionally what various offsets were relative to was complicated
(for me at least).
Made of the rects, paint-rects instead (relative to the paint origin).
Change-Id: I731e447fb0c1779fa1abcb67646f7d2100213100
Reviewed-on: https://chromium-review.googlesource.com/c/chromium/src/+/3597208
Reviewed-by: Philip Rogers <pdr@chromium.org>
Reviewed-by: Xianzhu Wang <wangxianzhu@chromium.org>
Commit-Queue: Ian Kilpatrick <ikilpatrick@chromium.org>
Cr-Commit-Position: refs/heads/main@{#995557}
diff --git a/css/css-tables/paint/col-paint-htb-rtl-ref.html b/css/css-tables/paint/col-paint-htb-rtl-ref.html
new file mode 100644
index 0000000..107a960
--- /dev/null
+++ b/css/css-tables/paint/col-paint-htb-rtl-ref.html
@@ -0,0 +1,17 @@
+<!DOCTYPE html>
+<style>
+table { border: solid 2px; border-spacing: 5px; padding: 5px; }
+col { background: linear-gradient(60deg, red 50%, blue 50%); }
+</style>
+<table>
+ <col style="width: 50px;"></col>
+ <col style="width: 100px;"></col>
+ <tr style="height: 100px;">
+ <td></td>
+ <td></td>
+ </tr>
+ <tr style="height: 50px;">
+ <td></td>
+ <td></td>
+ </tr>
+</table>
diff --git a/css/css-tables/paint/col-paint-htb-rtl.html b/css/css-tables/paint/col-paint-htb-rtl.html
new file mode 100644
index 0000000..1508421
--- /dev/null
+++ b/css/css-tables/paint/col-paint-htb-rtl.html
@@ -0,0 +1,19 @@
+<!DOCTYPE html>
+<link rel="help" href="https://drafts.csswg.org/css-tables-3/#drawing-cell-backgrounds">
+<link rel="match" href="col-paint-htb-rtl-ref.html">
+<style>
+table { border: solid 2px; border-spacing: 5px; padding: 5px; }
+col { background: linear-gradient(60deg, red 50%, blue 50%); }
+</style>
+<table style="direction: rtl;">
+ <col style="width: 100px;"></col>
+ <col style="width: 50px;"></col>
+ <tr style="height: 100px;">
+ <td></td>
+ <td></td>
+ </tr>
+ <tr style="height: 50px;">
+ <td></td>
+ <td></td>
+ </tr>
+</table>
diff --git a/css/css-tables/paint/col-paint-vrl-rtl-ref.html b/css/css-tables/paint/col-paint-vrl-rtl-ref.html
new file mode 100644
index 0000000..a651e03
--- /dev/null
+++ b/css/css-tables/paint/col-paint-vrl-rtl-ref.html
@@ -0,0 +1,17 @@
+<!DOCTYPE html>
+<style>
+table { border: solid 2px; border-spacing: 5px; padding: 5px; }
+col { background: linear-gradient(-60deg, red 50%, blue 50%); }
+</style>
+<table style="transform: rotate(90deg);">
+ <col style="width: 100px;"></col>
+ <col style="width: 50px;"></col>
+ <tr style="height: 100px;">
+ <td></td>
+ <td></td>
+ </tr>
+ <tr style="height: 50px;">
+ <td></td>
+ <td></td>
+ </tr>
+</table>
diff --git a/css/css-tables/paint/col-paint-vrl-rtl.html b/css/css-tables/paint/col-paint-vrl-rtl.html
new file mode 100644
index 0000000..d76ea59
--- /dev/null
+++ b/css/css-tables/paint/col-paint-vrl-rtl.html
@@ -0,0 +1,19 @@
+<!DOCTYPE html>
+<link rel="help" href="https://drafts.csswg.org/css-tables-3/#drawing-cell-backgrounds">
+<link rel="match" href="col-paint-vrl-rtl-ref.html">
+<style>
+table { border: solid 2px; border-spacing: 5px; padding: 5px; }
+col { background: linear-gradient(30deg, red 50%, blue 50%); }
+</style>
+<table style="writing-mode: vertical-rl; direction: rtl;">
+ <col style="height: 50px;"></col>
+ <col style="height: 100px;"></col>
+ <tr style="width: 100px;">
+ <td></td>
+ <td></td>
+ </tr>
+ <tr style="width: 50px;">
+ <td></td>
+ <td></td>
+ </tr>
+</table>
