[TablesNG] Fix paint phase of collapsed borders.
As above currently they are painting in the foreground phase when they
should be in the background phase.
Bug: 1217146
Change-Id: I135d61caa5e6822226d7f87c32b3474da15d17b8
Reviewed-on: https://chromium-review.googlesource.com/c/chromium/src/+/2941972
Commit-Queue: Ian Kilpatrick <ikilpatrick@chromium.org>
Reviewed-by: Xianzhu Wang <wangxianzhu@chromium.org>
Cr-Commit-Position: refs/heads/master@{#889870}
diff --git a/css/css-tables/collapsed-border-paint-phase-001.html b/css/css-tables/collapsed-border-paint-phase-001.html
new file mode 100644
index 0000000..9c45eb7
--- /dev/null
+++ b/css/css-tables/collapsed-border-paint-phase-001.html
@@ -0,0 +1,13 @@
+<!DOCTYPE html>
+<link rel="help" href="https://www.w3.org/TR/CSS2/zindex.html">
+<link rel="match" href="../reference/ref-filled-green-100px-square.xht">
+<meta name="assert" content="A tables collapsed borders paint in the background paint phase.">
+<p>Test passes if there is a filled green square and <strong>no red</strong>.</p>
+<table style="border-collapse: collapse; border-spacing: 0;">
+ <td style="border-right: 50px solid red; padding: 0;">
+ <div style="width: 50px; line-height: 0;">
+ <!-- Paints in the foreground phase above the collapsed borders. -->
+ <div style="display: inline-block; width: 100px; height: 100px; background: green;"></div>
+ </div>
+ </td>
+</table>
diff --git a/css/css-tables/collapsed-border-paint-phase-002.html b/css/css-tables/collapsed-border-paint-phase-002.html
new file mode 100644
index 0000000..865069d
--- /dev/null
+++ b/css/css-tables/collapsed-border-paint-phase-002.html
@@ -0,0 +1,13 @@
+<!DOCTYPE html>
+<link rel="help" href="https://www.w3.org/TR/CSS2/zindex.html">
+<link rel="match" href="../reference/ref-filled-green-100px-square.xht">
+<meta name="assert" content="A tables collapsed borders paint in the background paint phase, after children.">
+<p>Test passes if there is a filled green square and <strong>no red</strong>.</p>
+<!DOCTYPE html>
+<table style="border-collapse: collapse; border-spacing: 0;">
+ <td style="border-right: solid 100px green; height: 100px; padding: 0;">
+ <div style="width: 0;">
+ <div style="width: 100px; height: 100px; background: red;"></div>
+ </div>
+ </td>
+</table>
