From 26a029d407be480d791972afb5975cf62c9360a6 Mon Sep 17 00:00:00 2001
From: Daniel Baumann <daniel.baumann@progress-linux.org>
Date: Fri, 19 Apr 2024 02:47:55 +0200
Subject: Adding upstream version 124.0.1.

Signed-off-by: Daniel Baumann <daniel.baumann@progress-linux.org>
---
 .../computing-row-measure-0.html                   |  71 ++++++++
 .../computing-row-measure-1.html                   |  94 ++++++++++
 .../extra-height-given-to-all-row-groups-001.html  |  41 +++++
 .../extra-height-given-to-all-row-groups-002.html  |  41 +++++
 .../extra-height-given-to-all-row-groups-003.html  |  49 +++++
 .../extra-height-given-to-all-row-groups-004.html  |  49 +++++
 .../extra-height-given-to-all-row-groups-005.html  |  41 +++++
 .../percentage-sizing-of-table-cell-007-ref.html   |   8 +
 .../percentage-sizing-of-table-cell-007.html       |  10 ++
 ...tage-sizing-of-table-cell-children-002-ref.html |  37 ++++
 ...rcentage-sizing-of-table-cell-children-002.html |  39 ++++
 ...rcentage-sizing-of-table-cell-children-003.html |  37 ++++
 ...rcentage-sizing-of-table-cell-children-004.html |  37 ++++
 ...rcentage-sizing-of-table-cell-children-005.html |  40 +++++
 ...rcentage-sizing-of-table-cell-children-006.html |  38 ++++
 .../percentage-sizing-of-table-cell-children.html  | 199 +++++++++++++++++++++
 ...ng-of-table-cell-replaced-children-001-ref.html |  38 ++++
 ...sizing-of-table-cell-replaced-children-001.html |  40 +++++
 .../height-distribution/support/scrollbars.css     |  10 ++
 ...different-subpixel-padding-in-same-row-ref.html |  12 ++
 ...bpixel-padding-in-same-row-vertical-rl-ref.html |  13 ++
 ...t-subpixel-padding-in-same-row-vertical-rl.html |  15 ++
 .../td-different-subpixel-padding-in-same-row.html |  14 ++
 23 files changed, 973 insertions(+)
 create mode 100644 testing/web-platform/tests/css/css-tables/height-distribution/computing-row-measure-0.html
 create mode 100644 testing/web-platform/tests/css/css-tables/height-distribution/computing-row-measure-1.html
 create mode 100644 testing/web-platform/tests/css/css-tables/height-distribution/extra-height-given-to-all-row-groups-001.html
 create mode 100644 testing/web-platform/tests/css/css-tables/height-distribution/extra-height-given-to-all-row-groups-002.html
 create mode 100644 testing/web-platform/tests/css/css-tables/height-distribution/extra-height-given-to-all-row-groups-003.html
 create mode 100644 testing/web-platform/tests/css/css-tables/height-distribution/extra-height-given-to-all-row-groups-004.html
 create mode 100644 testing/web-platform/tests/css/css-tables/height-distribution/extra-height-given-to-all-row-groups-005.html
 create mode 100644 testing/web-platform/tests/css/css-tables/height-distribution/percentage-sizing-of-table-cell-007-ref.html
 create mode 100644 testing/web-platform/tests/css/css-tables/height-distribution/percentage-sizing-of-table-cell-007.html
 create mode 100644 testing/web-platform/tests/css/css-tables/height-distribution/percentage-sizing-of-table-cell-children-002-ref.html
 create mode 100644 testing/web-platform/tests/css/css-tables/height-distribution/percentage-sizing-of-table-cell-children-002.html
 create mode 100644 testing/web-platform/tests/css/css-tables/height-distribution/percentage-sizing-of-table-cell-children-003.html
 create mode 100644 testing/web-platform/tests/css/css-tables/height-distribution/percentage-sizing-of-table-cell-children-004.html
 create mode 100644 testing/web-platform/tests/css/css-tables/height-distribution/percentage-sizing-of-table-cell-children-005.html
 create mode 100644 testing/web-platform/tests/css/css-tables/height-distribution/percentage-sizing-of-table-cell-children-006.html
 create mode 100644 testing/web-platform/tests/css/css-tables/height-distribution/percentage-sizing-of-table-cell-children.html
 create mode 100644 testing/web-platform/tests/css/css-tables/height-distribution/percentage-sizing-of-table-cell-replaced-children-001-ref.html
 create mode 100644 testing/web-platform/tests/css/css-tables/height-distribution/percentage-sizing-of-table-cell-replaced-children-001.html
 create mode 100644 testing/web-platform/tests/css/css-tables/height-distribution/support/scrollbars.css
 create mode 100644 testing/web-platform/tests/css/css-tables/height-distribution/td-different-subpixel-padding-in-same-row-ref.html
 create mode 100644 testing/web-platform/tests/css/css-tables/height-distribution/td-different-subpixel-padding-in-same-row-vertical-rl-ref.html
 create mode 100644 testing/web-platform/tests/css/css-tables/height-distribution/td-different-subpixel-padding-in-same-row-vertical-rl.html
 create mode 100644 testing/web-platform/tests/css/css-tables/height-distribution/td-different-subpixel-padding-in-same-row.html

(limited to 'testing/web-platform/tests/css/css-tables/height-distribution')

