layout: Account for transform in scrollable overflow (#36138)

In the scrollable overflow calcutation, apply CSS transforms to boxes
and scrollable overflow of the descendant. Clip unreachable scrollable
overflow according to it's block start and inline start scrolling
direction. And, renamed `Fragment::scrolling_overflow` to
`Fragment::scrolling_overflow_for_parent` as it was calculating the
scrolling overflow contribution from a child.

Add several WPT tests, testing the transform interaction `rotate`,
`scale`, and `skew` with scrollable overflow. There are several WPT test
that are testing the interaction that not expected from current browsers
implementation according to the spec.

Testing: Existing and new WPT. 
Fixes: #36031

---------

Signed-off-by: stevennovaryo <steven.novaryo@gmail.com>

tests/wpt/meta/css/css-flexbox/negative-overflow.html.ini

@@ -5,21 +5,9 @@
   [.flexbox 11]
     expected: FAIL
 
-  [.flexbox 6]
-    expected: FAIL
-
-  [.flexbox 7]
-    expected: FAIL
-
-  [.flexbox 1]
-    expected: FAIL
-
   [.flexbox 2]
     expected: FAIL
 
-  [.flexbox 3]
-    expected: FAIL
-
   [.flexbox 8]
     expected: FAIL
 

tests/wpt/meta/css/css-grid/alignment/grid-content-alignment-overflow-002.html.ini

@@ -11,20 +11,11 @@
   [.grid 4]
     expected: FAIL
 
-  [.grid 5]
-    expected: FAIL
-
-  [.grid 6]
-    expected: FAIL
-
   [.grid 7]
     expected: FAIL
 
   [.grid 8]
     expected: FAIL
 
-  [.grid 11]
-    expected: FAIL
-
   [.grid 12]
     expected: FAIL

tests/wpt/meta/css/css-overflow/overflow-inline-transform-relative.html.ini

@@ -1,3 +0,0 @@
-[overflow-inline-transform-relative.html]
-  [#target used transform when computing scroll overflow]
-    expected: FAIL

tests/wpt/meta/css/css-overflow/scroll-overflow-padding-block-001.html.ini

@@ -1,7 +1,4 @@
 [scroll-overflow-padding-block-001.html]
   expected: ERROR
-  [undefined block-end]
-    expected: FAIL
-
   [undefined block-start]
     expected: [PASS, FAIL]

tests/wpt/meta/css/css-overflow/scrollable-overflow-transform-001.html.ini

@@ -1,9 +0,0 @@
-[scrollable-overflow-transform-001.html]
-  [.container 1]
-    expected: FAIL
-
-  [.container 2]
-    expected: FAIL
-
-  [.container 3]
-    expected: FAIL

tests/wpt/meta/css/css-overflow/scrollable-overflow-transform-002.html.ini

@@ -1,9 +0,0 @@
-[scrollable-overflow-transform-002.html]
-  [.container 1]
-    expected: FAIL
-
-  [.container 2]
-    expected: FAIL
-
-  [.container 3]
-    expected: FAIL

tests/wpt/meta/css/css-overflow/scrollable-overflow-transform-003.html.ini

@@ -1,9 +0,0 @@
-[scrollable-overflow-transform-003.html]
-  [.container 1]
-    expected: FAIL
-
-  [.container 2]
-    expected: FAIL
-
-  [.container 3]
-    expected: FAIL

tests/wpt/meta/css/css-overflow/scrollable-overflow-transform-005.tentative.html.ini

@@ -0,0 +1,3 @@
+[scrollable-overflow-transform-005.tentative.html]
+  [.container 6]
+    expected: FAIL

tests/wpt/meta/css/css-overflow/scrollable-overflow-transform-009.html.ini

@@ -0,0 +1,6 @@
+[scrollable-overflow-transform-009.html]
+  [.container 2]
+    expected: FAIL
+
+  [.container 3]
+    expected: FAIL

tests/wpt/meta/css/css-overflow/scrollable-overflow-transform-010.tentative.html.ini

@@ -0,0 +1,6 @@
+[scrollable-overflow-transform-010.tentative.html]
+  [.container 1]
+    expected: FAIL
+
+  [.container 2]
+    expected: FAIL

tests/wpt/meta/css/css-overflow/scrollable-overflow-transform-dynamic-001.html.ini

@@ -1,9 +0,0 @@
-[scrollable-overflow-transform-dynamic-001.html]
-  [Check scrollWidth before and after transform chage]
-    expected: FAIL
-
-  [Check scrollHeight before and after transform chage]
-    expected: FAIL
-
-  [Check scrollWidth and scrollHeight before and after transform chage]
-    expected: FAIL

tests/wpt/meta/css/css-overflow/scrollable-overflow-transform-dynamic-002.html.ini

@@ -1,9 +0,0 @@
-[scrollable-overflow-transform-dynamic-002.html]
-  [Check scrollWidth before and after transform chage]
-    expected: FAIL
-
-  [Check scrollHeight before and after transform chage]
-    expected: FAIL
-
-  [Check scrollWidth and scrollHeight before and after transform chage]
-    expected: FAIL

tests/wpt/meta/css/css-overflow/scrollable-overflow-transform-dynamic-003.html.ini

@@ -1,9 +0,0 @@
-[scrollable-overflow-transform-dynamic-003.html]
-  [Check scrollWidth before and after transform chage]
-    expected: FAIL
-
-  [Check scrollHeight before and after transform chage]
-    expected: FAIL
-
-  [Check scrollWidth and scrollHeight before and after transform chage]
-    expected: FAIL

tests/wpt/meta/css/css-overflow/scrollable-overflow-transform-dynamic-004.html.ini

@@ -1,9 +0,0 @@
-[scrollable-overflow-transform-dynamic-004.html]
-  [Check scrollWidth before and after position and transform chage]
-    expected: FAIL
-
-  [Check scrollHeight before and after position and transform chage]
-    expected: FAIL
-
-  [Check scrollWidth and scrollHeight after position and transform chage]
-    expected: FAIL

tests/wpt/meta/css/css-overflow/scrollable-overflow-transform-dynamic-005.html.ini

@@ -1,9 +0,0 @@
-[scrollable-overflow-transform-dynamic-005.html]
-  [Check scrollWidth before and after appendChild() and transform chage]
-    expected: FAIL
-
-  [Check scrollHeight before and after appendChild() and transform chage]
-    expected: FAIL
-
-  [Check scrollWidth and scrollHeight before and after appendChild() and transform chage]
-    expected: FAIL

tests/wpt/meta/css/css-overflow/scrollable-overflow-transform-dynamic-006.html.ini

@@ -1,9 +0,0 @@
-[scrollable-overflow-transform-dynamic-006.html]
-  [Check scrollWidth before and after removeChild() and transform chage]
-    expected: FAIL
-
-  [Check scrollHeight before and after removeChild() and transform chage]
-    expected: FAIL
-
-  [Check scrollWidth and scrollHeight before and after removeChild() and transform chage]
-    expected: FAIL

tests/wpt/meta/css/css-overflow/scrollable-overflow-transform-unreachable-region.html.ini

@@ -0,0 +1,168 @@
+[scrollable-overflow-transform-unreachable-region.html]
+  [scrollWidth of display: flow-root; direction: ltr; writing-mode: vertical-rl; flex-direction: row; flex-wrap: nowrap;]
+    expected: FAIL
+
+  [scrollWidth of display: flow-root; direction: rtl; writing-mode: vertical-lr; flex-direction: row; flex-wrap: nowrap;]
+    expected: FAIL
+
+  [scrollHeight of display: flow-root; direction: rtl; writing-mode: vertical-lr; flex-direction: row; flex-wrap: nowrap;]
+    expected: FAIL
+
+  [scrollHeight of display: flow-root; direction: rtl; writing-mode: vertical-rl; flex-direction: row; flex-wrap: nowrap;]
+    expected: FAIL
+
+  [scrollWidth of display: flex; direction: ltr; writing-mode: vertical-rl; flex-direction: row; flex-wrap: nowrap;]
+    expected: FAIL
+
+  [scrollWidth of display: flex; direction: rtl; writing-mode: vertical-lr; flex-direction: row; flex-wrap: nowrap;]
+    expected: FAIL
+
+  [scrollHeight of display: flex; direction: rtl; writing-mode: vertical-lr; flex-direction: row; flex-wrap: nowrap;]
+    expected: FAIL
+
+  [scrollHeight of display: flex; direction: rtl; writing-mode: vertical-rl; flex-direction: row; flex-wrap: nowrap;]
+    expected: FAIL
+
+  [scrollHeight of display: flex; direction: ltr; writing-mode: horizontal-tb; flex-direction: row; flex-wrap: wrap-reverse;]
+    expected: FAIL
+
+  [scrollWidth of display: flex; direction: ltr; writing-mode: vertical-lr; flex-direction: row; flex-wrap: wrap-reverse;]
+    expected: FAIL
+
+  [scrollHeight of display: flex; direction: rtl; writing-mode: horizontal-tb; flex-direction: row; flex-wrap: wrap-reverse;]
+    expected: FAIL
+
+  [scrollHeight of display: flex; direction: rtl; writing-mode: vertical-lr; flex-direction: row; flex-wrap: wrap-reverse;]
+    expected: FAIL
+
+  [scrollWidth of display: flex; direction: rtl; writing-mode: vertical-rl; flex-direction: row; flex-wrap: wrap-reverse;]
+    expected: FAIL
+
+  [scrollHeight of display: flex; direction: rtl; writing-mode: vertical-rl; flex-direction: row; flex-wrap: wrap-reverse;]
+    expected: FAIL
+
+  [scrollWidth of display: flex; direction: ltr; writing-mode: horizontal-tb; flex-direction: row-reverse; flex-wrap: nowrap;]
+    expected: FAIL
+
+  [scrollHeight of display: flex; direction: ltr; writing-mode: vertical-lr; flex-direction: row-reverse; flex-wrap: nowrap;]
+    expected: FAIL
+
+  [scrollWidth of display: flex; direction: ltr; writing-mode: vertical-rl; flex-direction: row-reverse; flex-wrap: nowrap;]
+    expected: FAIL
+
+  [scrollHeight of display: flex; direction: ltr; writing-mode: vertical-rl; flex-direction: row-reverse; flex-wrap: nowrap;]
+    expected: FAIL
+
+  [scrollWidth of display: flex; direction: rtl; writing-mode: horizontal-tb; flex-direction: row-reverse; flex-wrap: nowrap;]
+    expected: FAIL
+
+  [scrollWidth of display: flex; direction: rtl; writing-mode: vertical-lr; flex-direction: row-reverse; flex-wrap: nowrap;]
+    expected: FAIL
+
+  [scrollWidth of display: flex; direction: ltr; writing-mode: horizontal-tb; flex-direction: row-reverse; flex-wrap: wrap-reverse;]
+    expected: FAIL
+
+  [scrollHeight of display: flex; direction: ltr; writing-mode: horizontal-tb; flex-direction: row-reverse; flex-wrap: wrap-reverse;]
+    expected: FAIL
+
+  [scrollWidth of display: flex; direction: ltr; writing-mode: vertical-lr; flex-direction: row-reverse; flex-wrap: wrap-reverse;]
+    expected: FAIL
+
+  [scrollHeight of display: flex; direction: ltr; writing-mode: vertical-lr; flex-direction: row-reverse; flex-wrap: wrap-reverse;]
+    expected: FAIL
+
+  [scrollHeight of display: flex; direction: ltr; writing-mode: vertical-rl; flex-direction: row-reverse; flex-wrap: wrap-reverse;]
+    expected: FAIL
+
+  [scrollWidth of display: flex; direction: rtl; writing-mode: horizontal-tb; flex-direction: row-reverse; flex-wrap: wrap-reverse;]
+    expected: FAIL
+
+  [scrollHeight of display: flex; direction: rtl; writing-mode: horizontal-tb; flex-direction: row-reverse; flex-wrap: wrap-reverse;]
+    expected: FAIL
+
+  [scrollWidth of display: flex; direction: rtl; writing-mode: vertical-rl; flex-direction: row-reverse; flex-wrap: wrap-reverse;]
+    expected: FAIL
+
+  [scrollWidth of display: flex; direction: ltr; writing-mode: vertical-rl; flex-direction: column; flex-wrap: nowrap;]
+    expected: FAIL
+
+  [scrollWidth of display: flex; direction: rtl; writing-mode: vertical-lr; flex-direction: column; flex-wrap: nowrap;]
+    expected: FAIL
+
+  [scrollHeight of display: flex; direction: rtl; writing-mode: vertical-lr; flex-direction: column; flex-wrap: nowrap;]
+    expected: FAIL
+
+  [scrollHeight of display: flex; direction: rtl; writing-mode: vertical-rl; flex-direction: column; flex-wrap: nowrap;]
+    expected: FAIL
+
+  [scrollWidth of display: flex; direction: ltr; writing-mode: horizontal-tb; flex-direction: column; flex-wrap: wrap-reverse;]
+    expected: FAIL
+
+  [scrollHeight of display: flex; direction: ltr; writing-mode: vertical-lr; flex-direction: column; flex-wrap: wrap-reverse;]
+    expected: FAIL
+
+  [scrollWidth of display: flex; direction: ltr; writing-mode: vertical-rl; flex-direction: column; flex-wrap: wrap-reverse;]
+    expected: FAIL
+
+  [scrollHeight of display: flex; direction: ltr; writing-mode: vertical-rl; flex-direction: column; flex-wrap: wrap-reverse;]
+    expected: FAIL
+
+  [scrollWidth of display: flex; direction: rtl; writing-mode: horizontal-tb; flex-direction: column; flex-wrap: wrap-reverse;]
+    expected: FAIL
+
+  [scrollWidth of display: flex; direction: rtl; writing-mode: vertical-lr; flex-direction: column; flex-wrap: wrap-reverse;]
+    expected: FAIL
+
+  [scrollHeight of display: flex; direction: ltr; writing-mode: horizontal-tb; flex-direction: column-reverse; flex-wrap: nowrap;]
+    expected: FAIL
+
+  [scrollWidth of display: flex; direction: ltr; writing-mode: vertical-lr; flex-direction: column-reverse; flex-wrap: nowrap;]
+    expected: FAIL
+
+  [scrollHeight of display: flex; direction: rtl; writing-mode: horizontal-tb; flex-direction: column-reverse; flex-wrap: nowrap;]
+    expected: FAIL
+
+  [scrollHeight of display: flex; direction: rtl; writing-mode: vertical-lr; flex-direction: column-reverse; flex-wrap: nowrap;]
+    expected: FAIL
+
+  [scrollWidth of display: flex; direction: rtl; writing-mode: vertical-rl; flex-direction: column-reverse; flex-wrap: nowrap;]
+    expected: FAIL
+
+  [scrollHeight of display: flex; direction: rtl; writing-mode: vertical-rl; flex-direction: column-reverse; flex-wrap: nowrap;]
+    expected: FAIL
+
+  [scrollWidth of display: flex; direction: ltr; writing-mode: horizontal-tb; flex-direction: column-reverse; flex-wrap: wrap-reverse;]
+    expected: FAIL
+
+  [scrollHeight of display: flex; direction: ltr; writing-mode: horizontal-tb; flex-direction: column-reverse; flex-wrap: wrap-reverse;]
+    expected: FAIL
+
+  [scrollWidth of display: flex; direction: ltr; writing-mode: vertical-lr; flex-direction: column-reverse; flex-wrap: wrap-reverse;]
+    expected: FAIL
+
+  [scrollHeight of display: flex; direction: ltr; writing-mode: vertical-lr; flex-direction: column-reverse; flex-wrap: wrap-reverse;]
+    expected: FAIL
+
+  [scrollHeight of display: flex; direction: ltr; writing-mode: vertical-rl; flex-direction: column-reverse; flex-wrap: wrap-reverse;]
+    expected: FAIL
+
+  [scrollWidth of display: flex; direction: rtl; writing-mode: horizontal-tb; flex-direction: column-reverse; flex-wrap: wrap-reverse;]
+    expected: FAIL
+
+  [scrollHeight of display: flex; direction: rtl; writing-mode: horizontal-tb; flex-direction: column-reverse; flex-wrap: wrap-reverse;]
+    expected: FAIL
+
+  [scrollWidth of display: flex; direction: rtl; writing-mode: vertical-rl; flex-direction: column-reverse; flex-wrap: wrap-reverse;]
+    expected: FAIL
+
+  [scrollWidth of display: grid; direction: ltr; writing-mode: vertical-rl; flex-direction: row; flex-wrap: nowrap;]
+    expected: FAIL
+
+  [scrollWidth of display: grid; direction: rtl; writing-mode: vertical-lr; flex-direction: row; flex-wrap: nowrap;]
+    expected: FAIL
+
+  [scrollHeight of display: grid; direction: rtl; writing-mode: vertical-lr; flex-direction: row; flex-wrap: nowrap;]
+    expected: FAIL
+
+  [scrollHeight of display: grid; direction: rtl; writing-mode: vertical-rl; flex-direction: row; flex-wrap: nowrap;]
+    expected: FAIL

tests/wpt/meta/css/cssom-view/scrollWidthHeight-negative-margin-001.html.ini

@@ -1,12 +0,0 @@
-[scrollWidthHeight-negative-margin-001.html]
-  [scrollWidth/Height with negative margins: overflow: visible;]
-    expected: FAIL
-
-  [scrollWidth/Height with negative margins: overflow: hidden;]
-    expected: FAIL
-
-  [scrollWidth/Height with negative margins: overflow: auto;]
-    expected: FAIL
-
-  [scrollWidth/Height with negative margins: overflow: clip;]
-    expected: FAIL

tests/wpt/meta/css/cssom-view/scrollWidthHeight-negative-margin-002.html.ini

@@ -121,97 +121,97 @@
     expected: FAIL
 
   [scrollWidth with negative margins: display: flex; overflow: visible; direction: ltr; flex-direction: row;]
-    expected: FAIL
+    expected: [FAIL, PASS]
 
   [scrollHeight with negative margins: display: flex; overflow: visible; direction: ltr; flex-direction: row;]
-    expected: FAIL
+    expected: [FAIL, PASS]
 
   [scrollWidth with negative margins: display: flex; overflow: hidden; direction: ltr; flex-direction: row;]
-    expected: FAIL
+    expected: [FAIL, PASS]
 
   [scrollHeight with negative margins: display: flex; overflow: hidden; direction: ltr; flex-direction: row;]
-    expected: FAIL
+    expected: [FAIL, PASS]
 
   [scrollWidth with negative margins: display: flex; overflow: auto; direction: ltr; flex-direction: row;]
-    expected: FAIL
+    expected: [FAIL, PASS]
 
   [scrollHeight with negative margins: display: flex; overflow: auto; direction: ltr; flex-direction: row;]
-    expected: FAIL
+    expected: [FAIL, PASS]
 
   [scrollWidth with negative margins: display: flex; overflow: scroll; direction: ltr; flex-direction: row;]
-    expected: FAIL
+    expected: [FAIL, PASS]
 
   [scrollHeight with negative margins: display: flex; overflow: scroll; direction: ltr; flex-direction: row;]
-    expected: FAIL
+    expected: [FAIL, PASS]
 
   [scrollWidth with negative margins: display: flex; overflow: visible; direction: rtl; flex-direction: row;]
-    expected: FAIL
+    expected: [FAIL, PASS]
 
   [scrollHeight with negative margins: display: flex; overflow: visible; direction: rtl; flex-direction: row;]
-    expected: FAIL
+    expected: [FAIL, PASS]
 
   [scrollWidth with negative margins: display: flex; overflow: hidden; direction: rtl; flex-direction: row;]
-    expected: FAIL
+    expected: [FAIL, PASS]
 
   [scrollHeight with negative margins: display: flex; overflow: hidden; direction: rtl; flex-direction: row;]
-    expected: FAIL
+    expected: [FAIL, PASS]
 
   [scrollWidth with negative margins: display: flex; overflow: auto; direction: rtl; flex-direction: row;]
-    expected: FAIL
+    expected: [FAIL, PASS]
 
   [scrollHeight with negative margins: display: flex; overflow: auto; direction: rtl; flex-direction: row;]
-    expected: FAIL
+    expected: [FAIL, PASS]
 
   [scrollWidth with negative margins: display: flex; overflow: scroll; direction: rtl; flex-direction: row;]
-    expected: FAIL
+    expected: [FAIL, PASS]
 
   [scrollHeight with negative margins: display: flex; overflow: scroll; direction: rtl; flex-direction: row;]
-    expected: FAIL
+    expected: [FAIL, PASS]
 
   [scrollWidth with negative margins: display: flex; overflow: visible; direction: ltr; flex-flow: wrap-reverse;]
-    expected: FAIL
+    expected: [FAIL, PASS]
 
   [scrollHeight with negative margins: display: flex; overflow: visible; direction: ltr; flex-flow: wrap-reverse;]
     expected: FAIL
 
   [scrollWidth with negative margins: display: flex; overflow: hidden; direction: ltr; flex-flow: wrap-reverse;]
-    expected: FAIL
+    expected: [FAIL, PASS]
 
   [scrollHeight with negative margins: display: flex; overflow: hidden; direction: ltr; flex-flow: wrap-reverse;]
     expected: FAIL
 
   [scrollWidth with negative margins: display: flex; overflow: auto; direction: ltr; flex-flow: wrap-reverse;]
-    expected: FAIL
+    expected: [FAIL, PASS]
 
   [scrollHeight with negative margins: display: flex; overflow: auto; direction: ltr; flex-flow: wrap-reverse;]
     expected: FAIL
 
   [scrollWidth with negative margins: display: flex; overflow: scroll; direction: ltr; flex-flow: wrap-reverse;]
-    expected: FAIL
+    expected: [FAIL, PASS]
 
   [scrollHeight with negative margins: display: flex; overflow: scroll; direction: ltr; flex-flow: wrap-reverse;]
     expected: FAIL
 
   [scrollWidth with negative margins: display: flex; overflow: visible; direction: rtl; flex-flow: wrap-reverse;]
-    expected: FAIL
+    expected: [FAIL, PASS]
 
   [scrollHeight with negative margins: display: flex; overflow: visible; direction: rtl; flex-flow: wrap-reverse;]
     expected: FAIL
 
   [scrollWidth with negative margins: display: flex; overflow: hidden; direction: rtl; flex-flow: wrap-reverse;]
-    expected: FAIL
+    expected: [FAIL, PASS]
 
   [scrollHeight with negative margins: display: flex; overflow: hidden; direction: rtl; flex-flow: wrap-reverse;]
     expected: FAIL
 
   [scrollWidth with negative margins: display: flex; overflow: auto; direction: rtl; flex-flow: wrap-reverse;]
-    expected: FAIL
+    expected: [FAIL, PASS]
 
   [scrollHeight with negative margins: display: flex; overflow: auto; direction: rtl; flex-flow: wrap-reverse;]
     expected: FAIL
 
   [scrollWidth with negative margins: display: flex; overflow: scroll; direction: rtl; flex-flow: wrap-reverse;]
-    expected: FAIL
+    expected: [FAIL, PASS]
 
   [scrollHeight with negative margins: display: flex; overflow: scroll; direction: rtl; flex-flow: wrap-reverse;]
     expected: FAIL
@@ -220,49 +220,49 @@
     expected: FAIL
 
   [scrollHeight with negative margins: display: flex; overflow: visible; direction: ltr; flex-direction: row-reverse;]
-    expected: FAIL
+    expected: [FAIL, PASS]
 
   [scrollWidth with negative margins: display: flex; overflow: hidden; direction: ltr; flex-direction: row-reverse;]
     expected: FAIL
 
   [scrollHeight with negative margins: display: flex; overflow: hidden; direction: ltr; flex-direction: row-reverse;]
-    expected: FAIL
+    expected: [FAIL, PASS]
 
   [scrollWidth with negative margins: display: flex; overflow: auto; direction: ltr; flex-direction: row-reverse;]
     expected: FAIL
 
   [scrollHeight with negative margins: display: flex; overflow: auto; direction: ltr; flex-direction: row-reverse;]
-    expected: FAIL
+    expected: [FAIL, PASS]
 
   [scrollWidth with negative margins: display: flex; overflow: scroll; direction: ltr; flex-direction: row-reverse;]
     expected: FAIL
 
   [scrollHeight with negative margins: display: flex; overflow: scroll; direction: ltr; flex-direction: row-reverse;]
-    expected: FAIL
+    expected: [FAIL, PASS]
 
   [scrollWidth with negative margins: display: flex; overflow: visible; direction: rtl; flex-direction: row-reverse;]
     expected: FAIL
 
   [scrollHeight with negative margins: display: flex; overflow: visible; direction: rtl; flex-direction: row-reverse;]
-    expected: FAIL
+    expected: [FAIL, PASS]
 
   [scrollWidth with negative margins: display: flex; overflow: hidden; direction: rtl; flex-direction: row-reverse;]
     expected: FAIL
 
   [scrollHeight with negative margins: display: flex; overflow: hidden; direction: rtl; flex-direction: row-reverse;]
-    expected: FAIL
+    expected: [FAIL, PASS]
 
   [scrollWidth with negative margins: display: flex; overflow: auto; direction: rtl; flex-direction: row-reverse;]
     expected: FAIL
 
   [scrollHeight with negative margins: display: flex; overflow: auto; direction: rtl; flex-direction: row-reverse;]
-    expected: FAIL
+    expected: [FAIL, PASS]
 
   [scrollWidth with negative margins: display: flex; overflow: scroll; direction: rtl; flex-direction: row-reverse;]
     expected: FAIL
 
   [scrollHeight with negative margins: display: flex; overflow: scroll; direction: rtl; flex-direction: row-reverse;]
-    expected: FAIL
+    expected: [FAIL, PASS]
 
   [scrollWidth with negative margins: display: flex; overflow: visible; direction: ltr; flex-flow: row-reverse wrap-reverse;]
     expected: FAIL
@@ -313,145 +313,145 @@
     expected: FAIL
 
   [scrollWidth with negative margins: display: flex; overflow: visible; direction: ltr; flex-direction: column;]
-    expected: FAIL
+    expected: [FAIL, PASS]
 
   [scrollHeight with negative margins: display: flex; overflow: visible; direction: ltr; flex-direction: column;]
-    expected: FAIL
+    expected: [FAIL, PASS]
 
   [scrollWidth with negative margins: display: flex; overflow: hidden; direction: ltr; flex-direction: column;]
-    expected: FAIL
+    expected: [FAIL, PASS]
 
   [scrollHeight with negative margins: display: flex; overflow: hidden; direction: ltr; flex-direction: column;]
-    expected: FAIL
+    expected: [FAIL, PASS]
 
   [scrollWidth with negative margins: display: flex; overflow: auto; direction: ltr; flex-direction: column;]
-    expected: FAIL
+    expected: [FAIL, PASS]
 
   [scrollHeight with negative margins: display: flex; overflow: auto; direction: ltr; flex-direction: column;]
-    expected: FAIL
+    expected: [FAIL, PASS]
 
   [scrollWidth with negative margins: display: flex; overflow: scroll; direction: ltr; flex-direction: column;]
-    expected: FAIL
+    expected: [FAIL, PASS]
 
   [scrollHeight with negative margins: display: flex; overflow: scroll; direction: ltr; flex-direction: column;]
-    expected: FAIL
+    expected: [FAIL, PASS]
 
   [scrollWidth with negative margins: display: flex; overflow: visible; direction: rtl; flex-direction: column;]
-    expected: FAIL
+    expected: [FAIL, PASS]
 
   [scrollHeight with negative margins: display: flex; overflow: visible; direction: rtl; flex-direction: column;]
-    expected: FAIL
+    expected: [FAIL, PASS]
 
   [scrollWidth with negative margins: display: flex; overflow: hidden; direction: rtl; flex-direction: column;]
-    expected: FAIL
+    expected: [FAIL, PASS]
 
   [scrollHeight with negative margins: display: flex; overflow: hidden; direction: rtl; flex-direction: column;]
-    expected: FAIL
+    expected: [FAIL, PASS]
 
   [scrollWidth with negative margins: display: flex; overflow: auto; direction: rtl; flex-direction: column;]
-    expected: FAIL
+    expected: [FAIL, PASS]
 
   [scrollHeight with negative margins: display: flex; overflow: auto; direction: rtl; flex-direction: column;]
-    expected: FAIL
+    expected: [FAIL, PASS]
 
   [scrollWidth with negative margins: display: flex; overflow: scroll; direction: rtl; flex-direction: column;]
-    expected: FAIL
+    expected: [FAIL, PASS]
 
   [scrollHeight with negative margins: display: flex; overflow: scroll; direction: rtl; flex-direction: column;]
-    expected: FAIL
+    expected: [FAIL, PASS]
 
   [scrollWidth with negative margins: display: flex; overflow: visible; direction: ltr; flex-flow: column wrap-reverse;]
     expected: FAIL
 
   [scrollHeight with negative margins: display: flex; overflow: visible; direction: ltr; flex-flow: column wrap-reverse;]
-    expected: FAIL
+    expected: [FAIL, PASS]
 
   [scrollWidth with negative margins: display: flex; overflow: hidden; direction: ltr; flex-flow: column wrap-reverse;]
     expected: FAIL
 
   [scrollHeight with negative margins: display: flex; overflow: hidden; direction: ltr; flex-flow: column wrap-reverse;]
-    expected: FAIL
+    expected: [FAIL, PASS]
 
   [scrollWidth with negative margins: display: flex; overflow: auto; direction: ltr; flex-flow: column wrap-reverse;]
     expected: FAIL
 
   [scrollHeight with negative margins: display: flex; overflow: auto; direction: ltr; flex-flow: column wrap-reverse;]
-    expected: FAIL
+    expected: [FAIL, PASS]
 
   [scrollWidth with negative margins: display: flex; overflow: scroll; direction: ltr; flex-flow: column wrap-reverse;]
     expected: FAIL
 
   [scrollHeight with negative margins: display: flex; overflow: scroll; direction: ltr; flex-flow: column wrap-reverse;]
-    expected: FAIL
+    expected: [FAIL, PASS]
 
   [scrollWidth with negative margins: display: flex; overflow: visible; direction: rtl; flex-flow: column wrap-reverse;]
     expected: FAIL
 
   [scrollHeight with negative margins: display: flex; overflow: visible; direction: rtl; flex-flow: column wrap-reverse;]
-    expected: FAIL
+    expected: [FAIL, PASS]
 
   [scrollWidth with negative margins: display: flex; overflow: hidden; direction: rtl; flex-flow: column wrap-reverse;]
     expected: FAIL
 
   [scrollHeight with negative margins: display: flex; overflow: hidden; direction: rtl; flex-flow: column wrap-reverse;]
-    expected: FAIL
+    expected: [FAIL, PASS]
 
   [scrollWidth with negative margins: display: flex; overflow: auto; direction: rtl; flex-flow: column wrap-reverse;]
     expected: FAIL
 
   [scrollHeight with negative margins: display: flex; overflow: auto; direction: rtl; flex-flow: column wrap-reverse;]
-    expected: FAIL
+    expected: [FAIL, PASS]
 
   [scrollWidth with negative margins: display: flex; overflow: scroll; direction: rtl; flex-flow: column wrap-reverse;]
     expected: FAIL
 
   [scrollHeight with negative margins: display: flex; overflow: scroll; direction: rtl; flex-flow: column wrap-reverse;]
-    expected: FAIL
+    expected: [FAIL, PASS]
 
   [scrollWidth with negative margins: display: flex; overflow: visible; direction: ltr; flex-direction: column-reverse;]
-    expected: FAIL
+    expected: [FAIL, PASS]
 
   [scrollHeight with negative margins: display: flex; overflow: visible; direction: ltr; flex-direction: column-reverse;]
     expected: FAIL
 
   [scrollWidth with negative margins: display: flex; overflow: hidden; direction: ltr; flex-direction: column-reverse;]
-    expected: FAIL
+    expected: [FAIL, PASS]
 
   [scrollHeight with negative margins: display: flex; overflow: hidden; direction: ltr; flex-direction: column-reverse;]
     expected: FAIL
 
   [scrollWidth with negative margins: display: flex; overflow: auto; direction: ltr; flex-direction: column-reverse;]
-    expected: FAIL
+    expected: [FAIL, PASS]
 
   [scrollHeight with negative margins: display: flex; overflow: auto; direction: ltr; flex-direction: column-reverse;]
     expected: FAIL
 
   [scrollWidth with negative margins: display: flex; overflow: scroll; direction: ltr; flex-direction: column-reverse;]
-    expected: FAIL
+    expected: [FAIL, PASS]
 
   [scrollHeight with negative margins: display: flex; overflow: scroll; direction: ltr; flex-direction: column-reverse;]
     expected: FAIL
 
   [scrollWidth with negative margins: display: flex; overflow: visible; direction: rtl; flex-direction: column-reverse;]
-    expected: FAIL
+    expected: [FAIL, PASS]
 
   [scrollHeight with negative margins: display: flex; overflow: visible; direction: rtl; flex-direction: column-reverse;]
     expected: FAIL
 
   [scrollWidth with negative margins: display: flex; overflow: hidden; direction: rtl; flex-direction: column-reverse;]
-    expected: FAIL
+    expected: [FAIL, PASS]
 
   [scrollHeight with negative margins: display: flex; overflow: hidden; direction: rtl; flex-direction: column-reverse;]
     expected: FAIL
 
   [scrollWidth with negative margins: display: flex; overflow: auto; direction: rtl; flex-direction: column-reverse;]
-    expected: FAIL
+    expected: [FAIL, PASS]
 
   [scrollHeight with negative margins: display: flex; overflow: auto; direction: rtl; flex-direction: column-reverse;]
     expected: FAIL
 
   [scrollWidth with negative margins: display: flex; overflow: scroll; direction: rtl; flex-direction: column-reverse;]
-    expected: FAIL
+    expected: [FAIL, PASS]
 
   [scrollHeight with negative margins: display: flex; overflow: scroll; direction: rtl; flex-direction: column-reverse;]
     expected: FAIL
@@ -505,85 +505,70 @@
     expected: FAIL
 
   [scrollWidth with negative margins: display: flow-root; overflow: visible; direction: ltr; flex-direction: row;]
-    expected: FAIL
-
-  [scrollHeight with negative margins: display: flow-root; overflow: visible; direction: ltr; flex-direction: row;]
-    expected: FAIL
+    expected: [FAIL, PASS]
 
   [scrollWidth with negative margins: display: flow-root; overflow: hidden; direction: ltr; flex-direction: row;]
-    expected: FAIL
-
-  [scrollHeight with negative margins: display: flow-root; overflow: hidden; direction: ltr; flex-direction: row;]
-    expected: FAIL
+    expected: [FAIL, PASS]
 
   [scrollWidth with negative margins: display: flow-root; overflow: auto; direction: ltr; flex-direction: row;]
-    expected: FAIL
-
-  [scrollHeight with negative margins: display: flow-root; overflow: auto; direction: ltr; flex-direction: row;]
-    expected: FAIL
+    expected: [FAIL, PASS]
 
   [scrollWidth with negative margins: display: flow-root; overflow: scroll; direction: ltr; flex-direction: row;]
-    expected: FAIL
-
-  [scrollHeight with negative margins: display: flow-root; overflow: scroll; direction: ltr; flex-direction: row;]
-    expected: FAIL
+    expected: [FAIL, PASS]
 
   [scrollWidth with negative margins: display: flow-root; overflow: visible; direction: rtl; flex-direction: row;]
-    expected: FAIL
+    expected: [FAIL, PASS]
 
   [scrollHeight with negative margins: display: flow-root; overflow: visible; direction: rtl; flex-direction: row;]
-    expected: FAIL
+    expected: [FAIL, PASS]
 
   [scrollWidth with negative margins: display: flow-root; overflow: hidden; direction: rtl; flex-direction: row;]
-    expected: FAIL
+    expected: [FAIL, PASS]
 
   [scrollHeight with negative margins: display: flow-root; overflow: hidden; direction: rtl; flex-direction: row;]
-    expected: FAIL
+    expected: [FAIL, PASS]
 
   [scrollWidth with negative margins: display: flow-root; overflow: auto; direction: rtl; flex-direction: row;]
-    expected: FAIL
+    expected: [FAIL, PASS]
 
   [scrollHeight with negative margins: display: flow-root; overflow: auto; direction: rtl; flex-direction: row;]
-    expected: FAIL
+    expected: [FAIL, PASS]
 
   [scrollWidth with negative margins: display: flow-root; overflow: scroll; direction: rtl; flex-direction: row;]
-    expected: FAIL
+    expected: [FAIL, PASS]
 
   [scrollHeight with negative margins: display: flow-root; overflow: scroll; direction: rtl; flex-direction: row;]
-    expected: FAIL
+    expected: [FAIL, PASS]
 
   [scrollWidth with negative margins: display: flow-root; overflow: clip; direction: ltr; flex-direction: row;]
-    expected: FAIL
-
-  [scrollHeight with negative margins: display: flow-root; overflow: clip; direction: ltr; flex-direction: row;]
-    expected: FAIL
+    expected: [FAIL, PASS]
 
   [scrollWidth with negative margins: display: flow-root; overflow: clip; direction: rtl; flex-direction: row;]
-    expected: FAIL
+    expected: [FAIL, PASS]
 
   [scrollHeight with negative margins: display: flow-root; overflow: clip; direction: rtl; flex-direction: row;]
-    expected: FAIL
+    expected: [FAIL, PASS]
 
   [scrollWidth with negative margins: display: flex; overflow: clip; direction: ltr; flex-direction: row;]
-    expected: FAIL
+    expected: [FAIL, PASS]
 
   [scrollHeight with negative margins: display: flex; overflow: clip; direction: ltr; flex-direction: row;]
-    expected: FAIL
+    expected: [FAIL, PASS]
 
   [scrollWidth with negative margins: display: flex; overflow: clip; direction: rtl; flex-direction: row;]
-    expected: FAIL
+    expected: [FAIL, PASS]
 
   [scrollHeight with negative margins: display: flex; overflow: clip; direction: rtl; flex-direction: row;]
-    expected: FAIL
+    expected: [FAIL, PASS]
 
   [scrollWidth with negative margins: display: flex; overflow: clip; direction: ltr; flex-flow: wrap-reverse;]
-    expected: FAIL
+    expected: [FAIL, PASS]
 
   [scrollHeight with negative margins: display: flex; overflow: clip; direction: ltr; flex-flow: wrap-reverse;]
     expected: FAIL
 
   [scrollWidth with negative margins: display: flex; overflow: clip; direction: rtl; flex-flow: wrap-reverse;]
-    expected: FAIL
+    expected: [FAIL, PASS]
 
   [scrollHeight with negative margins: display: flex; overflow: clip; direction: rtl; flex-flow: wrap-reverse;]
     expected: FAIL
@@ -592,13 +577,13 @@
     expected: FAIL
 
   [scrollHeight with negative margins: display: flex; overflow: clip; direction: ltr; flex-direction: row-reverse;]
-    expected: FAIL
+    expected: [FAIL, PASS]
 
   [scrollWidth with negative margins: display: flex; overflow: clip; direction: rtl; flex-direction: row-reverse;]
     expected: FAIL
 
   [scrollHeight with negative margins: display: flex; overflow: clip; direction: rtl; flex-direction: row-reverse;]
-    expected: FAIL
+    expected: [FAIL, PASS]
 
   [scrollWidth with negative margins: display: flex; overflow: clip; direction: ltr; flex-flow: row-reverse wrap-reverse;]
     expected: FAIL
@@ -613,37 +598,37 @@
     expected: FAIL
 
   [scrollWidth with negative margins: display: flex; overflow: clip; direction: ltr; flex-direction: column;]
-    expected: FAIL
+    expected: [FAIL, PASS]
 
   [scrollHeight with negative margins: display: flex; overflow: clip; direction: ltr; flex-direction: column;]
-    expected: FAIL
+    expected: [FAIL, PASS]
 
   [scrollWidth with negative margins: display: flex; overflow: clip; direction: rtl; flex-direction: column;]
-    expected: FAIL
+    expected: [FAIL, PASS]
 
   [scrollHeight with negative margins: display: flex; overflow: clip; direction: rtl; flex-direction: column;]
-    expected: FAIL
+    expected: [FAIL, PASS]
 
   [scrollWidth with negative margins: display: flex; overflow: clip; direction: ltr; flex-flow: column wrap-reverse;]
     expected: FAIL
 
   [scrollHeight with negative margins: display: flex; overflow: clip; direction: ltr; flex-flow: column wrap-reverse;]
-    expected: FAIL
+    expected: [FAIL, PASS]
 
   [scrollWidth with negative margins: display: flex; overflow: clip; direction: rtl; flex-flow: column wrap-reverse;]
     expected: FAIL
 
   [scrollHeight with negative margins: display: flex; overflow: clip; direction: rtl; flex-flow: column wrap-reverse;]
-    expected: FAIL
+    expected: [FAIL, PASS]
 
   [scrollWidth with negative margins: display: flex; overflow: clip; direction: ltr; flex-direction: column-reverse;]
-    expected: FAIL
+    expected: [FAIL, PASS]
 
   [scrollHeight with negative margins: display: flex; overflow: clip; direction: ltr; flex-direction: column-reverse;]
     expected: FAIL
 
   [scrollWidth with negative margins: display: flex; overflow: clip; direction: rtl; flex-direction: column-reverse;]
-    expected: FAIL
+    expected: [FAIL, PASS]
 
   [scrollHeight with negative margins: display: flex; overflow: clip; direction: rtl; flex-direction: column-reverse;]
     expected: FAIL
@@ -661,61 +646,46 @@
     expected: FAIL
 
   [scrollWidth with negative margins: display: grid; overflow: visible; direction: ltr; flex-direction: row;]
-    expected: FAIL
-
-  [scrollHeight with negative margins: display: grid; overflow: visible; direction: ltr; flex-direction: row;]
-    expected: FAIL
+    expected: [FAIL, PASS]
 
   [scrollWidth with negative margins: display: grid; overflow: hidden; direction: ltr; flex-direction: row;]
-    expected: FAIL
-
-  [scrollHeight with negative margins: display: grid; overflow: hidden; direction: ltr; flex-direction: row;]
-    expected: FAIL
+    expected: [FAIL, PASS]
 
   [scrollWidth with negative margins: display: grid; overflow: auto; direction: ltr; flex-direction: row;]
-    expected: FAIL
-
-  [scrollHeight with negative margins: display: grid; overflow: auto; direction: ltr; flex-direction: row;]
-    expected: FAIL
+    expected: [FAIL, PASS]
 
   [scrollWidth with negative margins: display: grid; overflow: clip; direction: ltr; flex-direction: row;]
-    expected: FAIL
-
-  [scrollHeight with negative margins: display: grid; overflow: clip; direction: ltr; flex-direction: row;]
-    expected: FAIL
+    expected: [FAIL, PASS]
 
   [scrollWidth with negative margins: display: grid; overflow: scroll; direction: ltr; flex-direction: row;]
-    expected: FAIL
-
-  [scrollHeight with negative margins: display: grid; overflow: scroll; direction: ltr; flex-direction: row;]
-    expected: FAIL
+    expected: [FAIL, PASS]
 
   [scrollWidth with negative margins: display: grid; overflow: visible; direction: rtl; flex-direction: row;]
     expected: FAIL
 
   [scrollHeight with negative margins: display: grid; overflow: visible; direction: rtl; flex-direction: row;]
-    expected: FAIL
+    expected: [FAIL, PASS]
 
   [scrollWidth with negative margins: display: grid; overflow: hidden; direction: rtl; flex-direction: row;]
     expected: FAIL
 
   [scrollHeight with negative margins: display: grid; overflow: hidden; direction: rtl; flex-direction: row;]
-    expected: FAIL
+    expected: [FAIL, PASS]
 
   [scrollWidth with negative margins: display: grid; overflow: auto; direction: rtl; flex-direction: row;]
     expected: FAIL
 
   [scrollHeight with negative margins: display: grid; overflow: auto; direction: rtl; flex-direction: row;]
-    expected: FAIL
+    expected: [FAIL, PASS]
 
   [scrollWidth with negative margins: display: grid; overflow: clip; direction: rtl; flex-direction: row;]
     expected: FAIL
 
   [scrollHeight with negative margins: display: grid; overflow: clip; direction: rtl; flex-direction: row;]
-    expected: FAIL
+    expected: [FAIL, PASS]
 
   [scrollWidth with negative margins: display: grid; overflow: scroll; direction: rtl; flex-direction: row;]
     expected: FAIL
 
   [scrollHeight with negative margins: display: grid; overflow: scroll; direction: rtl; flex-direction: row;]
-    expected: FAIL
+    expected: [FAIL, PASS]

tests/wpt/meta/css/cssom-view/table-scroll-props.html.ini

@@ -0,0 +1,6 @@
+[table-scroll-props.html]
+  [Table with separated border]
+    expected: FAIL
+
+  [Table with collapsed border]
+    expected: FAIL