mirror of
https://github.com/servo/servo.git
synced 2025-08-08 06:55:31 +01:00
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>
This commit is contained in:
Steven Novaryo
GitHub
parent
b92542b756
commit
bd6928f3dc
37 changed files with 974 additions and 288 deletions
56
tests/wpt/meta/MANIFEST.json
vendored
56
tests/wpt/meta/MANIFEST.json
vendored
|
|
@ -595710,6 +595710,55 @@
|
|||
{}
|
||||
]
|
||||
],
|
||||
"scrollable-overflow-transform-004.html": [
|
||||
"b398167fa309885658f044ccdd1df75bca880701",
|
||||
[
|
||||
null,
|
||||
{}
|
||||
]
|
||||
],
|
||||
"scrollable-overflow-transform-005.tentative.html": [
|
||||
"837b95ba96db71e7d696edfe4bb6c7c489e7a411",
|
||||
[
|
||||
null,
|
||||
{}
|
||||
]
|
||||
],
|
||||
"scrollable-overflow-transform-006.html": [
|
||||
"2eea759da6a1adad341b2145a8b29725e84c2db6",
|
||||
[
|
||||
null,
|
||||
{}
|
||||
]
|
||||
],
|
||||
"scrollable-overflow-transform-007.html": [
|
||||
"8aa6e5f17d8633e759d5b52b5096057c367d7b58",
|
||||
[
|
||||
null,
|
||||
{}
|
||||
]
|
||||
],
|
||||
"scrollable-overflow-transform-008.html": [
|
||||
"df1daeb842405ba6107be563e1652651ec232d58",
|
||||
[
|
||||
null,
|
||||
{}
|
||||
]
|
||||
],
|
||||
"scrollable-overflow-transform-009.html": [
|
||||
"aca1b28418adf361a38f59bb10e6ba3cdabd3097",
|
||||
[
|
||||
null,
|
||||
{}
|
||||
]
|
||||
],
|
||||
"scrollable-overflow-transform-010.tentative.html": [
|
||||
"e2c62cb4474ecbd486360fdd4aeb1c306a433f2d",
|
||||
[
|
||||
null,
|
||||
{}
|
||||
]
|
||||
],
|
||||
"scrollable-overflow-transform-dynamic-001.html": [
|
||||
"a233376bdb222e5eeb45e3b5f646a84a665e6594",
|
||||
[
|
||||
|
|
@ -595752,6 +595801,13 @@
|
|||
{}
|
||||
]
|
||||
],
|
||||
"scrollable-overflow-transform-unreachable-region.html": [
|
||||
"91e987bf82654415f47500f9d6d7d568e4eefcbc",
|
||||
[
|
||||
null,
|
||||
{}
|
||||
]
|
||||
],
|
||||
"scrollable-overflow-vertical-rl-dynamic.html": [
|
||||
"07f322901748c9709c3037d0223a546549cc9cff",
|
||||
[
|
||||
|
|
|
|||
|
|
@ -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
|
||||
|
||||
|
|
|
|||
|
|
@ -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
|
||||
|
|
|
|||
|
|
@ -1,3 +0,0 @@
|
|||
[overflow-inline-transform-relative.html]
|
||||
[#target used transform when computing scroll overflow]
|
||||
expected: FAIL
|
||||
|
|
@ -1,7 +1,4 @@
|
|||
[scroll-overflow-padding-block-001.html]
|
||||
expected: ERROR
|
||||
[undefined block-end]
|
||||
expected: FAIL
|
||||
|
||||
[undefined block-start]
|
||||
expected: [PASS, FAIL]
|
||||
|
|
|
|||
|
|
@ -1,9 +0,0 @@
|
|||
[scrollable-overflow-transform-001.html]
|
||||
[.container 1]
|
||||
expected: FAIL
|
||||
|
||||
[.container 2]
|
||||
expected: FAIL
|
||||
|
||||
[.container 3]
|
||||
expected: FAIL
|
||||
|
|
@ -1,9 +0,0 @@
|
|||
[scrollable-overflow-transform-002.html]
|
||||
[.container 1]
|
||||
expected: FAIL
|
||||
|
||||
[.container 2]
|
||||
expected: FAIL
|
||||
|
||||
[.container 3]
|
||||
expected: FAIL
|
||||
|
|
@ -1,9 +0,0 @@
|
|||
[scrollable-overflow-transform-003.html]
|
||||
[.container 1]
|
||||
expected: FAIL
|
||||
|
||||
[.container 2]
|
||||
expected: FAIL
|
||||
|
||||
[.container 3]
|
||||
expected: FAIL
|
||||
3
tests/wpt/meta/css/css-overflow/scrollable-overflow-transform-005.tentative.html.ini
vendored
Normal file
3
tests/wpt/meta/css/css-overflow/scrollable-overflow-transform-005.tentative.html.ini
vendored
Normal file
|
|
@ -0,0 +1,3 @@
|
|||
[scrollable-overflow-transform-005.tentative.html]
|
||||
[.container 6]
|
||||
expected: FAIL
|
||||
6
tests/wpt/meta/css/css-overflow/scrollable-overflow-transform-009.html.ini
vendored
Normal file
6
tests/wpt/meta/css/css-overflow/scrollable-overflow-transform-009.html.ini
vendored
Normal file
|
|
@ -0,0 +1,6 @@
|
|||
[scrollable-overflow-transform-009.html]
|
||||
[.container 2]
|
||||
expected: FAIL
|
||||
|
||||
[.container 3]
|
||||
expected: FAIL
|
||||
6
tests/wpt/meta/css/css-overflow/scrollable-overflow-transform-010.tentative.html.ini
vendored
Normal file
6
tests/wpt/meta/css/css-overflow/scrollable-overflow-transform-010.tentative.html.ini
vendored
Normal file
|
|
@ -0,0 +1,6 @@
|
|||
[scrollable-overflow-transform-010.tentative.html]
|
||||
[.container 1]
|
||||
expected: FAIL
|
||||
|
||||
[.container 2]
|
||||
expected: FAIL
|
||||
|
|
@ -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
|
||||
|
|
@ -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
|
||||
|
|
@ -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
|
||||
|
|
@ -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
|
||||
|
|
@ -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
|
||||
|
|
@ -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
|
||||
168
tests/wpt/meta/css/css-overflow/scrollable-overflow-transform-unreachable-region.html.ini
vendored
Normal file
168
tests/wpt/meta/css/css-overflow/scrollable-overflow-transform-unreachable-region.html.ini
vendored
Normal file
|
|
@ -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
|
||||
|
|
@ -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
|
||||
|
|
@ -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]
|
||||
|
|
|
|||
6
tests/wpt/meta/css/cssom-view/table-scroll-props.html.ini
vendored
Normal file
6
tests/wpt/meta/css/cssom-view/table-scroll-props.html.ini
vendored
Normal file
|
|
@ -0,0 +1,6 @@
|
|||
[table-scroll-props.html]
|
||||
[Table with separated border]
|
||||
expected: FAIL
|
||||
|
||||
[Table with collapsed border]
|
||||
expected: FAIL
|
||||
53
tests/wpt/tests/css/css-overflow/scrollable-overflow-transform-004.html
vendored
Normal file
53
tests/wpt/tests/css/css-overflow/scrollable-overflow-transform-004.html
vendored
Normal file
|
|
@ -0,0 +1,53 @@
|
|||
<!DOCTYPE html>
|
||||
<meta charset="utf-8">
|
||||
<title>CSS Overflow: Scrollable Overflow Transform Scroll Container</title>
|
||||
<link rel="author" title="Jo Steven Novaryo" href="mailto:steven.novaryo@gmail.com">
|
||||
<link rel="help" href="https://drafts.csswg.org/css-overflow-3/#scrollable" />
|
||||
<meta name="assert" content="Checks that the box of scroll container with transform contribute to the scrollable overflow.">
|
||||
<script src="/resources/testharness.js"></script>
|
||||
<script src="/resources/testharnessreport.js"></script>
|
||||
<script src="/resources/check-layout-th.js"></script>
|
||||
<style>
|
||||
.container {
|
||||
width: 100px;
|
||||
height: 100px;
|
||||
overflow: auto;
|
||||
background: silver;
|
||||
border: solid thick;
|
||||
scrollbar-width: none;
|
||||
}
|
||||
|
||||
.element {
|
||||
width: 50px;
|
||||
height: 50px;
|
||||
overflow: scroll;
|
||||
background: lime;
|
||||
}
|
||||
|
||||
.element-content {
|
||||
width: 500px;
|
||||
height: 500px;
|
||||
background: aqua;
|
||||
}
|
||||
</style>
|
||||
<body onload="checkLayout('.container')">
|
||||
|
||||
<div class="container" data-expected-scroll-width="250">
|
||||
<div style="transform: translateX(200px);" class="element">
|
||||
<div class="element-content"></div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="container" data-expected-scroll-height="350">
|
||||
<div style="transform: translateY(300px);" class="element">
|
||||
<div class="element-content"></div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="container" data-expected-scroll-width="250" data-expected-scroll-height="350">
|
||||
<div style="transform: translate(200px, 300px);" class="element">
|
||||
<div class="element-content"></div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
</body>
|
||||
68
tests/wpt/tests/css/css-overflow/scrollable-overflow-transform-005.tentative.html
vendored
Normal file
68
tests/wpt/tests/css/css-overflow/scrollable-overflow-transform-005.tentative.html
vendored
Normal file
|
|
@ -0,0 +1,68 @@
|
|||
<!DOCTYPE html>
|
||||
<meta charset="utf-8">
|
||||
<title>CSS Overflow: Scrollable Overflow Transform Exclusion of Untransformed Child Box</title>
|
||||
<link rel="author" title="Jo Steven Novaryo" href="mailto:steven.novaryo@gmail.com">
|
||||
<link rel="help" href="https://drafts.csswg.org/css-overflow-3/#scrollable"/>
|
||||
<link rel="help" href="https://github.com/w3c/csswg-drafts/issues/12113"/>
|
||||
<meta name="assert" content="Checks that the untransformed child box is not included in scrollable overflow.">
|
||||
<script src="/resources/testharness.js"></script>
|
||||
<script src="/resources/testharnessreport.js"></script>
|
||||
<script src="/resources/check-layout-th.js"></script>
|
||||
<style>
|
||||
.container {
|
||||
width: 100px;
|
||||
height: 100px;
|
||||
overflow: scroll;
|
||||
background: silver;
|
||||
border: solid thick;
|
||||
scrollbar-width: none;
|
||||
}
|
||||
|
||||
.element {
|
||||
width: 200px;
|
||||
height: 200px;
|
||||
background: lime;
|
||||
}
|
||||
|
||||
.element-2 {
|
||||
width: 100px;
|
||||
height: 100px;
|
||||
}
|
||||
</style>
|
||||
<body onload="checkLayout('.container')">
|
||||
|
||||
<div class="container" data-expected-scroll-width="100" data-expected-scroll-height="100">
|
||||
<div style="transform: translate(-200px, -200px);" class="element">
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="container" data-expected-scroll-width="150" data-expected-scroll-height="150">
|
||||
<div style="transform: translate(-25%, -25%);" class="element">
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="container" data-expected-scroll-height="100" data-expected-scroll-height="100">
|
||||
<div style="width: 100px; height: 100px;">
|
||||
<div style="transform: translate(-200px, -200px);" class="element">
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="container" data-expected-scroll-width="150" data-expected-scroll-height="150">
|
||||
<div style="width: 100px; height: 100px;">
|
||||
<div style="transform: translate(-25%, -25%);" class="element">
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="container" style="position: relative;" data-expected-scroll-width="100" data-expected-scroll-height="100">
|
||||
<div style="transform: translate(-200px, -200px); position: absolute;" class="element">
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="container" style="position: relative;" data-expected-scroll-width="150" data-expected-scroll-height="150">
|
||||
<div style="transform: translate(-25%, -25%); position: absolute;" class="element">
|
||||
</div>
|
||||
</div>
|
||||
|
||||
</body>
|
||||
44
tests/wpt/tests/css/css-overflow/scrollable-overflow-transform-006.html
vendored
Normal file
44
tests/wpt/tests/css/css-overflow/scrollable-overflow-transform-006.html
vendored
Normal file
|
|
@ -0,0 +1,44 @@
|
|||
<!DOCTYPE html>
|
||||
<meta charset="utf-8">
|
||||
<title>CSS Overflow: Scrollable Overflow Transform Rotate</title>
|
||||
<link rel="author" title="Jo Steven Novaryo" href="mailto:steven.novaryo@gmail.com">
|
||||
<link rel="help" href="https://drafts.csswg.org/css-overflow-3/#scrollable" />
|
||||
<meta name="assert" content="Checks that the bounding rectangle of rotated element is included correctly in scrollable overflow.">
|
||||
<script src="/resources/testharness.js"></script>
|
||||
<script src="/resources/testharnessreport.js"></script>
|
||||
<script src="/resources/check-layout-th.js"></script>
|
||||
<style>
|
||||
.container {
|
||||
width: 100px;
|
||||
height: 100px;
|
||||
overflow: scroll;
|
||||
background: silver;
|
||||
border: solid thick;
|
||||
scrollbar-width: none;
|
||||
}
|
||||
|
||||
.element {
|
||||
width: 200px;
|
||||
height: 200px;
|
||||
background: lime;
|
||||
}
|
||||
|
||||
.element-2 {
|
||||
width: 200px;
|
||||
height: 200px;
|
||||
background: aqua;
|
||||
}
|
||||
</style>
|
||||
<body onload="checkLayout('.container')">
|
||||
|
||||
<div class="container" data-expected-scroll-width="241" data-expected-scroll-height="241">
|
||||
<div style="transform: rotate(45deg);" class="element">
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="container" data-expected-scroll-width="241" data-expected-scroll-height="241">
|
||||
<div style="transform: rotate(-45deg);" class="element">
|
||||
</div>
|
||||
</div>
|
||||
|
||||
</body>
|
||||
46
tests/wpt/tests/css/css-overflow/scrollable-overflow-transform-007.html
vendored
Normal file
46
tests/wpt/tests/css/css-overflow/scrollable-overflow-transform-007.html
vendored
Normal file
|
|
@ -0,0 +1,46 @@
|
|||
<!DOCTYPE html>
|
||||
<meta charset="utf-8">
|
||||
<title>CSS Overflow: Scrollable Overflow Transform Scale</title>
|
||||
<link rel="author" title="Jo Steven Novaryo" href="mailto:steven.novaryo@gmail.com">
|
||||
<link rel="help" href="https://drafts.csswg.org/css-overflow-3/#scrollable" />
|
||||
<meta name="assert" content="Checks that the bounding rectangle of scaled element is included correctly in scrollable overflow.">
|
||||
<script src="/resources/testharness.js"></script>
|
||||
<script src="/resources/testharnessreport.js"></script>
|
||||
<script src="/resources/check-layout-th.js"></script>
|
||||
<style>
|
||||
.container {
|
||||
width: 100px;
|
||||
height: 100px;
|
||||
overflow: scroll;
|
||||
background: silver;
|
||||
border: solid thick;
|
||||
scrollbar-width: none;
|
||||
}
|
||||
|
||||
.element {
|
||||
width: 200px;
|
||||
height: 200px;
|
||||
background: lime;
|
||||
}
|
||||
|
||||
.element-2 {
|
||||
width: 200px;
|
||||
height: 200px;
|
||||
background: aqua;
|
||||
}
|
||||
</style>
|
||||
<body onload="checkLayout('.container')">
|
||||
|
||||
<div class="container" data-expected-scroll-width="300" data-expected-scroll-height="300">
|
||||
<div style="transform: scale(2);" class="element">
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="container" data-expected-scroll-height="250" data-expected-scroll-height="250">
|
||||
<div style="transform: scale(0.5);" class="element">
|
||||
<div style="transform: scale(3);" class="element-2">
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
</body>
|
||||
44
tests/wpt/tests/css/css-overflow/scrollable-overflow-transform-008.html
vendored
Normal file
44
tests/wpt/tests/css/css-overflow/scrollable-overflow-transform-008.html
vendored
Normal file
|
|
@ -0,0 +1,44 @@
|
|||
<!DOCTYPE html>
|
||||
<meta charset="utf-8">
|
||||
<title>CSS Overflow: Scrollable Overflow Transform Skew</title>
|
||||
<link rel="author" title="Jo Steven Novaryo" href="mailto:steven.novaryo@gmail.com">
|
||||
<link rel="help" href="https://drafts.csswg.org/css-overflow-3/#scrollable" />
|
||||
<meta name="assert" content="Checks that the bounding rectangle of skewed element is included correctly in scrollable overflow.">
|
||||
<script src="/resources/testharness.js"></script>
|
||||
<script src="/resources/testharnessreport.js"></script>
|
||||
<script src="/resources/check-layout-th.js"></script>
|
||||
<style>
|
||||
.container {
|
||||
width: 100px;
|
||||
height: 100px;
|
||||
overflow: scroll;
|
||||
background: silver;
|
||||
border: solid thick;
|
||||
scrollbar-width: none;
|
||||
}
|
||||
|
||||
.element {
|
||||
width: 200px;
|
||||
height: 200px;
|
||||
background: lime;
|
||||
}
|
||||
|
||||
.element-2 {
|
||||
width: 200px;
|
||||
height: 200px;
|
||||
background: aqua;
|
||||
}
|
||||
</style>
|
||||
<body onload="checkLayout('.container')">
|
||||
|
||||
<div class="container" data-expected-scroll-width="227" data-expected-scroll-height="227">
|
||||
<div style="transform: skew(-15deg, -15deg);" class="element">
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="container" data-expected-scroll-width="227" data-expected-scroll-height="227">
|
||||
<div style="transform: skew(15deg, 15deg);" class="element">
|
||||
</div>
|
||||
</div>
|
||||
|
||||
</body>
|
||||
65
tests/wpt/tests/css/css-overflow/scrollable-overflow-transform-009.html
vendored
Normal file
65
tests/wpt/tests/css/css-overflow/scrollable-overflow-transform-009.html
vendored
Normal file
|
|
@ -0,0 +1,65 @@
|
|||
<!DOCTYPE html>
|
||||
<meta charset="utf-8">
|
||||
<title>CSS Overflow: Scrollable Overflow Transform Unreachable Scrollable Overflow</title>
|
||||
<link rel="author" title="Jo Steven Novaryo" href="mailto:steven.novaryo@gmail.com">
|
||||
<link rel="help" href="https://drafts.csswg.org/css-overflow-3/#scrollable" />
|
||||
<meta name="assert" content="Checks that the box in unreachable scrollable overflow region with transform is not included in the calculation.">
|
||||
<script src="/resources/testharness.js"></script>
|
||||
<script src="/resources/testharnessreport.js"></script>
|
||||
<script src="/resources/check-layout-th.js"></script>
|
||||
<style>
|
||||
.container {
|
||||
width: 100px;
|
||||
height: 100px;
|
||||
overflow: scroll;
|
||||
background: silver;
|
||||
border: solid thick;
|
||||
scrollbar-width: none;
|
||||
}
|
||||
|
||||
.relative {
|
||||
position: relative;
|
||||
}
|
||||
|
||||
.absolute {
|
||||
position: absolute;
|
||||
}
|
||||
|
||||
.element {
|
||||
width: 100px;
|
||||
height: 100px;
|
||||
background: lime;
|
||||
}
|
||||
</style>
|
||||
<body onload="checkLayout('.container')">
|
||||
<div class="container" data-expected-scroll-width="100" data-expected-scroll-height="100">
|
||||
<div style="transform: translate(-300px, -300px);" class="element">
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="container" data-expected-scroll-width="100" data-expected-scroll-height="100">
|
||||
<div style="transform: translate(300px, -300px);" class="element">
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="container" data-expected-scroll-width="100" data-expected-scroll-height="100">
|
||||
<div style="transform: translate(-300px, 300px);" class="element">
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="container relative" data-expected-scroll-width="100" data-expected-scroll-height="100">
|
||||
<div style="transform: translate(-300px, -300px);" class="element absolute">
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="container relative" data-expected-scroll-width="100" data-expected-scroll-height="100">
|
||||
<div style="transform: translate(300px, -300px);" class="element absolute">
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="container relative" data-expected-scroll-width="100" data-expected-scroll-height="100">
|
||||
<div style="transform: translate(-300px, 300px);" class="element absolute">
|
||||
</div>
|
||||
</div>
|
||||
|
||||
</body>
|
||||
49
tests/wpt/tests/css/css-overflow/scrollable-overflow-transform-010.tentative.html
vendored
Normal file
49
tests/wpt/tests/css/css-overflow/scrollable-overflow-transform-010.tentative.html
vendored
Normal file
|
|
@ -0,0 +1,49 @@
|
|||
<!DOCTYPE html>
|
||||
<meta charset="utf-8">
|
||||
<title>CSS Overflow: Scrollable Overflow Transform Rotate Nested Element</title>
|
||||
<link rel="author" title="Jo Steven Novaryo" href="mailto:steven.novaryo@gmail.com">
|
||||
<link rel="help" href="https://drafts.csswg.org/css-overflow-3/#scrollable"/>
|
||||
<link rel="help" href="https://github.com/w3c/csswg-drafts/issues/12112"/>
|
||||
<meta name="assert" content="Checks that the bounding rectangle of nested rotated element is included correctly in scrollable overflow.">
|
||||
<script src="/resources/testharness.js"></script>
|
||||
<script src="/resources/testharnessreport.js"></script>
|
||||
<script src="/resources/check-layout-th.js"></script>
|
||||
<style>
|
||||
.container {
|
||||
width: 100px;
|
||||
height: 100px;
|
||||
overflow: scroll;
|
||||
background: silver;
|
||||
border: solid thick;
|
||||
scrollbar-width: none;
|
||||
}
|
||||
|
||||
.element {
|
||||
width: 200px;
|
||||
height: 200px;
|
||||
background: lime;
|
||||
}
|
||||
|
||||
.element-2 {
|
||||
width: 200px;
|
||||
height: 200px;
|
||||
background: aqua;
|
||||
}
|
||||
</style>
|
||||
<body onload="checkLayout('.container')">
|
||||
|
||||
<div class="container" data-expected-scroll-height="241" data-expected-scroll-height="241">
|
||||
<div style="transform: rotate(-45deg);" class="element">
|
||||
<div style="transform: rotate(45deg);" class="element-2">
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="container" data-expected-scroll-height="222" data-expected-scroll-height="222">
|
||||
<div style="transform: rotate(30deg) rotate(-15deg);" class="element">
|
||||
<div style="transform: rotate(-30deg) rotate(105deg);" class="element-2">
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
</body>
|
||||
95
tests/wpt/tests/css/css-overflow/scrollable-overflow-transform-unreachable-region.html
vendored
Normal file
95
tests/wpt/tests/css/css-overflow/scrollable-overflow-transform-unreachable-region.html
vendored
Normal file
|
|
@ -0,0 +1,95 @@
|
|||
<!doctype html>
|
||||
<meta charset="utf-8">
|
||||
<meta name="viewport" content="width=device-width,initial-scale=1">
|
||||
<title>Scrollable Overflow of a Scroll Container with Transformed Child in Unreachable Scrollable Overflow Region.</title>
|
||||
<link rel="help" href="https://drafts.csswg.org/css-overflow-3/#unreachable-scrollable-overflow-region">
|
||||
<link rel="help" href="https://drafts.csswg.org/css-overflow-3/#scrollable">
|
||||
<link rel="author" title="Jo Steven Novaryo" href="mailto:steven.novaryo@gmail.com">
|
||||
<script src=/resources/testharness.js></script>
|
||||
<script src=/resources/testharnessreport.js></script>
|
||||
<style>
|
||||
body { margin: 0 }
|
||||
.wrapper {
|
||||
width: 100px;
|
||||
height: 200px;
|
||||
overflow: scroll;
|
||||
}
|
||||
.inner {
|
||||
width: 100px;
|
||||
height: 200px;
|
||||
background-color: lime;
|
||||
transform: translate(-3px, -6px) scale(1.10);
|
||||
}
|
||||
</style>
|
||||
<div class="wrapper">
|
||||
<div class="inner"></div>
|
||||
</div>
|
||||
<script>
|
||||
const wrapper = document.querySelector(".wrapper");
|
||||
const contentBox = {
|
||||
width: 100,
|
||||
height: 200,
|
||||
};
|
||||
|
||||
function getCurrentTestName(display, direction, writingMode, flexDirection, flexWrap) {
|
||||
return `display: ${display}; ` +
|
||||
`direction: ${direction}; ` +
|
||||
`writing-mode: ${writingMode}; ` +
|
||||
`flex-direction: ${flexDirection}; ` +
|
||||
`flex-wrap: ${flexWrap};`;
|
||||
}
|
||||
|
||||
for (let display of ["flow-root", "flex", "grid"]) {
|
||||
for (let flexDirection of ["row", "row-reverse", "column", "column-reverse"]) {
|
||||
if (flexDirection != "row" && display != "flex") {
|
||||
// Don't bother retesting with all flexDirection values unless we're actually a flex container
|
||||
continue;
|
||||
}
|
||||
for (let flexWrap of ["nowrap", "wrap-reverse"]) {
|
||||
if (flexWrap != "nowrap" && display != "flex") {
|
||||
// Don't bother retesting with all flexWrap values unless we're actually a flex container
|
||||
continue;
|
||||
}
|
||||
for (let direction of ["ltr", "rtl"]) {
|
||||
for (let writingMode of ["horizontal-tb", "vertical-lr", "vertical-rl"]) {
|
||||
wrapper.style.display = display;
|
||||
wrapper.style.direction = direction;
|
||||
wrapper.style.writingMode = writingMode;
|
||||
wrapper.style.flexDirection = flexDirection;
|
||||
wrapper.style.flexWrap = flexWrap;
|
||||
// Suppress scrollbars because they get added to the padding are
|
||||
// and would need to account for them in flexbox.
|
||||
wrapper.style.scrollbarWidth = display == "flex" ? "none" : "";
|
||||
let vertical = writingMode.startsWith("vertical");
|
||||
let scrollToTop = vertical && direction == "rtl";
|
||||
let scrollToLeft = (!vertical && direction == "rtl") || writingMode == "vertical-rl";
|
||||
let flexMainAxisIsVertical = flexDirection.startsWith("row") == vertical;
|
||||
if (display == "flex") {
|
||||
if (flexDirection.endsWith("-reverse")) {
|
||||
if (flexMainAxisIsVertical) {
|
||||
scrollToTop = !scrollToTop;
|
||||
} else {
|
||||
scrollToLeft = !scrollToLeft;
|
||||
}
|
||||
}
|
||||
if (flexWrap == "wrap-reverse") {
|
||||
if (flexMainAxisIsVertical) {
|
||||
scrollToLeft = !scrollToLeft;
|
||||
} else {
|
||||
scrollToTop = !scrollToTop;
|
||||
}
|
||||
}
|
||||
}
|
||||
currentTestName = getCurrentTestName(display, direction, writingMode, flexDirection, flexWrap);
|
||||
test(function() {
|
||||
assert_equals(wrapper.scrollWidth, (scrollToLeft ? 108 : 102), "scrollWidth");
|
||||
}, "scrollWidth of " + currentTestName);
|
||||
test(function() {
|
||||
assert_equals(wrapper.scrollHeight, (scrollToTop ? 216 : 204), "scrollHeight");
|
||||
}, "scrollHeight of " + currentTestName);
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
Loading…
Add table
Add a link
Reference in a new issue