diff --git a/testing/web-platform/tests/css/css-tables/height-distribution/computing-row-measure-0.html b/testing/web-platform/tests/css/css-tables/height-distribution/computing-row-measure-0.html
new file mode 100644
index 0000000000..ebaab2c359
--- /dev/null
+++ b/testing/web-platform/tests/css/css-tables/height-distribution/computing-row-measure-0.html
@@ -0,0 +1,71 @@
+<!doctype html>
+<script src='/resources/testharness.js'></script>
+<script src='/resources/testharnessreport.js'></script>
+<link rel='stylesheet' href='../support/base.css' />
+
+<link rel="author" title="Greg Whitworth" href="gwhit@microsoft.com" />
+<link rel="help" href="https://drafts.csswg.org/css-tables-3/#computing-column-measures" />
+<main>
+    <h4>"Computing row measures"</h4>
+    <p>This is testing that the table root's minimum is max(table-root width, capmin, gridmin) <a href="https://drafts.csswg.org/css-tables-3/#computing-the-table-width">Spec Text</a></p>
+
+    <hr/>
+    <table id="one" cellspacing="0" cellpadding="0">
+        <tbody style="height: 1px;">
+            <tr style="height: 10px;">
+                <td style="height: 1px;"></td>
+            </tr>
+        </tbody>
+    </table>
+
+    <table id="two" cellspacing="0" cellpadding="0">
+        <tbody style="height: 10px;">
+            <tr style="height: 1px;">
+                <td style="height: 1px;"></td>
+            </tr>
+        </tbody>
+    </table>
+
+    <table id="three" cellspacing="0" cellpadding="0">
+        <tbody style="height: 1px;">
+            <tr style="height: 1px;">
+                <td style="height: 10px;"></td>
+            </tr>
+        </tbody>
+    </table>
+
+    <table id="four" cellspacing="0" cellpadding="0">
+        <tbody style="height: 10px;">
+            <tr>
+                <td style="height: 1px;"></td>
+            </tr>
+        </tbody>
+    </table>
+</main>
+
+<script>
+    var i = 1;
+    generate_tests(assert_equals, [
+        [
+            "Checking intermediate min-content height for span 1 (1)",
+            document.getElementById('one').offsetHeight,
+            10
+        ],
+        [
+            "Checking intermediate min-content height for span 1 (2)",
+            document.getElementById('two').offsetHeight,
+            10
+        ],
+        [
+            "Checking intermediate min-content height for span 1 (3)",
+            document.getElementById('three').offsetHeight,
+            10
+        ],
+        [
+            "Checking intermediate min-content height for span 1 (4)",
+            document.getElementById('four').offsetHeight,
+            10
+        ]
+    ]);
+</script>
+</html>
diff --git a/testing/web-platform/tests/css/css-tables/height-distribution/computing-row-measure-1.html b/testing/web-platform/tests/css/css-tables/height-distribution/computing-row-measure-1.html
new file mode 100644
index 0000000000..756e730eef
--- /dev/null
+++ b/testing/web-platform/tests/css/css-tables/height-distribution/computing-row-measure-1.html
@@ -0,0 +1,94 @@
+<!doctype html>
+<script src='/resources/testharness.js'></script>
+<script src='/resources/testharnessreport.js'></script>
+<link rel='stylesheet' href='../support/base.css' />
+
+<link rel="author" title="Greg Whitworth" href="gwhit@microsoft.com" />
+<link rel="help" href="https://drafts.csswg.org/css-tables-3/#computing-column-measures" />
+<main>
+    <h1>Width Distribution</h1>
+    <h4>"Computing column measures"</h4>
+    <p>This is testing intermediate min-content width for span 2</p>
+
+    <hr/>
+    <table cellspacing="0" cellpadding="0">
+        <colgroup style="width: auto;">
+            <col style="width: 10px;"></col>
+            <col style="width: 20px;"></col>
+        </colgroup>
+        <tr>
+            <td id="one" style="width: 1px;"></td>
+            <td style="width: 2px;"></td>
+        </tr>
+        <tr>
+            <td colspan="2" style="width: 51px;"></td>
+        </tr>
+    </table>
+
+    <table cellspacing="0" cellpadding="0">
+        <colgroup style="width: auto;">
+            <col style="width: 10px;"></col>
+            <col style="width: auto;"></col>
+        </colgroup>
+        <tr>
+            <td id="two" style="width: 1px;"></td>
+            <td style="width: auto;"></td>
+        </tr>
+        <tr>
+            <td colspan="2" style="width: 51px;"></td>
+        </tr>
+    </table>
+
+    <table cellspacing="0" cellpadding="0">
+        <colgroup style="width: 51px;">
+            <col style="width: 10px;"></col>
+            <col style="width: 20px;"></col>
+        </colgroup>
+        <tr>
+            <td id="three" style="width: 1px;"></td>
+            <td style="width: 2px;"></td>
+        </tr>
+    </table>
+
+    <table cellspacing="0" cellpadding="0">
+        <colgroup style="width: 51px;">
+            <col style="width: 20px;"></col>
+            <col style="width: auto;"></col>
+        </colgroup>
+        <tr>
+            <td style="width: 10px;"></td>
+            <td id="four" style="width: 20px;"></td>
+        </tr>
+    </table>
+</main>
+
+<style>
+    table { margin-bottom: 10px; height: 50px; }
+    td { outline: 1px solid red; outline-offset: -1px; }
+</style>
+<script>
+    var i = 1;
+    generate_tests(assert_equals, [
+        [
+            "Checking intermediate min-content width for span 2 (1)",
+            document.getElementById('one').offsetWidth,
+            17
+        ],
+        [
+            "Checking intermediate min-content width for span 2 (2)",
+            document.getElementById('two').offsetWidth,
+            10
+        ],
+        [
+            "Checking intermediate min-content width for span 2 (3)",
+            document.getElementById('three').offsetWidth,
+            10
+        ],
+        [
+            "Checking intermediate min-content width for span 2 (4)",
+            document.getElementById('four').offsetWidth,
+            51
+        ]
+    ]);
+</script>
+</html>
diff --git a/testing/web-platform/tests/css/css-tables/height-distribution/extra-height-given-to-all-row-groups-001.html b/testing/web-platform/tests/css/css-tables/height-distribution/extra-height-given-to-all-row-groups-001.html
new file mode 100644
index 0000000000..387bfafae1
--- /dev/null
+++ b/testing/web-platform/tests/css/css-tables/height-distribution/extra-height-given-to-all-row-groups-001.html
@@ -0,0 +1,41 @@
+<!DOCTYPE html>
+<meta charset="utf-8">
+<link rel="author" title="David Grogan" href="dgrogan@chromium.org">
+<link rel="help" href="https://drafts.csswg.org/css-tables-3/#height-distribution-algorithm">
+<link rel="match" href="../../reference/ref-filled-green-100px-square.xht">
+<link rel="bookmark" href="https://bugs.chromium.org/p/chromium/issues/detail?id=708345" />
+<meta name="assert" content="height of rows in thead are increased to match table height" />
+<title>
+all row groups receive extra height distribution
+</title>
+
+<style>
+table {
+  background: green;
+  border-collapse:collapse;
+}
+
+td {
+  padding:0px;
+}
+
+#redSquare {
+  height: 100px;
+  width: 100px;
+  background-color: red;
+  position: absolute;
+  z-index: -1;
+}
+</style>
+
+<p>Test passes if there is a filled green square and <strong>no red</strong>.
+</p>
+<div id="redSquare"></div>
+<table style="height:100px">
+  <thead>
+    <tr>
+      <td><div style="display:inline-block; width:100px;">
+      </div></td>
+    </tr>
+  </thead>
+</table>
diff --git a/testing/web-platform/tests/css/css-tables/height-distribution/extra-height-given-to-all-row-groups-002.html b/testing/web-platform/tests/css/css-tables/height-distribution/extra-height-given-to-all-row-groups-002.html
new file mode 100644
index 0000000000..6a0589d3b8
--- /dev/null
+++ b/testing/web-platform/tests/css/css-tables/height-distribution/extra-height-given-to-all-row-groups-002.html
@@ -0,0 +1,41 @@
+<!DOCTYPE html>
+<meta charset="utf-8">
+<link rel="author" title="David Grogan" href="dgrogan@chromium.org">
+<link rel="help" href="https://drafts.csswg.org/css-tables-3/#height-distribution-algorithm">
+<link rel="match" href="../../reference/ref-filled-green-100px-square.xht">
+<link rel="bookmark" href="https://bugs.chromium.org/p/chromium/issues/detail?id=708345" />
+<meta name="assert" content="height of rows in tbody are increased to match table height" />
+<title>
+all row groups receive extra height distribution
+</title>
+
+<style>
+table {
+  background: green;
+  border-collapse:collapse;
+}
+
+td {
+  padding:0px;
+}
+
+#redSquare {
+  height: 100px;
+  width: 100px;
+  background-color: red;
+  position: absolute;
+  z-index: -1;
+}
+</style>
+
+<p>Test passes if there is a filled green square and <strong>no red</strong>.
+</p>
+<div id="redSquare"></div>
+<table style="height:100px">
+  <tbody>
+    <tr>
+      <td><div style="display:inline-block; width:100px;">
+      </div></td>
+    </tr>
+  </tbody>
+</table>
diff --git a/testing/web-platform/tests/css/css-tables/height-distribution/extra-height-given-to-all-row-groups-003.html b/testing/web-platform/tests/css/css-tables/height-distribution/extra-height-given-to-all-row-groups-003.html
new file mode 100644
index 0000000000..7970f95d0e
--- /dev/null
+++ b/testing/web-platform/tests/css/css-tables/height-distribution/extra-height-given-to-all-row-groups-003.html
@@ -0,0 +1,49 @@
+<!DOCTYPE html>
+<meta charset="utf-8">
+<script src="/resources/testharness.js"></script>
+<script src="/resources/testharnessreport.js"></script>
+<script src="/resources/check-layout-th.js"></script>
+<link rel="author" title="David Grogan" href="dgrogan@chromium.org">
+<link rel="help" href="https://drafts.csswg.org/css-tables-3/#height-distribution-algorithm">
+<link rel="bookmark" href="https://bugs.chromium.org/p/chromium/issues/detail?id=708345" />
+<meta name="assert" content="All rows of equal intrinsic height should be increased the same amount, regardless of which group they are in, tbody+tbody case" />
+<title>
+all row groups receive extra height distribution
+</title>
+
+<style>
+table {
+  border-collapse: collapse;
+}
+
+td {
+  padding: 0px;
+}
+
+td div {
+  width: 100px;
+  height:10px;
+}
+
+tbody {
+  outline: 2px solid lightblue;
+}
+
+</style>
+
+<table id="theTable" style="height:100px">
+  <tbody data-expected-height=50>
+    <tr>
+      <td><div></div></td>
+    </tr>
+  </tbody>
+  <tbody data-expected-height=50>
+    <tr>
+      <td><div></div></td>
+    </tr>
+  </tbody>
+</table>
+
+<script>
+checkLayout('#theTable')
+</script>
diff --git a/testing/web-platform/tests/css/css-tables/height-distribution/extra-height-given-to-all-row-groups-004.html b/testing/web-platform/tests/css/css-tables/height-distribution/extra-height-given-to-all-row-groups-004.html
new file mode 100644
index 0000000000..8ca86957c1
--- /dev/null
+++ b/testing/web-platform/tests/css/css-tables/height-distribution/extra-height-given-to-all-row-groups-004.html
@@ -0,0 +1,49 @@
+<!DOCTYPE html>
+<meta charset="utf-8">
+<script src="/resources/testharness.js"></script>
+<script src="/resources/testharnessreport.js"></script>
+<script src="/resources/check-layout-th.js"></script>
+<link rel="author" title="David Grogan" href="dgrogan@chromium.org">
+<link rel="help" href="https://drafts.csswg.org/css-tables-3/#height-distribution-algorithm">
+<link rel="bookmark" href="https://bugs.chromium.org/p/chromium/issues/detail?id=708345" />
+<meta name="assert" content="All rows of equal intrinsic height should be increased the same amount, regardless of which group they are in, thead+tbody case" />
+<title>
+all row groups receive extra height distribution
+</title>
+
+<style>
+table {
+  border-collapse: collapse;
+}
+
+td {
+  padding: 0px;
+}
+
+td div {
+  width: 100px;
+  height:10px;
+}
+
+thead, tbody {
+  outline: 2px solid lightblue;
+}
+
+</style>
+
+<table id="theTable" style="height:100px">
+  <thead data-expected-height=50>
+    <tr>
+      <td><div></div></td>
+    </tr>
+  </thead>
+  <tbody data-expected-height=50>
+    <tr>
+      <td><div></div></td>
+    </tr>
+  </tbody>
+</table>
+
+<script>
+checkLayout('#theTable')
+</script>
diff --git a/testing/web-platform/tests/css/css-tables/height-distribution/extra-height-given-to-all-row-groups-005.html b/testing/web-platform/tests/css/css-tables/height-distribution/extra-height-given-to-all-row-groups-005.html
new file mode 100644
index 0000000000..381d775e89
--- /dev/null
+++ b/testing/web-platform/tests/css/css-tables/height-distribution/extra-height-given-to-all-row-groups-005.html
@@ -0,0 +1,41 @@
+<!DOCTYPE html>
+<meta charset="utf-8">
+<link rel="author" title="David Grogan" href="dgrogan@chromium.org">
+<link rel="help" href="https://drafts.csswg.org/css-tables-3/#height-distribution-algorithm">
+<link rel="match" href="../../reference/ref-filled-green-100px-square.xht">
+<link rel="bookmark" href="https://bugs.chromium.org/p/chromium/issues/detail?id=708345" />
+<meta name="assert" content="height of rows in tfoot are increased to match table height" />
+<title>
+all row groups receive extra height distribution
+</title>
+
+<style>
+table {
+  background: green;
+  border-collapse:collapse;
+}
+
+td {
+  padding:0px;
+}
+
+#redSquare {
+  height: 100px;
+  width: 100px;
+  background-color: red;
+  position: absolute;
+  z-index: -1;
+}
+</style>
+
+<p>Test passes if there is a filled green square and <strong>no red</strong>.
+</p>
+<div id="redSquare"></div>
+<table style="height:100px">
+  <tfoot>
+    <tr>
+      <td><div style="display:inline-block; width:100px;">
+      </div></td>
+    </tr>
+  </tfoot>
+</table>
diff --git a/testing/web-platform/tests/css/css-tables/height-distribution/percentage-sizing-of-table-cell-007-ref.html b/testing/web-platform/tests/css/css-tables/height-distribution/percentage-sizing-of-table-cell-007-ref.html
new file mode 100644
index 0000000000..cdd6e7c906
--- /dev/null
+++ b/testing/web-platform/tests/css/css-tables/height-distribution/percentage-sizing-of-table-cell-007-ref.html
@@ -0,0 +1,8 @@
+<!DOCTYPE html>
+<table>
+  <td>
+    <div style="width: 100px; height: 100px; overflow-y: scroll;">
+      <div style="height: 200px; background: green;"></div>
+    </div>
+  </td>
+</table>
diff --git a/testing/web-platform/tests/css/css-tables/height-distribution/percentage-sizing-of-table-cell-007.html b/testing/web-platform/tests/css/css-tables/height-distribution/percentage-sizing-of-table-cell-007.html
new file mode 100644
index 0000000000..371333a24d
--- /dev/null
+++ b/testing/web-platform/tests/css/css-tables/height-distribution/percentage-sizing-of-table-cell-007.html
@@ -0,0 +1,10 @@
+<!DOCTYPE html>
+<link rel="help" href="https://bugs.chromium.org/p/chromium/issues/detail?id=1227868">
+<link rel="match" href="percentage-sizing-of-table-cell-007-ref.html">
+<table style="height: 100%;">
+  <td>
+    <div style="width: 100px; min-height: 100px; height: 100%; overflow-y: scroll;">
+      <div style="height: 200px; background: green;"></div>
+    </div>
+  </td>
+</table>
diff --git a/testing/web-platform/tests/css/css-tables/height-distribution/percentage-sizing-of-table-cell-children-002-ref.html b/testing/web-platform/tests/css/css-tables/height-distribution/percentage-sizing-of-table-cell-children-002-ref.html
new file mode 100644
index 0000000000..f2ed9e15dd
--- /dev/null
+++ b/testing/web-platform/tests/css/css-tables/height-distribution/percentage-sizing-of-table-cell-children-002-ref.html
@@ -0,0 +1,37 @@
+<!DOCTYPE html>
+<meta charset="utf-8">
+<title>CSS Reftest Reference: Percentage sizing of table cell children with margin, border, padding and scrollbar</title>
+<link rel="author" title="Manuel Rego Casasnovas" href="mailto:rego@igalia.com">
+<style>
+.table {
+  display: block;
+  border: solid 5px black;
+  width: 150px;
+  height: 100px;
+}
+
+.td {
+  background: cyan;
+  overflow: scroll;
+  padding: 5px 15px 10px 20px;
+  border: solid magenta;
+  border-width: 12px 9px 6px 3px;
+  height: 100px;
+  box-sizing: border-box;
+}
+
+.child {
+  background: yellow;
+  width: 100%;
+  height: 100%;
+}
+</style>
+<link rel="stylesheet" type="text/css" href="support/scrollbars.css">
+
+<p>The test passes if you see scrollbars but there's no overflow, so you cannot actually scroll.</p>
+
+<div class="table">
+  <div class="td">
+    <div class="child"></div>
+  </div>
+</div>
diff --git a/testing/web-platform/tests/css/css-tables/height-distribution/percentage-sizing-of-table-cell-children-002.html b/testing/web-platform/tests/css/css-tables/height-distribution/percentage-sizing-of-table-cell-children-002.html
new file mode 100644
index 0000000000..19b02b2031
--- /dev/null
+++ b/testing/web-platform/tests/css/css-tables/height-distribution/percentage-sizing-of-table-cell-children-002.html
@@ -0,0 +1,39 @@
+<!DOCTYPE html>
+<meta charset="utf-8">
+<title>CSS Table Test: Percentage sizing of table cell children with margin, border, padding and scrollbar</title>
+<link rel="author" title="Manuel Rego Casasnovas" href="mailto:rego@igalia.com">
+<link rel="help" href="https://drafts.csswg.org/css-tables-3/#content-measure">
+<link rel="match" href="percentage-sizing-of-table-cell-children-002-ref.html">
+<meta name="assert" content="Checks that table cell children resolve properly their percentage sizes, even when the table cell has margin, border, padding and scrollbar.">
+<style>
+.table {
+  display: table;
+  border: solid 5px black;
+  width: 150px;
+  height: 100px;
+}
+
+.td {
+  display: table-cell;
+  background: cyan;
+  overflow: scroll;
+  padding: 5px 15px 10px 20px;
+  border: solid magenta;
+  border-width: 12px 9px 6px 3px;
+}
+
+.child {
+  background: yellow;
+  width: 100%;
+  height: 100%;
+}
+</style>
+<link rel="stylesheet" type="text/css" href="support/scrollbars.css">
+
+<p>The test passes if you see scrollbars but there's no overflow, so you cannot actually scroll.</p>
+
+<div class="table">
+  <div class="td">
+    <div class="child"></div>
+  </div>
+</div>
diff --git a/testing/web-platform/tests/css/css-tables/height-distribution/percentage-sizing-of-table-cell-children-003.html b/testing/web-platform/tests/css/css-tables/height-distribution/percentage-sizing-of-table-cell-children-003.html
new file mode 100644
index 0000000000..1198e6f649
--- /dev/null
+++ b/testing/web-platform/tests/css/css-tables/height-distribution/percentage-sizing-of-table-cell-children-003.html
@@ -0,0 +1,37 @@
+<!doctype html>
+<link rel="author" title="David Grogan" href="mailto:dgrogan@chromium.org">
+<link rel="help" href="https://drafts.csswg.org/css-tables-3/#row-layout">
+<link rel="match" href="../../reference/ref-filled-green-100px-square.xht">
+<link rel="bookmark" href="https://crbug.com/982312" />
+<meta name="assert" content="min-height is honored on a %height child of a table cell with an unresolvable %height and when the descendant has overflow:auto" />
+
+<title>table cell percent height descendant with overflow:auto</title>
+
+<!-- msft.html -->
+
+<style>
+.list-div {
+  overflow-y: auto;
+  height: 100%;
+  width: 100px;
+  min-height: 100px;
+  background: green;
+}
+#redSquare {
+  height: 100px;
+  width: 100px;
+  background-color: red;
+  position: absolute;
+  z-index: -1;
+}
+</style>
+
+<p>Test passes if there is a filled green square and <strong>no red</strong>.
+</p>
+<div id="redSquare"></div>
+<div style="display:table">
+  <div style="display:table-cell; height:100%">
+    <div class="list-div">
+    </div>
+  </div>
+</div>
diff --git a/testing/web-platform/tests/css/css-tables/height-distribution/percentage-sizing-of-table-cell-children-004.html b/testing/web-platform/tests/css/css-tables/height-distribution/percentage-sizing-of-table-cell-children-004.html
new file mode 100644
index 0000000000..ffbb4b008a
--- /dev/null
+++ b/testing/web-platform/tests/css/css-tables/height-distribution/percentage-sizing-of-table-cell-children-004.html
@@ -0,0 +1,37 @@
+<!doctype html>
+<link rel="author" title="David Grogan" href="mailto:dgrogan@chromium.org">
+<link rel="help" href="https://drafts.csswg.org/css-tables-3/#row-layout">
+<link rel="match" href="../../reference/ref-filled-green-100px-square.xht">
+<link rel="bookmark" href="https://crbug.com/982312" />
+<meta name="assert" content="%height child of a table cell with a fixed height is positioned correctly when the min-height is greater than the cell's fixed height and when the descendant has overflow:auto." />
+
+<title>table cell percent height descendant with overflow:auto</title>
+
+<!-- msft_fixed_height.html -->
+
+<style>
+.list-div {
+  overflow-y: auto;
+  height: 100%;
+  width: 100px;
+  min-height: 100px;
+  background: green;
+}
+#redSquare {
+  height: 100px;
+  width: 100px;
+  background-color: red;
+  position: absolute;
+  z-index: -1;
+}
+</style>
+
+<p>Test passes if there is a filled green square and <strong>no red</strong>.
+</p>
+<div id="redSquare"></div>
+<div style="display:table">
+  <div style="display:table-cell; height:50px">
+    <div class="list-div">
+    </div>
+  </div>
+</div>
diff --git a/testing/web-platform/tests/css/css-tables/height-distribution/percentage-sizing-of-table-cell-children-005.html b/testing/web-platform/tests/css/css-tables/height-distribution/percentage-sizing-of-table-cell-children-005.html
new file mode 100644
index 0000000000..0a0e658bd8
--- /dev/null
+++ b/testing/web-platform/tests/css/css-tables/height-distribution/percentage-sizing-of-table-cell-children-005.html
@@ -0,0 +1,40 @@
+<!doctype html>
+<link rel="author" title="David Grogan" href="mailto:dgrogan@chromium.org">
+<link rel="help" href="https://drafts.csswg.org/css-tables-3/#row-layout">
+<link rel="match" href="../../reference/ref-filled-green-100px-square.xht">
+<link rel="bookmark" href="https://crbug.com/982312" />
+<meta name="assert" content="intrinsic height of a table cell descendant is honored when the descendant and cell both have unresolvable percentage heights and when the descendant has overflow:auto" />
+
+<title>table cell percent height descendant with overflow:auto</title>
+
+<!-- other_msft.html -->
+
+<style>
+.list-div {
+  overflow-y: auto;
+  height: 100%;
+}
+.list-div-child {
+  width: 100px;
+  height: 100px;
+  background: green;
+}
+#redSquare {
+  height: 100px;
+  width: 100px;
+  background-color: red;
+  position: absolute;
+  z-index: -1;
+}
+</style>
+
+<p>Test passes if there is a filled green square and <strong>no red</strong>.
+</p>
+<div id="redSquare"></div>
+<div style="display:table">
+  <div style="display:table-cell; height:100%">
+    <div class="list-div">
+      <div class="list-div-child"></div>
+    </div>
+  </div>
+</div>
diff --git a/testing/web-platform/tests/css/css-tables/height-distribution/percentage-sizing-of-table-cell-children-006.html b/testing/web-platform/tests/css/css-tables/height-distribution/percentage-sizing-of-table-cell-children-006.html
new file mode 100644
index 0000000000..de3ac019b3
--- /dev/null
+++ b/testing/web-platform/tests/css/css-tables/height-distribution/percentage-sizing-of-table-cell-children-006.html
@@ -0,0 +1,38 @@
+<!doctype html>
+<link rel="author" title="David Grogan" href="mailto:dgrogan@chromium.org">
+<link rel="help" href="https://drafts.csswg.org/css-tables-3/#row-layout">
+<link rel="match" href="../../reference/ref-filled-green-100px-square.xht">
+<link rel="bookmark" href="https://crbug.com/982312" />
+<meta name="assert" content="table cell descendant retains its min-height when the descendant and cell both have unresolvable percentage heights and the descendant has overflow:auto, and the cell's sibling has a fixed height greater than the descendant's min-height." />
+
+<title>table cell percent height descendant with overflow:auto</title>
+
+<!-- msftsibling.html -->
+
+<style>
+.list-div {
+  overflow-y: auto;
+  height: 100%;
+  width: 100px;
+  min-height: 100px;
+  background: green;
+}
+#redSquare {
+  height: 100px;
+  width: 100px;
+  background-color: red;
+  position: absolute;
+  z-index: -1;
+}
+</style>
+
+<p>Test passes if there is a filled green square and <strong>no red</strong>.
+</p>
+<div id="redSquare"></div>
+<div style="display:table">
+  <!-- vertical-align:top because blink and ff do baseline differently here -->
+  <div style="display:table-cell; height:100%; vertical-align:top;">
+    <div class="list-div"></div>
+  </div>
+  <div style="display:table-cell; height:150px;"></div>
+</div>
diff --git a/testing/web-platform/tests/css/css-tables/height-distribution/percentage-sizing-of-table-cell-children.html b/testing/web-platform/tests/css/css-tables/height-distribution/percentage-sizing-of-table-cell-children.html
new file mode 100644
index 0000000000..1029581022
--- /dev/null
+++ b/testing/web-platform/tests/css/css-tables/height-distribution/percentage-sizing-of-table-cell-children.html
@@ -0,0 +1,199 @@
+<!doctype html>
+<!--------------------------------------------------------------------------------------->
+<script src='/resources/testharness.js'></script>
+<script src='/resources/testharnessreport.js'></script>
+<link rel='stylesheet' href='../support/base.css' />
+<link rel="help" href="https://drafts.csswg.org/css-tables-3/#computing-column-measures" />
+<script>
+
+    function assertOffsetWidthEquals(a,targetValue) {
+        var desc = document.querySelector('main > hr:last-of-type + p + p') || document.querySelectorAll('main > hr + p + p')[document.querySelectorAll('main > hr + p + p').length-1];
+        var root = document.querySelector('main > div:last-of-type') || document.querySelectorAll('main > div')[document.querySelectorAll('main > div').length-1];
+        generate_tests(assert_equals, [
+            [
+                desc.textContent,
+                root.querySelector("[target="+a+"]").offsetWidth,
+                targetValue
+            ]
+        ]);
+    }
+
+    function assertOffsetHeightEquals(a,targetValue) {
+        var desc = document.querySelector('main > hr:last-of-type + p + p') || document.querySelectorAll('main > hr + p + p')[document.querySelectorAll('main > hr + p + p').length-1];
+        var root = document.querySelector('main > div:last-of-type') || document.querySelectorAll('main > div')[document.querySelectorAll('main > div').length-1];
+        generate_tests(assert_equals, [
+            [
+                desc.textContent,
+                root.querySelector("[target="+a+"]").offsetHeight,
+                targetValue
+            ]
+        ]);
+    }
+
+</script>
+
+
+<main>
+
+    <h1>Height distribution</h1>
+    <p>Check that percentages are accounted for correctly for table-cell children</p>
+
+
+    <hr/><!------------------------------------------------------------------------------------------------------------>
+    <p>There should be a 100px blue square below:</p>
+    <p>Percentages resolve based on the column width</p>
+    <div>
+        <x-table style="width: 100px; height: 100px;">
+            <x-tr><x-td><div target=a style="width: 100%; height: 100px; background: blue"></div></x-td></x-tr>
+        </x-table>
+    </div>
+    <script>
+
+        assertOffsetWidthEquals('a',100);
+
+    </script>
+
+
+    <hr/><!------------------------------------------------------------------------------------------------------------>
+    <p>There should be a 100px blue square below:</p>
+    <p>Percentages resolve based on the row height</p>
+    <div>
+        <x-table style="width: 100px; height: 100px;">
+            <x-tr><x-td><div target=a style="width: 100px; height: 100%; background: blue"></div></x-td></x-tr>
+        </x-table>
+    </div>
+    <script>
+
+        assertOffsetHeightEquals('a',100);
+
+    </script>
+
+    <hr/><!------------------------------------------------------------------------------------------------------------>
+    <p>There should be a 100px blue square below:</p>
+    <p>Percentages resolve based on the final column width</p>
+    <div>
+        <x-table style="width: 0px; height: 100px; background: red;">
+            <x-tr><x-td style="width:0px;height:0px;"><div target=a style="width: 100%; height: 100px; background: blue"></div></x-td></x-tr>
+            <x-tr><x-td style="width:0px;height:0px;"><div target=a style="width: 100px; height: 0px"></div></x-td></x-tr>
+        </x-table>
+    </div>
+    <script>
+
+        assertOffsetWidthEquals('a',100);
+
+    </script>
+
+
+    <hr/><!------------------------------------------------------------------------------------------------------------>
+    <p>There should be a 100px blue square below:</p>
+    <p>Percentages resolve based on the final row height</p>
+    <div>
+        <x-table style="width: 100px; height: 0px; background: red;">
+            <x-tr>
+                <x-td style="width: 0px; height: 0px;"><div target=a style="width: 100px; height: 100%; background: blue"></div></x-td>
+                <x-td style="width: 0px; height: 0px;"><div target=a style="width: 0px; height: 100px; background: red"></div></x-td>
+            </x-tr>
+        </x-table>
+    </div>
+    <script>
+
+        assertOffsetHeightEquals('a',100);
+
+    </script>
+
+
+    <hr/><!------------------------------------------------------------------------------------------------------------>
+    <p>There should be a blue and cyan rectangles of the same width:</p>
+    <p>Unresolvable percentage widths are resolved as auto in first pass (replaced elements)</p>
+    <div>
+        <x-table style="width: 0px; height: 18px; background: red;">
+            <x-tr><x-td><input target=a style="width: 100%; height: 100%; background: blue; vertical-align: top; appearance:none; -webkit-appearance:none; border:0;margin:0;padding:0;"/></x-td></x-tr>
+        </x-table>
+        <input style="background:cyan; appearance:none; -webkit-appearance:none; border:0;margin:0;padding:0;" />
+    </div>
+    <script>
+
+        assertOffsetWidthEquals('a',document.querySelector('input[style="background:cyan; appearance:none; -webkit-appearance:none; border:0;margin:0;padding:0;"]').offsetWidth);
+
+    </script>
+
+
+    <hr/><!------------------------------------------------------------------------------------------------------------>
+    <p>There should be a blue and cyan rectangles below of the same height:</p>
+    <p>Unresolvable percentage heights are resolved as auto in first pass (replaced elements)</p>
+    <div>
+        <x-table style="width: auto; height: 0px; background: red;">
+            <x-tr><x-td><input target=a style="width: 100%; height: 100%; background: blue; vertical-align: top; appearance:none; -webkit-appearance:none; border:0;margin:0;padding:0;"/></x-td></x-tr>
+        </x-table>
+        <input style="background:cyan; appearance:none; -webkit-appearance:none; border:0;margin:0;padding:0;" />
+    </div>
+    <script>
+
+        assertOffsetHeightEquals('a',document.querySelector('input[style="background:cyan; appearance:none; -webkit-appearance:none; border:0;margin:0;padding:0;"]').offsetHeight);
+
+    </script>
+
+
+    <hr/><!------------------------------------------------------------------------------------------------------------>
+    <p>There should be a 100px blue square below:</p>
+    <p>Unresolvable percentage widths are resolved as auto in first pass (unscrollable overflow)</p>
+    <div>
+        <x-table style="width: 0px; height: 100px; background: red;">
+            <x-tr><x-td><div target=a style="width: 100%; height: 100px; background: blue; overflow: hidden;"><div target=a style="width: 100px; height: 0px"></div></div></x-td></x-tr>
+        </x-table>
+    </div>
+    <script>
+
+        assertOffsetWidthEquals('a',100);
+
+    </script>
+
+
+    <hr/><!------------------------------------------------------------------------------------------------------------>
+    <p>There should be a 100px blue square below:</p>
+    <p>Unresolvable percentage heights are resolved as auto in first pass (unscrollable overflow)</p>
+    <div>
+        <x-table style="width: 100px; height: 0px; background: red;">
+            <x-tr>
+                <x-td><div target=a style="width: 100px; height: 100%; background: blue; overflow: hidden;"><div target=a style="width: 0px; height: 100px; background: red"></div></div></x-td>
+            </x-tr>
+        </x-table>
+    </div>
+    <script>
+
+        assertOffsetHeightEquals('a',100);
+
+    </script>
+
+
+    <hr/><!------------------------------------------------------------------------------------------------------------>
+    <p>There should be a 100px blue square below:</p>
+    <p>Unresolvable percentage widths are resolved as auto in first pass (scrollable overflow)</p>
+    <div>
+        <x-table style="width: 0px; height: 100px; background: red;">
+            <x-tr><x-td><div target=a style="width: 100%; height: 100px; background: blue; overflow: auto;"><div target=a style="width: 100px; height: 0px"></div></div></x-td></x-tr>
+        </x-table>
+    </div>
+    <script>
+
+        assertOffsetWidthEquals('a',100);
+
+    </script>
+
+
+    <hr/><!------------------------------------------------------------------------------------------------------------>
+    <p>There should be a 100px blue square below:</p>
+    <p>Unresolvable percentage heights are resolved as 0px in first pass (scrollable overflow)</p>
+    <div>
+        <x-table style="width: 100px; height: 100px; background: red;">
+            <x-tr><x-td><div target=a style="width: 100px; height: 100%; background: red; overflow: auto;"><div target=a style="width: 0px; height: 100px; background: red"></div></div></x-td></x-tr>
+            <x-tr><x-td><div style="width: 100px; height: 100%; background: blue; overflow: hidden;"><div target=a style="width: 0px; height: 100px; background: red"></div></div></x-td></x-tr>
+        </x-table>
+    </div>
+    <script>
+
+        assertOffsetHeightEquals('a',0);
+
+    </script>
+
+</main>
diff --git a/testing/web-platform/tests/css/css-tables/height-distribution/percentage-sizing-of-table-cell-replaced-children-001-ref.html b/testing/web-platform/tests/css/css-tables/height-distribution/percentage-sizing-of-table-cell-replaced-children-001-ref.html
new file mode 100644
index 0000000000..a696e56b4c
--- /dev/null
+++ b/testing/web-platform/tests/css/css-tables/height-distribution/percentage-sizing-of-table-cell-replaced-children-001-ref.html
@@ -0,0 +1,38 @@
+<!DOCTYPE html>
+<meta charset="utf-8">
+<title>CSS Reftest Reference: Percentage sizing of table cell children with margin, border, padding and scrollbar</title>
+<link rel="author" title="Manuel Rego Casasnovas" href="mailto:rego@igalia.com">
+<style>
+.table {
+  display: block;
+  border: solid 5px black;
+  width: 150px;
+  height: 100px;
+}
+
+.td {
+  background: cyan;
+  overflow: scroll;
+  padding: 5px 15px 10px 20px;
+  border: solid magenta;
+  border-width: 12px 9px 6px 3px;
+  height: 100px;
+  box-sizing: border-box;
+}
+
+img {
+  display: block;
+  background: yellow;
+  width: 100%;
+  height: 100%;
+}
+</style>
+<link rel="stylesheet" type="text/css" href="support/scrollbars.css">
+
+<p>The test passes if you see scrollbars but there's no overflow, so you cannot actually scroll.</p>
+
+<div class="table">
+  <div class="td">
+    <img />
+  </div>
+</div>
diff --git a/testing/web-platform/tests/css/css-tables/height-distribution/percentage-sizing-of-table-cell-replaced-children-001.html b/testing/web-platform/tests/css/css-tables/height-distribution/percentage-sizing-of-table-cell-replaced-children-001.html
new file mode 100644
index 0000000000..bd2de2d2dd
--- /dev/null
+++ b/testing/web-platform/tests/css/css-tables/height-distribution/percentage-sizing-of-table-cell-replaced-children-001.html
@@ -0,0 +1,40 @@
+<!DOCTYPE html>
+<meta charset="utf-8">
+<title>CSS Table Test: Percentage sizing of table cell replaced children with margin, border, padding and scrollbar</title>
+<link rel="author" title="Manuel Rego Casasnovas" href="mailto:rego@igalia.com">
+<link rel="help" href="https://drafts.csswg.org/css-tables-3/#content-measure">
+<link rel="match" href="percentage-sizing-of-table-cell-replaced-children-001-ref.html">
+<meta name="assert" content="Checks that table cell replaced children resolve properly their percentage sizes, even when the table cell has margin, border, padding and scrollbar.">
+<style>
+.table {
+  display: table;
+  border: solid 5px black;
+  width: 150px;
+  height: 100px;
+}
+
+.td {
+  display: table-cell;
+  background: cyan;
+  overflow: scroll;
+  padding: 5px 15px 10px 20px;
+  border: solid magenta;
+  border-width: 12px 9px 6px 3px;
+}
+
+img {
+  display: block;
+  background: yellow;
+  width: 100%;
+  height: 100%;
+}
+</style>
+<link rel="stylesheet" type="text/css" href="support/scrollbars.css">
+
+<p>The test passes if you see scrollbars but there's no overflow, so you cannot actually scroll.</p>
+
+<div class="table">
+  <div class="td">
+    <img />
+  </div>
+</div>
diff --git a/testing/web-platform/tests/css/css-tables/height-distribution/support/scrollbars.css b/testing/web-platform/tests/css/css-tables/height-distribution/support/scrollbars.css
new file mode 100644
index 0000000000..7a6944e169
--- /dev/null
+++ b/testing/web-platform/tests/css/css-tables/height-distribution/support/scrollbars.css
@@ -0,0 +1,10 @@
+/* This makes the scrollbars visible on mac, both to humans and screenshots.*/
+
+::-webkit-scrollbar {
+    -webkit-appearance: none;
+}
+
+::-webkit-scrollbar-track {
+    background-color: #eee;
+    border-radius: 8px;
+}
diff --git a/testing/web-platform/tests/css/css-tables/height-distribution/td-different-subpixel-padding-in-same-row-ref.html b/testing/web-platform/tests/css/css-tables/height-distribution/td-different-subpixel-padding-in-same-row-ref.html
new file mode 100644
index 0000000000..02f0f54c3f
--- /dev/null
+++ b/testing/web-platform/tests/css/css-tables/height-distribution/td-different-subpixel-padding-in-same-row-ref.html
@@ -0,0 +1,12 @@
+<!DOCTYPE html>
+Passes if there is an unbroken rectangular border.
+<style>td { width: 20px; height: 20px; padding: 2px }</style>
+<table style="position: absolute; top: 30.3px; border: 2px solid black; border-collapse: collapse">
+  <tr>
+    <td></td>
+    <td></td>
+    <td></td>
+    <td></td>
+    <td></td>
+  </tr>
+</table>
diff --git a/testing/web-platform/tests/css/css-tables/height-distribution/td-different-subpixel-padding-in-same-row-vertical-rl-ref.html b/testing/web-platform/tests/css/css-tables/height-distribution/td-different-subpixel-padding-in-same-row-vertical-rl-ref.html
new file mode 100644
index 0000000000..9784962be4
--- /dev/null
+++ b/testing/web-platform/tests/css/css-tables/height-distribution/td-different-subpixel-padding-in-same-row-vertical-rl-ref.html
@@ -0,0 +1,13 @@
+<!DOCTYPE html>
+Passes if there is an unbroken rectangular border.
+<style>td { width: 20px; height: 20px; padding: 2px }</style>
+<table style="position: absolute; top: 30.3px; border: 2px solid black;
+              border-collapse: collapse; writing-mode: vertical-rl">
+  <tr>
+    <td></td>
+    <td></td>
+    <td></td>
+    <td></td>
+    <td></td>
+  </tr>
+</table>
diff --git a/testing/web-platform/tests/css/css-tables/height-distribution/td-different-subpixel-padding-in-same-row-vertical-rl.html b/testing/web-platform/tests/css/css-tables/height-distribution/td-different-subpixel-padding-in-same-row-vertical-rl.html
new file mode 100644
index 0000000000..48edbde281
--- /dev/null
+++ b/testing/web-platform/tests/css/css-tables/height-distribution/td-different-subpixel-padding-in-same-row-vertical-rl.html
@@ -0,0 +1,15 @@
+<!DOCTYPE html>
+<link rel="help" href="https://drafts.csswg.org/css-tables-3/#height-distribution-algorithm">
+<link rel="match" href="td-different-subpixel-padding-in-same-row-vertical-rl-ref.html">
+Passes if there is an unbroken rectangular border.
+<style>td { width: 20px; height: 20px }</style>
+<table style="position: absolute; top: 30.3px; border: 2px solid black;
+              border-collapse: collapse; writing-mode: vertical-rl">
+  <tr>
+    <td style="padding: 2px 1px"></td>
+    <td style="padding: 2px 1.2px"></td>
+    <td style="padding: 2px 1.5px"></td>
+    <td style="padding: 2px 1.7px"></td>
+    <td style="padding: 2px"></td>
+  </tr>
+</table>
diff --git a/testing/web-platform/tests/css/css-tables/height-distribution/td-different-subpixel-padding-in-same-row.html b/testing/web-platform/tests/css/css-tables/height-distribution/td-different-subpixel-padding-in-same-row.html
new file mode 100644
index 0000000000..a7fe908e0d
--- /dev/null
+++ b/testing/web-platform/tests/css/css-tables/height-distribution/td-different-subpixel-padding-in-same-row.html
@@ -0,0 +1,14 @@
+<!DOCTYPE html>
+<link rel="help" href="https://drafts.csswg.org/css-tables-3/#height-distribution-algorithm">
+<link rel="match" href="td-different-subpixel-padding-in-same-row-ref.html">
+Passes if there is an unbroken rectangular border.
+<style>td { width: 20px; height: 20px }</style>
+<table style="position: absolute; top: 30.3px; border: 2px solid black; border-collapse: collapse">
+  <tr>
+    <td style="padding: 1px 2px"></td>
+    <td style="padding: 1.2px 2px"></td>
+    <td style="padding: 1.5px 2px"></td>
+    <td style="padding: 1.7px 2px"></td>
+    <td style="padding: 2px"></td>
+  </tr>
+</table>
-- 
cgit v1.2.3