Update web-platform-tests to revision cf926057109b153af54214d52a2b3d746269d434

This commit is contained in:
WPT Sync Bot 2020-05-20 08:20:23 +00:00
parent 7e74f73301
commit 9309f626be
90 changed files with 2262 additions and 1287 deletions

View file

@ -1,4 +0,0 @@
[hit-test-floats-004.html]
[Miss float below something else]
expected: FAIL

View file

@ -0,0 +1,2 @@
[border-width-pixel-snapping-001-a.html]
expected: FAIL

View file

@ -0,0 +1,2 @@
[shaping-arabic-diacritics-002.html]
expected: FAIL

View file

@ -2,6 +2,3 @@
[Hit test intersecting scaled box] [Hit test intersecting scaled box]
expected: FAIL expected: FAIL
[Hit test within unscaled box]
expected: FAIL

View file

@ -0,0 +1,4 @@
[elementsFromPoint-invalid-cases.html]
[The root element is the last element returned for otherwise empty queries within the viewport]
expected: FAIL

View file

@ -312,21 +312,18 @@
[Response: combined response Content-Type: text/html;" \\" text/plain ";charset=GBK] [Response: combined response Content-Type: text/html;" \\" text/plain ";charset=GBK]
expected: NOTRUN expected: NOTRUN
[<iframe>: separate response Content-Type: text/html;" \\" text/plain] [<iframe>: combined response Content-Type: text/html;" text/plain]
expected: FAIL expected: FAIL
[<iframe>: combined response Content-Type: */* text/html] [<iframe>: combined response Content-Type: text/html */*;charset=gbk]
expected: FAIL expected: FAIL
[<iframe>: combined response Content-Type: text/html;x=" text/plain] [<iframe>: combined response Content-Type: text/plain;charset=gbk text/html]
expected: FAIL expected: FAIL
[<iframe>: combined response Content-Type: text/html */*] [<iframe>: separate response Content-Type: text/html;x=" text/plain]
expected: FAIL expected: FAIL
[<iframe>: separate response Content-Type: text/html;" text/plain] [<iframe>: combined response Content-Type: text/html;" \\" text/plain]
expected: FAIL
[<iframe>: separate response Content-Type: text/html */*]
expected: FAIL expected: FAIL

View file

@ -53,12 +53,3 @@
[combined text/javascript ] [combined text/javascript ]
expected: FAIL expected: FAIL
[separate text/javascript x/x]
expected: FAIL
[separate text/javascript;charset=windows-1252 text/javascript]
expected: FAIL
[separate text/javascript ]
expected: FAIL

View file

@ -11,3 +11,9 @@
[X-Content-Type-Options%3A%20nosniff%2C%2C%40%23%24%23%25%25%26%5E%26%5E*()()11!] [X-Content-Type-Options%3A%20nosniff%2C%2C%40%23%24%23%25%25%26%5E%26%5E*()()11!]
expected: FAIL expected: FAIL
[X-Content-Type-Options%3A%20%22nosniFF%22]
expected: FAIL
[X-Content-Type-Options%3A%20%2Cnosniff]
expected: FAIL

View file

@ -1,4 +1,4 @@
[traverse_the_history_2.html] [traverse_the_history_4.html]
[Multiple history traversals, last would be aborted] [Multiple history traversals, last would be aborted]
expected: FAIL expected: FAIL

View file

@ -1,4 +1,4 @@
[traverse_the_history_2.html] [traverse_the_history_5.html]
[Multiple history traversals, last would be aborted] [Multiple history traversals, last would be aborted]
expected: FAIL expected: FAIL

View file

@ -1,5 +1,5 @@
[iframe_sandbox_popups_escaping-1.html] [iframe_sandbox_popups_escaping-1.html]
expected: TIMEOUT expected: CRASH
[Check that popups from a sandboxed iframe escape the sandbox if\n allow-popups-to-escape-sandbox is used] [Check that popups from a sandboxed iframe escape the sandbox if\n allow-popups-to-escape-sandbox is used]
expected: TIMEOUT expected: TIMEOUT

View file

@ -1,4 +1,5 @@
[iframe_sandbox_popups_escaping-3.html] [iframe_sandbox_popups_escaping-3.html]
expected: CRASH
[Check that popups from a sandboxed iframe escape the sandbox if\n allow-popups-to-escape-sandbox is used] [Check that popups from a sandboxed iframe escape the sandbox if\n allow-popups-to-escape-sandbox is used]
expected: FAIL expected: FAIL

View file

@ -1,4 +1,5 @@
[iframe_sandbox_popups_nonescaping-2.html] [iframe_sandbox_popups_nonescaping-2.html]
expected: CRASH
[Check that popups from a sandboxed iframe do not escape the sandbox] [Check that popups from a sandboxed iframe do not escape the sandbox]
expected: FAIL expected: FAIL

View file

@ -0,0 +1,4 @@
[DOMContentLoaded-defer.html]
[The end: DOMContentLoaded and defer scripts]
expected: FAIL

View file

@ -0,0 +1,32 @@
[ignore-opens-during-unload.window.html]
expected: TIMEOUT
[document.open should bail out when ignore-opens-during-unload is greater than 0 during visibilitychange event (open(parent) while unloading parent and child)]
expected: TIMEOUT
[document.open should bail out when ignore-opens-during-unload is greater than 0 during beforeunload event (in top-level browsing context)]
expected: TIMEOUT
[document.open should bail out when ignore-opens-during-unload is greater than 0 during beforeunload event (open(parent) while unloading child only)]
expected: TIMEOUT
[document.open should bail out when ignore-opens-during-unload is greater than 0 during pagehide event (open(parent) while unloading parent and child)]
expected: TIMEOUT
[document.open should bail out when ignore-opens-during-unload is greater than 0 during pagehide event (in top-level browsing context)]
expected: FAIL
[document.open should bail out when ignore-opens-during-unload is greater than 0 during unload event (in top-level browsing context)]
expected: FAIL
[document.open should bail out when ignore-opens-during-unload is greater than 0 during visibilitychange event (in top-level browsing context)]
expected: TIMEOUT
[document.open should bail out when ignore-opens-during-unload is greater than 0 during beforeunload event (open(parent) while unloading parent and child)]
expected: TIMEOUT
[document.open should bail out when ignore-opens-during-unload is greater than 0 during visibilitychange event (open(parent) while unloading child only)]
expected: TIMEOUT
[document.open should bail out when ignore-opens-during-unload is greater than 0 during unload event (open(parent) while unloading parent and child)]
expected: TIMEOUT

View file

@ -1,5 +0,0 @@
[017.html]
expected: TIMEOUT
[origin of the script that invoked the method, about:blank]
expected: TIMEOUT

View file

@ -0,0 +1,5 @@
[018.html]
expected: TIMEOUT
[origin of the script that invoked the method, javascript:]
expected: TIMEOUT

View file

@ -122434,6 +122434,32 @@
{} {}
] ]
], ],
"border-width-pixel-snapping-001-a.html": [
"664e652c2bf277913eff4b15bcebbb4f6c679743",
[
null,
[
[
"/css/css-backgrounds/reference/border-width-pixel-snapping-001-ref.html",
"!="
]
],
{}
]
],
"border-width-pixel-snapping-001-b.html": [
"2bbb4f8b355bca712b1e2d6e4a3c15e01d9fd7e6",
[
null,
[
[
"/css/css-backgrounds/reference/border-width-pixel-snapping-001-ref.html",
"=="
]
],
{}
]
],
"box-shadow-005.html": [ "box-shadow-005.html": [
"705ced279d30e6113eed68b819b287f7e48219cd", "705ced279d30e6113eed68b819b287f7e48219cd",
[ [
@ -158055,6 +158081,32 @@
{} {}
] ]
], ],
"position-absolute-center-003.html": [
"187fae6fabd148e665dbd8bbcd8bd4e074717b5b",
[
null,
[
[
"/css/reference/ref-filled-green-100px-square.xht",
"=="
]
],
{}
]
],
"position-absolute-center-004.html": [
"b4922ef77e9aeb0d6c0479a01f40df2df9b6a860",
[
null,
[
[
"/css/reference/ref-filled-green-100px-square.xht",
"=="
]
],
{}
]
],
"position-absolute-dynamic-list-marker.html": [ "position-absolute-dynamic-list-marker.html": [
"79535326396e451d0db5ae6b6a1cfe56b810c443", "79535326396e451d0db5ae6b6a1cfe56b810c443",
[ [
@ -171165,6 +171217,32 @@
{} {}
] ]
], ],
"shaping-arabic-diacritics-001.html": [
"c7eee3481abb176c6956218abc8bd5a15ad9d335",
[
null,
[
[
"/css/css-text/shaping/reference/shaping-arabic-diacritics-001-ref.html",
"=="
]
],
{}
]
],
"shaping-arabic-diacritics-002.html": [
"ec252ef5ea943d6e049347548984a6c8535bfd25",
[
null,
[
[
"/css/css-text/shaping/reference/shaping-arabic-diacritics-002-ref.html",
"=="
]
],
{}
]
],
"shaping_lig-000.html": [ "shaping_lig-000.html": [
"6b918350596637ad77c7899558e842d3bdff1354", "6b918350596637ad77c7899558e842d3bdff1354",
[ [
@ -242703,7 +242781,7 @@
}, },
"support": { "support": {
".azure-pipelines.yml": [ ".azure-pipelines.yml": [
"9b8676ef43f8803ce437a4a43d29bfc1820f4476", "8c8a15d4ef438d21786fb62e5c7ca99475e80c45",
[] []
], ],
".codecov.yml": [ ".codecov.yml": [
@ -264960,6 +265038,10 @@
"549f3dbaa2e302777799d14c5ca1eb13a83493bf", "549f3dbaa2e302777799d14c5ca1eb13a83493bf",
[] []
], ],
"report-original-url-on-mixed-content-frame.https.sub.html.sub.headers": [
"d079fb134a5316191380e0e3065072f57d629d29",
[]
],
"report-original-url.sub.html.sub.headers": [ "report-original-url.sub.html.sub.headers": [
"1031a7a00a989d6f6b95c0aecf9ba5125ce026a3", "1031a7a00a989d6f6b95c0aecf9ba5125ce026a3",
[] []
@ -286385,6 +286467,10 @@
"67324c71786b92d4207976284d915f1893b8007d", "67324c71786b92d4207976284d915f1893b8007d",
[] []
], ],
"border-width-pixel-snapping-001-ref.html": [
"99dd2f0beb2a6a9b5bcf79408d1fbf089b8e15ec",
[]
],
"box-shadow-005-ref.html": [ "box-shadow-005-ref.html": [
"81a5cbf6b8e06f6435bc133287f128ed6af8ed62", "81a5cbf6b8e06f6435bc133287f128ed6af8ed62",
[] []
@ -303288,6 +303374,14 @@
"a75dd158d45dcbb2ffa53a2973d3c9d792cf3e05", "a75dd158d45dcbb2ffa53a2973d3c9d792cf3e05",
[] []
], ],
"shaping-arabic-diacritics-001-ref.html": [
"f1b3ee100d04cf7c8cb74a366e2064625d9d571e",
[]
],
"shaping-arabic-diacritics-002-ref.html": [
"d145e72ed85db49876f70d3b6c63c816a5d99c67",
[]
],
"shaping_lig-000-ref.html": [ "shaping_lig-000-ref.html": [
"7b92b83625b3800d3791efbe1248d8cc5ca2beb0", "7b92b83625b3800d3791efbe1248d8cc5ca2beb0",
[] []
@ -320834,7 +320928,7 @@
[] []
], ],
"generic-sensor-tests.js": [ "generic-sensor-tests.js": [
"22101ccc2731df9c3a8933c8ee7d20375d27b1da", "833bd0e73131edcf40125386549903cb31819cd3",
[] []
], ],
"resources": { "resources": {
@ -323454,7 +323548,7 @@
"289659a41fdf41178781c764643f8946f4ec09b7", "289659a41fdf41178781c764643f8946f4ec09b7",
[] []
], ],
"reporting.https.html.sub.headers": [ "reporting-to-endpoint.https.html.sub.headers": [
"cda6ab2272fc4858f8ba4119d13ca07104c7601f", "cda6ab2272fc4858f8ba4119d13ca07104c7601f",
[] []
], ],
@ -340605,6 +340699,10 @@
"49ceb2648a93410bdd5ee53ef0e114146210741b", "49ceb2648a93410bdd5ee53ef0e114146210741b",
[] []
], ],
"empty.h2.js": [
"e69de29bb2d1d6434b8b29ae775ad8c2e48c5391",
[]
],
"empty.html": [ "empty.html": [
"6feb11946b80d85c40bba8a9e859f6928cf90455", "6feb11946b80d85c40bba8a9e859f6928cf90455",
[] []
@ -340913,10 +341011,6 @@
"bcab35364dff6f4494d73adfa150d800efc6bf70", "bcab35364dff6f4494d73adfa150d800efc6bf70",
[] []
], ],
"idlharness-worker.sub.js": [
"44bd0870b9561eff46eaf1e56aa27912ce0c11a7",
[]
],
"iframe-with-image.html": [ "iframe-with-image.html": [
"ce78840cb28310947f39232acd87fba0c0262f0b", "ce78840cb28310947f39232acd87fba0c0262f0b",
[] []
@ -341009,6 +341103,10 @@
"ed20cd4dca6a14e427b907a1d5147c88596bb1f0", "ed20cd4dca6a14e427b907a1d5147c88596bb1f0",
[] []
], ],
"interface-requirements-worker.sub.js": [
"a3f239b654811317bfcedd09149afab928235c1b",
[]
],
"invalid-blobtype-iframe.https.html": [ "invalid-blobtype-iframe.https.html": [
"1e6cacb55d7f80f6c71e3be513c10a756d66543b", "1e6cacb55d7f80f6c71e3be513c10a756d66543b",
[] []
@ -343226,7 +343324,7 @@
[] []
], ],
"META.yml": [ "META.yml": [
"bac3e9780db682e76dd2cfe4447ca25d84eeaa2f", "3eb893f4e65c3c0e5567688bd30725bc21eb40cb",
[] []
], ],
"__init__.py": [ "__init__.py": [
@ -344009,7 +344107,7 @@
[] []
], ],
"serve.py": [ "serve.py": [
"0e5090c2eef80abd774797771297df2759265c59", "43ff7bd0dfbac5eae74cbe43235f016c4fe14d35",
[] []
], ],
"test_functional.py": [ "test_functional.py": [
@ -352049,6 +352147,14 @@
"c7a75d7d221561df02c42470ad5e751324de645d", "c7a75d7d221561df02c42470ad5e751324de645d",
[] []
], ],
"META.yml": [
"befe8a68dd5d060da9480f9a967fd11060281967",
[]
],
"README.md": [
"ef0dbfee60ce3e787131ca40e5be64952e578e03",
[]
],
"common": { "common": {
"constants.js": [ "constants.js": [
"9d3dd1a32defa22fd3a0cd0e17504cb4727b9622", "9d3dd1a32defa22fd3a0cd0e17504cb4727b9622",
@ -367577,7 +367683,7 @@
] ]
], ],
"idlharness.https.any.js": [ "idlharness.https.any.js": [
"b0ccebd9f48999284ec36dbfb11a35314efa3135", "ae65eb49f2120e1a6d7222a7c0ecc9836c4ff5a8",
[ [
"WebCryptoAPI/idlharness.https.any.html", "WebCryptoAPI/idlharness.https.any.html",
{ {
@ -367589,8 +367695,13 @@
[ [
"script", "script",
"/resources/idlharness.js" "/resources/idlharness.js"
],
[
"timeout",
"long"
] ]
] ],
"timeout": "long"
} }
], ],
[ [
@ -367604,8 +367715,13 @@
[ [
"script", "script",
"/resources/idlharness.js" "/resources/idlharness.js"
],
[
"timeout",
"long"
] ]
] ],
"timeout": "long"
} }
] ]
], ],
@ -375809,8 +375925,15 @@
{} {}
] ]
], ],
"report-original-url-on-mixed-content-frame.https.sub.html": [
"67db730631fee8acf261b0cdbcdbd8647e21e46c",
[
null,
{}
]
],
"report-original-url.sub.html": [ "report-original-url.sub.html": [
"45c1aeb2de86e64ec7de51bf0898c85f42d13320", "5c9c4566bf7d008be44c770c7695ebde0b469b44",
[ [
null, null,
{} {}
@ -387018,7 +387141,7 @@
] ]
], ],
"grid-inline-support-flexible-lengths-001.html": [ "grid-inline-support-flexible-lengths-001.html": [
"42bbb43cf6ae229222375f3af822246c8bdb8d97", "3a2c94238987b84fc99bee3c80e2ddc7fd04793c",
[ [
null, null,
{} {}
@ -387032,28 +387155,35 @@
] ]
], ],
"grid-inline-support-grid-template-columns-rows-001.html": [ "grid-inline-support-grid-template-columns-rows-001.html": [
"cbcdc2c345400235f777974c05a041b13c332b1b", "32733e238fad58677447b44be9c5fcc934fe803d",
[ [
null, null,
{} {}
] ]
], ],
"grid-inline-support-named-grid-lines-001.html": [ "grid-inline-support-named-grid-lines-001.html": [
"a405f0557c94cdab2a0bd6803c38b1d790947adc", "fc4caf282349776da41ee63c6a07c3a834243fdc",
[ [
null, null,
{} {}
] ]
], ],
"grid-inline-support-repeat-001.html": [ "grid-inline-support-repeat-001.html": [
"67a0c6611223f1f610ee575b0dc230027e3105c9", "465e5e8cd826306ce2c5b6661e086df6eb9e96a1",
[ [
null, null,
{} {}
] ]
], ],
"grid-inline-template-columns-rows-resolved-values-001.html": [ "grid-inline-template-columns-rows-resolved-values-001.html": [
"4b1390687dcdb07399b88dad5c93adbd908067e4", "ff1f814309603c13248b7045d9ca0f9900bd04fe",
[
null,
{}
]
],
"grid-inline-template-columns-rows-resolved-values-001.tentative.html": [
"44abd5ee8a63a51140082f3265374cac51ce656b",
[ [
null, null,
{} {}
@ -387095,7 +387225,7 @@
] ]
], ],
"grid-support-flexible-lengths-001.html": [ "grid-support-flexible-lengths-001.html": [
"db9488af25876a439d20b3a93de6be66a2729d43", "0dae45b39d1acc556ed79fac3ff58562e8ce8e78",
[ [
null, null,
{} {}
@ -387109,21 +387239,21 @@
] ]
], ],
"grid-support-grid-template-columns-rows-001.html": [ "grid-support-grid-template-columns-rows-001.html": [
"cb0dbffe1614e286d2b179b75dd0aaf3f195cd98", "bf818cd85eaff5b659165021e317c23b00d71f77",
[ [
null, null,
{} {}
] ]
], ],
"grid-support-named-grid-lines-001.html": [ "grid-support-named-grid-lines-001.html": [
"5357855b0474b8036f72de77ead519104ae1fb3d", "bff5e8151c782060f08f8fdcf59ccd142d65547e",
[ [
null, null,
{} {}
] ]
], ],
"grid-support-repeat-001.html": [ "grid-support-repeat-001.html": [
"54d230cca9d2be3509d7af79c83eb213075d14de", "c2c8be0c5910f6bb0b16f33ac536955b63cca0c3",
[ [
null, null,
{} {}
@ -387144,7 +387274,14 @@
] ]
], ],
"grid-template-columns-rows-resolved-values-001.html": [ "grid-template-columns-rows-resolved-values-001.html": [
"df91cebf63ee0a251e1c8da56567f7684bf4b1f9", "c992bf66d269d0923e78b59f90da4e34395bebe2",
[
null,
{}
]
],
"grid-template-columns-rows-resolved-values-001.tentative.html": [
"d3ab1093299f44e4e59bd16986af8e36cb5e40e2",
[ [
null, null,
{} {}
@ -387173,6 +387310,13 @@
{} {}
] ]
], ],
"grid-items-minimum-height-orthogonal-001.html": [
"c8f46336714140e942c19382f0e9f449e93ab90f",
[
null,
{}
]
],
"grid-items-minimum-width-001.html": [ "grid-items-minimum-width-001.html": [
"78bbfcbd2f64f0777a3656fec296e029975c1ebb", "78bbfcbd2f64f0777a3656fec296e029975c1ebb",
[ [
@ -387188,7 +387332,7 @@
] ]
], ],
"grid-items-minimum-width-orthogonal-001.html": [ "grid-items-minimum-width-orthogonal-001.html": [
"33df23e6c0ab2048336e0171569773ba9c5c4ccc", "4f8e68911376306a6551f911960e134175195b0c",
[ [
null, null,
{} {}
@ -387364,7 +387508,7 @@
] ]
}, },
"grid-layout-properties.html": [ "grid-layout-properties.html": [
"a5376827eb91a2e4a92fe4738b1a319fcdc38ee8", "38fde5ba20d4686b2a1ba15c226ced4671c015a7",
[ [
null, null,
{} {}
@ -387826,7 +387970,7 @@
] ]
], ],
"grid-template-columns-computed-withcontent.html": [ "grid-template-columns-computed-withcontent.html": [
"ed67f03f6c226ad32370b76a36f431e4636b463a", "a550b84e05253127b9641cafa7ffd21c5958b0ca",
[ [
null, null,
{} {}
@ -387875,7 +388019,7 @@
] ]
], ],
"grid-template-rows-computed-withcontent.html": [ "grid-template-rows-computed-withcontent.html": [
"1e85f16d9338a5b74bd54be79e42a4007ffd715b", "693cf338c0dc42406336ccd99a605b1cf0d4f9be",
[ [
null, null,
{} {}
@ -447068,14 +447212,7 @@
] ]
], ],
"reporting-navigation.https.html": [ "reporting-navigation.https.html": [
"503e52110bdb87387a7c800370f89c73469c9483", "2baf1755f0ca1ad2cc31dc0358a4c7b8014d41cd",
[
null,
{}
]
],
"reporting-subresource-corp.https.html": [
"aa76bbe8d21d259ed0b9dcadb1d942635134ac79",
[ [
null, null,
{ {
@ -447083,8 +447220,17 @@
} }
] ]
], ],
"reporting.https.html": [ "reporting-subresource-corp.https.html": [
"42d5e6cc33537e988daf77d740fdcdeab64508c5", "5314ec93550f2641dd249b9e912a6c3688f3ab0c",
[
null,
{
"timeout": "long"
}
]
],
"reporting-to-endpoint.https.html": [
"cfff7bcb9e8aac12a210a657418fe0a78156e93b",
[ [
null, null,
{ {
@ -467661,7 +467807,7 @@
] ]
}, },
"scriptlevel-001.html": [ "scriptlevel-001.html": [
"11ad68d818829e2fe63510560b6d56ff39d833a8", "f91635b73879255422f3df613a40eac1df81f80b",
[ [
null, null,
{} {}
@ -468695,7 +468841,7 @@
] ]
], ],
"idlharness.window.js": [ "idlharness.window.js": [
"9d8f7eefb84dcc16534f1311c3b3c3d68e84572d", "b76348b59df51867bea664dc12ba9ec97c9328da",
[ [
"mediacapture-image/idlharness.window.html", "mediacapture-image/idlharness.window.html",
{ {
@ -468707,8 +468853,13 @@
[ [
"script", "script",
"/resources/idlharness.js" "/resources/idlharness.js"
],
[
"timeout",
"long"
] ]
] ],
"timeout": "long"
} }
] ]
], ],
@ -472378,7 +472529,7 @@
}, },
"netinfo": { "netinfo": {
"idlharness.any.js": [ "idlharness.any.js": [
"96b114fdb56d38935c085b8fd5f4f4689dad9858", "21d5595012735079165e68f8aa8a5b29a7fb7bdb",
[ [
"netinfo/idlharness.any.html", "netinfo/idlharness.any.html",
{ {
@ -472390,8 +472541,13 @@
[ [
"script", "script",
"/resources/idlharness.js" "/resources/idlharness.js"
],
[
"timeout",
"long"
] ]
] ],
"timeout": "long"
} }
], ],
[ [
@ -472405,8 +472561,13 @@
[ [
"script", "script",
"/resources/idlharness.js" "/resources/idlharness.js"
],
[
"timeout",
"long"
] ]
] ],
"timeout": "long"
} }
] ]
], ],
@ -489534,6 +489695,137 @@
] ]
} }
}, },
"idlharness.https.any.js": [
"a6c434f5566f5f9f695fce43b5c41e88b39dcc67",
[
"service-workers/idlharness.https.any.html",
{
"script_metadata": [
[
"global",
"window,worker"
],
[
"script",
"/resources/WebIDLParser.js"
],
[
"script",
"/resources/idlharness.js"
],
[
"script",
"cache-storage/resources/test-helpers.js"
],
[
"script",
"service-worker/resources/test-helpers.sub.js"
],
[
"timeout",
"long"
]
],
"timeout": "long"
}
],
[
"service-workers/idlharness.https.any.serviceworker.html",
{
"script_metadata": [
[
"global",
"window,worker"
],
[
"script",
"/resources/WebIDLParser.js"
],
[
"script",
"/resources/idlharness.js"
],
[
"script",
"cache-storage/resources/test-helpers.js"
],
[
"script",
"service-worker/resources/test-helpers.sub.js"
],
[
"timeout",
"long"
]
],
"timeout": "long"
}
],
[
"service-workers/idlharness.https.any.sharedworker.html",
{
"script_metadata": [
[
"global",
"window,worker"
],
[
"script",
"/resources/WebIDLParser.js"
],
[
"script",
"/resources/idlharness.js"
],
[
"script",
"cache-storage/resources/test-helpers.js"
],
[
"script",
"service-worker/resources/test-helpers.sub.js"
],
[
"timeout",
"long"
]
],
"timeout": "long"
}
],
[
"service-workers/idlharness.https.any.worker.html",
{
"script_metadata": [
[
"global",
"window,worker"
],
[
"script",
"/resources/WebIDLParser.js"
],
[
"script",
"/resources/idlharness.js"
],
[
"script",
"cache-storage/resources/test-helpers.js"
],
[
"script",
"service-worker/resources/test-helpers.sub.js"
],
[
"timeout",
"long"
]
],
"timeout": "long"
}
]
],
"service-worker": { "service-worker": {
"Service-Worker-Allowed-header.https.html": [ "Service-Worker-Allowed-header.https.html": [
"6f44bb17e7da958a195e8602aa5aef9c135a80b3", "6f44bb17e7da958a195e8602aa5aef9c135a80b3",
@ -489855,6 +490147,13 @@
{} {}
] ]
], ],
"data-iframe.html": [
"d767d574345bf7058d58381d94e5dabffd1fca9e",
[
null,
{}
]
],
"data-transfer-files.https.html": [ "data-transfer-files.https.html": [
"cc8ab6e672726e168b44dfee5b4720012fffee0a", "cc8ab6e672726e168b44dfee5b4720012fffee0a",
[ [
@ -490298,24 +490597,6 @@
{} {}
] ]
], ],
"idlharness-sw.https.html": [
"5209cc6702e147c023032398211a365874162227",
[
null,
{
"timeout": "long"
}
]
],
"idlharness-window.https.html": [
"cc3bdaf11fc7bc174eef555a60263e192efdc539",
[
null,
{
"timeout": "long"
}
]
],
"immutable-prototype-serviceworker.https.html": [ "immutable-prototype-serviceworker.https.html": [
"e63f6b348a861345101670b9c3d87aaa4977b0c4", "e63f6b348a861345101670b9c3d87aaa4977b0c4",
[ [
@ -490379,6 +490660,15 @@
{} {}
] ]
], ],
"interface-requirements-sw.https.html": [
"eef868c889f04d257055d9f08ce22832b6cc34fd",
[
null,
{
"timeout": "long"
}
]
],
"invalid-blobtype.https.html": [ "invalid-blobtype.https.html": [
"1c5920fb039101b18fc3c39e53f7cbb9b5e1ebfc", "1c5920fb039101b18fc3c39e53f7cbb9b5e1ebfc",
[ [
@ -490556,6 +490846,13 @@
{} {}
] ]
], ],
"next-hop-protocol.https.html": [
"7a907438d5d9f0b3ba1e198e048ea0b2e86a2415",
[
null,
{}
]
],
"onactivate-script-error.https.html": [ "onactivate-script-error.https.html": [
"f5e80bb9a456bc57f2a821e1fd69114e6ae8638a", "f5e80bb9a456bc57f2a821e1fd69114e6ae8638a",
[ [
@ -509569,7 +509866,7 @@
] ]
], ],
"idlharness.https.window.js": [ "idlharness.https.window.js": [
"1520387caf133dc43c5f036bbf24a99ef73a7f3c", "fbe59864af99c0a55b83e942f0e40f4d45de72a6",
[ [
"web-share/idlharness.https.window.html", "web-share/idlharness.https.window.html",
{ {
@ -509581,8 +509878,13 @@
[ [
"script", "script",
"/resources/idlharness.js" "/resources/idlharness.js"
],
[
"timeout",
"long"
] ]
] ],
"timeout": "long"
} }
] ]
], ],
@ -513016,7 +513318,7 @@
] ]
], ],
"RTCPeerConnection-videoDetectorTest.html": [ "RTCPeerConnection-videoDetectorTest.html": [
"c9d0f24b12b3354808795cdf293ec3ecec0914b2", "71fffdc68603465b22b32da738ab5fedab378f41",
[ [
null, null,
{ {
@ -513118,7 +513420,7 @@
] ]
], ],
"RTCRtpSender-replaceTrack.https.html": [ "RTCRtpSender-replaceTrack.https.html": [
"671e86fd4e893a061944333c03fc3158368ae5ca", "77b0fc9594c221d5f8f9fe68950940e992982e99",
[ [
null, null,
{} {}
@ -513563,7 +513865,7 @@
}, },
"webrtc-priority": { "webrtc-priority": {
"RTCPeerConnection-ondatachannel.html": [ "RTCPeerConnection-ondatachannel.html": [
"b153c3adac502f48d40610ba7178bb25faa103ee", "e4b1e8d58a51be112cb4f68a7681268219f0c81c",
[ [
null, null,
{} {}

View file

@ -1,4 +0,0 @@
[hit-test-floats-004.html]
[Miss float below something else]
expected: FAIL

View file

@ -0,0 +1,2 @@
[border-width-pixel-snapping-001-a.html]
expected: FAIL

View file

@ -0,0 +1,2 @@
[shaping-arabic-diacritics-002.html]
expected: FAIL

View file

@ -2,6 +2,3 @@
[Hit test intersecting scaled box] [Hit test intersecting scaled box]
expected: FAIL expected: FAIL
[Hit test within unscaled box]
expected: FAIL

View file

@ -0,0 +1,4 @@
[elementsFromPoint-invalid-cases.html]
[The root element is the last element returned for otherwise empty queries within the viewport]
expected: FAIL

View file

@ -312,21 +312,18 @@
[fetch(): separate response Content-Type: text/plain ] [fetch(): separate response Content-Type: text/plain ]
expected: NOTRUN expected: NOTRUN
[<iframe>: separate response Content-Type: text/html;" \\" text/plain] [<iframe>: combined response Content-Type: text/html;" text/plain]
expected: FAIL expected: FAIL
[<iframe>: combined response Content-Type: */* text/html] [<iframe>: combined response Content-Type: text/html */*;charset=gbk]
expected: FAIL expected: FAIL
[<iframe>: combined response Content-Type: text/html;x=" text/plain] [<iframe>: combined response Content-Type: text/plain;charset=gbk text/html]
expected: FAIL expected: FAIL
[<iframe>: combined response Content-Type: text/html */*] [<iframe>: separate response Content-Type: text/html;x=" text/plain]
expected: FAIL expected: FAIL
[<iframe>: separate response Content-Type: text/html;" text/plain] [<iframe>: combined response Content-Type: text/html;" \\" text/plain]
expected: FAIL
[<iframe>: separate response Content-Type: text/html */*]
expected: FAIL expected: FAIL

View file

@ -53,12 +53,3 @@
[combined text/javascript ] [combined text/javascript ]
expected: FAIL expected: FAIL
[separate text/javascript x/x]
expected: FAIL
[separate text/javascript;charset=windows-1252 text/javascript]
expected: FAIL
[separate text/javascript ]
expected: FAIL

View file

@ -11,3 +11,9 @@
[X-Content-Type-Options%3A%20nosniff%2C%2C%40%23%24%23%25%25%26%5E%26%5E*()()11!] [X-Content-Type-Options%3A%20nosniff%2C%2C%40%23%24%23%25%25%26%5E%26%5E*()()11!]
expected: FAIL expected: FAIL
[X-Content-Type-Options%3A%20%22nosniFF%22]
expected: FAIL
[X-Content-Type-Options%3A%20%2Cnosniff]
expected: FAIL

View file

@ -0,0 +1,4 @@
[traverse_the_history_4.html]
[Multiple history traversals, last would be aborted]
expected: FAIL

View file

@ -0,0 +1,4 @@
[traverse_the_history_5.html]
[Multiple history traversals, last would be aborted]
expected: FAIL

View file

@ -1,6 +1,6 @@
[iframe_sandbox_popups_escaping-1.html] [iframe_sandbox_popups_escaping-1.html]
type: testharness type: testharness
expected: TIMEOUT expected: CRASH
[Check that popups from a sandboxed iframe escape the sandbox if\n allow-popups-to-escape-sandbox is used] [Check that popups from a sandboxed iframe escape the sandbox if\n allow-popups-to-escape-sandbox is used]
expected: TIMEOUT expected: TIMEOUT

View file

@ -1,5 +1,6 @@
[iframe_sandbox_popups_escaping-3.html] [iframe_sandbox_popups_escaping-3.html]
type: testharness type: testharness
expected: CRASH
[Check that popups from a sandboxed iframe escape the sandbox if\n allow-popups-to-escape-sandbox is used] [Check that popups from a sandboxed iframe escape the sandbox if\n allow-popups-to-escape-sandbox is used]
expected: FAIL expected: FAIL

View file

@ -1,5 +1,6 @@
[iframe_sandbox_popups_nonescaping-2.html] [iframe_sandbox_popups_nonescaping-2.html]
type: testharness type: testharness
expected: CRASH
[Check that popups from a sandboxed iframe do not escape the sandbox] [Check that popups from a sandboxed iframe do not escape the sandbox]
expected: FAIL expected: FAIL

View file

@ -0,0 +1,4 @@
[DOMContentLoaded-defer.html]
[The end: DOMContentLoaded and defer scripts]
expected: FAIL

View file

@ -1,5 +1,5 @@
[ignore-opens-during-unload.window.html] [ignore-opens-during-unload.window.html]
expected: CRASH expected: TIMEOUT
[ignore-opens-during-unload] [ignore-opens-during-unload]
expected: FAIL expected: FAIL

View file

@ -1,5 +0,0 @@
[017.html]
expected: TIMEOUT
[origin of the script that invoked the method, about:blank]
expected: TIMEOUT

View file

@ -0,0 +1,5 @@
[018.html]
expected: TIMEOUT
[origin of the script that invoked the method, javascript:]
expected: TIMEOUT

View file

@ -1,5 +1,5 @@
# This is the configuration file for Azure Pipelines, used to run tests on # This is the configuration file for Azure Pipelines, used to run tests on
# macOS. Documentation to help understand this setup: # macOS and Windows. Documentation to help understand this setup:
# https://docs.microsoft.com/en-us/azure/devops/pipelines/yaml-schema # https://docs.microsoft.com/en-us/azure/devops/pipelines/yaml-schema
# https://docs.microsoft.com/en-us/azure/devops/pipelines/build/triggers # https://docs.microsoft.com/en-us/azure/devops/pipelines/build/triggers
# https://docs.microsoft.com/en-us/azure/devops/pipelines/process/multiple-phases # https://docs.microsoft.com/en-us/azure/devops/pipelines/process/multiple-phases

View file

@ -1,5 +1,6 @@
// META: script=/resources/WebIDLParser.js // META: script=/resources/WebIDLParser.js
// META: script=/resources/idlharness.js // META: script=/resources/idlharness.js
// META: timeout=long
// https://w3c.github.io/webcrypto/Overview.html // https://w3c.github.io/webcrypto/Overview.html

View file

@ -0,0 +1,11 @@
<!DOCTYPE html>
<html>
<head>
<script src="/resources/testharness.js"></script>
<script src="/resources/testharnessreport.js"></script>
</head>
<body>
<script async defer src='../support/checkReport.sub.js?reportField=blocked-uri&reportValue={{location[scheme]}}%3A%2F%2F{{location[host]}}/common/redirect.py%3Flocation%3Dhttp%253A%252F%252F{{hosts[][]}}%253A{{ports[http][0]}}%252Fcontent-security-policy%252Fsupport%252Ffail.html%253Ft%253D1'></script>
<iframe src='{{location[scheme]}}://{{location[host]}}/common/redirect.py?location=http%3A%2F%2F{{hosts[][]}}%3A{{ports[http][0]}}%2Fcontent-security-policy%2Fsupport%2Ffail.html%3Ft%3D1' style='display: none;'>
</body>
</html>

View file

@ -0,0 +1,6 @@
Expires: Mon, 26 Jul 1997 05:00:00 GMT
Cache-Control: no-store, no-cache, must-revalidate
Cache-Control: post-check=0, pre-check=0, false
Pragma: no-cache
Set-Cookie: report-original-url-on-mixed-content-frame={{$id:uuid()}}; Path=/content-security-policy/reporting/
Content-Security-Policy: block-all-mixed-content; report-uri ../support/report.py?op=put&reportID={{$id}}

View file

@ -34,14 +34,14 @@ async_test(t => {
async_test(t => { async_test(t => {
var i = document.createElement('img'); var i = document.createElement('img');
var url = "{{location[scheme]}}://{{domains[www1]}}:{{ports[http][0]}}/common/redirect.py?location=" + encodeURIComponent("{{location[scheme]}}://{{location[host]}}/content-security-policy/support/fail.png?t=3"); var url = "{{location[scheme]}}://{{domains[www1]}}:{{ports[http][0]}}/common/redirect.py?location=" + encodeURIComponent("{{location[scheme]}}://{{location[host]}}/content-security-policy/support/fail.png?t=3");
createListener("{{location[scheme]}}://{{location[host]}}/content-security-policy/support/fail.png?t=3", t); createListener(url, t);
i.src = url; i.src = url;
}, "Block after redirect, same-origin = original URL in report"); }, "Block after redirect, same-origin = original URL in report");
async_test(t => { async_test(t => {
var i = document.createElement('img'); var i = document.createElement('img');
var url = "{{location[scheme]}}://{{domains[www1]}}:{{ports[http][0]}}/common/redirect.py?location=" + encodeURIComponent("{{location[scheme]}}://{{domains[www2]}}:{{ports[http][0]}}/content-security-policy/support/fail.png?t=4"); var url = "{{location[scheme]}}://{{domains[www1]}}:{{ports[http][0]}}/common/redirect.py?location=" + encodeURIComponent("{{location[scheme]}}://{{domains[www2]}}:{{ports[http][0]}}/content-security-policy/support/fail.png?t=4");
createListener("{{location[scheme]}}://{{domains[www2]}}:{{ports[http][0]}}", t); createListener(url, t);
i.src = url; i.src = url;
}, "Block after redirect, cross-origin = original URL in report"); }, "Block after redirect, cross-origin = original URL in report");
</script> </script>

View file

@ -0,0 +1,8 @@
<!DOCTYPE html>
<meta charset="utf-8">
<title>CSS Backgrounds and Borders Test: border-width pixel snapping</title>
<link rel="author" title="Manuel Rego Casasnovas" href="mailto:rego@igalia.com">
<link rel="help" href="https://drafts.csswg.org/css-ui/#outline-width">
<link rel="mismatch" href="reference/border-width-pixel-snapping-001-ref.html">
<meta name="assert" content="Test checks that outline-width is floored down when it needs to do pixel snapping (so 1.9px are not the same than 2px).">
<div style="border: 1.9px solid black; width: 100.2px; height: 100.2px;"></div>

View file

@ -0,0 +1,8 @@
<!DOCTYPE html>
<meta charset="utf-8">
<title>CSS Backgrounds and Borders Test: border-width pixel snapping</title>
<link rel="author" title="Manuel Rego Casasnovas" href="mailto:rego@igalia.com">
<link rel="help" href="https://drafts.csswg.org/css-ui/#outline-width">
<link rel="match" href="reference/border-width-pixel-snapping-001-ref.html">
<meta name="assert" content="Test checks that outline-width is floored down when it needs to do pixel snapping (so 2.1px are the same than 2px).">
<div style="border: 2.1px solid black; width: 99.8px; height: 99.8px;"></div>

View file

@ -0,0 +1,5 @@
<!DOCTYPE html>
<meta charset="utf-8">
<title>CSS Backgrounds and Borders Reference Test: border-width pixel snapping</title>
<link rel="author" title="Manuel Rego Casasnovas" href="mailto:rego@igalia.com">
<div style="border: 2px solid black; width: 100px; height: 100px;"></div>

View file

@ -85,21 +85,21 @@ document.fonts.ready.then(()=> {
// Wrong values. // Wrong values.
TestingUtils.testGridTemplateColumnsRows("emptyGrid", "fr", "fr", "none", "none"); TestingUtils.testGridTemplateColumnsRows("emptyGrid", "fr", "fr", "none", "none");
TestingUtils.testGridTemplateColumnsRows("grid", "fr", "fr", "none", "none"); TestingUtils.testGridTemplateColumnsRows("grid", "fr", "fr", "90px", "10px");
TestingUtils.testGridTemplateColumnsRows("emptyGrid", "1 fr", "1 fr", "none", "none"); TestingUtils.testGridTemplateColumnsRows("emptyGrid", "1 fr", "1 fr", "none", "none");
TestingUtils.testGridTemplateColumnsRows("grid", "1 fr", "1 fr", "none", "none"); TestingUtils.testGridTemplateColumnsRows("grid", "1 fr", "1 fr", "90px", "10px");
TestingUtils.testGridTemplateColumnsRows("emptyGrid", "1free-space", "1free-space", "none", "none"); TestingUtils.testGridTemplateColumnsRows("emptyGrid", "1free-space", "1free-space", "none", "none");
TestingUtils.testGridTemplateColumnsRows("grid", "1free-space", "1free-space", "none", "none"); TestingUtils.testGridTemplateColumnsRows("grid", "1free-space", "1free-space", "90px", "10px");
TestingUtils.testGridTemplateColumnsRows("emptyGrid", "-2fr", "-2fr", "none", "none"); TestingUtils.testGridTemplateColumnsRows("emptyGrid", "-2fr", "-2fr", "none", "none");
TestingUtils.testGridTemplateColumnsRows("grid", "-2fr", "-2fr", "none", "none"); TestingUtils.testGridTemplateColumnsRows("grid", "-2fr", "-2fr", "90px", "10px");
TestingUtils.testGridTemplateColumnsRows("emptyGrid", "0,5fr", "0,5fr", "none", "none"); TestingUtils.testGridTemplateColumnsRows("emptyGrid", "0,5fr", "0,5fr", "none", "none");
TestingUtils.testGridTemplateColumnsRows("grid", "0,5fr", "0,5fr", "none", "none"); TestingUtils.testGridTemplateColumnsRows("grid", "0,5fr", "0,5fr", "90px", "10px");
TestingUtils.testGridTemplateColumnsRows("emptyGrid", "calc(1fr + 100px)", "calc(1fr + 100px)", "none", "none"); TestingUtils.testGridTemplateColumnsRows("emptyGrid", "calc(1fr + 100px)", "calc(1fr + 100px)", "none", "none");
TestingUtils.testGridTemplateColumnsRows("grid", "calc(1fr + 100px)", "calc(1fr + 100px)", "none", "none"); TestingUtils.testGridTemplateColumnsRows("grid", "calc(1fr + 100px)", "calc(1fr + 100px)", "90px", "10px");
TestingUtils.testGridTemplateColumnsRows("emptyGrid", "(1fr) auto", "(1fr) auto", "none", "none"); TestingUtils.testGridTemplateColumnsRows("emptyGrid", "(1fr) auto", "(1fr) auto", "none", "none");
TestingUtils.testGridTemplateColumnsRows("grid", "(1fr) auto", "(1fr) auto", "none", "none"); TestingUtils.testGridTemplateColumnsRows("grid", "(1fr) auto", "(1fr) auto", "90px", "10px");
TestingUtils.testGridTemplateColumnsRows("emptyGrid", "minmax(1fr, 1000px)", "minmax(1fr, 700px)", "none", "none"); TestingUtils.testGridTemplateColumnsRows("emptyGrid", "minmax(1fr, 1000px)", "minmax(1fr, 700px)", "none", "none");
TestingUtils.testGridTemplateColumnsRows("grid", "minmax(1fr, 1000px)", "minmax(1fr, 700px)", "none", "none"); TestingUtils.testGridTemplateColumnsRows("grid", "minmax(1fr, 1000px)", "minmax(1fr, 700px)", "90px", "10px");
done(); done();
}); });
</script> </script>

View file

@ -31,7 +31,7 @@ setup({explicit_done: true});
document.fonts.ready.then(()=> { document.fonts.ready.then(()=> {
// Single values. // Single values.
TestingUtils.testGridTemplateColumnsRows("emptyGrid", "none", "none", "none", "none"); TestingUtils.testGridTemplateColumnsRows("emptyGrid", "none", "none", "none", "none");
TestingUtils.testGridTemplateColumnsRows("grid", "none", "none", "none", "none"); TestingUtils.testGridTemplateColumnsRows("grid", "none", "none", "90px", "10px");
TestingUtils.testGridTemplateColumnsRows("emptyGrid", "auto", "auto", "0px", "0px"); TestingUtils.testGridTemplateColumnsRows("emptyGrid", "auto", "auto", "0px", "0px");
TestingUtils.testGridTemplateColumnsRows("grid", "auto", "auto", "90px", "10px"); TestingUtils.testGridTemplateColumnsRows("grid", "auto", "auto", "90px", "10px");
TestingUtils.testGridTemplateColumnsRows("emptyGrid", "500px", "300px", "500px", "300px"); TestingUtils.testGridTemplateColumnsRows("emptyGrid", "500px", "300px", "500px", "300px");
@ -77,13 +77,13 @@ document.fonts.ready.then(()=> {
// Wrong values. // Wrong values.
TestingUtils.testGridTemplateColumnsRows("emptyGrid", "foo", "bar", "none", "none"); TestingUtils.testGridTemplateColumnsRows("emptyGrid", "foo", "bar", "none", "none");
TestingUtils.testGridTemplateColumnsRows("grid", "foo", "bar", "none", "none"); TestingUtils.testGridTemplateColumnsRows("grid", "foo", "bar", "90px", "10px");
TestingUtils.testGridTemplateColumnsRows("emptyGrid", "auto none", "none auto", "none", "none"); TestingUtils.testGridTemplateColumnsRows("emptyGrid", "auto none", "none auto", "none", "none");
TestingUtils.testGridTemplateColumnsRows("grid", "auto none", "none auto", "none", "none"); TestingUtils.testGridTemplateColumnsRows("grid", "auto none", "none auto", "90px", "10px");
TestingUtils.testGridTemplateColumnsRows("emptyGrid", "100px, 200px", "300px, 400px", "none", "none"); TestingUtils.testGridTemplateColumnsRows("emptyGrid", "100px, 200px", "300px, 400px", "none", "none");
TestingUtils.testGridTemplateColumnsRows("grid", "100px, 200px", "300px, 400px", "none", "none"); TestingUtils.testGridTemplateColumnsRows("grid", "100px, 200px", "300px, 400px", "90px", "10px");
TestingUtils.testGridTemplateColumnsRows("emptyGrid", "minmax(100px, 200px, 300px)", "minmax(100px, 200px, 300px)", "none", "none"); TestingUtils.testGridTemplateColumnsRows("emptyGrid", "minmax(100px, 200px, 300px)", "minmax(100px, 200px, 300px)", "none", "none");
TestingUtils.testGridTemplateColumnsRows("grid", "minmax(100px, 200px, 300px)", "minmax(100px, 200px, 300px)", "none", "none"); TestingUtils.testGridTemplateColumnsRows("grid", "minmax(100px, 200px, 300px)", "minmax(100px, 200px, 300px)", "90px", "10px");
done(); done();
}); });
</script> </script>

View file

@ -77,47 +77,47 @@ document.fonts.ready.then(()=> {
// Wrong values. // Wrong values.
TestingUtils.testGridTemplateColumnsRows("emptyGrid", "[a]", "[a]", "none", "none"); TestingUtils.testGridTemplateColumnsRows("emptyGrid", "[a]", "[a]", "none", "none");
TestingUtils.testGridTemplateColumnsRows("grid", "[a]", "[a]", "none", "none"); TestingUtils.testGridTemplateColumnsRows("grid", "[a]", "[a]", "90px", "10px");
TestingUtils.testGridTemplateColumnsRows("emptyGrid", "[a b]", "[a b]", "none", "none"); TestingUtils.testGridTemplateColumnsRows("emptyGrid", "[a b]", "[a b]", "none", "none");
TestingUtils.testGridTemplateColumnsRows("grid", "[a b]", "[a b]", "none", "none"); TestingUtils.testGridTemplateColumnsRows("grid", "[a b]", "[a b]", "90px", "10px");
TestingUtils.testGridTemplateColumnsRows("emptyGrid", "[a] none [b]", "[a] none [b]", "none", "none"); TestingUtils.testGridTemplateColumnsRows("emptyGrid", "[a] none [b]", "[a] none [b]", "none", "none");
TestingUtils.testGridTemplateColumnsRows("grid", "[a] none [b]", "[a] none [b]", "none", "none"); TestingUtils.testGridTemplateColumnsRows("grid", "[a] none [b]", "[a] none [b]", "90px", "10px");
TestingUtils.testGridTemplateColumnsRows("emptyGrid", "[a] [b]", "[a] [b]", "none", "none"); TestingUtils.testGridTemplateColumnsRows("emptyGrid", "[a] [b]", "[a] [b]", "none", "none");
TestingUtils.testGridTemplateColumnsRows("grid", "[a] [b]", "[a] [b]", "none", "none"); TestingUtils.testGridTemplateColumnsRows("grid", "[a] [b]", "[a] [b]", "90px", "10px");
TestingUtils.testGridTemplateColumnsRows("emptyGrid", "a auto b", "a auto b", "none", "none"); TestingUtils.testGridTemplateColumnsRows("emptyGrid", "a auto b", "a auto b", "none", "none");
TestingUtils.testGridTemplateColumnsRows("grid", "a auto b", "a auto b", "none", "none"); TestingUtils.testGridTemplateColumnsRows("grid", "a auto b", "a auto b", "90px", "10px");
TestingUtils.testGridTemplateColumnsRows("emptyGrid", "(a) auto (b)", "(a) auto (b)", "none", "none"); TestingUtils.testGridTemplateColumnsRows("emptyGrid", "(a) auto (b)", "(a) auto (b)", "none", "none");
TestingUtils.testGridTemplateColumnsRows("grid", "(a) auto (b)", "(a) auto (b)", "none", "none"); TestingUtils.testGridTemplateColumnsRows("grid", "(a) auto (b)", "(a) auto (b)", "90px", "10px");
TestingUtils.testGridTemplateColumnsRows("emptyGrid", "'a' auto 'b'", "'a' auto 'b'", "none", "none"); TestingUtils.testGridTemplateColumnsRows("emptyGrid", "'a' auto 'b'", "'a' auto 'b'", "none", "none");
TestingUtils.testGridTemplateColumnsRows("grid", "'a' auto 'b'", "'a' auto 'b'", "none", "none"); TestingUtils.testGridTemplateColumnsRows("grid", "'a' auto 'b'", "'a' auto 'b'", "90px", "10px");
TestingUtils.testGridTemplateColumnsRows("emptyGrid", "\"a\" auto \"b\"", "\"a\" auto \"b\"", "none", "none"); TestingUtils.testGridTemplateColumnsRows("emptyGrid", "\"a\" auto \"b\"", "\"a\" auto \"b\"", "none", "none");
TestingUtils.testGridTemplateColumnsRows("grid", "\"a\" auto \"b\"", "\"a\" auto \"b\"", "none", "none"); TestingUtils.testGridTemplateColumnsRows("grid", "\"a\" auto \"b\"", "\"a\" auto \"b\"", "90px", "10px");
TestingUtils.testGridTemplateColumnsRows("emptyGrid", "[a, b] auto [a, b]", "[a, b] auto [a, b]", "none", "none"); TestingUtils.testGridTemplateColumnsRows("emptyGrid", "[a, b] auto [a, b]", "[a, b] auto [a, b]", "none", "none");
TestingUtils.testGridTemplateColumnsRows("grid", "[a, b] auto [a, b]", "[a, b] auto [a, b]", "none", "none"); TestingUtils.testGridTemplateColumnsRows("grid", "[a, b] auto [a, b]", "[a, b] auto [a, b]", "90px", "10px");
TestingUtils.testGridTemplateColumnsRows("emptyGrid", "[a] [b] auto [c d] [e]", "[a] [b] auto [c d] [e]", "none", "none"); TestingUtils.testGridTemplateColumnsRows("emptyGrid", "[a] [b] auto [c d] [e]", "[a] [b] auto [c d] [e]", "none", "none");
TestingUtils.testGridTemplateColumnsRows("grid", "[a] [b] auto [c d] [e]", "[a] [b] auto [c d] [e]", "none", "none"); TestingUtils.testGridTemplateColumnsRows("grid", "[a] [b] auto [c d] [e]", "[a] [b] auto [c d] [e]", "90px", "10px");
TestingUtils.testGridTemplateColumnsRows("emptyGrid", "[a [b]] auto [c]", "[a [b]] auto [c]", "none", "none"); TestingUtils.testGridTemplateColumnsRows("emptyGrid", "[a [b]] auto [c]", "[a [b]] auto [c]", "none", "none");
TestingUtils.testGridTemplateColumnsRows("grid", "[a [b]] auto [c]", "[a [b]] auto [c]", "none", "none"); TestingUtils.testGridTemplateColumnsRows("grid", "[a [b]] auto [c]", "[a [b]] auto [c]", "90px", "10px");
TestingUtils.testGridTemplateColumnsRows("emptyGrid", "[a] auto [[b]]", "[a] auto [[b]]", "none", "none"); TestingUtils.testGridTemplateColumnsRows("emptyGrid", "[a] auto [[b]]", "[a] auto [[b]]", "none", "none");
TestingUtils.testGridTemplateColumnsRows("grid", "[a] auto [[b]]", "[a] auto [[b]]", "none", "none"); TestingUtils.testGridTemplateColumnsRows("grid", "[a] auto [[b]]", "[a] auto [[b]]", "90px", "10px");
TestingUtils.testGridTemplateColumnsRows("emptyGrid", "[a auto [b]", "[a auto [b]", "none", "none"); TestingUtils.testGridTemplateColumnsRows("emptyGrid", "[a auto [b]", "[a auto [b]", "none", "none");
TestingUtils.testGridTemplateColumnsRows("grid", "[a auto [b]", "[a auto [b]", "none", "none"); TestingUtils.testGridTemplateColumnsRows("grid", "[a auto [b]", "[a auto [b]", "90px", "10px");
TestingUtils.testGridTemplateColumnsRows("emptyGrid", "[a 100px] auto [b]", "[a 100px] auto [b]", "none", "none"); TestingUtils.testGridTemplateColumnsRows("emptyGrid", "[a 100px] auto [b]", "[a 100px] auto [b]", "none", "none");
TestingUtils.testGridTemplateColumnsRows("grid", "[a 100px] auto [b]", "[a 100px] auto [b]", "none", "none"); TestingUtils.testGridTemplateColumnsRows("grid", "[a 100px] auto [b]", "[a 100px] auto [b]", "90px", "10px");
TestingUtils.testGridTemplateColumnsRows("emptyGrid", "[a 50%] auto [b]", "[a 50%] auto [b]", "none", "none"); TestingUtils.testGridTemplateColumnsRows("emptyGrid", "[a 50%] auto [b]", "[a 50%] auto [b]", "none", "none");
TestingUtils.testGridTemplateColumnsRows("grid", "[a 50%] auto [b]", "[a 50%] auto [b]", "none", "none"); TestingUtils.testGridTemplateColumnsRows("grid", "[a 50%] auto [b]", "[a 50%] auto [b]", "90px", "10px");
TestingUtils.testGridTemplateColumnsRows("emptyGrid", "[5] auto [10]", "[5] auto [10]", "none", "none"); TestingUtils.testGridTemplateColumnsRows("emptyGrid", "[5] auto [10]", "[5] auto [10]", "none", "none");
TestingUtils.testGridTemplateColumnsRows("grid", "[5] auto [10]", "[5] auto [10]", "none", "none"); TestingUtils.testGridTemplateColumnsRows("grid", "[5] auto [10]", "[5] auto [10]", "90px", "10px");
TestingUtils.testGridTemplateColumnsRows("emptyGrid", "[a.] auto [b*]", "[a.] auto [b*]", "none", "none"); TestingUtils.testGridTemplateColumnsRows("emptyGrid", "[a.] auto [b*]", "[a.] auto [b*]", "none", "none");
TestingUtils.testGridTemplateColumnsRows("grid", "[a.] auto [b*]", "[a.] auto [b*]", "none", "none"); TestingUtils.testGridTemplateColumnsRows("grid", "[a.] auto [b*]", "[a.] auto [b*]", "90px", "10px");
TestingUtils.testGridTemplateColumnsRows("emptyGrid", "[#a] auto [$b]", "[#a] auto [$b]", "none", "none"); TestingUtils.testGridTemplateColumnsRows("emptyGrid", "[#a] auto [$b]", "[#a] auto [$b]", "none", "none");
TestingUtils.testGridTemplateColumnsRows("grid", "[#a] auto [$b]", "[#a] auto [$b]", "none", "none"); TestingUtils.testGridTemplateColumnsRows("grid", "[#a] auto [$b]", "[#a] auto [$b]", "90px", "10px");
TestingUtils.testGridTemplateColumnsRows("emptyGrid", "[initial] auto", "[initial] auto", "none", "none"); TestingUtils.testGridTemplateColumnsRows("emptyGrid", "[initial] auto", "[initial] auto", "none", "none");
TestingUtils.testGridTemplateColumnsRows("grid", "[initial] auto", "[initial] auto", "none", "none"); TestingUtils.testGridTemplateColumnsRows("grid", "[initial] auto", "[initial] auto", "90px", "10px");
TestingUtils.testGridTemplateColumnsRows("emptyGrid", "[inherit] auto", "[inherit] auto", "none", "none"); TestingUtils.testGridTemplateColumnsRows("emptyGrid", "[inherit] auto", "[inherit] auto", "none", "none");
TestingUtils.testGridTemplateColumnsRows("grid", "[inherit] auto", "[inherit] auto", "none", "none"); TestingUtils.testGridTemplateColumnsRows("grid", "[inherit] auto", "[inherit] auto", "90px", "10px");
TestingUtils.testGridTemplateColumnsRows("emptyGrid", "[default] auto", "[default] auto", "none", "none"); TestingUtils.testGridTemplateColumnsRows("emptyGrid", "[default] auto", "[default] auto", "none", "none");
TestingUtils.testGridTemplateColumnsRows("grid", "[default] auto", "[default] auto", "none", "none"); TestingUtils.testGridTemplateColumnsRows("grid", "[default] auto", "[default] auto", "90px", "10px");
done(); done();
}); });
</script> </script>

View file

@ -65,19 +65,19 @@ document.fonts.ready.then(()=> {
// Wrong values. // Wrong values.
TestingUtils.testGridTemplateColumnsRows("emptyGrid", "repeat(-1, auto)", "repeat(-1, auto)", "none", "none"); TestingUtils.testGridTemplateColumnsRows("emptyGrid", "repeat(-1, auto)", "repeat(-1, auto)", "none", "none");
TestingUtils.testGridTemplateColumnsRows("grid", "repeat(-1, auto)", "repeat(-1, auto)", "none", "none"); TestingUtils.testGridTemplateColumnsRows("grid", "repeat(-1, auto)", "repeat(-1, auto)", "90px", "10px");
TestingUtils.testGridTemplateColumnsRows("emptyGrid", "repeat(auto, 2)", "repeat(auto, 2)", "none", "none"); TestingUtils.testGridTemplateColumnsRows("emptyGrid", "repeat(auto, 2)", "repeat(auto, 2)", "none", "none");
TestingUtils.testGridTemplateColumnsRows("grid", "repeat(auto, 2)", "repeat(auto, 2)", "none", "none"); TestingUtils.testGridTemplateColumnsRows("grid", "repeat(auto, 2)", "repeat(auto, 2)", "90px", "10px");
TestingUtils.testGridTemplateColumnsRows("emptyGrid", "repeat 2, auto", "repeat 2, auto", "none", "none"); TestingUtils.testGridTemplateColumnsRows("emptyGrid", "repeat 2, auto", "repeat 2, auto", "none", "none");
TestingUtils.testGridTemplateColumnsRows("grid", "repeat 2, auto", "repeat 2, auto", "none", "none"); TestingUtils.testGridTemplateColumnsRows("grid", "repeat 2, auto", "repeat 2, auto", "90px", "10px");
TestingUtils.testGridTemplateColumnsRows("emptyGrid", "repeat(2 auto)", "repeat(2 auto)", "none", "none"); TestingUtils.testGridTemplateColumnsRows("emptyGrid", "repeat(2 auto)", "repeat(2 auto)", "none", "none");
TestingUtils.testGridTemplateColumnsRows("grid", "repeat(2 auto)", "repeat(2 auto)", "none", "none"); TestingUtils.testGridTemplateColumnsRows("grid", "repeat(2 auto)", "repeat(2 auto)", "90px", "10px");
TestingUtils.testGridTemplateColumnsRows("emptyGrid", "100px (repeat 2, auto)", "(repeat 2, auto)", "none", "none"); TestingUtils.testGridTemplateColumnsRows("emptyGrid", "100px (repeat 2, auto)", "(repeat 2, auto)", "none", "none");
TestingUtils.testGridTemplateColumnsRows("grid", "100px (repeat 2, auto)", "(repeat 2, auto)", "none", "none"); TestingUtils.testGridTemplateColumnsRows("grid", "100px (repeat 2, auto)", "(repeat 2, auto)", "90px", "10px");
TestingUtils.testGridTemplateColumnsRows("emptyGrid", "repeat(2, 50px repeat(2, 100px))", "repeat(2, 50px repeat(2, 100px))", "none", "none"); TestingUtils.testGridTemplateColumnsRows("emptyGrid", "repeat(2, 50px repeat(2, 100px))", "repeat(2, 50px repeat(2, 100px))", "none", "none");
TestingUtils.testGridTemplateColumnsRows("grid", "repeat(2, 50px repeat(2, 100px))", "repeat(2, 50px repeat(2, 100px))", "none", "none"); TestingUtils.testGridTemplateColumnsRows("grid", "repeat(2, 50px repeat(2, 100px))", "repeat(2, 50px repeat(2, 100px))", "90px", "10px");
TestingUtils.testGridTemplateColumnsRows("emptyGrid", "100px repeat(2, [a])", "100px repeat(2, [a])", "none", "none"); TestingUtils.testGridTemplateColumnsRows("emptyGrid", "100px repeat(2, [a])", "100px repeat(2, [a])", "none", "none");
TestingUtils.testGridTemplateColumnsRows("grid", "100px repeat(2, [a])", "100px repeat(2, [a])", "none", "none"); TestingUtils.testGridTemplateColumnsRows("grid", "100px repeat(2, [a])", "100px repeat(2, [a])", "90px", "10px");
done(); done();
}); });
</script> </script>

View file

@ -4,7 +4,7 @@
<link rel="author" title="Manuel Rego Casasnovas" href="mailto:rego@igalia.com"> <link rel="author" title="Manuel Rego Casasnovas" href="mailto:rego@igalia.com">
<link rel="help" href="http://www.w3.org/TR/css-grid-1/#resolved-track-list" title="5.1.5. Resolved Values"> <link rel="help" href="http://www.w3.org/TR/css-grid-1/#resolved-track-list" title="5.1.5. Resolved Values">
<meta name="flags" content="ahem dom"> <meta name="flags" content="ahem dom">
<meta name="assert" content="This test checks that resolved values for 'grid-template-columns' and 'grid-template-rows' don't include implicitly created tracks in an inline grid."> <meta name="assert" content="This test checks that resolved values for 'grid-template-columns' and 'grid-template-rows' list tracks implicitly created in an inline grid.">
<script src="/resources/testharness.js"></script> <script src="/resources/testharness.js"></script>
<script src="/resources/testharnessreport.js"></script> <script src="/resources/testharnessreport.js"></script>
<script src="support/testing-utils.js"></script> <script src="support/testing-utils.js"></script>
@ -17,7 +17,6 @@
font: 10px/1 Ahem; font: 10px/1 Ahem;
justify-content: start; justify-content: start;
align-content: start; align-content: start;
position: relative;
} }
.fifthColumn { .fifthColumn {
@ -59,218 +58,50 @@
</div> </div>
<script> <script>
function testSizeAndPositionOfItems(gridId, expectedItemData) {
let grid = document.getElementById(gridId);
assert_equals(grid.childElementCount, expectedItemData.length, "childElementCount");
let props = ["offsetWidth", "offsetTop", "offsetHeight"];
for (let i = 0; i < expectedItemData.length; ++i)
for (let prop of props)
assert_equals(grid.children[i][prop], expectedItemData[i][prop], "children[" + i + "]." + prop);
}
function testGrid(gridId, columnsStyle, rowsStyle, columnsComputedValue, rowsComputedValue, expectedItemData) {
TestingUtils.testGridTemplateColumnsRows(gridId, columnsStyle, rowsStyle, columnsComputedValue, rowsComputedValue);
test(function() {
testSizeAndPositionOfItems(gridId, expectedItemData);
}, "Children of '" + gridId + "' with: grid-template-columns: " + columnsStyle + "; and grid-template-rows: " + rowsStyle + ";");
}
setup({explicit_done: true}); setup({explicit_done: true});
document.fonts.ready.then(()=> { document.fonts.ready.then(()=> {
// Valid values. // Valid values.
testGrid("grid", "", "", "none", "none", [ TestingUtils.testGridTemplateColumnsRows("grid", "", "", "110px", ["10px 10px 20px", "repeat(2, 10px) 20px"]);
{offsetLeft: 0, offsetWidth: 110, offsetTop: 0, offsetHeight: 10}, TestingUtils.testGridTemplateColumnsRows("grid", "auto auto", "", "100px 110px", "10px 20px");
{offsetLeft: 0, offsetWidth: 110, offsetTop: 10, offsetHeight: 10}, TestingUtils.testGridTemplateColumnsRows("grid", "60px", "", "60px", ["20px 20px 20px", "repeat(3, 20px)"]);
{offsetLeft: 0, offsetWidth: 110, offsetTop: 20, offsetHeight: 20}, TestingUtils.testGridTemplateColumnsRows("grid", "100px 60px", "", "100px 60px", ["20px 20px", "repeat(2, 20px)"]);
]); TestingUtils.testGridTemplateColumnsRows("grid", "", "50px", "110px", "50px 10px 20px");
testGrid("grid", "auto auto", "", "100px 110px", "none", [ TestingUtils.testGridTemplateColumnsRows("grid", "", "50px 30px", "110px", "50px 30px 20px");
{offsetLeft: 0, offsetWidth: 100, offsetTop: 0, offsetHeight: 10}, TestingUtils.testGridTemplateColumnsRows("grid", "60px", "50px", "60px", ["50px 20px 20px", "50px repeat(2, 20px)"]);
{offsetLeft: 100, offsetWidth: 110, offsetTop: 0, offsetHeight: 10}, TestingUtils.testGridTemplateColumnsRows("grid", "60px", "50px 30px", "60px", "50px 30px 20px");
{offsetLeft: 0, offsetWidth: 100, offsetTop: 10, offsetHeight: 20}, TestingUtils.testGridTemplateColumnsRows("grid", "100px 60px", "50px", "100px 60px", "50px 20px");
]); TestingUtils.testGridTemplateColumnsRows("grid", "100px 60px", "50px 30px", "100px 60px", "50px 30px");
testGrid("grid", "60px", "", "60px", "none", [
{offsetLeft: 0, offsetWidth: 60, offsetTop: 0, offsetHeight: 20},
{offsetLeft: 0, offsetWidth: 60, offsetTop: 20, offsetHeight: 20},
{offsetLeft: 0, offsetWidth: 60, offsetTop: 40, offsetHeight: 20},
]);
testGrid("grid", "100px 60px", "", "100px 60px", "none", [
{offsetLeft: 0, offsetWidth: 100, offsetTop: 0, offsetHeight: 20},
{offsetLeft: 100, offsetWidth: 60, offsetTop: 0, offsetHeight: 20},
{offsetLeft: 0, offsetWidth: 100, offsetTop: 20, offsetHeight: 20},
]);
testGrid("grid", "", "50px", "none", "50px", [
{offsetLeft: 0, offsetWidth: 110, offsetTop: 0, offsetHeight: 50},
{offsetLeft: 0, offsetWidth: 110, offsetTop: 50, offsetHeight: 10},
{offsetLeft: 0, offsetWidth: 110, offsetTop: 60, offsetHeight: 20},
]);
testGrid("grid", "", "50px 30px", "none", "50px 30px", [
{offsetLeft: 0, offsetWidth: 110, offsetTop: 0, offsetHeight: 50},
{offsetLeft: 0, offsetWidth: 110, offsetTop: 50, offsetHeight: 30},
{offsetLeft: 0, offsetWidth: 110, offsetTop: 80, offsetHeight: 20},
]);
testGrid("grid", "60px", "50px", "60px", "50px", [
{offsetLeft: 0, offsetWidth: 60, offsetTop: 0, offsetHeight: 50},
{offsetLeft: 0, offsetWidth: 60, offsetTop: 50, offsetHeight: 20},
{offsetLeft: 0, offsetWidth: 60, offsetTop: 70, offsetHeight: 20},
]);
testGrid("grid", "60px", "50px 30px", "60px", "50px 30px", [
{offsetLeft: 0, offsetWidth: 60, offsetTop: 0, offsetHeight: 50},
{offsetLeft: 0, offsetWidth: 60, offsetTop: 50, offsetHeight: 30},
{offsetLeft: 0, offsetWidth: 60, offsetTop: 80, offsetHeight: 20},
]);
testGrid("grid", "100px 60px", "50px", "100px 60px", "50px", [
{offsetLeft: 0, offsetWidth: 100, offsetTop: 0, offsetHeight: 50},
{offsetLeft: 100, offsetWidth: 60, offsetTop: 0, offsetHeight: 50},
{offsetLeft: 0, offsetWidth: 100, offsetTop: 50, offsetHeight: 20},
]);
testGrid("grid", "100px 60px", "50px 30px", "100px 60px", "50px 30px", [
{offsetLeft: 0, offsetWidth: 100, offsetTop: 0, offsetHeight: 50},
{offsetLeft: 100, offsetWidth: 60, offsetTop: 0, offsetHeight: 50},
{offsetLeft: 0, offsetWidth: 100, offsetTop: 50, offsetHeight: 30},
]);
testGrid("gridItemsPositions", "", "", "none", "none", [ TestingUtils.testGridTemplateColumnsRows("gridItemsPositions", "", "", ["110px 0px 0px 0px 100px", "110px repeat(3, 0px) 100px"], "10px 20px 0px 10px");
{offsetLeft: 110, offsetWidth: 100, offsetTop: 0, offsetHeight: 10}, TestingUtils.testGridTemplateColumnsRows("gridItemsPositions", "60px", "", ["60px 0px 0px 0px 100px", "60px repeat(3, 0px) 100px"], "10px 20px 0px 20px");
{offsetLeft: 0, offsetWidth: 110, offsetTop: 30, offsetHeight: 10}, TestingUtils.testGridTemplateColumnsRows("gridItemsPositions", "60px 50px", "", ["60px 50px 0px 0px 100px", "60px 50px repeat(2, 0px) 100px"], "10px 20px 0px 20px");
{offsetLeft: 0, offsetWidth: 110, offsetTop: 10, offsetHeight: 20}, TestingUtils.testGridTemplateColumnsRows("gridItemsPositions", "", "60px", ["110px 0px 0px 0px 100px", "110px repeat(3, 0px) 100px"], "60px 20px 0px 10px");
]); TestingUtils.testGridTemplateColumnsRows("gridItemsPositions", "", "60px 50px", ["110px 0px 0px 0px 100px", "110px repeat(3, 0px) 100px"], "60px 50px 0px 10px");
testGrid("gridItemsPositions", "60px", "", "60px", "none", [ TestingUtils.testGridTemplateColumnsRows("gridItemsPositions", "60px", "60px", ["60px 0px 0px 0px 100px", "60px repeat(3, 0px) 100px"], "60px 20px 0px 20px");
{offsetLeft: 60, offsetWidth: 100, offsetTop: 0, offsetHeight: 10}, TestingUtils.testGridTemplateColumnsRows("gridItemsPositions", "60px", "60px 50px", ["60px 0px 0px 0px 100px", "60px repeat(3, 0px) 100px"], "60px 50px 0px 20px");
{offsetLeft: 0, offsetWidth: 60, offsetTop: 30, offsetHeight: 20}, TestingUtils.testGridTemplateColumnsRows("gridItemsPositions", "60px 50px", "60px", ["60px 50px 0px 0px 100px", "60px 50px repeat(2, 0px) 100px"], "60px 20px 0px 20px");
{offsetLeft: 0, offsetWidth: 60, offsetTop: 10, offsetHeight: 20}, TestingUtils.testGridTemplateColumnsRows("gridItemsPositions", "60px 50px", "60px 50px", ["60px 50px 0px 0px 100px", "60px 50px repeat(2, 0px) 100px"], "60px 50px 0px 20px");
]);
testGrid("gridItemsPositions", "60px 50px", "", "60px 50px", "none", [
{offsetLeft: 110, offsetWidth: 100, offsetTop: 0, offsetHeight: 10},
{offsetLeft: 0, offsetWidth: 60, offsetTop: 30, offsetHeight: 20},
{offsetLeft: 0, offsetWidth: 60, offsetTop: 10, offsetHeight: 20},
]);
testGrid("gridItemsPositions", "", "60px", "none", "60px", [
{offsetLeft: 110, offsetWidth: 100, offsetTop: 0, offsetHeight: 60},
{offsetLeft: 0, offsetWidth: 110, offsetTop: 80, offsetHeight: 10},
{offsetLeft: 0, offsetWidth: 110, offsetTop: 60, offsetHeight: 20},
]);
testGrid("gridItemsPositions", "", "60px 50px", "none", "60px 50px", [
{offsetLeft: 110, offsetWidth: 100, offsetTop: 0, offsetHeight: 60},
{offsetLeft: 0, offsetWidth: 110, offsetTop: 110, offsetHeight: 10},
{offsetLeft: 0, offsetWidth: 110, offsetTop: 60, offsetHeight: 50},
]);
testGrid("gridItemsPositions", "60px", "60px", "60px", "60px", [
{offsetLeft: 60, offsetWidth: 100, offsetTop: 0, offsetHeight: 60},
{offsetLeft: 0, offsetWidth: 60, offsetTop: 80, offsetHeight: 20},
{offsetLeft: 0, offsetWidth: 60, offsetTop: 60, offsetHeight: 20},
]);
testGrid("gridItemsPositions", "60px", "60px 50px", "60px", "60px 50px", [
{offsetLeft: 60, offsetWidth: 100, offsetTop: 0, offsetHeight: 60},
{offsetLeft: 0, offsetWidth: 60, offsetTop: 110, offsetHeight: 20},
{offsetLeft: 0, offsetWidth: 60, offsetTop: 60, offsetHeight: 50},
]);
testGrid("gridItemsPositions", "60px 50px", "60px", "60px 50px", "60px", [
{offsetLeft: 110, offsetWidth: 100, offsetTop: 0, offsetHeight: 60},
{offsetLeft: 0, offsetWidth: 60, offsetTop: 80, offsetHeight: 20},
{offsetLeft: 0, offsetWidth: 60, offsetTop: 60, offsetHeight: 20},
]);
testGrid("gridItemsPositions", "60px 50px", "60px 50px", "60px 50px", "60px 50px", [
{offsetLeft: 110, offsetWidth: 100, offsetTop: 0, offsetHeight: 60},
{offsetLeft: 0, offsetWidth: 60, offsetTop: 110, offsetHeight: 20},
{offsetLeft: 0, offsetWidth: 60, offsetTop: 60, offsetHeight: 50},
]);
testGrid("gridAutoFlowColumn", "", "", "none", "none", [ TestingUtils.testGridTemplateColumnsRows("gridAutoFlowColumn", "", "", "100px 110px 50px", "20px");
{offsetLeft: 0, offsetWidth: 100, offsetTop: 0, offsetHeight: 20}, TestingUtils.testGridTemplateColumnsRows("gridAutoFlowColumn", "", "auto auto", "110px 50px", "20px 10px");
{offsetLeft: 100, offsetWidth: 110, offsetTop: 0, offsetHeight: 20}, TestingUtils.testGridTemplateColumnsRows("gridAutoFlowColumn", "60px", "", "60px 110px 50px", "20px");
{offsetLeft: 210, offsetWidth: 50, offsetTop: 0, offsetHeight: 20}, TestingUtils.testGridTemplateColumnsRows("gridAutoFlowColumn", "100px 60px", "", "100px 60px 50px", "20px");
]); TestingUtils.testGridTemplateColumnsRows("gridAutoFlowColumn", "", "50px", "100px 110px 50px", "50px");
testGrid("gridAutoFlowColumn", "", "auto auto", "none", "20px 10px", [ TestingUtils.testGridTemplateColumnsRows("gridAutoFlowColumn", "", "50px 30px", "110px 50px", "50px 30px");
{offsetLeft: 0, offsetWidth: 110, offsetTop: 0, offsetHeight: 20}, TestingUtils.testGridTemplateColumnsRows("gridAutoFlowColumn", "60px", "50px", "60px 110px 50px", "50px");
{offsetLeft: 0, offsetWidth: 110, offsetTop: 20, offsetHeight: 10}, TestingUtils.testGridTemplateColumnsRows("gridAutoFlowColumn", "60px", "50px 30px", "60px 50px", "50px 30px");
{offsetLeft: 110, offsetWidth: 50, offsetTop: 0, offsetHeight: 20}, TestingUtils.testGridTemplateColumnsRows("gridAutoFlowColumn", "100px 60px", "50px", "100px 60px 50px", "50px");
]); TestingUtils.testGridTemplateColumnsRows("gridAutoFlowColumn", "100px 60px", "50px 30px", "100px 60px", "50px 30px");
testGrid("gridAutoFlowColumn", "60px", "", "60px", "none", [
{offsetLeft: 0, offsetWidth: 60, offsetTop: 0, offsetHeight: 20},
{offsetLeft: 60, offsetWidth: 110, offsetTop: 0, offsetHeight: 20},
{offsetLeft: 170, offsetWidth: 50, offsetTop: 0, offsetHeight: 20},
]);
testGrid("gridAutoFlowColumn", "100px 60px", "", "100px 60px", "none", [
{offsetLeft: 0, offsetWidth: 100, offsetTop: 0, offsetHeight: 20},
{offsetLeft: 100, offsetWidth: 60, offsetTop: 0, offsetHeight: 20},
{offsetLeft: 160, offsetWidth: 50, offsetTop: 0, offsetHeight: 20},
]);
testGrid("gridAutoFlowColumn", "", "50px", "none", "50px", [
{offsetLeft: 0, offsetWidth: 100, offsetTop: 0, offsetHeight: 50},
{offsetLeft: 100, offsetWidth: 110, offsetTop: 0, offsetHeight: 50},
{offsetLeft: 210, offsetWidth: 50, offsetTop: 0, offsetHeight: 50},
]);
testGrid("gridAutoFlowColumn", "", "50px 30px", "none", "50px 30px", [
{offsetLeft: 0, offsetWidth: 110, offsetTop: 0, offsetHeight: 50},
{offsetLeft: 0, offsetWidth: 110, offsetTop: 50, offsetHeight: 30},
{offsetLeft: 110, offsetWidth: 50, offsetTop: 0, offsetHeight: 50},
]);
testGrid("gridAutoFlowColumn", "60px", "50px", "60px", "50px", [
{offsetLeft: 0, offsetWidth: 60, offsetTop: 0, offsetHeight: 50},
{offsetLeft: 60, offsetWidth: 110, offsetTop: 0, offsetHeight: 50},
{offsetLeft: 170, offsetWidth: 50, offsetTop: 0, offsetHeight: 50},
]);
testGrid("gridAutoFlowColumn", "60px", "50px 30px", "60px", "50px 30px", [
{offsetLeft: 0, offsetWidth: 60, offsetTop: 0, offsetHeight: 50},
{offsetLeft: 0, offsetWidth: 60, offsetTop: 50, offsetHeight: 30},
{offsetLeft: 60, offsetWidth: 50, offsetTop: 0, offsetHeight: 50},
]);
testGrid("gridAutoFlowColumn", "100px 60px", "50px", "100px 60px", "50px", [
{offsetLeft: 0, offsetWidth: 100, offsetTop: 0, offsetHeight: 50},
{offsetLeft: 100, offsetWidth: 60, offsetTop: 0, offsetHeight: 50},
{offsetLeft: 160, offsetWidth: 50, offsetTop: 0, offsetHeight: 50},
]);
testGrid("gridAutoFlowColumn", "100px 60px", "50px 30px", "100px 60px", "50px 30px", [
{offsetLeft: 0, offsetWidth: 100, offsetTop: 0, offsetHeight: 50},
{offsetLeft: 0, offsetWidth: 100, offsetTop: 50, offsetHeight: 30},
{offsetLeft: 100, offsetWidth: 60, offsetTop: 0, offsetHeight: 50},
]);
testGrid("gridAutoFlowColumnItemsPositions", "", "", "none", "none", [ TestingUtils.testGridTemplateColumnsRows("gridAutoFlowColumnItemsPositions", "", "", ["110px 50px 0px 0px 100px", "110px 50px repeat(2, 0px) 100px"], ["20px 0px 0px 10px", "20px repeat(2, 0px) 10px"]);
{offsetLeft: 160, offsetWidth: 100, offsetTop: 0, offsetHeight: 20}, TestingUtils.testGridTemplateColumnsRows("gridAutoFlowColumnItemsPositions", "60px", "", ["60px 50px 0px 0px 100px", "60px 50px repeat(2, 0px) 100px"], ["20px 0px 0px 20px", "20px repeat(2, 0px) 20px"]);
{offsetLeft: 0, offsetWidth: 110, offsetTop: 20, offsetHeight: 10}, TestingUtils.testGridTemplateColumnsRows("gridAutoFlowColumnItemsPositions", "60px 70px", "", ["60px 70px 0px 0px 100px", "60px 70px repeat(2, 0px) 100px"], ["20px 0px 0px 20px", "20px repeat(2, 0px) 20px"]);
{offsetLeft: 110, offsetWidth: 50, offsetTop: 0, offsetHeight: 20}, TestingUtils.testGridTemplateColumnsRows("gridAutoFlowColumnItemsPositions", "", "60px", ["110px 50px 0px 0px 100px", "110px 50px repeat(2, 0px) 100px"], ["60px 0px 0px 10px", "60px repeat(2, 0px) 10px"]);
]); TestingUtils.testGridTemplateColumnsRows("gridAutoFlowColumnItemsPositions", "", "60px 70px", ["110px 50px 0px 0px 100px", "110px 50px repeat(2, 0px) 100px"], "60px 70px 0px 10px");
testGrid("gridAutoFlowColumnItemsPositions", "60px", "", "60px", "none", [ TestingUtils.testGridTemplateColumnsRows("gridAutoFlowColumnItemsPositions", "60px", "60px", ["60px 50px 0px 0px 100px", "60px 50px repeat(2, 0px) 100px"], ["60px 0px 0px 20px", "60px repeat(2, 0px) 20px"]);
{offsetLeft: 110, offsetWidth: 100, offsetTop: 0, offsetHeight: 20}, TestingUtils.testGridTemplateColumnsRows("gridAutoFlowColumnItemsPositions", "60px", "60px 70px", ["60px 50px 0px 0px 100px", "60px 50px repeat(2, 0px) 100px"], "60px 70px 0px 20px");
{offsetLeft: 0, offsetWidth: 60, offsetTop: 20, offsetHeight: 20}, TestingUtils.testGridTemplateColumnsRows("gridAutoFlowColumnItemsPositions", "60px 70px", "60px", ["60px 70px 0px 0px 100px", "60px 70px repeat(2, 0px) 100px"], ["60px 0px 0px 20px", "60px repeat(2, 0px) 20px"]);
{offsetLeft: 60, offsetWidth: 50, offsetTop: 0, offsetHeight: 20}, TestingUtils.testGridTemplateColumnsRows("gridAutoFlowColumnItemsPositions", "60px 70px", "60px 70px", ["60px 70px 0px 0px 100px", "60px 70px repeat(2, 0px) 100px"], "60px 70px 0px 20px");
]);
testGrid("gridAutoFlowColumnItemsPositions", "60px 70px", "", "60px 70px", "none", [
{offsetLeft: 130, offsetWidth: 100, offsetTop: 0, offsetHeight: 20},
{offsetLeft: 0, offsetWidth: 60, offsetTop: 20, offsetHeight: 20},
{offsetLeft: 60, offsetWidth: 70, offsetTop: 0, offsetHeight: 20},
]);
testGrid("gridAutoFlowColumnItemsPositions", "", "60px", "none", "60px", [
{offsetLeft: 160, offsetWidth: 100, offsetTop: 0, offsetHeight: 60},
{offsetLeft: 0, offsetWidth: 110, offsetTop: 60, offsetHeight: 10},
{offsetLeft: 110, offsetWidth: 50, offsetTop: 0, offsetHeight: 60},
]);
testGrid("gridAutoFlowColumnItemsPositions", "", "60px 70px", "none", "60px 70px", [
{offsetLeft: 160, offsetWidth: 100, offsetTop: 0, offsetHeight: 60},
{offsetLeft: 0, offsetWidth: 110, offsetTop: 130, offsetHeight: 10},
{offsetLeft: 110, offsetWidth: 50, offsetTop: 0, offsetHeight: 60},
]);
testGrid("gridAutoFlowColumnItemsPositions", "60px", "60px", "60px", "60px", [
{offsetLeft: 110, offsetWidth: 100, offsetTop: 0, offsetHeight: 60},
{offsetLeft: 0, offsetWidth: 60, offsetTop: 60, offsetHeight: 20},
{offsetLeft: 60, offsetWidth: 50, offsetTop: 0, offsetHeight: 60},
]);
testGrid("gridAutoFlowColumnItemsPositions", "60px", "60px 70px", "60px", "60px 70px", [
{offsetLeft: 110, offsetWidth: 100, offsetTop: 0, offsetHeight: 60},
{offsetLeft: 0, offsetWidth: 60, offsetTop: 130, offsetHeight: 20},
{offsetLeft: 60, offsetWidth: 50, offsetTop: 0, offsetHeight: 60},
]);
testGrid("gridAutoFlowColumnItemsPositions", "60px 70px", "60px", "60px 70px", "60px", [
{offsetLeft: 130, offsetWidth: 100, offsetTop: 0, offsetHeight: 60},
{offsetLeft: 0, offsetWidth: 60, offsetTop: 60, offsetHeight: 20},
{offsetLeft: 60, offsetWidth: 70, offsetTop: 0, offsetHeight: 60},
]);
testGrid("gridAutoFlowColumnItemsPositions", "60px 70px", "60px 70px", "60px 70px", "60px 70px", [
{offsetLeft: 130, offsetWidth: 100, offsetTop: 0, offsetHeight: 60},
{offsetLeft: 0, offsetWidth: 60, offsetTop: 130, offsetHeight: 20},
{offsetLeft: 60, offsetWidth: 70, offsetTop: 0, offsetHeight: 60},
]);
done(); done();
}); });
</script> </script>

View file

@ -0,0 +1,277 @@
<!DOCTYPE html>
<meta charset="utf-8">
<title>CSS Grid Layout Test: 'grid-template-columns' and 'grid-template-rows' properties resolved values for implicit tracks in an inline grid</title>
<link rel="author" title="Manuel Rego Casasnovas" href="mailto:rego@igalia.com">
<link rel="help" href="http://www.w3.org/TR/css-grid-1/#resolved-track-list" title="5.1.5. Resolved Values">
<link rel="help" href="https://github.com/w3c/csswg-drafts/issues/4475">
<meta name="flags" content="ahem dom">
<meta name="assert" content="This test checks that resolved values for 'grid-template-columns' and 'grid-template-rows' don't include implicitly created tracks in an inline grid.">
<script src="/resources/testharness.js"></script>
<script src="/resources/testharnessreport.js"></script>
<script src="support/testing-utils.js"></script>
<link rel="stylesheet" type="text/css" href="/fonts/ahem.css" />
<style>
.inline-grid {
display: inline-grid;
width: 800px;
height: 600px;
font: 10px/1 Ahem;
justify-content: start;
align-content: start;
position: relative;
}
.fifthColumn {
grid-column: 5;
}
.fourthRow {
grid-row: 4;
}
.gridAutoFlowColumn {
grid-auto-flow: column;
}
</style>
<div id="log"></div>
<div id="grid" class="inline-grid">
<div>FIRST ITEM</div>
<div>SECOND ITEM</div>
<div>THIRD<br />ITEM</div>
</div>
<div id="gridItemsPositions" class="inline-grid">
<div class="fifthColumn">FIRST ITEM</div>
<div class="fourthRow">SECOND ITEM</div>
<div>THIRD<br />ITEM</div>
</div>
<div id="gridAutoFlowColumn" class="inline-grid gridAutoFlowColumn">
<div>FIRST ITEM</div>
<div>SECOND ITEM</div>
<div>THIRD<br />ITEM</div>
</div>
<div id="gridAutoFlowColumnItemsPositions" class="inline-grid gridAutoFlowColumn">
<div class="fifthColumn">FIRST ITEM</div>
<div class="fourthRow">SECOND ITEM</div>
<div>THIRD<br />ITEM</div>
</div>
<script>
function testSizeAndPositionOfItems(gridId, expectedItemData) {
let grid = document.getElementById(gridId);
assert_equals(grid.childElementCount, expectedItemData.length, "childElementCount");
let props = ["offsetWidth", "offsetTop", "offsetHeight"];
for (let i = 0; i < expectedItemData.length; ++i)
for (let prop of props)
assert_equals(grid.children[i][prop], expectedItemData[i][prop], "children[" + i + "]." + prop);
}
function testGrid(gridId, columnsStyle, rowsStyle, columnsComputedValue, rowsComputedValue, expectedItemData) {
TestingUtils.testGridTemplateColumnsRows(gridId, columnsStyle, rowsStyle, columnsComputedValue, rowsComputedValue);
test(function() {
testSizeAndPositionOfItems(gridId, expectedItemData);
}, "Children of '" + gridId + "' with: grid-template-columns: " + columnsStyle + "; and grid-template-rows: " + rowsStyle + ";");
}
setup({explicit_done: true});
document.fonts.ready.then(()=> {
// Valid values.
testGrid("grid", "", "", "none", "none", [
{offsetLeft: 0, offsetWidth: 110, offsetTop: 0, offsetHeight: 10},
{offsetLeft: 0, offsetWidth: 110, offsetTop: 10, offsetHeight: 10},
{offsetLeft: 0, offsetWidth: 110, offsetTop: 20, offsetHeight: 20},
]);
testGrid("grid", "auto auto", "", "100px 110px", "none", [
{offsetLeft: 0, offsetWidth: 100, offsetTop: 0, offsetHeight: 10},
{offsetLeft: 100, offsetWidth: 110, offsetTop: 0, offsetHeight: 10},
{offsetLeft: 0, offsetWidth: 100, offsetTop: 10, offsetHeight: 20},
]);
testGrid("grid", "60px", "", "60px", "none", [
{offsetLeft: 0, offsetWidth: 60, offsetTop: 0, offsetHeight: 20},
{offsetLeft: 0, offsetWidth: 60, offsetTop: 20, offsetHeight: 20},
{offsetLeft: 0, offsetWidth: 60, offsetTop: 40, offsetHeight: 20},
]);
testGrid("grid", "100px 60px", "", "100px 60px", "none", [
{offsetLeft: 0, offsetWidth: 100, offsetTop: 0, offsetHeight: 20},
{offsetLeft: 100, offsetWidth: 60, offsetTop: 0, offsetHeight: 20},
{offsetLeft: 0, offsetWidth: 100, offsetTop: 20, offsetHeight: 20},
]);
testGrid("grid", "", "50px", "none", "50px", [
{offsetLeft: 0, offsetWidth: 110, offsetTop: 0, offsetHeight: 50},
{offsetLeft: 0, offsetWidth: 110, offsetTop: 50, offsetHeight: 10},
{offsetLeft: 0, offsetWidth: 110, offsetTop: 60, offsetHeight: 20},
]);
testGrid("grid", "", "50px 30px", "none", "50px 30px", [
{offsetLeft: 0, offsetWidth: 110, offsetTop: 0, offsetHeight: 50},
{offsetLeft: 0, offsetWidth: 110, offsetTop: 50, offsetHeight: 30},
{offsetLeft: 0, offsetWidth: 110, offsetTop: 80, offsetHeight: 20},
]);
testGrid("grid", "60px", "50px", "60px", "50px", [
{offsetLeft: 0, offsetWidth: 60, offsetTop: 0, offsetHeight: 50},
{offsetLeft: 0, offsetWidth: 60, offsetTop: 50, offsetHeight: 20},
{offsetLeft: 0, offsetWidth: 60, offsetTop: 70, offsetHeight: 20},
]);
testGrid("grid", "60px", "50px 30px", "60px", "50px 30px", [
{offsetLeft: 0, offsetWidth: 60, offsetTop: 0, offsetHeight: 50},
{offsetLeft: 0, offsetWidth: 60, offsetTop: 50, offsetHeight: 30},
{offsetLeft: 0, offsetWidth: 60, offsetTop: 80, offsetHeight: 20},
]);
testGrid("grid", "100px 60px", "50px", "100px 60px", "50px", [
{offsetLeft: 0, offsetWidth: 100, offsetTop: 0, offsetHeight: 50},
{offsetLeft: 100, offsetWidth: 60, offsetTop: 0, offsetHeight: 50},
{offsetLeft: 0, offsetWidth: 100, offsetTop: 50, offsetHeight: 20},
]);
testGrid("grid", "100px 60px", "50px 30px", "100px 60px", "50px 30px", [
{offsetLeft: 0, offsetWidth: 100, offsetTop: 0, offsetHeight: 50},
{offsetLeft: 100, offsetWidth: 60, offsetTop: 0, offsetHeight: 50},
{offsetLeft: 0, offsetWidth: 100, offsetTop: 50, offsetHeight: 30},
]);
testGrid("gridItemsPositions", "", "", "none", "none", [
{offsetLeft: 110, offsetWidth: 100, offsetTop: 0, offsetHeight: 10},
{offsetLeft: 0, offsetWidth: 110, offsetTop: 30, offsetHeight: 10},
{offsetLeft: 0, offsetWidth: 110, offsetTop: 10, offsetHeight: 20},
]);
testGrid("gridItemsPositions", "60px", "", "60px", "none", [
{offsetLeft: 60, offsetWidth: 100, offsetTop: 0, offsetHeight: 10},
{offsetLeft: 0, offsetWidth: 60, offsetTop: 30, offsetHeight: 20},
{offsetLeft: 0, offsetWidth: 60, offsetTop: 10, offsetHeight: 20},
]);
testGrid("gridItemsPositions", "60px 50px", "", "60px 50px", "none", [
{offsetLeft: 110, offsetWidth: 100, offsetTop: 0, offsetHeight: 10},
{offsetLeft: 0, offsetWidth: 60, offsetTop: 30, offsetHeight: 20},
{offsetLeft: 0, offsetWidth: 60, offsetTop: 10, offsetHeight: 20},
]);
testGrid("gridItemsPositions", "", "60px", "none", "60px", [
{offsetLeft: 110, offsetWidth: 100, offsetTop: 0, offsetHeight: 60},
{offsetLeft: 0, offsetWidth: 110, offsetTop: 80, offsetHeight: 10},
{offsetLeft: 0, offsetWidth: 110, offsetTop: 60, offsetHeight: 20},
]);
testGrid("gridItemsPositions", "", "60px 50px", "none", "60px 50px", [
{offsetLeft: 110, offsetWidth: 100, offsetTop: 0, offsetHeight: 60},
{offsetLeft: 0, offsetWidth: 110, offsetTop: 110, offsetHeight: 10},
{offsetLeft: 0, offsetWidth: 110, offsetTop: 60, offsetHeight: 50},
]);
testGrid("gridItemsPositions", "60px", "60px", "60px", "60px", [
{offsetLeft: 60, offsetWidth: 100, offsetTop: 0, offsetHeight: 60},
{offsetLeft: 0, offsetWidth: 60, offsetTop: 80, offsetHeight: 20},
{offsetLeft: 0, offsetWidth: 60, offsetTop: 60, offsetHeight: 20},
]);
testGrid("gridItemsPositions", "60px", "60px 50px", "60px", "60px 50px", [
{offsetLeft: 60, offsetWidth: 100, offsetTop: 0, offsetHeight: 60},
{offsetLeft: 0, offsetWidth: 60, offsetTop: 110, offsetHeight: 20},
{offsetLeft: 0, offsetWidth: 60, offsetTop: 60, offsetHeight: 50},
]);
testGrid("gridItemsPositions", "60px 50px", "60px", "60px 50px", "60px", [
{offsetLeft: 110, offsetWidth: 100, offsetTop: 0, offsetHeight: 60},
{offsetLeft: 0, offsetWidth: 60, offsetTop: 80, offsetHeight: 20},
{offsetLeft: 0, offsetWidth: 60, offsetTop: 60, offsetHeight: 20},
]);
testGrid("gridItemsPositions", "60px 50px", "60px 50px", "60px 50px", "60px 50px", [
{offsetLeft: 110, offsetWidth: 100, offsetTop: 0, offsetHeight: 60},
{offsetLeft: 0, offsetWidth: 60, offsetTop: 110, offsetHeight: 20},
{offsetLeft: 0, offsetWidth: 60, offsetTop: 60, offsetHeight: 50},
]);
testGrid("gridAutoFlowColumn", "", "", "none", "none", [
{offsetLeft: 0, offsetWidth: 100, offsetTop: 0, offsetHeight: 20},
{offsetLeft: 100, offsetWidth: 110, offsetTop: 0, offsetHeight: 20},
{offsetLeft: 210, offsetWidth: 50, offsetTop: 0, offsetHeight: 20},
]);
testGrid("gridAutoFlowColumn", "", "auto auto", "none", "20px 10px", [
{offsetLeft: 0, offsetWidth: 110, offsetTop: 0, offsetHeight: 20},
{offsetLeft: 0, offsetWidth: 110, offsetTop: 20, offsetHeight: 10},
{offsetLeft: 110, offsetWidth: 50, offsetTop: 0, offsetHeight: 20},
]);
testGrid("gridAutoFlowColumn", "60px", "", "60px", "none", [
{offsetLeft: 0, offsetWidth: 60, offsetTop: 0, offsetHeight: 20},
{offsetLeft: 60, offsetWidth: 110, offsetTop: 0, offsetHeight: 20},
{offsetLeft: 170, offsetWidth: 50, offsetTop: 0, offsetHeight: 20},
]);
testGrid("gridAutoFlowColumn", "100px 60px", "", "100px 60px", "none", [
{offsetLeft: 0, offsetWidth: 100, offsetTop: 0, offsetHeight: 20},
{offsetLeft: 100, offsetWidth: 60, offsetTop: 0, offsetHeight: 20},
{offsetLeft: 160, offsetWidth: 50, offsetTop: 0, offsetHeight: 20},
]);
testGrid("gridAutoFlowColumn", "", "50px", "none", "50px", [
{offsetLeft: 0, offsetWidth: 100, offsetTop: 0, offsetHeight: 50},
{offsetLeft: 100, offsetWidth: 110, offsetTop: 0, offsetHeight: 50},
{offsetLeft: 210, offsetWidth: 50, offsetTop: 0, offsetHeight: 50},
]);
testGrid("gridAutoFlowColumn", "", "50px 30px", "none", "50px 30px", [
{offsetLeft: 0, offsetWidth: 110, offsetTop: 0, offsetHeight: 50},
{offsetLeft: 0, offsetWidth: 110, offsetTop: 50, offsetHeight: 30},
{offsetLeft: 110, offsetWidth: 50, offsetTop: 0, offsetHeight: 50},
]);
testGrid("gridAutoFlowColumn", "60px", "50px", "60px", "50px", [
{offsetLeft: 0, offsetWidth: 60, offsetTop: 0, offsetHeight: 50},
{offsetLeft: 60, offsetWidth: 110, offsetTop: 0, offsetHeight: 50},
{offsetLeft: 170, offsetWidth: 50, offsetTop: 0, offsetHeight: 50},
]);
testGrid("gridAutoFlowColumn", "60px", "50px 30px", "60px", "50px 30px", [
{offsetLeft: 0, offsetWidth: 60, offsetTop: 0, offsetHeight: 50},
{offsetLeft: 0, offsetWidth: 60, offsetTop: 50, offsetHeight: 30},
{offsetLeft: 60, offsetWidth: 50, offsetTop: 0, offsetHeight: 50},
]);
testGrid("gridAutoFlowColumn", "100px 60px", "50px", "100px 60px", "50px", [
{offsetLeft: 0, offsetWidth: 100, offsetTop: 0, offsetHeight: 50},
{offsetLeft: 100, offsetWidth: 60, offsetTop: 0, offsetHeight: 50},
{offsetLeft: 160, offsetWidth: 50, offsetTop: 0, offsetHeight: 50},
]);
testGrid("gridAutoFlowColumn", "100px 60px", "50px 30px", "100px 60px", "50px 30px", [
{offsetLeft: 0, offsetWidth: 100, offsetTop: 0, offsetHeight: 50},
{offsetLeft: 0, offsetWidth: 100, offsetTop: 50, offsetHeight: 30},
{offsetLeft: 100, offsetWidth: 60, offsetTop: 0, offsetHeight: 50},
]);
testGrid("gridAutoFlowColumnItemsPositions", "", "", "none", "none", [
{offsetLeft: 160, offsetWidth: 100, offsetTop: 0, offsetHeight: 20},
{offsetLeft: 0, offsetWidth: 110, offsetTop: 20, offsetHeight: 10},
{offsetLeft: 110, offsetWidth: 50, offsetTop: 0, offsetHeight: 20},
]);
testGrid("gridAutoFlowColumnItemsPositions", "60px", "", "60px", "none", [
{offsetLeft: 110, offsetWidth: 100, offsetTop: 0, offsetHeight: 20},
{offsetLeft: 0, offsetWidth: 60, offsetTop: 20, offsetHeight: 20},
{offsetLeft: 60, offsetWidth: 50, offsetTop: 0, offsetHeight: 20},
]);
testGrid("gridAutoFlowColumnItemsPositions", "60px 70px", "", "60px 70px", "none", [
{offsetLeft: 130, offsetWidth: 100, offsetTop: 0, offsetHeight: 20},
{offsetLeft: 0, offsetWidth: 60, offsetTop: 20, offsetHeight: 20},
{offsetLeft: 60, offsetWidth: 70, offsetTop: 0, offsetHeight: 20},
]);
testGrid("gridAutoFlowColumnItemsPositions", "", "60px", "none", "60px", [
{offsetLeft: 160, offsetWidth: 100, offsetTop: 0, offsetHeight: 60},
{offsetLeft: 0, offsetWidth: 110, offsetTop: 60, offsetHeight: 10},
{offsetLeft: 110, offsetWidth: 50, offsetTop: 0, offsetHeight: 60},
]);
testGrid("gridAutoFlowColumnItemsPositions", "", "60px 70px", "none", "60px 70px", [
{offsetLeft: 160, offsetWidth: 100, offsetTop: 0, offsetHeight: 60},
{offsetLeft: 0, offsetWidth: 110, offsetTop: 130, offsetHeight: 10},
{offsetLeft: 110, offsetWidth: 50, offsetTop: 0, offsetHeight: 60},
]);
testGrid("gridAutoFlowColumnItemsPositions", "60px", "60px", "60px", "60px", [
{offsetLeft: 110, offsetWidth: 100, offsetTop: 0, offsetHeight: 60},
{offsetLeft: 0, offsetWidth: 60, offsetTop: 60, offsetHeight: 20},
{offsetLeft: 60, offsetWidth: 50, offsetTop: 0, offsetHeight: 60},
]);
testGrid("gridAutoFlowColumnItemsPositions", "60px", "60px 70px", "60px", "60px 70px", [
{offsetLeft: 110, offsetWidth: 100, offsetTop: 0, offsetHeight: 60},
{offsetLeft: 0, offsetWidth: 60, offsetTop: 130, offsetHeight: 20},
{offsetLeft: 60, offsetWidth: 50, offsetTop: 0, offsetHeight: 60},
]);
testGrid("gridAutoFlowColumnItemsPositions", "60px 70px", "60px", "60px 70px", "60px", [
{offsetLeft: 130, offsetWidth: 100, offsetTop: 0, offsetHeight: 60},
{offsetLeft: 0, offsetWidth: 60, offsetTop: 60, offsetHeight: 20},
{offsetLeft: 60, offsetWidth: 70, offsetTop: 0, offsetHeight: 60},
]);
testGrid("gridAutoFlowColumnItemsPositions", "60px 70px", "60px 70px", "60px 70px", "60px 70px", [
{offsetLeft: 130, offsetWidth: 100, offsetTop: 0, offsetHeight: 60},
{offsetLeft: 0, offsetWidth: 60, offsetTop: 130, offsetHeight: 20},
{offsetLeft: 60, offsetWidth: 70, offsetTop: 0, offsetHeight: 60},
]);
done();
});
</script>

View file

@ -85,21 +85,21 @@ document.fonts.ready.then(()=> {
// Wrong values. // Wrong values.
TestingUtils.testGridTemplateColumnsRows("emptyGrid", "fr", "fr", "none", "none"); TestingUtils.testGridTemplateColumnsRows("emptyGrid", "fr", "fr", "none", "none");
TestingUtils.testGridTemplateColumnsRows("grid", "fr", "fr", "none", "none"); TestingUtils.testGridTemplateColumnsRows("grid", "fr", "fr", "90px", "10px");
TestingUtils.testGridTemplateColumnsRows("emptyGrid", "1 fr", "1 fr", "none", "none"); TestingUtils.testGridTemplateColumnsRows("emptyGrid", "1 fr", "1 fr", "none", "none");
TestingUtils.testGridTemplateColumnsRows("grid", "1 fr", "1 fr", "none", "none"); TestingUtils.testGridTemplateColumnsRows("grid", "1 fr", "1 fr", "90px", "10px");
TestingUtils.testGridTemplateColumnsRows("emptyGrid", "1free-space", "1free-space", "none", "none"); TestingUtils.testGridTemplateColumnsRows("emptyGrid", "1free-space", "1free-space", "none", "none");
TestingUtils.testGridTemplateColumnsRows("grid", "1free-space", "1free-space", "none", "none"); TestingUtils.testGridTemplateColumnsRows("grid", "1free-space", "1free-space", "90px", "10px");
TestingUtils.testGridTemplateColumnsRows("emptyGrid", "-2fr", "-2fr", "none", "none"); TestingUtils.testGridTemplateColumnsRows("emptyGrid", "-2fr", "-2fr", "none", "none");
TestingUtils.testGridTemplateColumnsRows("grid", "-2fr", "-2fr", "none", "none"); TestingUtils.testGridTemplateColumnsRows("grid", "-2fr", "-2fr", "90px", "10px");
TestingUtils.testGridTemplateColumnsRows("emptyGrid", "0,5fr", "0,5fr", "none", "none"); TestingUtils.testGridTemplateColumnsRows("emptyGrid", "0,5fr", "0,5fr", "none", "none");
TestingUtils.testGridTemplateColumnsRows("grid", "0,5fr", "0,5fr", "none", "none"); TestingUtils.testGridTemplateColumnsRows("grid", "0,5fr", "0,5fr", "90px", "10px");
TestingUtils.testGridTemplateColumnsRows("emptyGrid", "calc(1fr + 100px)", "calc(1fr + 100px)", "none", "none"); TestingUtils.testGridTemplateColumnsRows("emptyGrid", "calc(1fr + 100px)", "calc(1fr + 100px)", "none", "none");
TestingUtils.testGridTemplateColumnsRows("grid", "calc(1fr + 100px)", "calc(1fr + 100px)", "none", "none"); TestingUtils.testGridTemplateColumnsRows("grid", "calc(1fr + 100px)", "calc(1fr + 100px)", "90px", "10px");
TestingUtils.testGridTemplateColumnsRows("emptyGrid", "(1fr) auto", "(1fr) auto", "none", "none"); TestingUtils.testGridTemplateColumnsRows("emptyGrid", "(1fr) auto", "(1fr) auto", "none", "none");
TestingUtils.testGridTemplateColumnsRows("grid", "(1fr) auto", "(1fr) auto", "none", "none"); TestingUtils.testGridTemplateColumnsRows("grid", "(1fr) auto", "(1fr) auto", "90px", "10px");
TestingUtils.testGridTemplateColumnsRows("emptyGrid", "minmax(1fr, 1000px)", "minmax(1fr, 700px)", "none", "none"); TestingUtils.testGridTemplateColumnsRows("emptyGrid", "minmax(1fr, 1000px)", "minmax(1fr, 700px)", "none", "none");
TestingUtils.testGridTemplateColumnsRows("grid", "minmax(1fr, 1000px)", "minmax(1fr, 700px)", "none", "none"); TestingUtils.testGridTemplateColumnsRows("grid", "minmax(1fr, 1000px)", "minmax(1fr, 700px)", "90px", "10px");
done(); done();
}); });
</script> </script>

View file

@ -31,7 +31,7 @@ setup({explicit_done: true});
document.fonts.ready.then(()=> { document.fonts.ready.then(()=> {
// Single values. // Single values.
TestingUtils.testGridTemplateColumnsRows("emptyGrid", "none", "none", "none", "none"); TestingUtils.testGridTemplateColumnsRows("emptyGrid", "none", "none", "none", "none");
TestingUtils.testGridTemplateColumnsRows("grid", "none", "none", "none", "none"); TestingUtils.testGridTemplateColumnsRows("grid", "none", "none", "90px", "10px");
TestingUtils.testGridTemplateColumnsRows("emptyGrid", "auto", "auto", "0px", "0px"); TestingUtils.testGridTemplateColumnsRows("emptyGrid", "auto", "auto", "0px", "0px");
TestingUtils.testGridTemplateColumnsRows("grid", "auto", "auto", "90px", "10px"); TestingUtils.testGridTemplateColumnsRows("grid", "auto", "auto", "90px", "10px");
TestingUtils.testGridTemplateColumnsRows("emptyGrid", "500px", "300px", "500px", "300px"); TestingUtils.testGridTemplateColumnsRows("emptyGrid", "500px", "300px", "500px", "300px");
@ -77,13 +77,13 @@ document.fonts.ready.then(()=> {
// Wrong values. // Wrong values.
TestingUtils.testGridTemplateColumnsRows("emptyGrid", "foo", "bar", "none", "none"); TestingUtils.testGridTemplateColumnsRows("emptyGrid", "foo", "bar", "none", "none");
TestingUtils.testGridTemplateColumnsRows("grid", "foo", "bar", "none", "none"); TestingUtils.testGridTemplateColumnsRows("grid", "foo", "bar", "90px", "10px");
TestingUtils.testGridTemplateColumnsRows("emptyGrid", "auto none", "none auto", "none", "none"); TestingUtils.testGridTemplateColumnsRows("emptyGrid", "auto none", "none auto", "none", "none");
TestingUtils.testGridTemplateColumnsRows("grid", "auto none", "none auto", "none", "none"); TestingUtils.testGridTemplateColumnsRows("grid", "auto none", "none auto", "90px", "10px");
TestingUtils.testGridTemplateColumnsRows("emptyGrid", "100px, 200px", "300px, 400px", "none", "none"); TestingUtils.testGridTemplateColumnsRows("emptyGrid", "100px, 200px", "300px, 400px", "none", "none");
TestingUtils.testGridTemplateColumnsRows("grid", "100px, 200px", "300px, 400px", "none", "none"); TestingUtils.testGridTemplateColumnsRows("grid", "100px, 200px", "300px, 400px", "90px", "10px");
TestingUtils.testGridTemplateColumnsRows("emptyGrid", "minmax(100px, 200px, 300px)", "minmax(100px, 200px, 300px)", "none", "none"); TestingUtils.testGridTemplateColumnsRows("emptyGrid", "minmax(100px, 200px, 300px)", "minmax(100px, 200px, 300px)", "none", "none");
TestingUtils.testGridTemplateColumnsRows("grid", "minmax(100px, 200px, 300px)", "minmax(100px, 200px, 300px)", "none", "none"); TestingUtils.testGridTemplateColumnsRows("grid", "minmax(100px, 200px, 300px)", "minmax(100px, 200px, 300px)", "90px", "10px");
done(); done();
}); });
</script> </script>

View file

@ -77,47 +77,47 @@ document.fonts.ready.then(()=> {
// Wrong values. // Wrong values.
TestingUtils.testGridTemplateColumnsRows("emptyGrid", "[a]", "[a]", "none", "none"); TestingUtils.testGridTemplateColumnsRows("emptyGrid", "[a]", "[a]", "none", "none");
TestingUtils.testGridTemplateColumnsRows("grid", "[a]", "[a]", "none", "none"); TestingUtils.testGridTemplateColumnsRows("grid", "[a]", "[a]", "90px", "10px");
TestingUtils.testGridTemplateColumnsRows("emptyGrid", "[a b]", "[a b]", "none", "none"); TestingUtils.testGridTemplateColumnsRows("emptyGrid", "[a b]", "[a b]", "none", "none");
TestingUtils.testGridTemplateColumnsRows("grid", "[a b]", "[a b]", "none", "none"); TestingUtils.testGridTemplateColumnsRows("grid", "[a b]", "[a b]", "90px", "10px");
TestingUtils.testGridTemplateColumnsRows("emptyGrid", "[a] none [b]", "[a] none [b]", "none", "none"); TestingUtils.testGridTemplateColumnsRows("emptyGrid", "[a] none [b]", "[a] none [b]", "none", "none");
TestingUtils.testGridTemplateColumnsRows("grid", "[a] none [b]", "[a] none [b]", "none", "none"); TestingUtils.testGridTemplateColumnsRows("grid", "[a] none [b]", "[a] none [b]", "90px", "10px");
TestingUtils.testGridTemplateColumnsRows("emptyGrid", "[a] [b]", "[a] [b]", "none", "none"); TestingUtils.testGridTemplateColumnsRows("emptyGrid", "[a] [b]", "[a] [b]", "none", "none");
TestingUtils.testGridTemplateColumnsRows("grid", "[a] [b]", "[a] [b]", "none", "none"); TestingUtils.testGridTemplateColumnsRows("grid", "[a] [b]", "[a] [b]", "90px", "10px");
TestingUtils.testGridTemplateColumnsRows("emptyGrid", "a auto b", "a auto b", "none", "none"); TestingUtils.testGridTemplateColumnsRows("emptyGrid", "a auto b", "a auto b", "none", "none");
TestingUtils.testGridTemplateColumnsRows("grid", "a auto b", "a auto b", "none", "none"); TestingUtils.testGridTemplateColumnsRows("grid", "a auto b", "a auto b", "90px", "10px");
TestingUtils.testGridTemplateColumnsRows("emptyGrid", "(a) auto (b)", "(a) auto (b)", "none", "none"); TestingUtils.testGridTemplateColumnsRows("emptyGrid", "(a) auto (b)", "(a) auto (b)", "none", "none");
TestingUtils.testGridTemplateColumnsRows("grid", "(a) auto (b)", "(a) auto (b)", "none", "none"); TestingUtils.testGridTemplateColumnsRows("grid", "(a) auto (b)", "(a) auto (b)", "90px", "10px");
TestingUtils.testGridTemplateColumnsRows("emptyGrid", "'a' auto 'b'", "'a' auto 'b'", "none", "none"); TestingUtils.testGridTemplateColumnsRows("emptyGrid", "'a' auto 'b'", "'a' auto 'b'", "none", "none");
TestingUtils.testGridTemplateColumnsRows("grid", "'a' auto 'b'", "'a' auto 'b'", "none", "none"); TestingUtils.testGridTemplateColumnsRows("grid", "'a' auto 'b'", "'a' auto 'b'", "90px", "10px");
TestingUtils.testGridTemplateColumnsRows("emptyGrid", "\"a\" auto \"b\"", "\"a\" auto \"b\"", "none", "none"); TestingUtils.testGridTemplateColumnsRows("emptyGrid", "\"a\" auto \"b\"", "\"a\" auto \"b\"", "none", "none");
TestingUtils.testGridTemplateColumnsRows("grid", "\"a\" auto \"b\"", "\"a\" auto \"b\"", "none", "none"); TestingUtils.testGridTemplateColumnsRows("grid", "\"a\" auto \"b\"", "\"a\" auto \"b\"", "90px", "10px");
TestingUtils.testGridTemplateColumnsRows("emptyGrid", "[a, b] auto [a, b]", "[a, b] auto [a, b]", "none", "none"); TestingUtils.testGridTemplateColumnsRows("emptyGrid", "[a, b] auto [a, b]", "[a, b] auto [a, b]", "none", "none");
TestingUtils.testGridTemplateColumnsRows("grid", "[a, b] auto [a, b]", "[a, b] auto [a, b]", "none", "none"); TestingUtils.testGridTemplateColumnsRows("grid", "[a, b] auto [a, b]", "[a, b] auto [a, b]", "90px", "10px");
TestingUtils.testGridTemplateColumnsRows("emptyGrid", "[a] [b] auto [c d] [e]", "[a] [b] auto [c d] [e]", "none", "none"); TestingUtils.testGridTemplateColumnsRows("emptyGrid", "[a] [b] auto [c d] [e]", "[a] [b] auto [c d] [e]", "none", "none");
TestingUtils.testGridTemplateColumnsRows("grid", "[a] [b] auto [c d] [e]", "[a] [b] auto [c d] [e]", "none", "none"); TestingUtils.testGridTemplateColumnsRows("grid", "[a] [b] auto [c d] [e]", "[a] [b] auto [c d] [e]", "90px", "10px");
TestingUtils.testGridTemplateColumnsRows("emptyGrid", "[a [b]] auto [c]", "[a [b]] auto [c]", "none", "none"); TestingUtils.testGridTemplateColumnsRows("emptyGrid", "[a [b]] auto [c]", "[a [b]] auto [c]", "none", "none");
TestingUtils.testGridTemplateColumnsRows("grid", "[a [b]] auto [c]", "[a [b]] auto [c]", "none", "none"); TestingUtils.testGridTemplateColumnsRows("grid", "[a [b]] auto [c]", "[a [b]] auto [c]", "90px", "10px");
TestingUtils.testGridTemplateColumnsRows("emptyGrid", "[a] auto [[b]]", "[a] auto [[b]]", "none", "none"); TestingUtils.testGridTemplateColumnsRows("emptyGrid", "[a] auto [[b]]", "[a] auto [[b]]", "none", "none");
TestingUtils.testGridTemplateColumnsRows("grid", "[a] auto [[b]]", "[a] auto [[b]]", "none", "none"); TestingUtils.testGridTemplateColumnsRows("grid", "[a] auto [[b]]", "[a] auto [[b]]", "90px", "10px");
TestingUtils.testGridTemplateColumnsRows("emptyGrid", "[a auto [b]", "[a auto [b]", "none", "none"); TestingUtils.testGridTemplateColumnsRows("emptyGrid", "[a auto [b]", "[a auto [b]", "none", "none");
TestingUtils.testGridTemplateColumnsRows("grid", "[a auto [b]", "[a auto [b]", "none", "none"); TestingUtils.testGridTemplateColumnsRows("grid", "[a auto [b]", "[a auto [b]", "90px", "10px");
TestingUtils.testGridTemplateColumnsRows("emptyGrid", "[a 100px] auto [b]", "[a 100px] auto [b]", "none", "none"); TestingUtils.testGridTemplateColumnsRows("emptyGrid", "[a 100px] auto [b]", "[a 100px] auto [b]", "none", "none");
TestingUtils.testGridTemplateColumnsRows("grid", "[a 100px] auto [b]", "[a 100px] auto [b]", "none", "none"); TestingUtils.testGridTemplateColumnsRows("grid", "[a 100px] auto [b]", "[a 100px] auto [b]", "90px", "10px");
TestingUtils.testGridTemplateColumnsRows("emptyGrid", "[a 50%] auto [b]", "[a 50%] auto [b]", "none", "none"); TestingUtils.testGridTemplateColumnsRows("emptyGrid", "[a 50%] auto [b]", "[a 50%] auto [b]", "none", "none");
TestingUtils.testGridTemplateColumnsRows("grid", "[a 50%] auto [b]", "[a 50%] auto [b]", "none", "none"); TestingUtils.testGridTemplateColumnsRows("grid", "[a 50%] auto [b]", "[a 50%] auto [b]", "90px", "10px");
TestingUtils.testGridTemplateColumnsRows("emptyGrid", "[5] auto [10]", "[5] auto [10]", "none", "none"); TestingUtils.testGridTemplateColumnsRows("emptyGrid", "[5] auto [10]", "[5] auto [10]", "none", "none");
TestingUtils.testGridTemplateColumnsRows("grid", "[5] auto [10]", "[5] auto [10]", "none", "none"); TestingUtils.testGridTemplateColumnsRows("grid", "[5] auto [10]", "[5] auto [10]", "90px", "10px");
TestingUtils.testGridTemplateColumnsRows("emptyGrid", "[a.] auto [b*]", "[a.] auto [b*]", "none", "none"); TestingUtils.testGridTemplateColumnsRows("emptyGrid", "[a.] auto [b*]", "[a.] auto [b*]", "none", "none");
TestingUtils.testGridTemplateColumnsRows("grid", "[a.] auto [b*]", "[a.] auto [b*]", "none", "none"); TestingUtils.testGridTemplateColumnsRows("grid", "[a.] auto [b*]", "[a.] auto [b*]", "90px", "10px");
TestingUtils.testGridTemplateColumnsRows("emptyGrid", "[#a] auto [$b]", "[#a] auto [$b]", "none", "none"); TestingUtils.testGridTemplateColumnsRows("emptyGrid", "[#a] auto [$b]", "[#a] auto [$b]", "none", "none");
TestingUtils.testGridTemplateColumnsRows("grid", "[#a] auto [$b]", "[#a] auto [$b]", "none", "none"); TestingUtils.testGridTemplateColumnsRows("grid", "[#a] auto [$b]", "[#a] auto [$b]", "90px", "10px");
TestingUtils.testGridTemplateColumnsRows("emptyGrid", "[initial] auto", "[initial] auto", "none", "none"); TestingUtils.testGridTemplateColumnsRows("emptyGrid", "[initial] auto", "[initial] auto", "none", "none");
TestingUtils.testGridTemplateColumnsRows("grid", "[initial] auto", "[initial] auto", "none", "none"); TestingUtils.testGridTemplateColumnsRows("grid", "[initial] auto", "[initial] auto", "90px", "10px");
TestingUtils.testGridTemplateColumnsRows("emptyGrid", "[inherit] auto", "[inherit] auto", "none", "none"); TestingUtils.testGridTemplateColumnsRows("emptyGrid", "[inherit] auto", "[inherit] auto", "none", "none");
TestingUtils.testGridTemplateColumnsRows("grid", "[inherit] auto", "[inherit] auto", "none", "none"); TestingUtils.testGridTemplateColumnsRows("grid", "[inherit] auto", "[inherit] auto", "90px", "10px");
TestingUtils.testGridTemplateColumnsRows("emptyGrid", "[default] auto", "[default] auto", "none", "none"); TestingUtils.testGridTemplateColumnsRows("emptyGrid", "[default] auto", "[default] auto", "none", "none");
TestingUtils.testGridTemplateColumnsRows("grid", "[default] auto", "[default] auto", "none", "none"); TestingUtils.testGridTemplateColumnsRows("grid", "[default] auto", "[default] auto", "90px", "10px");
done(); done();
}); });
</script> </script>

View file

@ -65,19 +65,19 @@ document.fonts.ready.then(()=> {
// Wrong values. // Wrong values.
TestingUtils.testGridTemplateColumnsRows("emptyGrid", "repeat(-1, auto)", "repeat(-1, auto)", "none", "none"); TestingUtils.testGridTemplateColumnsRows("emptyGrid", "repeat(-1, auto)", "repeat(-1, auto)", "none", "none");
TestingUtils.testGridTemplateColumnsRows("grid", "repeat(-1, auto)", "repeat(-1, auto)", "none", "none"); TestingUtils.testGridTemplateColumnsRows("grid", "repeat(-1, auto)", "repeat(-1, auto)", "90px", "10px");
TestingUtils.testGridTemplateColumnsRows("emptyGrid", "repeat(auto, 2)", "repeat(auto, 2)", "none", "none"); TestingUtils.testGridTemplateColumnsRows("emptyGrid", "repeat(auto, 2)", "repeat(auto, 2)", "none", "none");
TestingUtils.testGridTemplateColumnsRows("grid", "repeat(auto, 2)", "repeat(auto, 2)", "none", "none"); TestingUtils.testGridTemplateColumnsRows("grid", "repeat(auto, 2)", "repeat(auto, 2)", "90px", "10px");
TestingUtils.testGridTemplateColumnsRows("emptyGrid", "repeat 2, auto", "repeat 2, auto", "none", "none"); TestingUtils.testGridTemplateColumnsRows("emptyGrid", "repeat 2, auto", "repeat 2, auto", "none", "none");
TestingUtils.testGridTemplateColumnsRows("grid", "repeat 2, auto", "repeat 2, auto", "none", "none"); TestingUtils.testGridTemplateColumnsRows("grid", "repeat 2, auto", "repeat 2, auto", "90px", "10px");
TestingUtils.testGridTemplateColumnsRows("emptyGrid", "repeat(2 auto)", "repeat(2 auto)", "none", "none"); TestingUtils.testGridTemplateColumnsRows("emptyGrid", "repeat(2 auto)", "repeat(2 auto)", "none", "none");
TestingUtils.testGridTemplateColumnsRows("grid", "repeat(2 auto)", "repeat(2 auto)", "none", "none"); TestingUtils.testGridTemplateColumnsRows("grid", "repeat(2 auto)", "repeat(2 auto)", "90px", "10px");
TestingUtils.testGridTemplateColumnsRows("emptyGrid", "100px (repeat 2, auto)", "(repeat 2, auto)", "none", "none"); TestingUtils.testGridTemplateColumnsRows("emptyGrid", "100px (repeat 2, auto)", "(repeat 2, auto)", "none", "none");
TestingUtils.testGridTemplateColumnsRows("grid", "100px (repeat 2, auto)", "(repeat 2, auto)", "none", "none"); TestingUtils.testGridTemplateColumnsRows("grid", "100px (repeat 2, auto)", "(repeat 2, auto)", "90px", "10px");
TestingUtils.testGridTemplateColumnsRows("emptyGrid", "repeat(2, 50px repeat(2, 100px))", "repeat(2, 50px repeat(2, 100px))", "none", "none"); TestingUtils.testGridTemplateColumnsRows("emptyGrid", "repeat(2, 50px repeat(2, 100px))", "repeat(2, 50px repeat(2, 100px))", "none", "none");
TestingUtils.testGridTemplateColumnsRows("grid", "repeat(2, 50px repeat(2, 100px))", "repeat(2, 50px repeat(2, 100px))", "none", "none"); TestingUtils.testGridTemplateColumnsRows("grid", "repeat(2, 50px repeat(2, 100px))", "repeat(2, 50px repeat(2, 100px))", "90px", "10px");
TestingUtils.testGridTemplateColumnsRows("emptyGrid", "100px repeat(2, [a])", "100px repeat(2, [a])", "none", "none"); TestingUtils.testGridTemplateColumnsRows("emptyGrid", "100px repeat(2, [a])", "100px repeat(2, [a])", "none", "none");
TestingUtils.testGridTemplateColumnsRows("grid", "100px repeat(2, [a])", "100px repeat(2, [a])", "none", "none"); TestingUtils.testGridTemplateColumnsRows("grid", "100px repeat(2, [a])", "100px repeat(2, [a])", "90px", "10px");
done(); done();
}); });
</script> </script>

View file

@ -4,7 +4,7 @@
<link rel="author" title="Manuel Rego Casasnovas" href="mailto:rego@igalia.com"> <link rel="author" title="Manuel Rego Casasnovas" href="mailto:rego@igalia.com">
<link rel="help" href="http://www.w3.org/TR/css-grid-1/#resolved-track-list" title="5.1.5. Resolved Values"> <link rel="help" href="http://www.w3.org/TR/css-grid-1/#resolved-track-list" title="5.1.5. Resolved Values">
<meta name="flags" content="ahem dom"> <meta name="flags" content="ahem dom">
<meta name="assert" content="This test checks that resolved values for 'grid-template-columns' and 'grid-template-rows' don't include implicitly created tracks."> <meta name="assert" content="This test checks that resolved values for 'grid-template-columns' and 'grid-template-rows' list tracks implicitly created.">
<script src="/resources/testharness.js"></script> <script src="/resources/testharness.js"></script>
<script src="/resources/testharnessreport.js"></script> <script src="/resources/testharnessreport.js"></script>
<script src="support/testing-utils.js"></script> <script src="support/testing-utils.js"></script>
@ -17,7 +17,6 @@
font: 10px/1 Ahem; font: 10px/1 Ahem;
justify-content: start; justify-content: start;
align-content: start; align-content: start;
position: relative;
} }
.fifthColumn { .fifthColumn {
@ -59,218 +58,50 @@
</div> </div>
<script> <script>
function testSizeAndPositionOfItems(gridId, expectedItemData) {
let grid = document.getElementById(gridId);
assert_equals(grid.childElementCount, expectedItemData.length, "childElementCount");
let props = ["offsetWidth", "offsetTop", "offsetHeight"];
for (let i = 0; i < expectedItemData.length; ++i)
for (let prop of props)
assert_equals(grid.children[i][prop], expectedItemData[i][prop], "children[" + i + "]." + prop);
}
function testGrid(gridId, columnsStyle, rowsStyle, columnsComputedValue, rowsComputedValue, expectedItemData) {
TestingUtils.testGridTemplateColumnsRows(gridId, columnsStyle, rowsStyle, columnsComputedValue, rowsComputedValue);
test(function() {
testSizeAndPositionOfItems(gridId, expectedItemData);
}, "Children of '" + gridId + "' with: grid-template-columns: " + columnsStyle + "; and grid-template-rows: " + rowsStyle + ";");
}
setup({explicit_done: true}); setup({explicit_done: true});
document.fonts.ready.then(()=> { document.fonts.ready.then(()=> {
// Valid values. // Valid values.
testGrid("grid", "", "", "none", "none", [ TestingUtils.testGridTemplateColumnsRows("grid", "", "", "110px", ["10px 10px 20px", "repeat(2, 10px) 20px"]);
{offsetLeft: 0, offsetWidth: 110, offsetTop: 0, offsetHeight: 10}, TestingUtils.testGridTemplateColumnsRows("grid", "auto auto", "", "100px 110px", "10px 20px");
{offsetLeft: 0, offsetWidth: 110, offsetTop: 10, offsetHeight: 10}, TestingUtils.testGridTemplateColumnsRows("grid", "60px", "", "60px", ["20px 20px 20px", "repeat(3, 20px)"]);
{offsetLeft: 0, offsetWidth: 110, offsetTop: 20, offsetHeight: 20}, TestingUtils.testGridTemplateColumnsRows("grid", "100px 60px", "", "100px 60px", ["20px 20px", "repeat(2, 20px)"]);
]); TestingUtils.testGridTemplateColumnsRows("grid", "", "50px", "110px", "50px 10px 20px");
testGrid("grid", "auto auto", "", "100px 110px", "none", [ TestingUtils.testGridTemplateColumnsRows("grid", "", "50px 30px", "110px", "50px 30px 20px");
{offsetLeft: 0, offsetWidth: 100, offsetTop: 0, offsetHeight: 10}, TestingUtils.testGridTemplateColumnsRows("grid", "60px", "50px", "60px", ["50px 20px 20px", "50px repeat(2, 20px)"]);
{offsetLeft: 100, offsetWidth: 110, offsetTop: 0, offsetHeight: 10}, TestingUtils.testGridTemplateColumnsRows("grid", "60px", "50px 30px", "60px", "50px 30px 20px");
{offsetLeft: 0, offsetWidth: 100, offsetTop: 10, offsetHeight: 20}, TestingUtils.testGridTemplateColumnsRows("grid", "100px 60px", "50px", "100px 60px", "50px 20px");
]); TestingUtils.testGridTemplateColumnsRows("grid", "100px 60px", "50px 30px", "100px 60px", "50px 30px");
testGrid("grid", "60px", "", "60px", "none", [
{offsetLeft: 0, offsetWidth: 60, offsetTop: 0, offsetHeight: 20},
{offsetLeft: 0, offsetWidth: 60, offsetTop: 20, offsetHeight: 20},
{offsetLeft: 0, offsetWidth: 60, offsetTop: 40, offsetHeight: 20},
]);
testGrid("grid", "100px 60px", "", "100px 60px", "none", [
{offsetLeft: 0, offsetWidth: 100, offsetTop: 0, offsetHeight: 20},
{offsetLeft: 100, offsetWidth: 60, offsetTop: 0, offsetHeight: 20},
{offsetLeft: 0, offsetWidth: 100, offsetTop: 20, offsetHeight: 20},
]);
testGrid("grid", "", "50px", "none", "50px", [
{offsetLeft: 0, offsetWidth: 110, offsetTop: 0, offsetHeight: 50},
{offsetLeft: 0, offsetWidth: 110, offsetTop: 50, offsetHeight: 10},
{offsetLeft: 0, offsetWidth: 110, offsetTop: 60, offsetHeight: 20},
]);
testGrid("grid", "", "50px 30px", "none", "50px 30px", [
{offsetLeft: 0, offsetWidth: 110, offsetTop: 0, offsetHeight: 50},
{offsetLeft: 0, offsetWidth: 110, offsetTop: 50, offsetHeight: 30},
{offsetLeft: 0, offsetWidth: 110, offsetTop: 80, offsetHeight: 20},
]);
testGrid("grid", "60px", "50px", "60px", "50px", [
{offsetLeft: 0, offsetWidth: 60, offsetTop: 0, offsetHeight: 50},
{offsetLeft: 0, offsetWidth: 60, offsetTop: 50, offsetHeight: 20},
{offsetLeft: 0, offsetWidth: 60, offsetTop: 70, offsetHeight: 20},
]);
testGrid("grid", "60px", "50px 30px", "60px", "50px 30px", [
{offsetLeft: 0, offsetWidth: 60, offsetTop: 0, offsetHeight: 50},
{offsetLeft: 0, offsetWidth: 60, offsetTop: 50, offsetHeight: 30},
{offsetLeft: 0, offsetWidth: 60, offsetTop: 80, offsetHeight: 20},
]);
testGrid("grid", "100px 60px", "50px", "100px 60px", "50px", [
{offsetLeft: 0, offsetWidth: 100, offsetTop: 0, offsetHeight: 50},
{offsetLeft: 100, offsetWidth: 60, offsetTop: 0, offsetHeight: 50},
{offsetLeft: 0, offsetWidth: 100, offsetTop: 50, offsetHeight: 20},
]);
testGrid("grid", "100px 60px", "50px 30px", "100px 60px", "50px 30px", [
{offsetLeft: 0, offsetWidth: 100, offsetTop: 0, offsetHeight: 50},
{offsetLeft: 100, offsetWidth: 60, offsetTop: 0, offsetHeight: 50},
{offsetLeft: 0, offsetWidth: 100, offsetTop: 50, offsetHeight: 30},
]);
testGrid("gridItemsPositions", "", "", "none", "none", [ TestingUtils.testGridTemplateColumnsRows("gridItemsPositions", "", "", ["110px 0px 0px 0px 100px", "110px repeat(3, 0px) 100px"], "10px 20px 0px 10px");
{offsetLeft: 110, offsetWidth: 100, offsetTop: 0, offsetHeight: 10}, TestingUtils.testGridTemplateColumnsRows("gridItemsPositions", "60px", "", ["60px 0px 0px 0px 100px", "60px repeat(3, 0px) 100px"], "10px 20px 0px 20px");
{offsetLeft: 0, offsetWidth: 110, offsetTop: 30, offsetHeight: 10}, TestingUtils.testGridTemplateColumnsRows("gridItemsPositions", "60px 50px", "", ["60px 50px 0px 0px 100px", "60px 50px repeat(2, 0px) 100px"], "10px 20px 0px 20px");
{offsetLeft: 0, offsetWidth: 110, offsetTop: 10, offsetHeight: 20}, TestingUtils.testGridTemplateColumnsRows("gridItemsPositions", "", "60px", ["110px 0px 0px 0px 100px", "110px repeat(3, 0px) 100px"], "60px 20px 0px 10px");
]); TestingUtils.testGridTemplateColumnsRows("gridItemsPositions", "", "60px 50px", ["110px 0px 0px 0px 100px", "110px repeat(3, 0px) 100px"], "60px 50px 0px 10px");
testGrid("gridItemsPositions", "60px", "", "60px", "none", [ TestingUtils.testGridTemplateColumnsRows("gridItemsPositions", "60px", "60px", ["60px 0px 0px 0px 100px", "60px repeat(3, 0px) 100px"], "60px 20px 0px 20px");
{offsetLeft: 60, offsetWidth: 100, offsetTop: 0, offsetHeight: 10}, TestingUtils.testGridTemplateColumnsRows("gridItemsPositions", "60px", "60px 50px", ["60px 0px 0px 0px 100px", "60px repeat(3, 0px) 100px"], "60px 50px 0px 20px");
{offsetLeft: 0, offsetWidth: 60, offsetTop: 30, offsetHeight: 20}, TestingUtils.testGridTemplateColumnsRows("gridItemsPositions", "60px 50px", "60px", ["60px 50px 0px 0px 100px", "60px 50px repeat(2, 0px) 100px"], "60px 20px 0px 20px");
{offsetLeft: 0, offsetWidth: 60, offsetTop: 10, offsetHeight: 20}, TestingUtils.testGridTemplateColumnsRows("gridItemsPositions", "60px 50px", "60px 50px", ["60px 50px 0px 0px 100px", "60px 50px repeat(2, 0px) 100px"], "60px 50px 0px 20px");
]);
testGrid("gridItemsPositions", "60px 50px", "", "60px 50px", "none", [
{offsetLeft: 110, offsetWidth: 100, offsetTop: 0, offsetHeight: 10},
{offsetLeft: 0, offsetWidth: 60, offsetTop: 30, offsetHeight: 20},
{offsetLeft: 0, offsetWidth: 60, offsetTop: 10, offsetHeight: 20},
]);
testGrid("gridItemsPositions", "", "60px", "none", "60px", [
{offsetLeft: 110, offsetWidth: 100, offsetTop: 0, offsetHeight: 60},
{offsetLeft: 0, offsetWidth: 110, offsetTop: 80, offsetHeight: 10},
{offsetLeft: 0, offsetWidth: 110, offsetTop: 60, offsetHeight: 20},
]);
testGrid("gridItemsPositions", "", "60px 50px", "none", "60px 50px", [
{offsetLeft: 110, offsetWidth: 100, offsetTop: 0, offsetHeight: 60},
{offsetLeft: 0, offsetWidth: 110, offsetTop: 110, offsetHeight: 10},
{offsetLeft: 0, offsetWidth: 110, offsetTop: 60, offsetHeight: 50},
]);
testGrid("gridItemsPositions", "60px", "60px", "60px", "60px", [
{offsetLeft: 60, offsetWidth: 100, offsetTop: 0, offsetHeight: 60},
{offsetLeft: 0, offsetWidth: 60, offsetTop: 80, offsetHeight: 20},
{offsetLeft: 0, offsetWidth: 60, offsetTop: 60, offsetHeight: 20},
]);
testGrid("gridItemsPositions", "60px", "60px 50px", "60px", "60px 50px", [
{offsetLeft: 60, offsetWidth: 100, offsetTop: 0, offsetHeight: 60},
{offsetLeft: 0, offsetWidth: 60, offsetTop: 110, offsetHeight: 20},
{offsetLeft: 0, offsetWidth: 60, offsetTop: 60, offsetHeight: 50},
]);
testGrid("gridItemsPositions", "60px 50px", "60px", "60px 50px", "60px", [
{offsetLeft: 110, offsetWidth: 100, offsetTop: 0, offsetHeight: 60},
{offsetLeft: 0, offsetWidth: 60, offsetTop: 80, offsetHeight: 20},
{offsetLeft: 0, offsetWidth: 60, offsetTop: 60, offsetHeight: 20},
]);
testGrid("gridItemsPositions", "60px 50px", "60px 50px", "60px 50px", "60px 50px", [
{offsetLeft: 110, offsetWidth: 100, offsetTop: 0, offsetHeight: 60},
{offsetLeft: 0, offsetWidth: 60, offsetTop: 110, offsetHeight: 20},
{offsetLeft: 0, offsetWidth: 60, offsetTop: 60, offsetHeight: 50},
]);
testGrid("gridAutoFlowColumn", "", "", "none", "none", [ TestingUtils.testGridTemplateColumnsRows("gridAutoFlowColumn", "", "", "100px 110px 50px", "20px");
{offsetLeft: 0, offsetWidth: 100, offsetTop: 0, offsetHeight: 20}, TestingUtils.testGridTemplateColumnsRows("gridAutoFlowColumn", "", "auto auto", "110px 50px", "20px 10px");
{offsetLeft: 100, offsetWidth: 110, offsetTop: 0, offsetHeight: 20}, TestingUtils.testGridTemplateColumnsRows("gridAutoFlowColumn", "60px", "", "60px 110px 50px", "20px");
{offsetLeft: 210, offsetWidth: 50, offsetTop: 0, offsetHeight: 20}, TestingUtils.testGridTemplateColumnsRows("gridAutoFlowColumn", "100px 60px", "", "100px 60px 50px", "20px");
]); TestingUtils.testGridTemplateColumnsRows("gridAutoFlowColumn", "", "50px", "100px 110px 50px", "50px");
testGrid("gridAutoFlowColumn", "", "auto auto", "none", "20px 10px", [ TestingUtils.testGridTemplateColumnsRows("gridAutoFlowColumn", "", "50px 30px", "110px 50px", "50px 30px");
{offsetLeft: 0, offsetWidth: 110, offsetTop: 0, offsetHeight: 20}, TestingUtils.testGridTemplateColumnsRows("gridAutoFlowColumn", "60px", "50px", "60px 110px 50px", "50px");
{offsetLeft: 0, offsetWidth: 110, offsetTop: 20, offsetHeight: 10}, TestingUtils.testGridTemplateColumnsRows("gridAutoFlowColumn", "60px", "50px 30px", "60px 50px", "50px 30px");
{offsetLeft: 110, offsetWidth: 50, offsetTop: 0, offsetHeight: 20}, TestingUtils.testGridTemplateColumnsRows("gridAutoFlowColumn", "100px 60px", "50px", "100px 60px 50px", "50px");
]); TestingUtils.testGridTemplateColumnsRows("gridAutoFlowColumn", "100px 60px", "50px 30px", "100px 60px", "50px 30px");
testGrid("gridAutoFlowColumn", "60px", "", "60px", "none", [
{offsetLeft: 0, offsetWidth: 60, offsetTop: 0, offsetHeight: 20},
{offsetLeft: 60, offsetWidth: 110, offsetTop: 0, offsetHeight: 20},
{offsetLeft: 170, offsetWidth: 50, offsetTop: 0, offsetHeight: 20},
]);
testGrid("gridAutoFlowColumn", "100px 60px", "", "100px 60px", "none", [
{offsetLeft: 0, offsetWidth: 100, offsetTop: 0, offsetHeight: 20},
{offsetLeft: 100, offsetWidth: 60, offsetTop: 0, offsetHeight: 20},
{offsetLeft: 160, offsetWidth: 50, offsetTop: 0, offsetHeight: 20},
]);
testGrid("gridAutoFlowColumn", "", "50px", "none", "50px", [
{offsetLeft: 0, offsetWidth: 100, offsetTop: 0, offsetHeight: 50},
{offsetLeft: 100, offsetWidth: 110, offsetTop: 0, offsetHeight: 50},
{offsetLeft: 210, offsetWidth: 50, offsetTop: 0, offsetHeight: 50},
]);
testGrid("gridAutoFlowColumn", "", "50px 30px", "none", "50px 30px", [
{offsetLeft: 0, offsetWidth: 110, offsetTop: 0, offsetHeight: 50},
{offsetLeft: 0, offsetWidth: 110, offsetTop: 50, offsetHeight: 30},
{offsetLeft: 110, offsetWidth: 50, offsetTop: 0, offsetHeight: 50},
]);
testGrid("gridAutoFlowColumn", "60px", "50px", "60px", "50px", [
{offsetLeft: 0, offsetWidth: 60, offsetTop: 0, offsetHeight: 50},
{offsetLeft: 60, offsetWidth: 110, offsetTop: 0, offsetHeight: 50},
{offsetLeft: 170, offsetWidth: 50, offsetTop: 0, offsetHeight: 50},
]);
testGrid("gridAutoFlowColumn", "60px", "50px 30px", "60px", "50px 30px", [
{offsetLeft: 0, offsetWidth: 60, offsetTop: 0, offsetHeight: 50},
{offsetLeft: 0, offsetWidth: 60, offsetTop: 50, offsetHeight: 30},
{offsetLeft: 60, offsetWidth: 50, offsetTop: 0, offsetHeight: 50},
]);
testGrid("gridAutoFlowColumn", "100px 60px", "50px", "100px 60px", "50px", [
{offsetLeft: 0, offsetWidth: 100, offsetTop: 0, offsetHeight: 50},
{offsetLeft: 100, offsetWidth: 60, offsetTop: 0, offsetHeight: 50},
{offsetLeft: 160, offsetWidth: 50, offsetTop: 0, offsetHeight: 50},
]);
testGrid("gridAutoFlowColumn", "100px 60px", "50px 30px", "100px 60px", "50px 30px", [
{offsetLeft: 0, offsetWidth: 100, offsetTop: 0, offsetHeight: 50},
{offsetLeft: 0, offsetWidth: 100, offsetTop: 50, offsetHeight: 30},
{offsetLeft: 100, offsetWidth: 60, offsetTop: 0, offsetHeight: 50},
]);
testGrid("gridAutoFlowColumnItemsPositions", "", "", "none", "none", [ TestingUtils.testGridTemplateColumnsRows("gridAutoFlowColumnItemsPositions", "", "", ["110px 50px 0px 0px 100px", "110px 50px repeat(2, 0px) 100px"], ["20px 0px 0px 10px", "20px repeat(2, 0px) 10px"]);
{offsetLeft: 160, offsetWidth: 100, offsetTop: 0, offsetHeight: 20}, TestingUtils.testGridTemplateColumnsRows("gridAutoFlowColumnItemsPositions", "60px", "", ["60px 50px 0px 0px 100px", "60px 50px repeat(2, 0px) 100px"], ["20px 0px 0px 20px", "20px repeat(2, 0px) 20px"]);
{offsetLeft: 0, offsetWidth: 110, offsetTop: 20, offsetHeight: 10}, TestingUtils.testGridTemplateColumnsRows("gridAutoFlowColumnItemsPositions", "60px 70px", "", ["60px 70px 0px 0px 100px", "60px 70px repeat(2, 0px) 100px"], ["20px 0px 0px 20px", "20px repeat(2, 0px) 20px"]);
{offsetLeft: 110, offsetWidth: 50, offsetTop: 0, offsetHeight: 20}, TestingUtils.testGridTemplateColumnsRows("gridAutoFlowColumnItemsPositions", "", "60px", ["110px 50px 0px 0px 100px", "110px 50px repeat(2, 0px) 100px"], ["60px 0px 0px 10px", "60px repeat(2, 0px) 10px"]);
]); TestingUtils.testGridTemplateColumnsRows("gridAutoFlowColumnItemsPositions", "", "60px 70px", ["110px 50px 0px 0px 100px", "110px 50px repeat(2, 0px) 100px"], "60px 70px 0px 10px");
testGrid("gridAutoFlowColumnItemsPositions", "60px", "", "60px", "none", [ TestingUtils.testGridTemplateColumnsRows("gridAutoFlowColumnItemsPositions", "60px", "60px", ["60px 50px 0px 0px 100px", "60px 50px repeat(2, 0px) 100px"], ["60px 0px 0px 20px", "60px repeat(2, 0px) 20px"]);
{offsetLeft: 110, offsetWidth: 100, offsetTop: 0, offsetHeight: 20}, TestingUtils.testGridTemplateColumnsRows("gridAutoFlowColumnItemsPositions", "60px", "60px 70px", ["60px 50px 0px 0px 100px", "60px 50px repeat(2, 0px) 100px"], "60px 70px 0px 20px");
{offsetLeft: 0, offsetWidth: 60, offsetTop: 20, offsetHeight: 20}, TestingUtils.testGridTemplateColumnsRows("gridAutoFlowColumnItemsPositions", "60px 70px", "60px", ["60px 70px 0px 0px 100px", "60px 70px repeat(2, 0px) 100px"], ["60px 0px 0px 20px", "60px repeat(2, 0px) 20px"]);
{offsetLeft: 60, offsetWidth: 50, offsetTop: 0, offsetHeight: 20}, TestingUtils.testGridTemplateColumnsRows("gridAutoFlowColumnItemsPositions", "60px 70px", "60px 70px", ["60px 70px 0px 0px 100px", "60px 70px repeat(2, 0px) 100px"], "60px 70px 0px 20px");
]);
testGrid("gridAutoFlowColumnItemsPositions", "60px 70px", "", "60px 70px", "none", [
{offsetLeft: 130, offsetWidth: 100, offsetTop: 0, offsetHeight: 20},
{offsetLeft: 0, offsetWidth: 60, offsetTop: 20, offsetHeight: 20},
{offsetLeft: 60, offsetWidth: 70, offsetTop: 0, offsetHeight: 20},
]);
testGrid("gridAutoFlowColumnItemsPositions", "", "60px", "none", "60px", [
{offsetLeft: 160, offsetWidth: 100, offsetTop: 0, offsetHeight: 60},
{offsetLeft: 0, offsetWidth: 110, offsetTop: 60, offsetHeight: 10},
{offsetLeft: 110, offsetWidth: 50, offsetTop: 0, offsetHeight: 60},
]);
testGrid("gridAutoFlowColumnItemsPositions", "", "60px 70px", "none", "60px 70px", [
{offsetLeft: 160, offsetWidth: 100, offsetTop: 0, offsetHeight: 60},
{offsetLeft: 0, offsetWidth: 110, offsetTop: 130, offsetHeight: 10},
{offsetLeft: 110, offsetWidth: 50, offsetTop: 0, offsetHeight: 60},
]);
testGrid("gridAutoFlowColumnItemsPositions", "60px", "60px", "60px", "60px", [
{offsetLeft: 110, offsetWidth: 100, offsetTop: 0, offsetHeight: 60},
{offsetLeft: 0, offsetWidth: 60, offsetTop: 60, offsetHeight: 20},
{offsetLeft: 60, offsetWidth: 50, offsetTop: 0, offsetHeight: 60},
]);
testGrid("gridAutoFlowColumnItemsPositions", "60px", "60px 70px", "60px", "60px 70px", [
{offsetLeft: 110, offsetWidth: 100, offsetTop: 0, offsetHeight: 60},
{offsetLeft: 0, offsetWidth: 60, offsetTop: 130, offsetHeight: 20},
{offsetLeft: 60, offsetWidth: 50, offsetTop: 0, offsetHeight: 60},
]);
testGrid("gridAutoFlowColumnItemsPositions", "60px 70px", "60px", "60px 70px", "60px", [
{offsetLeft: 130, offsetWidth: 100, offsetTop: 0, offsetHeight: 60},
{offsetLeft: 0, offsetWidth: 60, offsetTop: 60, offsetHeight: 20},
{offsetLeft: 60, offsetWidth: 70, offsetTop: 0, offsetHeight: 60},
]);
testGrid("gridAutoFlowColumnItemsPositions", "60px 70px", "60px 70px", "60px 70px", "60px 70px", [
{offsetLeft: 130, offsetWidth: 100, offsetTop: 0, offsetHeight: 60},
{offsetLeft: 0, offsetWidth: 60, offsetTop: 130, offsetHeight: 20},
{offsetLeft: 60, offsetWidth: 70, offsetTop: 0, offsetHeight: 60},
]);
done(); done();
}); });
</script> </script>

View file

@ -0,0 +1,277 @@
<!DOCTYPE html>
<meta charset="utf-8">
<title>CSS Grid Layout Test: 'grid-template-columns' and 'grid-template-rows' properties resolved values for implicit tracks</title>
<link rel="author" title="Manuel Rego Casasnovas" href="mailto:rego@igalia.com">
<link rel="help" href="http://www.w3.org/TR/css-grid-1/#resolved-track-list" title="5.1.5. Resolved Values">
<link rel="help" href="https://github.com/w3c/csswg-drafts/issues/4475">
<meta name="flags" content="ahem dom">
<meta name="assert" content="This test checks that resolved values for 'grid-template-columns' and 'grid-template-rows' don't include implicitly created tracks.">
<script src="/resources/testharness.js"></script>
<script src="/resources/testharnessreport.js"></script>
<script src="support/testing-utils.js"></script>
<link rel="stylesheet" type="text/css" href="/fonts/ahem.css" />
<style>
.grid {
display: grid;
width: 800px;
height: 600px;
font: 10px/1 Ahem;
justify-content: start;
align-content: start;
position: relative;
}
.fifthColumn {
grid-column: 5;
}
.fourthRow {
grid-row: 4;
}
.gridAutoFlowColumn {
grid-auto-flow: column;
}
</style>
<div id="log"></div>
<div id="grid" class="grid">
<div>FIRST ITEM</div>
<div>SECOND ITEM</div>
<div>THIRD<br />ITEM</div>
</div>
<div id="gridItemsPositions" class="grid">
<div class="fifthColumn">FIRST ITEM</div>
<div class="fourthRow">SECOND ITEM</div>
<div>THIRD<br />ITEM</div>
</div>
<div id="gridAutoFlowColumn" class="grid gridAutoFlowColumn">
<div>FIRST ITEM</div>
<div>SECOND ITEM</div>
<div>THIRD<br />ITEM</div>
</div>
<div id="gridAutoFlowColumnItemsPositions" class="grid gridAutoFlowColumn">
<div class="fifthColumn">FIRST ITEM</div>
<div class="fourthRow">SECOND ITEM</div>
<div>THIRD<br />ITEM</div>
</div>
<script>
function testSizeAndPositionOfItems(gridId, expectedItemData) {
let grid = document.getElementById(gridId);
assert_equals(grid.childElementCount, expectedItemData.length, "childElementCount");
let props = ["offsetWidth", "offsetTop", "offsetHeight"];
for (let i = 0; i < expectedItemData.length; ++i)
for (let prop of props)
assert_equals(grid.children[i][prop], expectedItemData[i][prop], "children[" + i + "]." + prop);
}
function testGrid(gridId, columnsStyle, rowsStyle, columnsComputedValue, rowsComputedValue, expectedItemData) {
TestingUtils.testGridTemplateColumnsRows(gridId, columnsStyle, rowsStyle, columnsComputedValue, rowsComputedValue);
test(function() {
testSizeAndPositionOfItems(gridId, expectedItemData);
}, "Children of '" + gridId + "' with: grid-template-columns: " + columnsStyle + "; and grid-template-rows: " + rowsStyle + ";");
}
setup({explicit_done: true});
document.fonts.ready.then(()=> {
// Valid values.
testGrid("grid", "", "", "none", "none", [
{offsetLeft: 0, offsetWidth: 110, offsetTop: 0, offsetHeight: 10},
{offsetLeft: 0, offsetWidth: 110, offsetTop: 10, offsetHeight: 10},
{offsetLeft: 0, offsetWidth: 110, offsetTop: 20, offsetHeight: 20},
]);
testGrid("grid", "auto auto", "", "100px 110px", "none", [
{offsetLeft: 0, offsetWidth: 100, offsetTop: 0, offsetHeight: 10},
{offsetLeft: 100, offsetWidth: 110, offsetTop: 0, offsetHeight: 10},
{offsetLeft: 0, offsetWidth: 100, offsetTop: 10, offsetHeight: 20},
]);
testGrid("grid", "60px", "", "60px", "none", [
{offsetLeft: 0, offsetWidth: 60, offsetTop: 0, offsetHeight: 20},
{offsetLeft: 0, offsetWidth: 60, offsetTop: 20, offsetHeight: 20},
{offsetLeft: 0, offsetWidth: 60, offsetTop: 40, offsetHeight: 20},
]);
testGrid("grid", "100px 60px", "", "100px 60px", "none", [
{offsetLeft: 0, offsetWidth: 100, offsetTop: 0, offsetHeight: 20},
{offsetLeft: 100, offsetWidth: 60, offsetTop: 0, offsetHeight: 20},
{offsetLeft: 0, offsetWidth: 100, offsetTop: 20, offsetHeight: 20},
]);
testGrid("grid", "", "50px", "none", "50px", [
{offsetLeft: 0, offsetWidth: 110, offsetTop: 0, offsetHeight: 50},
{offsetLeft: 0, offsetWidth: 110, offsetTop: 50, offsetHeight: 10},
{offsetLeft: 0, offsetWidth: 110, offsetTop: 60, offsetHeight: 20},
]);
testGrid("grid", "", "50px 30px", "none", "50px 30px", [
{offsetLeft: 0, offsetWidth: 110, offsetTop: 0, offsetHeight: 50},
{offsetLeft: 0, offsetWidth: 110, offsetTop: 50, offsetHeight: 30},
{offsetLeft: 0, offsetWidth: 110, offsetTop: 80, offsetHeight: 20},
]);
testGrid("grid", "60px", "50px", "60px", "50px", [
{offsetLeft: 0, offsetWidth: 60, offsetTop: 0, offsetHeight: 50},
{offsetLeft: 0, offsetWidth: 60, offsetTop: 50, offsetHeight: 20},
{offsetLeft: 0, offsetWidth: 60, offsetTop: 70, offsetHeight: 20},
]);
testGrid("grid", "60px", "50px 30px", "60px", "50px 30px", [
{offsetLeft: 0, offsetWidth: 60, offsetTop: 0, offsetHeight: 50},
{offsetLeft: 0, offsetWidth: 60, offsetTop: 50, offsetHeight: 30},
{offsetLeft: 0, offsetWidth: 60, offsetTop: 80, offsetHeight: 20},
]);
testGrid("grid", "100px 60px", "50px", "100px 60px", "50px", [
{offsetLeft: 0, offsetWidth: 100, offsetTop: 0, offsetHeight: 50},
{offsetLeft: 100, offsetWidth: 60, offsetTop: 0, offsetHeight: 50},
{offsetLeft: 0, offsetWidth: 100, offsetTop: 50, offsetHeight: 20},
]);
testGrid("grid", "100px 60px", "50px 30px", "100px 60px", "50px 30px", [
{offsetLeft: 0, offsetWidth: 100, offsetTop: 0, offsetHeight: 50},
{offsetLeft: 100, offsetWidth: 60, offsetTop: 0, offsetHeight: 50},
{offsetLeft: 0, offsetWidth: 100, offsetTop: 50, offsetHeight: 30},
]);
testGrid("gridItemsPositions", "", "", "none", "none", [
{offsetLeft: 110, offsetWidth: 100, offsetTop: 0, offsetHeight: 10},
{offsetLeft: 0, offsetWidth: 110, offsetTop: 30, offsetHeight: 10},
{offsetLeft: 0, offsetWidth: 110, offsetTop: 10, offsetHeight: 20},
]);
testGrid("gridItemsPositions", "60px", "", "60px", "none", [
{offsetLeft: 60, offsetWidth: 100, offsetTop: 0, offsetHeight: 10},
{offsetLeft: 0, offsetWidth: 60, offsetTop: 30, offsetHeight: 20},
{offsetLeft: 0, offsetWidth: 60, offsetTop: 10, offsetHeight: 20},
]);
testGrid("gridItemsPositions", "60px 50px", "", "60px 50px", "none", [
{offsetLeft: 110, offsetWidth: 100, offsetTop: 0, offsetHeight: 10},
{offsetLeft: 0, offsetWidth: 60, offsetTop: 30, offsetHeight: 20},
{offsetLeft: 0, offsetWidth: 60, offsetTop: 10, offsetHeight: 20},
]);
testGrid("gridItemsPositions", "", "60px", "none", "60px", [
{offsetLeft: 110, offsetWidth: 100, offsetTop: 0, offsetHeight: 60},
{offsetLeft: 0, offsetWidth: 110, offsetTop: 80, offsetHeight: 10},
{offsetLeft: 0, offsetWidth: 110, offsetTop: 60, offsetHeight: 20},
]);
testGrid("gridItemsPositions", "", "60px 50px", "none", "60px 50px", [
{offsetLeft: 110, offsetWidth: 100, offsetTop: 0, offsetHeight: 60},
{offsetLeft: 0, offsetWidth: 110, offsetTop: 110, offsetHeight: 10},
{offsetLeft: 0, offsetWidth: 110, offsetTop: 60, offsetHeight: 50},
]);
testGrid("gridItemsPositions", "60px", "60px", "60px", "60px", [
{offsetLeft: 60, offsetWidth: 100, offsetTop: 0, offsetHeight: 60},
{offsetLeft: 0, offsetWidth: 60, offsetTop: 80, offsetHeight: 20},
{offsetLeft: 0, offsetWidth: 60, offsetTop: 60, offsetHeight: 20},
]);
testGrid("gridItemsPositions", "60px", "60px 50px", "60px", "60px 50px", [
{offsetLeft: 60, offsetWidth: 100, offsetTop: 0, offsetHeight: 60},
{offsetLeft: 0, offsetWidth: 60, offsetTop: 110, offsetHeight: 20},
{offsetLeft: 0, offsetWidth: 60, offsetTop: 60, offsetHeight: 50},
]);
testGrid("gridItemsPositions", "60px 50px", "60px", "60px 50px", "60px", [
{offsetLeft: 110, offsetWidth: 100, offsetTop: 0, offsetHeight: 60},
{offsetLeft: 0, offsetWidth: 60, offsetTop: 80, offsetHeight: 20},
{offsetLeft: 0, offsetWidth: 60, offsetTop: 60, offsetHeight: 20},
]);
testGrid("gridItemsPositions", "60px 50px", "60px 50px", "60px 50px", "60px 50px", [
{offsetLeft: 110, offsetWidth: 100, offsetTop: 0, offsetHeight: 60},
{offsetLeft: 0, offsetWidth: 60, offsetTop: 110, offsetHeight: 20},
{offsetLeft: 0, offsetWidth: 60, offsetTop: 60, offsetHeight: 50},
]);
testGrid("gridAutoFlowColumn", "", "", "none", "none", [
{offsetLeft: 0, offsetWidth: 100, offsetTop: 0, offsetHeight: 20},
{offsetLeft: 100, offsetWidth: 110, offsetTop: 0, offsetHeight: 20},
{offsetLeft: 210, offsetWidth: 50, offsetTop: 0, offsetHeight: 20},
]);
testGrid("gridAutoFlowColumn", "", "auto auto", "none", "20px 10px", [
{offsetLeft: 0, offsetWidth: 110, offsetTop: 0, offsetHeight: 20},
{offsetLeft: 0, offsetWidth: 110, offsetTop: 20, offsetHeight: 10},
{offsetLeft: 110, offsetWidth: 50, offsetTop: 0, offsetHeight: 20},
]);
testGrid("gridAutoFlowColumn", "60px", "", "60px", "none", [
{offsetLeft: 0, offsetWidth: 60, offsetTop: 0, offsetHeight: 20},
{offsetLeft: 60, offsetWidth: 110, offsetTop: 0, offsetHeight: 20},
{offsetLeft: 170, offsetWidth: 50, offsetTop: 0, offsetHeight: 20},
]);
testGrid("gridAutoFlowColumn", "100px 60px", "", "100px 60px", "none", [
{offsetLeft: 0, offsetWidth: 100, offsetTop: 0, offsetHeight: 20},
{offsetLeft: 100, offsetWidth: 60, offsetTop: 0, offsetHeight: 20},
{offsetLeft: 160, offsetWidth: 50, offsetTop: 0, offsetHeight: 20},
]);
testGrid("gridAutoFlowColumn", "", "50px", "none", "50px", [
{offsetLeft: 0, offsetWidth: 100, offsetTop: 0, offsetHeight: 50},
{offsetLeft: 100, offsetWidth: 110, offsetTop: 0, offsetHeight: 50},
{offsetLeft: 210, offsetWidth: 50, offsetTop: 0, offsetHeight: 50},
]);
testGrid("gridAutoFlowColumn", "", "50px 30px", "none", "50px 30px", [
{offsetLeft: 0, offsetWidth: 110, offsetTop: 0, offsetHeight: 50},
{offsetLeft: 0, offsetWidth: 110, offsetTop: 50, offsetHeight: 30},
{offsetLeft: 110, offsetWidth: 50, offsetTop: 0, offsetHeight: 50},
]);
testGrid("gridAutoFlowColumn", "60px", "50px", "60px", "50px", [
{offsetLeft: 0, offsetWidth: 60, offsetTop: 0, offsetHeight: 50},
{offsetLeft: 60, offsetWidth: 110, offsetTop: 0, offsetHeight: 50},
{offsetLeft: 170, offsetWidth: 50, offsetTop: 0, offsetHeight: 50},
]);
testGrid("gridAutoFlowColumn", "60px", "50px 30px", "60px", "50px 30px", [
{offsetLeft: 0, offsetWidth: 60, offsetTop: 0, offsetHeight: 50},
{offsetLeft: 0, offsetWidth: 60, offsetTop: 50, offsetHeight: 30},
{offsetLeft: 60, offsetWidth: 50, offsetTop: 0, offsetHeight: 50},
]);
testGrid("gridAutoFlowColumn", "100px 60px", "50px", "100px 60px", "50px", [
{offsetLeft: 0, offsetWidth: 100, offsetTop: 0, offsetHeight: 50},
{offsetLeft: 100, offsetWidth: 60, offsetTop: 0, offsetHeight: 50},
{offsetLeft: 160, offsetWidth: 50, offsetTop: 0, offsetHeight: 50},
]);
testGrid("gridAutoFlowColumn", "100px 60px", "50px 30px", "100px 60px", "50px 30px", [
{offsetLeft: 0, offsetWidth: 100, offsetTop: 0, offsetHeight: 50},
{offsetLeft: 0, offsetWidth: 100, offsetTop: 50, offsetHeight: 30},
{offsetLeft: 100, offsetWidth: 60, offsetTop: 0, offsetHeight: 50},
]);
testGrid("gridAutoFlowColumnItemsPositions", "", "", "none", "none", [
{offsetLeft: 160, offsetWidth: 100, offsetTop: 0, offsetHeight: 20},
{offsetLeft: 0, offsetWidth: 110, offsetTop: 20, offsetHeight: 10},
{offsetLeft: 110, offsetWidth: 50, offsetTop: 0, offsetHeight: 20},
]);
testGrid("gridAutoFlowColumnItemsPositions", "60px", "", "60px", "none", [
{offsetLeft: 110, offsetWidth: 100, offsetTop: 0, offsetHeight: 20},
{offsetLeft: 0, offsetWidth: 60, offsetTop: 20, offsetHeight: 20},
{offsetLeft: 60, offsetWidth: 50, offsetTop: 0, offsetHeight: 20},
]);
testGrid("gridAutoFlowColumnItemsPositions", "60px 70px", "", "60px 70px", "none", [
{offsetLeft: 130, offsetWidth: 100, offsetTop: 0, offsetHeight: 20},
{offsetLeft: 0, offsetWidth: 60, offsetTop: 20, offsetHeight: 20},
{offsetLeft: 60, offsetWidth: 70, offsetTop: 0, offsetHeight: 20},
]);
testGrid("gridAutoFlowColumnItemsPositions", "", "60px", "none", "60px", [
{offsetLeft: 160, offsetWidth: 100, offsetTop: 0, offsetHeight: 60},
{offsetLeft: 0, offsetWidth: 110, offsetTop: 60, offsetHeight: 10},
{offsetLeft: 110, offsetWidth: 50, offsetTop: 0, offsetHeight: 60},
]);
testGrid("gridAutoFlowColumnItemsPositions", "", "60px 70px", "none", "60px 70px", [
{offsetLeft: 160, offsetWidth: 100, offsetTop: 0, offsetHeight: 60},
{offsetLeft: 0, offsetWidth: 110, offsetTop: 130, offsetHeight: 10},
{offsetLeft: 110, offsetWidth: 50, offsetTop: 0, offsetHeight: 60},
]);
testGrid("gridAutoFlowColumnItemsPositions", "60px", "60px", "60px", "60px", [
{offsetLeft: 110, offsetWidth: 100, offsetTop: 0, offsetHeight: 60},
{offsetLeft: 0, offsetWidth: 60, offsetTop: 60, offsetHeight: 20},
{offsetLeft: 60, offsetWidth: 50, offsetTop: 0, offsetHeight: 60},
]);
testGrid("gridAutoFlowColumnItemsPositions", "60px", "60px 70px", "60px", "60px 70px", [
{offsetLeft: 110, offsetWidth: 100, offsetTop: 0, offsetHeight: 60},
{offsetLeft: 0, offsetWidth: 60, offsetTop: 130, offsetHeight: 20},
{offsetLeft: 60, offsetWidth: 50, offsetTop: 0, offsetHeight: 60},
]);
testGrid("gridAutoFlowColumnItemsPositions", "60px 70px", "60px", "60px 70px", "60px", [
{offsetLeft: 130, offsetWidth: 100, offsetTop: 0, offsetHeight: 60},
{offsetLeft: 0, offsetWidth: 60, offsetTop: 60, offsetHeight: 20},
{offsetLeft: 60, offsetWidth: 70, offsetTop: 0, offsetHeight: 60},
]);
testGrid("gridAutoFlowColumnItemsPositions", "60px 70px", "60px 70px", "60px 70px", "60px 70px", [
{offsetLeft: 130, offsetWidth: 100, offsetTop: 0, offsetHeight: 60},
{offsetLeft: 0, offsetWidth: 60, offsetTop: 130, offsetHeight: 20},
{offsetLeft: 60, offsetWidth: 70, offsetTop: 0, offsetHeight: 60},
]);
done();
});
</script>

View file

@ -0,0 +1,365 @@
<!DOCTYPE html>
<meta charset="utf-8">
<title>CSS Grid Layout Test: Mininum height of grid items orthogonal</title>
<link rel="author" title="Oriol Brufau" href="mailto:obrufau@igalia.com">
<link rel="help" href="https://drafts.csswg.org/css-grid-1/#grid-items">
<meta name="assert" content="Checks that orthogonal grid items minimum height take into account borders, padding and margins for grid containers with definite height.">
<link rel="stylesheet" href="/css/support/grid.css">
<style>
.grid {
display: inline-grid;
height: 100px;
border: solid thick;
grid: minmax(auto, 0px) / 10px 10px;
}
.grid > div:nth-child(1) { background: cyan; writing-mode: vertical-lr; }
.grid > div:nth-child(2) { background: magenta; }
.height60 { height: 60px; }
.minHeight60 { min-height: 60px; }
.marginTop5 { margin-top: 5px; }
.marginBottom10 { margin-bottom: 10px; }
.marginLeftAuto { margin-left: auto }
.paddingTop6 { padding-top: 6px; }
.paddingBottom3 { padding-bottom: 3px; }
.borderTop2, .borderBottom4 { border: solid yellow 0px; }
.borderTop2 { border-top-width: 2px; }
.borderBottom4 { border-bottom-width: 4px; }
</style>
<script src="/resources/testharness.js"></script>
<script src="/resources/testharnessreport.js"></script>
<script src="/resources/check-layout-th.js"></script>
<body onload="checkLayout('.grid')">
<div id="log"></div>
<h3>Direction LTR</h3>
<pre>Item height: 60px;</pre>
<div class="grid">
<div class="height60" data-expected-height="60"></div>
<div data-expected-height="60"></div>
</div>
<pre>Item min-height: 60px;</pre>
<div class="grid">
<div class="minHeight60" data-expected-height="60"></div>
<div data-expected-height="60"></div>
</div>
<pre>Item height: 60px; &amp; margin-left: 5px;</pre>
<div class="grid">
<div class="height60 marginTop5" data-expected-height="60"></div>
<div data-expected-height="65"></div>
</div>
<pre>Item min-height: 60px; &amp; margin-left: 5px;</pre>
<div class="grid">
<div class="minHeight60 marginTop5" data-expected-height="60"></div>
<div data-expected-height="65"></div>
</div>
<pre>Item min-height: 60px; &amp; margin-top: 5px; &amp; margin-left: auto</pre>
<div class="grid">
<div class="minHeight60 marginTop5 marginLeftAuto" data-expected-height="60"></div>
<div data-expected-height="65"></div>
</div>
<pre>Item height: 60px; &amp; margin-right: 10px;</pre>
<div class="grid">
<div class="height60 marginBottom10" data-expected-height="60"></div>
<div data-expected-height="70"></div>
</div>
<pre>Item min-height: 60px; &amp; margin-right: 10px;</pre>
<div class="grid">
<div class="minHeight60 marginBottom10" data-expected-height="60"></div>
<div data-expected-height="70"></div>
</div>
<pre>Item height: 60px; &amp; margin-left: 5px; &amp; margin-right: 10px;</pre>
<div class="grid">
<div class="height60 marginTop5 marginBottom10" data-expected-height="60"></div>
<div data-expected-height="75"></div>
</div>
<pre>Item min-height: 60px; &amp; margin-left: 5px; &amp; margin-right: 10px;</pre>
<div class="grid">
<div class="minHeight60 marginTop5 marginBottom10" data-expected-height="60"></div>
<div data-expected-height="75"></div>
</div>
<pre>Item height: 60px; &amp; padding-left: 6px;</pre>
<div class="grid">
<div class="height60 paddingTop6" data-expected-height="66"></div>
<div data-expected-height="66"></div>
</div>
<pre>Item min-height: 60px; &amp; padding-left: 6px;</pre>
<div class="grid">
<div class="minHeight60 paddingTop6" data-expected-height="66"></div>
<div data-expected-height="66"></div>
</div>
<pre>Item height: 60px; &amp; padding-right: 3px;</pre>
<div class="grid">
<div class="height60 paddingBottom3" data-expected-height="63"></div>
<div data-expected-height="63"></div>
</div>
<pre>Item min-height: 60px; &amp; padding-right: 3px;</pre>
<div class="grid">
<div class="minHeight60 paddingBottom3" data-expected-height="63"></div>
<div data-expected-height="63"></div>
</div>
<pre>Item height: 60px; &amp; padding-left: 6px; &amp; padding-right: 3px;</pre>
<div class="grid">
<div class="height60 paddingTop6 paddingBottom3" data-expected-height="69"></div>
<div data-expected-height="69"></div>
</div>
<pre>Item min-height: 60px; &amp; padding-left: 6px; &amp; padding-right: 3px;</pre>
<div class="grid">
<div class="minHeight60 paddingTop6 paddingBottom3" data-expected-height="69"></div>
<div data-expected-height="69"></div>
</div>
<pre>Item height: 60px; &amp; border-left-width: 2px;</pre>
<div class="grid">
<div class="height60 borderTop2" data-expected-height="62"></div>
<div data-expected-height="62"></div>
</div>
<pre>Item min-height: 60px; &amp; border-left-width: 2px;</pre>
<div class="grid">
<div class="minHeight60 borderTop2" data-expected-height="62"></div>
<div data-expected-height="62"></div>
</div>
<pre>Item height: 60px; &amp; border-right-width: 4px;</pre>
<div class="grid">
<div class="height60 borderBottom4" data-expected-height="64"></div>
<div data-expected-height="64"></div>
</div>
<pre>Item min-height: 60px; &amp; border-right-width: 4px;</pre>
<div class="grid">
<div class="minHeight60 borderBottom4" data-expected-height="64"></div>
<div data-expected-height="64"></div>
</div>
<pre>Item height: 60px; &amp; border-left-width: 2px; &amp; border-right-width: 4px;</pre>
<div class="grid">
<div class="height60 borderTop2 borderBottom4" data-expected-height="66"></div>
<div data-expected-height="66"></div>
</div>
<pre>Item min-height: 60px; &amp; border-left-width: 2px; &amp; border-right-width: 4px;</pre>
<div class="grid">
<div class="minHeight60 borderTop2 borderBottom4" data-expected-height="66"></div>
<div data-expected-height="66"></div>
</div>
<pre>Item height: 60px; &amp; margin-left: 5px; &amp; margin-right: 10px; &amp; padding-left: 6px; &amp; padding-right: 3px; &amp; border-left-width: 2px; &amp; border-right-width: 4px;</pre>
<div class="grid">
<div class="height60 marginTop5 marginBottom10 paddingTop6 paddingBottom3 borderTop2 borderBottom4" data-expected-height="75"></div>
<div data-expected-height="90"></div>
</div>
<pre>Item min-height: 60px; &amp; margin-left: 5px; &amp; margin-right: 10px; &amp; padding-left: 6px; &amp; padding-right: 3px; &amp; border-left-width: 2px; &amp; border-right-width: 4px;</pre>
<div class="grid">
<div class="minHeight60 marginTop5 marginBottom10 paddingTop6 paddingBottom3 borderTop2 borderBottom4" data-expected-height="75"></div>
<div data-expected-height="90"></div>
</div>
<h3>Direction RTL</h3>
<pre>Item height: 60px;</pre>
<div class="grid directionRTL">
<div class="height60" data-expected-height="60"></div>
<div data-expected-height="60"></div>
</div>
<pre>Item min-height: 60px;</pre>
<div class="grid directionRTL">
<div class="minHeight60" data-expected-height="60"></div>
<div data-expected-height="60"></div>
</div>
<pre>Item height: 60px; &amp; margin-left: 5px;</pre>
<div class="grid directionRTL">
<div class="height60 marginTop5" data-expected-height="60"></div>
<div data-expected-height="65"></div>
</div>
<pre>Item min-height: 60px; &amp; margin-left: 5px;</pre>
<div class="grid directionRTL">
<div class="minHeight60 marginTop5" data-expected-height="60"></div>
<div data-expected-height="65"></div>
</div>
<pre>Item min-height: 60px; &amp; margin-top: 5px; &amp; margin-left: auto</pre>
<div class="grid directionRTL">
<div class="minHeight60 marginTop5 marginLeftAuto" data-expected-height="60"></div>
<div data-expected-height="65"></div>
</div>
<pre>Item height: 60px; &amp; margin-right: 10px;</pre>
<div class="grid directionRTL">
<div class="height60 marginBottom10" data-expected-height="60"></div>
<div data-expected-height="70"></div>
</div>
<pre>Item min-height: 60px; &amp; margin-right: 10px;</pre>
<div class="grid directionRTL">
<div class="minHeight60 marginBottom10" data-expected-height="60"></div>
<div data-expected-height="70"></div>
</div>
<pre>Item height: 60px; &amp; margin-left: 5px; &amp; margin-right: 10px;</pre>
<div class="grid directionRTL">
<div class="height60 marginTop5 marginBottom10" data-expected-height="60"></div>
<div data-expected-height="75"></div>
</div>
<pre>Item min-height: 60px; &amp; margin-left: 5px; &amp; margin-right: 10px;</pre>
<div class="grid directionRTL">
<div class="minHeight60 marginTop5 marginBottom10" data-expected-height="60"></div>
<div data-expected-height="75"></div>
</div>
<pre>Item height: 60px; &amp; padding-left: 6px;</pre>
<div class="grid directionRTL">
<div class="height60 paddingTop6" data-expected-height="66"></div>
<div data-expected-height="66"></div>
</div>
<pre>Item min-height: 60px; &amp; padding-left: 6px;</pre>
<div class="grid directionRTL">
<div class="minHeight60 paddingTop6" data-expected-height="66"></div>
<div data-expected-height="66"></div>
</div>
<pre>Item height: 60px; &amp; padding-right: 3px;</pre>
<div class="grid directionRTL">
<div class="height60 paddingBottom3" data-expected-height="63"></div>
<div data-expected-height="63"></div>
</div>
<pre>Item min-height: 60px; &amp; padding-right: 3px;</pre>
<div class="grid directionRTL">
<div class="minHeight60 paddingBottom3" data-expected-height="63"></div>
<div data-expected-height="63"></div>
</div>
<pre>Item height: 60px; &amp; padding-left: 6px; &amp; padding-right: 3px;</pre>
<div class="grid directionRTL">
<div class="height60 paddingTop6 paddingBottom3" data-expected-height="69"></div>
<div data-expected-height="69"></div>
</div>
<pre>Item min-height: 60px; &amp; padding-left: 6px; &amp; padding-right: 3px;</pre>
<div class="grid directionRTL">
<div class="minHeight60 paddingTop6 paddingBottom3" data-expected-height="69"></div>
<div data-expected-height="69"></div>
</div>
<pre>Item height: 60px; &amp; border-left-width: 2px;</pre>
<div class="grid directionRTL">
<div class="height60 borderTop2" data-expected-height="62"></div>
<div data-expected-height="62"></div>
</div>
<pre>Item min-height: 60px; &amp; border-left-width: 2px;</pre>
<div class="grid directionRTL">
<div class="minHeight60 borderTop2" data-expected-height="62"></div>
<div data-expected-height="62"></div>
</div>
<pre>Item height: 60px; &amp; border-right-width: 4px;</pre>
<div class="grid directionRTL">
<div class="height60 borderBottom4" data-expected-height="64"></div>
<div data-expected-height="64"></div>
</div>
<pre>Item min-height: 60px; &amp; border-right-width: 4px;</pre>
<div class="grid directionRTL">
<div class="minHeight60 borderBottom4" data-expected-height="64"></div>
<div data-expected-height="64"></div>
</div>
<pre>Item height: 60px; &amp; border-left-width: 2px; &amp; border-right-width: 4px;</pre>
<div class="grid directionRTL">
<div class="height60 borderTop2 borderBottom4" data-expected-height="66"></div>
<div data-expected-height="66"></div>
</div>
<pre>Item min-height: 60px; &amp; border-left-width: 2px; &amp; border-right-width: 4px;</pre>
<div class="grid directionRTL">
<div class="minHeight60 borderTop2 borderBottom4" data-expected-height="66"></div>
<div data-expected-height="66"></div>
</div>
<pre>Item height: 60px; &amp; margin-left: 5px; &amp; margin-right: 10px; &amp; padding-left: 6px; &amp; padding-right: 3px; &amp; border-left-width: 2px; &amp; border-right-width: 4px;</pre>
<div class="grid directionRTL">
<div class="height60 marginTop5 marginBottom10 paddingTop6 paddingBottom3 borderTop2 borderBottom4" data-expected-height="75"></div>
<div data-expected-height="90"></div>
</div>
<pre>Item min-height: 60px; &amp; margin-left: 5px; &amp; margin-right: 10px; &amp; padding-left: 6px; &amp; padding-right: 3px; &amp; border-left-width: 2px; &amp; border-right-width: 4px;</pre>
<div class="grid directionRTL">
<div class="minHeight60 marginTop5 marginBottom10 paddingTop6 paddingBottom3 borderTop2 borderBottom4" data-expected-height="75"></div>
<div data-expected-height="90"></div>
</div>

View file

@ -20,6 +20,7 @@
.marginLeft5 { margin-left: 5px; } .marginLeft5 { margin-left: 5px; }
.marginRight10 { margin-right: 10px; } .marginRight10 { margin-right: 10px; }
.marginTopAuto { margin-top: auto }
.paddingLeft6 { padding-left: 6px; } .paddingLeft6 { padding-left: 6px; }
.paddingRight3 { padding-right: 3px; } .paddingRight3 { padding-right: 3px; }
@ -66,6 +67,13 @@
<div data-expected-width="65"></div> <div data-expected-width="65"></div>
</div> </div>
<pre>Item min-width: 60px; &amp; margin-left: 5px; &amp; margin-top: auto</pre>
<div class="grid">
<div class="minWidth60 marginLeft5 marginTopAuto" data-expected-width="60"></div>
<div data-expected-width="65"></div>
</div>
<pre>Item width: 60px; &amp; margin-right: 10px;</pre> <pre>Item width: 60px; &amp; margin-right: 10px;</pre>
<div class="grid"> <div class="grid">
@ -222,6 +230,13 @@
<div data-expected-width="65"></div> <div data-expected-width="65"></div>
</div> </div>
<pre>Item min-width: 60px; &amp; margin-left: 5px; &amp; margin-top: auto</pre>
<div class="grid directionRTL">
<div class="minWidth60 marginLeft5 marginTopAuto" data-expected-width="60"></div>
<div data-expected-width="65"></div>
</div>
<pre>Item width: 60px; &amp; margin-right: 10px;</pre> <pre>Item width: 60px; &amp; margin-right: 10px;</pre>
<div class="grid directionRTL"> <div class="grid directionRTL">

View file

@ -79,8 +79,8 @@
}({ }({
'grid-template-columns': { // named 'grid-definition-columns' in last draft 'grid-template-columns': { // named 'grid-definition-columns' in last draft
initial: 'none', initial: '150px',
'none': ['none', 'none'], 'none': ['none', '150px'],
'<line-names>': ['[a] auto [b] auto [c]', '[a] 150px [b] 100px [c]'], '<line-names>': ['[a] auto [b] auto [c]', '[a] 150px [b] 100px [c]'],
'<track-size>.auto': ['auto', '150px'], '<track-size>.auto': ['auto', '150px'],
'<track-size>.<track-breadth>.<length>': ['100px', '100px'], '<track-size>.<track-breadth>.<length>': ['100px', '100px'],
@ -89,20 +89,20 @@
'<track-size>.<track-breadth>.min-content': ['min-content', '100px'], '<track-size>.<track-breadth>.min-content': ['min-content', '100px'],
'<track-size>.<track-breadth>.max-content': ['max-content', '150px'], '<track-size>.<track-breadth>.max-content': ['max-content', '150px'],
'<track-size>.<track-breadth>.minmax()': ['minmax(100px, 200px)', '200px'], '<track-size>.<track-breadth>.minmax()': ['minmax(100px, 200px)', '200px'],
'reset': ['none', 'none'], 'reset': ['none', '150px'],
}, },
'grid-template-rows': { // named 'grid-definition-rows' in last draft 'grid-template-rows': { // named 'grid-definition-rows' in last draft
initial: 'none', initial: '50px 50px 50px',
'none': ['none', 'none'], 'none': ['none', '50px 50px 50px'],
'<line-names>': ['[a] auto [b] auto [c]', '[a] 50px [b] 50px [c]'], '<line-names>': ['[a] auto [b] auto [c]', '[a] 50px [b] 50px [c] 50px'],
'<track-size>.auto': ['auto', '50px'], '<track-size>.auto': ['auto', '50px 50px 50px'],
'<track-size>.<track-breadth>.<length>': ['100px', '100px'], '<track-size>.<track-breadth>.<length>': ['100px', '100px 50px 50px'],
'<track-size>.<track-breadth>.<percentage>': ['100%', '150px'], '<track-size>.<track-breadth>.<percentage>': ['100%', '150px 50px 50px'],
'<track-size>.<track-breadth>.<flex>': ['1fr', '50px'], '<track-size>.<track-breadth>.<flex>': ['1fr', '50px 50px 50px'],
'<track-size>.<track-breadth>.min-content': ['min-content', '50px'], '<track-size>.<track-breadth>.min-content': ['min-content', '50px 50px 50px'],
'<track-size>.<track-breadth>.max-content': ['max-content', '50px'], '<track-size>.<track-breadth>.max-content': ['max-content', '50px 50px 50px'],
'<track-size>.<track-breadth>.minmax()': ['minmax(100px, 200px)', '200px'], '<track-size>.<track-breadth>.minmax()': ['minmax(100px, 200px)', '200px 50px 50px'],
'reset': ['none', 'none'], 'reset': ['none', '50px 50px 50px'],
}, },
'grid-template-areas': { 'grid-template-areas': {
initial: 'none', initial: 'none',
@ -111,13 +111,13 @@
'reset': ['none', 'none'], 'reset': ['none', 'none'],
}, },
'grid-template': { 'grid-template': {
initial: 'none', initial: '50px 50px 50px / 150px',
'none': ['', 'none'], 'none': ['', '50px 50px 50px / 150px'],
'<grid-template-rows> / <grid-template-columns>': ['100px 100px / 200px 200px', '100px 100px / 200px 200px'], '<grid-template-rows> / <grid-template-columns>': ['100px 100px / 200px 200px', '100px 100px / 200px 200px'],
'<line-names>': ['[a] auto [b] auto [c] / [d] auto [e] auto [f]', '[a] auto [b] auto [c] / [d] auto [e] auto [f]'], '<line-names>': ['[a] auto [b] auto [c] / [d] auto [e] auto [f]', '[a] auto [b] auto [c] / [d] auto [e] auto [f]'],
'<string>+': ['"a b" "a b"', '"a b" "a b"'], '<string>+': ['"a b" "a b"', '"a b" "a b"'],
'<string><track-size>+': ['100px / "a b" 50px', '100px / "a b" 50px'], '<string><track-size>+': ['100px / "a b" 50px', '100px / "a b" 50px'],
'reset': ['', 'none'], 'reset': ['', '50px 50px 50px / 150px'],
}, },
'grid-auto-columns': { 'grid-auto-columns': {
initial: 'auto', initial: 'auto',

View file

@ -36,7 +36,7 @@
</div> </div>
</div> </div>
<script> <script>
test_computed_value("grid-template-columns", 'none', 'none'); // "none" without #child test_computed_value("grid-template-columns", 'none', '300px'); // "none" without #child
// track-size <fixed-breadth> = <length-percentage> | <flex> | min-content | max-content | auto // track-size <fixed-breadth> = <length-percentage> | <flex> | min-content | max-content | auto
test_computed_value("grid-template-columns", '20%', '60px'); // 20% * width test_computed_value("grid-template-columns", '20%', '60px'); // 20% * width

View file

@ -36,7 +36,7 @@
</div> </div>
</div> </div>
<script> <script>
test_computed_value("grid-template-rows", 'none', 'none'); // "none" without #child test_computed_value("grid-template-rows", 'none', '600px'); // "none" without #child
// track-size <fixed-breadth> = <length-percentage> | <flex> | min-content | max-content | auto // track-size <fixed-breadth> = <length-percentage> | <flex> | min-content | max-content | auto
test_computed_value("grid-template-rows", '20%', '120px'); // 20% * height test_computed_value("grid-template-rows", '20%', '120px'); // 20% * height

View file

@ -0,0 +1,18 @@
<!DOCTYPE html>
<link rel="help" href="https://crbug.com/1081872">
<link rel="match" href="../reference/ref-filled-green-100px-square.xht">
<meta name="assert" content="A positioned absolute child with center alignment should be centered based on its margin-box.">
<style>
.s100 {
width: 100px;
height: 100px;
box-sizing: border-box;
}
</style>
<p>Test passes if there is a filled green square and <strong>no red</strong>.</p>
<div class="s100" style="position: relative;">
<div class="s100" style="position: absolute; background: red; border: solid green; border-width: 30px 20px 20px 30px;"></div>
<div class="s100" style="display: flex; align-items: center; justify-content: center;">
<div style="position: absolute; width: 50px; height: 50px; margin-left: 10px; margin-top: 10px; background: green;"></div>
</div>
</div>

View file

@ -0,0 +1,18 @@
<!DOCTYPE html>
<link rel="help" href="https://crbug.com/1081872">
<link rel="match" href="../reference/ref-filled-green-100px-square.xht">
<meta name="assert" content="A positioned absolute child with center alignment should be centered based on its margin-box.">
<style>
.s100 {
width: 100px;
height: 100px;
box-sizing: border-box;
}
</style>
<p>Test passes if there is a filled green square and <strong>no red</strong>.</p>
<div class="s100" style="position: relative;">
<div class="s100" style="position: absolute; background: red; border: solid green; border-width: 20px 30px 30px 20px;"></div>
<div class="s100" style="display: flex; align-items: center; justify-content: center;">
<div style="position: absolute; width: 50px; height: 50px; margin-right: 10px; margin-bottom: 10px; background: green;"></div>
</div>
</div>

View file

@ -0,0 +1,25 @@
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8">
<title>shaping: Arabic diacritics on NBSP - reference</title>
<link rel="author" title="Jonathan Kew" href="mailto:jkew@mozilla.com">
<style type="text/css">
@font-face {
font-family: ArabicTest;
src: url('/fonts/noto/NotoNaskhArabic-regular.woff2') format('woff2');
}
.test {
font: 120px/2 ArabicTest, sans-serif;
}
</style>
</head>
<body>
<p class="instructions">Test passes if the two lines are rendered identically,
with the superscript alef (&#x627;) directly above the raised hamza (&#x621;).</p>
<!-- Order of lines is reversed from the testcase; if they render identically
they should still match perfectly. -->
<div class=test>a<span dir=rtl>&nbsp;&#x670;&#x654;</span>z</div>
<div class=test>a<span dir=rtl>&nbsp;&#x654;&#x670;</span>z</div>
</body>
</html>

View file

@ -0,0 +1,28 @@
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8">
<title>shaping: Arabic diacritics on NBSP - reference</title>
<link rel="author" title="Jonathan Kew" href="mailto:jkew@mozilla.com">
<style type="text/css">
@font-face {
font-family: ArabicTest;
src: url('/fonts/noto/NotoNaskhArabic-regular.woff2') format('woff2');
}
.test {
font: 120px/2 ArabicTest, sans-serif;
}
.test span {
padding: .1em .05em 0;
background: black;
}
</style>
</head>
<body>
<p class="instructions">Test passes if the Arabic diacritics are entirely hidden by the black boxes.</p>
<!-- Diacritics removed from the test lines, as they should have been completely obscured
by the black background anyhow. -->
<div class=test>a<span dir=rtl>&nbsp;</span>z</div>
<div class=test>a<span dir=rtl>&nbsp;</span>z</div>
</body>
</html>

View file

@ -0,0 +1,30 @@
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8">
<title>shaping: Arabic diacritics on NBSP</title>
<meta name="assert" content="Shaping must work for diacritics rendered on NBSP as base">
<link rel="author" title="Jonathan Kew" href="mailto:jkew@mozilla.com">
<link rel="help" href="https://www.unicode.org/versions/Unicode13.0.0/ch02.pdf">
<link rel="help" href="https://www.unicode.org/reports/tr53/">
<link rel="match" href="reference/shaping-arabic-diacritics-001-ref.html">
<style type="text/css">
@font-face {
font-family: ArabicTest;
src: url('/fonts/noto/NotoNaskhArabic-regular.woff2') format('woff2');
}
.test {
font: 120px/2 ArabicTest, sans-serif;
}
</style>
</head>
<body>
<p class="instructions">Test passes if the two lines are rendered identically,
with the superscript alef (&#x627;) directly above the raised hamza (&#x621;).</p>
<!-- The Arabic characters here are ARABIC HAMZA ABOVE and ARABIC LETTER
SUPERSCRIPT ALEF, and according to UTR53 should always be sorted
as <hamza,alef> for rendering regardless of underlying order. -->
<div class=test>a<span dir=rtl>&nbsp;&#x654;&#x670;</span>z</div>
<div class=test>a<span dir=rtl>&nbsp;&#x670;&#x654;</span>z</div>
</body>
</html>

View file

@ -0,0 +1,34 @@
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8">
<title>shaping: Arabic diacritics on NBSP</title>
<meta name="assert" content="Shaping must work for diacritics rendered on NBSP as base">
<link rel="author" title="Jonathan Kew" href="mailto:jkew@mozilla.com">
<link rel="help" href="https://www.unicode.org/versions/Unicode13.0.0/ch02.pdf">
<link rel="help" href="https://www.unicode.org/reports/tr53/">
<link rel="match" href="reference/shaping-arabic-diacritics-002-ref.html">
<style type="text/css">
@font-face {
font-family: ArabicTest;
src: url('/fonts/noto/NotoNaskhArabic-regular.woff2') format('woff2');
}
.test {
font: 120px/2 ArabicTest, sans-serif;
}
.test span {
padding: .1em .05em 0;
background: black;
}
</style>
</head>
<body>
<p class="instructions">Test passes if the Arabic diacritics are entirely hidden by the black boxes.</p>
<!-- The Arabic characters here are ARABIC HAMZA ABOVE and ARABIC LETTER
SUPERSCRIPT ALEF, and (using the NotoNaskhArabic font) they should both
be entirely within the (padded) width of the NBSP, if they are properly
positioned (regardless of their order). -->
<div class=test>a<span dir=rtl>&nbsp;&#x654;&#x670;</span>z</div>
<div class=test>a<span dir=rtl>&nbsp;&#x670;&#x654;</span>z</div>
</body>
</html>

View file

@ -399,7 +399,7 @@ function runGenericSensorTests(sensorName,
const mockSensor = await sensorProvider.getCreatedSensor(sensorName); const mockSensor = await sensorProvider.getCreatedSensor(sensorName);
await mockSensor.setSensorReading(readings); await mockSensor.setSensorReading(readings);
const fastCounter = await new Promise((resolve, reject) => { return new Promise((resolve, reject) => {
let fastSensorNotifiedCounter = 0; let fastSensorNotifiedCounter = 0;
let slowSensorNotifiedCounter = 0; let slowSensorNotifiedCounter = 0;
@ -413,10 +413,17 @@ function runGenericSensorTests(sensorName,
const slowSensor = new sensorType({frequency: slowFrequency}); const slowSensor = new sensorType({frequency: slowFrequency});
slowSensor.onreading = () => { slowSensor.onreading = () => {
// Skip the initial notification that always comes immediately. // Skip the initial notification that always comes immediately.
if (slowSensorNotifiedCounter === 1) { if (slowSensorNotifiedCounter === 2) {
fastSensor.stop(); fastSensor.stop();
slowSensor.stop(); slowSensor.stop();
resolve(fastSensorNotifiedCounter);
try {
assert_greater_than(fastSensorNotifiedCounter, 3,
"Fast sensor overtakes the slow one");
resolve();
} catch (e) {
reject(e);
}
} }
slowSensorNotifiedCounter++; slowSensorNotifiedCounter++;
} }
@ -427,7 +434,6 @@ function runGenericSensorTests(sensorName,
} }
fastSensor.onerror = reject; fastSensor.onerror = reject;
}); });
assert_greater_than(fastCounter, 2, "Fast sensor overtakes the slow one");
}, `${sensorName}: frequency hint works.`); }, `${sensorName}: frequency hint works.`);
// Re-enable after https://github.com/w3c/sensors/issues/361 is fixed. // Re-enable after https://github.com/w3c/sensors/issues/361 is fixed.

View file

@ -1,14 +1,17 @@
<!doctype html> <!doctype html>
<html> <html>
<meta name="timeout" content="long">
<body> <body>
<script src="/resources/testharness.js"></script> <script src="/resources/testharness.js"></script>
<script src="/resources/testharnessreport.js"></script> <script src="/resources/testharnessreport.js"></script>
<script src="/common/get-host-info.sub.js"></script> <script src="/common/get-host-info.sub.js"></script>
<script> <script>
const {ORIGIN, REMOTE_ORIGIN} = get_host_info(); const {ORIGIN, REMOTE_ORIGIN} = get_host_info();
const COEP = const COEP = '|header(cross-origin-embedder-policy,require-corp)';
'|header(cross-origin-embedder-policy,require-corp)' + const COEP_RO =
'|header(cross-origin-embedder-policy-report-only,require-corp)'; '|header(cross-origin-embedder-policy-report-only,require-corp)';
const CORP_CROSS_ORIGIN =
'|header(cross-origin-resource-policy,cross-origin)';
const FRAME_URL = `${ORIGIN}/common/blank.html?pipe=`; const FRAME_URL = `${ORIGIN}/common/blank.html?pipe=`;
const REMOTE_FRAME_URL = `${REMOTE_ORIGIN}/common/blank.html?pipe=`; const REMOTE_FRAME_URL = `${REMOTE_ORIGIN}/common/blank.html?pipe=`;
@ -19,6 +22,13 @@ function checkCorpReport(report, contextUrl, blockedUrl) {
assert_equals(report.body['blocked-url'], blockedUrl); assert_equals(report.body['blocked-url'], blockedUrl);
} }
function checkCoepMismatchReport(report, contextUrl, blockedUrl) {
assert_equals(report.type, 'coep');
assert_equals(report.url, contextUrl);
assert_equals(report.body.type, 'navigation');
assert_equals(report.body['blocked-url'], blockedUrl);
}
function loadFrame(document, url) { function loadFrame(document, url) {
return new Promise((resolve, reject) => { return new Promise((resolve, reject) => {
const frame = document.createElement('iframe'); const frame = document.createElement('iframe');
@ -29,49 +39,111 @@ function loadFrame(document, url) {
}); });
} }
function observeReportsUpTo(global, upto) { // |parentSuffix| is a suffix for the parent frame URL.
// When |withEmptyFrame| is true, this function creates an empty frame
// between the parent and target frames.
// |targetUrl| is a URL for the target frame.
async function loadFrames(test, parentSuffix, withEmptyFrame, targetUrl) {
const frame = await loadFrame(document, FRAME_URL + parentSuffix);
test.add_cleanup(() => frame.remove());
let parent;
if (withEmptyFrame) {
parent = frame.contentDocument.createElement('iframe');
frame.contentDocument.body.appendChild(parent);
} else {
parent = frame;
}
// Here we don't need "await". This loading may or may not succeed, and
// we're not interested in the result.
loadFrame(parent.contentDocument, targetUrl);
return parent;
}
async function observeReports(global) {
const reports = []; const reports = [];
return new Promise(resolve => {
const observer = new global.ReportingObserver((rs) => { const observer = new global.ReportingObserver((rs) => {
for (const r of rs) { for (const r of rs) {
reports.push(r.toJSON()); reports.push(r.toJSON());
if (reports.length == upto) {
observer.disconnect();
resolve(reports);
}
} }
}); });
observer.observe(); observer.observe();
});
// Wait 3000ms for reports to settle.
await new Promise(r => step_timeout(r, 3000));
return reports;
} }
promise_test(async (t) => { // CASES is a list of test case. Each test case consists of:
const parent = await loadFrame(document, FRAME_URL + COEP); // parent: the suffix of the URL of the parent frame.
t.add_cleanup(() => parent.remove()); // target: the suffix of the URL of the target frame.
loadFrame(parent.contentDocument, REMOTE_FRAME_URL + COEP); // reports: the expectation of reports to be made. Each report is one of:
// 'CORP': CORP violation
// 'CORP-RO' CORP violation (report only)
// 'NAV': COEP mismatch between the frames.
// 'NAV-RO': COEP mismatch between the frames (report only).
// Currently '-RO' is no-op, e.g., 'CORP' and 'CORP-RO' have the same
// expectation. We are planning to introduce "disposition" member in
// reports, which will differentiate them each other.
const CASES = [
{ parent: '', target: '', reports: [] },
{ parent: '', target: COEP, reports: [] },
{ parent: COEP, target: COEP, reports: ['CORP'] },
{ parent: COEP, target: '', reports: ['CORP'] },
// One for COEP, one for COEP-RO. { parent: '', target: CORP_CROSS_ORIGIN, reports: [] },
const reports = await observeReportsUpTo(parent.contentWindow, 2); { parent: COEP, target: CORP_CROSS_ORIGIN, reports: ['NAV'] },
assert_equals(reports.length, 2); { parent: '', target: COEP + CORP_CROSS_ORIGIN, reports: [] },
checkCorpReport(reports[0], parent.src, REMOTE_FRAME_URL + COEP); { parent: COEP, target: COEP + CORP_CROSS_ORIGIN, reports: [] },
checkCorpReport(reports[1], parent.src, REMOTE_FRAME_URL + COEP);
}, 'Navigation CORP');
promise_test(async (t) => { { parent: COEP_RO, target: COEP, reports: ['CORP-RO'] },
const grandParent = await loadFrame(document, FRAME_URL + COEP); { parent: COEP_RO, target: '', reports: ['CORP-RO', 'NAV-RO'] },
t.add_cleanup(() => grandParent.remove()); { parent: COEP_RO, target: CORP_CROSS_ORIGIN, reports: ['NAV-RO'] },
const parent = grandParent.contentDocument.createElement('iframe'); { parent: COEP_RO, target: COEP + CORP_CROSS_ORIGIN, reports: [] },
grandParent.contentDocument.body.appendChild(parent);
loadFrame(parent.contentDocument, REMOTE_FRAME_URL + COEP);
// One for COEP, one for COEP-RO. { parent: COEP, target: COEP_RO + CORP_CROSS_ORIGIN, reports: ['NAV'] },
const reports = await observeReportsUpTo(parent.contentWindow, 2); ];
assert_equals(reports.length, 2); for (const testcase of CASES) {
checkCorpReport(reports[0], 'about:blank', REMOTE_FRAME_URL + COEP); for (const withEmptyFrame of [false, true]) {
checkCorpReport(reports[1], 'about:blank', REMOTE_FRAME_URL + COEP); function desc(s) {
}, 'Navigation CORP and about:blank'); return s === '' ? '(none)' : s;
}
async_test(async (t) => {
try {
const targetUrl = REMOTE_FRAME_URL + testcase.target;
const parent =
await loadFrames(t, testcase.parent, withEmptyFrame, targetUrl);
const contextUrl = parent.src ? parent.src : 'about:blank';
const reports = await observeReports(parent.contentWindow);
assert_equals(reports.length, testcase.reports.length);
for (let i = 0; i < reports.length; i += 1) {
const report = reports[i];
switch (testcase.reports[i]) {
case 'CORP':
case 'CORP-RO':
checkCorpReport(report, contextUrl, targetUrl);
break;
case 'NAV':
case 'NAV-RO':
checkCoepMismatchReport(report, contextUrl, targetUrl);
break;
default:
assert_unreached(
'Unexpected report expeaction: ' + testcase.reports[i]);
}
}
t.done();
} catch (e) {
t.step(() => { throw e; });
}
}, `parent: ${desc(testcase.parent)}, target: ${desc(testcase.target)}, ` +
`with empty frame: ${withEmptyFrame}`);
}
}
</script> </script>
</body></html> </body></html>

View file

@ -28,9 +28,9 @@ function checkReport(report, contextUrl, blockedUrl) {
assert_equals(report.body['blocked-url'], blockedUrl); assert_equals(report.body['blocked-url'], blockedUrl);
} }
async function fetchInFrame(t, url) { async function fetchInFrame(t, frameUrl, url) {
const reports = []; const reports = [];
const frame = await with_iframe(FRAME_URL); const frame = await with_iframe(frameUrl);
t.add_cleanup(() => frame.remove()); t.add_cleanup(() => frame.remove());
const observer = new frame.contentWindow.ReportingObserver((rs) => { const observer = new frame.contentWindow.ReportingObserver((rs) => {
@ -80,7 +80,7 @@ const ENVIRONMENTS = [{
tag: 'document', tag: 'document',
contextUrl: FRAME_URL, contextUrl: FRAME_URL,
run: async (test, url) => { run: async (test, url) => {
return await fetchInFrame(test, url); return await fetchInFrame(test, FRAME_URL, url);
}, },
}, { }, {
tag: 'dedicated worker', tag: 'dedicated worker',
@ -113,6 +113,21 @@ const ENVIRONMENTS = [{
worker.addEventListener('error', test.unreached_func('Worker.onerror')); worker.addEventListener('error', test.unreached_func('Worker.onerror'));
return await fetchInWorker(worker, url); return await fetchInWorker(worker, url);
}, },
}, {
tag: 'between service worker and page',
contextUrl: `${ORIGIN}${BASE}/reporting-empty-frame.html`,
run: async (test, url) => {
const SCOPE = `${BASE}/reporting-empty-frame.html`;
// Here we use a Service Worker without COEP.
const WORKER_URL = `${ORIGIN}${BASE}/sw.js`;
const reg =
await service_worker_unregister_and_register(test, WORKER_URL, SCOPE);
test.add_cleanup(() => reg.unregister());
const worker = reg.installing || reg.waiting || reg.active;
worker.addEventListener('error', test.unreached_func('Worker.onerror'));
return await fetchInFrame(
test, `${ORIGIN}${BASE}/reporting-empty-frame.html`, url);
},
}]; }];
const CASES = [{ const CASES = [{

View file

@ -0,0 +1,171 @@
<!doctype html>
<html>
<meta name="timeout" content="long">
<body>
<script src="/resources/testharness.js"></script>
<script src="/resources/testharnessreport.js"></script>
<script src="/common/utils.js"></script>
<script src="/common/get-host-info.sub.js"></script>
<script>
// This file consists of tests for COEP reporting. The tests make COEP
// violations and see whether reports are sent to the network as specified.
// We only have basic tests in this file - one for each kind of reports,
// because we can also test the reporting functionality with ReportingObserver,
// and that way is faster, easier to debug, and less flaky.
//
// For more detailed tests and tests with workers, see tests in other files
// such as
// - reporting-navigation.https.html
// - reporting-subresource-corp.https.html
// - cache-storage-reporting*.https.html
// .
const { REMOTE_ORIGIN } = get_host_info();
const BASE = new URL("resources", location).pathname
function wait(ms) {
return new Promise(resolve => step_timeout(resolve, ms));
}
async function pollReports(endpoint, reports) {
while (true) {
await wait(200);
const res = await fetch(`resources/report.py?endpoint=${endpoint}`, {cache: 'no-store'});
if (res.status !== 200) {
continue;
}
for (const report of await res.json()) {
reports.push(report);
}
}
}
const reports = [];
const reportsForReportOnly = [];
pollReports('endpoint', reports);
pollReports('report-only-endpoint', reportsForReportOnly);
function checkCorpReportExistence(reports, blockedUrl, contextUrl) {
blockedUrl = new URL(blockedUrl, location).href;
contextUrl = new URL(contextUrl, location).href;
for (const report of reports) {
if (report.type !== 'coep' || report.url !== contextUrl ||
report.body.type !== 'corp') {
continue;
}
if (report.body['blocked-url'] === blockedUrl) {
return;
}
}
assert_unreached(`A report whose blocked-url is ${blockedUrl} and url is ${contextUrl} is not found.`);
}
function checkNavigationReportExistence(reports, blockedUrl, contextUrl) {
blockedUrl = new URL(blockedUrl, location).href;
contextUrl = new URL(contextUrl, location).href;
for (const report of reports) {
if (report.type !== 'coep' || report.url !== contextUrl ||
report.body.type !== 'navigation') {
continue;
}
if (report.body['blocked-url'] === blockedUrl) {
return;
}
}
assert_unreached(`A report whose blocked-url is ${blockedUrl} and url is ${contextUrl} is not found.`);
}
async_test(async (t) => {
try {
const iframe = document.createElement('iframe');
t.add_cleanup(() => iframe.remove());
iframe.src = `resources/reporting-empty-frame.html`
document.body.appendChild(iframe);
await new Promise(resolve => {
iframe.addEventListener('load', resolve, {once: true});
});
const url = `${REMOTE_ORIGIN}/common/text-plain.txt?${token()}`;
const init = { mode: 'no-cors', cache: 'no-store' };
// The response comes from cross-origin, and doesn't have a CORP
// header, so it is blocked.
iframe.contentWindow.fetch(url, init).catch(() => {});
// Wait 3 seconds for reports to settle.
await wait(3000);
checkCorpReportExistence(reports, url, iframe.src);
checkCorpReportExistence(reportsForReportOnly, url, iframe.src);
t.done();
} catch (e) {
t.step(() => { throw e });
}
}, 'subresource CORP');
async_test(async (t) => {
try {
const iframe = document.createElement('iframe');
t.add_cleanup(() => iframe.remove());
iframe.src = `resources/reporting-empty-frame.html`
document.body.appendChild(iframe);
await new Promise(resolve => {
iframe.addEventListener('load', resolve, {once: true});
});
const w = iframe.contentWindow;
function attachFrame(url) {
const frame = w.document.createElement('iframe');
frame.src = url;
w.document.body.appendChild(frame);
}
const url = `${REMOTE_ORIGIN}/common/blank.html?${token()}`;
// The nested frame comes from cross-origin and doesn't have a CORP
// header, so it is blocked.
attachFrame(url);
// Wait 3 seconds for reports to settle.
await wait(3000);
checkCorpReportExistence(reports, url, iframe.src);
checkCorpReportExistence(reportsForReportOnly, url, iframe.src);
t.done();
} catch (e) {
t.step(() => { throw e });
}
}, 'navigation CORP');
async_test(async (t) => {
try {
const iframe = document.createElement('iframe');
t.add_cleanup(() => iframe.remove());
iframe.src = 'resources/reporting-empty-frame.html';
const targetUrl = `/common/blank.html?${token()}`;
iframe.addEventListener('load', () => {
const nested = iframe.contentDocument.createElement('iframe');
nested.src = targetUrl;
// |nested| doesn't have COEP whereas |iframe| has, so it is blocked.
iframe.contentDocument.body.appendChild(nested);
}, {once: true});
document.body.appendChild(iframe);
// Wait 3 seconds for reports to settle.
await wait(3000);
checkNavigationReportExistence(reports, targetUrl, iframe.src);
checkNavigationReportExistence(
reportsForReportOnly, targetUrl, iframe.src);
t.done();
} catch (e) {
t.step(() => { throw e });
}
}, 'COEP violation on nested frame navigation');
</script>$

View file

@ -1,462 +0,0 @@
<!doctype html>
<html>
<meta name="timeout" content="long">
<body>
<script src="/resources/testharness.js"></script>
<script src="/resources/testharnessreport.js"></script>
<script src="/common/utils.js"></script>
<script src="/common/get-host-info.sub.js"></script>
<script src="/service-workers/service-worker/resources/test-helpers.sub.js"></script>
<script>
const HOST = get_host_info();
const REMOTE_ORIGIN = HOST.REMOTE_ORIGIN;
const BASE = new URL("resources", location).pathname
function wait(ms) {
return new Promise(resolve => step_timeout(resolve, ms));
}
async function pollReports(endpoint, reports) {
while (true) {
await wait(200);
const res = await fetch(`resources/report.py?endpoint=${endpoint}`, {cache: 'no-store'});
if (res.status !== 200) {
continue;
}
for (const report of await res.json()) {
reports.push(report);
}
}
}
const reports = [];
const reportsForReportOnly = [];
pollReports('endpoint', reports);
pollReports('report-only-endpoint', reportsForReportOnly);
function checkCorpReportExistence(reports, blockedUrl, contextUrl) {
blockedUrl = new URL(blockedUrl, location).href;
contextUrl = new URL(contextUrl, location).href;
for (const report of reports) {
if (report.type !== 'coep' || report.url !== contextUrl ||
report.body.type !== 'corp') {
continue;
}
if (report.body['blocked-url'] === blockedUrl) {
return;
}
}
assert_unreached(`A report whose blocked-url is ${blockedUrl} and url is ${contextUrl} is not found.`);
}
function checkNavigationReportExistence(reports, blockedUrl, contextUrl) {
blockedUrl = new URL(blockedUrl, location).href;
contextUrl = new URL(contextUrl, location).href;
for (const report of reports) {
if (report.type !== 'coep' || report.url !== contextUrl ||
report.body.type !== 'navigation') {
continue;
}
if (report.body['blocked-url'] === blockedUrl) {
return;
}
}
assert_unreached(`A report whose blocked-url is ${blockedUrl} and url is ${contextUrl} is not found.`);
}
function checkReportNonExistence(reports, blockedUrl, contextUrl) {
blockedUrl = new URL(blockedUrl, location).href;
contextUrl = new URL(contextUrl, location).href;
for (const report of reports) {
if (report.type !== 'coep' || report.url !== contextUrl) {
continue;
}
assert_not_equals(report.body['blocked-url'], blockedUrl);
}
}
async_test(async (t) => {
try {
const iframe = document.createElement('iframe');
t.add_cleanup(() => iframe.remove());
iframe.src = `resources/reporting-empty-frame.html`
document.body.appendChild(iframe);
await new Promise(resolve => {
iframe.addEventListener('load', resolve, {once: true});
});
function fetchInIframe(url) {
const init = { mode: 'no-cors', cache: 'no-store' };
iframe.contentWindow.fetch(url, init).catch(() => {});
}
const suffix = 'subresource-corp';
const sameOriginUrl = `/common/text-plain.txt?${suffix}`;
const blockedByPureCorp = `${REMOTE_ORIGIN}${BASE}/nothing-same-origin-corp.txt?${suffix}`;
const blockedDueToCoep = `${REMOTE_ORIGIN}/common/text-plain.txt?abc&${suffix}`;
const dest = `${REMOTE_ORIGIN}/common/text-plain.txt?xyz&${suffix}`;
const redirect = `/common/redirect.py?location=${encodeURIComponent(dest)}&${suffix}`;
fetchInIframe(sameOriginUrl);
fetchInIframe(blockedByPureCorp);
fetchInIframe(blockedDueToCoep);
fetchInIframe(redirect);
// Wait 3 seconds for reports to settle.
await wait(3000);
checkReportNonExistence(reports, sameOriginUrl, iframe.src);
checkReportNonExistence(reports, blockedByPureCorp, iframe.src);
checkCorpReportExistence(reports, blockedDueToCoep, iframe.src);
checkCorpReportExistence(reports, redirect, iframe.src);
checkReportNonExistence(reports, dest, iframe.src);
t.done();
} catch (e) {
t.step(() => { throw e });
}
}, 'subresource CORP');
async_test(async (t) => {
try {
const IFRAME_SRC = 'resources/coep-iframe.html';
const SCOPE = new URL(IFRAME_SRC, location).pathname;
const SCRIPT =
'resources/sw.js?' +
`pipe=header(service-worker-allowed,${SCOPE})|` +
'header(cross-origin-embedder-policy,require-corp%3breport-to=%22endpoint%22)|' +
'header(cross-origin-embedder-policy-report-only,require-corp%3breport-to=%22report-only-endpoint%22)';
const reg = await service_worker_unregister_and_register(t, SCRIPT, SCOPE);
await wait_for_state(t, reg.installing, 'activated');
const iframe = document.createElement('iframe');
t.add_cleanup(() => {
iframe.remove();
reg.unregister();
});
iframe.src = IFRAME_SRC;
document.body.appendChild(iframe);
await new Promise(resolve => {
iframe.addEventListener('load', resolve, {once: true});
});
document.body.appendChild(iframe);
await new Promise(resolve => {
iframe.addEventListener('load', resolve, {once: true});
});
function fetchInIframe(url) {
const init = { mode: 'no-cors', cache: 'no-store' };
iframe.contentWindow.fetch(url, init).catch(() => {});
}
const suffix = 'subresource-corp-sw';
const sameOriginUrl = `/common/text-plain.txt?${suffix}`;
const blockedByPureCorp = `${REMOTE_ORIGIN}${BASE}/nothing-same-origin-corp.txt?${suffix}`;
const blockedDueToCoep = `${REMOTE_ORIGIN}/common/text-plain.txt?abc&${suffix}`;
const dest = `${REMOTE_ORIGIN}/common/text-plain.txt?xyz&${suffix}`;
const redirect = `/common/redirect.py?location=${encodeURIComponent(dest)}&${suffix}`;
fetchInIframe(sameOriginUrl);
fetchInIframe(blockedByPureCorp);
fetchInIframe(blockedDueToCoep);
fetchInIframe(redirect);
// Wait 3 seconds for reports to settle.
await wait(3000);
const contextUrl = SCRIPT;
checkReportNonExistence(reports, sameOriginUrl, contextUrl);
checkReportNonExistence(reports, blockedByPureCorp, contextUrl);
checkCorpReportExistence(reports, blockedDueToCoep, contextUrl);
checkCorpReportExistence(reports, redirect, contextUrl);
checkReportNonExistence(reports, dest, contextUrl);
t.done();
} catch (e) {
t.step(() => { throw e });
}
}, 'CORP for subresource requests initiated from a service worker');
async_test(async (t) => {
try {
const iframe = document.createElement('iframe');
t.add_cleanup(() => iframe.remove());
iframe.src = `resources/reporting-empty-frame.html`
document.body.appendChild(iframe);
await new Promise(resolve => {
iframe.addEventListener('load', resolve, {once: true});
});
const w = iframe.contentWindow;
function attachFrame(url) {
const frame = w.document.createElement('iframe');
frame.src = url;
w.document.body.appendChild(frame);
}
const suffix = 'navigation-corp';
const coep = `pipe=header(cross-origin-embedder-policy,require-corp)`;
const sameOrigin = `/common/blank.html?${coep}&${suffix}`;
const blockedDueToCoep = `${REMOTE_ORIGIN}/common/blank.html?${coep}&${suffix}-a`;
const dest = `${REMOTE_ORIGIN}/common/blank.html?${coep}&${suffix}-b`;
const redirect = `/common/redirect.py?location=${encodeURIComponent(dest)}&${suffix}`;
attachFrame(sameOrigin);
attachFrame(blockedDueToCoep);
attachFrame(redirect);
// Wait 3 seconds for reports to settle.
await wait(3000);
checkReportNonExistence(reports, sameOrigin, iframe.src);
checkCorpReportExistence(reports, blockedDueToCoep, iframe.src);
checkCorpReportExistence(reports, redirect, iframe.src);
checkReportNonExistence(reports, dest, iframe.src);
t.done();
} catch (e) {
t.step(() => { throw e });
}
}, 'navigation CORP');
async_test(async (t) => {
try {
const iframe = document.createElement('iframe');
t.add_cleanup(() => iframe.remove());
const suffix = '&navigation-coep';
const corp = 'header(cross-origin-resource-policy,cross-origin)';
const noCoep = `pipe=${corp}`;
const coep =
`pipe=header(cross-origin-embedder-policy,require-corp%3breport-to=%22endpoint%22)|${corp}`;
const coepReportOnly =
`pipe=header(cross-origin-embedder-policy-report-only,require-corp%3breport-to=%22report-only-endpoint%22)|${corp}`;
const path = `/common/blank.html`;
const pipes = [noCoep, coep, coepReportOnly];
const settings = new Map();
settings.set(noCoep, {
pipe: noCoep,
value: 'unsafe-none',
reportOnlyValue: 'unsafe-none',
});
settings.set(coep, {
pipe: coep,
value: 'require-corp',
reportOnlyValue: 'unsafe-none',
});
settings.set(coepReportOnly, {
pipe: coepReportOnly,
value: 'unsafe-none',
reportOnlyValue: 'require-corp',
});
function genUrl(pipe) {
return `${path}?${pipe}${suffix}`;
}
for (const outer of settings.keys()) {
for (const inner of settings.keys()) {
const iframe = document.createElement('iframe');
t.add_cleanup(() => iframe.remove());
iframe.src = genUrl(outer);
iframe.addEventListener('load', () => {
const w = iframe.contentWindow;
const d = iframe.contentDocument;
const nested = d.createElement('iframe');
nested.src = genUrl(inner) + '-nested';
d.body.appendChild(nested);
}, {once: true});
document.body.appendChild(iframe);
}
}
// Wait 3 seconds for reports to settle.
await wait(3000);
function check(rs, inner, outer) {
checkNavigationReportExistence(
rs, genUrl(inner) + '-nested', genUrl(outer));
}
function checkNoReport(reports, inner, outer) {
checkReportNonExistence(
reports, genUrl(inner) + '-nested', genUrl(outer));
}
// outer === noCoep
checkNoReport(reports, noCoep, noCoep);
checkNoReport(reports, coep, noCoep);
checkNoReport(reports, coepReportOnly, noCoep);
checkNoReport(reportsForReportOnly, noCoep, noCoep);
checkNoReport(reportsForReportOnly, coep, noCoep);
checkNoReport(reportsForReportOnly, coepReportOnly, noCoep);
// outer === coep
check(reports, noCoep, coep);
checkNoReport(reports, coep, coep);
check(reports, coepReportOnly, coep);
checkNoReport(reportsForReportOnly, noCoep, coep);
checkNoReport(reportsForReportOnly, coep, coep);
checkNoReport(reportsForReportOnly, coepReportOnly, coep);
// outer === coepReportOnly
checkNoReport(reports, noCoep, coepReportOnly);
checkNoReport(reports, coep, coepReportOnly);
checkNoReport(reports, coepReportOnly, coepReportOnly);
check(reportsForReportOnly, noCoep, coepReportOnly);
checkNoReport(reportsForReportOnly, coep, coepReportOnly);
check(reportsForReportOnly, coepReportOnly, coepReportOnly);
t.done();
} catch (e) {
t.step(() => { throw e });
}
}, 'COEP violation on nested frame navigation');
async_test(async (t) => {
try {
const iframe = document.createElement('iframe');
t.add_cleanup(() => iframe.remove());
iframe.src = `resources/reporting-empty-frame.html`
document.body.appendChild(iframe);
await new Promise(resolve => {
iframe.addEventListener('load', resolve, {once: true});
});
const worker_url = new URL('resources/fetch-in-dedicated-worker.js', location);
const worker = new iframe.contentWindow.Worker(worker_url);
function fetchInWorker(url) {
const init = { mode: 'no-cors', cache: 'no-store' };
worker.postMessage({url, init});
return new Promise((resolve) => {
worker.addEventListener('message', resolve);
});
}
const suffix = 'subresource-corp-from-dedicated-worker';
const sameOriginUrl = `/common/text-plain.txt?${suffix}`;
const blockedByPureCorp = `${REMOTE_ORIGIN}${BASE}/nothing-same-origin-corp.txt?${suffix}`;
const blockedDueToCoep = `${REMOTE_ORIGIN}/common/text-plain.txt?abc&${suffix}`;
const dest = `${REMOTE_ORIGIN}/common/text-plain.txt?xyz&${suffix}`;
const redirect = `/common/redirect.py?location=${encodeURIComponent(dest)}&${suffix}`;
fetchInWorker(sameOriginUrl);
fetchInWorker(blockedByPureCorp);
fetchInWorker(blockedDueToCoep);
fetchInWorker(redirect);
// Wait 1 seconds for reports to settle.
await wait(1000);
checkReportNonExistence(reports, sameOriginUrl, worker_url.href);
checkReportNonExistence(reports, blockedByPureCorp, worker_url.href);
checkCorpReportExistence(reports, blockedDueToCoep, worker_url.href);
checkCorpReportExistence(reports, redirect, worker_url.href);
checkReportNonExistence(reports, dest, worker_url.href);
t.done();
} catch (e) {
t.step(() => { throw e });
}
}, 'subresource requests initiated from DedicatedWorker');
promise_test(async (t) => {
const suffix = 'subresource-corp-from-dedicated-worker-via-passthrough-sw';
const iframe_src = `resources/reporting-empty-frame.html?passthrough&${suffix}`;
// Register a service worker that controls an iframe.
const registration = await service_worker_unregister_and_register(
t, 'resources/sw.js', iframe_src);
t.add_cleanup(() => registration.unregister());
await wait_for_state(t, registration.installing, 'activated');
const iframe = document.createElement('iframe');
t.add_cleanup(() => iframe.remove());
iframe.src = iframe_src;
document.body.appendChild(iframe);
await new Promise(resolve => {
iframe.addEventListener('load', resolve, {once: true});
});
const worker_url = new URL('resources/fetch-in-dedicated-worker.js', location);
const worker = new iframe.contentWindow.Worker(worker_url);
function fetchInWorker(url) {
const init = { mode: 'no-cors', cache: 'no-store' };
worker.postMessage({url, init});
return new Promise((resolve) => {
worker.addEventListener('message', resolve);
});
}
const sameOriginUrl = `/common/text-plain.txt?${suffix}`;
const blockedByPureCorp = `${REMOTE_ORIGIN}${BASE}/nothing-same-origin-corp.txt?${suffix}`;
const blockedDueToCoep = `${REMOTE_ORIGIN}/common/text-plain.txt?abc&${suffix}`;
const dest = `${REMOTE_ORIGIN}/common/text-plain.txt?xyz&${suffix}`;
const redirect = `/common/redirect.py?location=${encodeURIComponent(dest)}&${suffix}`;
fetchInWorker(sameOriginUrl);
fetchInWorker(blockedByPureCorp);
fetchInWorker(blockedDueToCoep);
fetchInWorker(redirect);
// Wait 1 seconds for reports to settle.
await wait(1000);
checkReportNonExistence(reports, sameOriginUrl, worker_url.href);
checkReportNonExistence(reports, blockedByPureCorp, worker_url.href);
checkCorpReportExistence(reports, blockedDueToCoep, worker_url.href);
checkCorpReportExistence(reports, redirect, worker_url.href);
checkReportNonExistence(reports, dest, worker_url.href);
}, 'subresource requests initiated from DedicatedWorker controlled by a passthrough service worker');
promise_test(async (t) => {
const iframe_src = `resources/reporting-empty-frame.html?passthrough`;
// Register a service worker that controls an iframe.
const registration = await service_worker_unregister_and_register(
t, 'resources/sw.js', iframe_src);
t.add_cleanup(() => registration.unregister());
await wait_for_state(t, registration.installing, 'activated');
const iframe = document.createElement('iframe');
t.add_cleanup(() => iframe.remove());
iframe.src = iframe_src;
document.body.appendChild(iframe);
await new Promise(resolve => {
iframe.addEventListener('load', resolve, {once: true});
});
async function fetchInIframe(url) {
const init = { mode: 'no-cors', cache: 'no-store' };
// Ignore errors.
return iframe.contentWindow.fetch(url, init).catch(() => {});
}
const suffix = 'subresource-corp-passthrough-sw';
const sameOriginUrl = `/common/text-plain.txt?${suffix}`;
const blockedByPureCorp = `${REMOTE_ORIGIN}${BASE}/nothing-same-origin-corp.txt?${suffix}`;
const blockedDueToCoep = `${REMOTE_ORIGIN}/common/text-plain.txt?abc&${suffix}`;
const dest = `${REMOTE_ORIGIN}/common/text-plain.txt?xyz&${suffix}`;
const redirect = `/common/redirect.py?location=${encodeURIComponent(dest)}&${suffix}`;
fetchInIframe(sameOriginUrl);
fetchInIframe(blockedByPureCorp);
fetchInIframe(blockedDueToCoep);
fetchInIframe(redirect);
// Wait until |reports| is ready.
await wait(1000);
checkReportNonExistence(reports, sameOriginUrl, iframe.src);
checkReportNonExistence(reports, blockedByPureCorp, iframe.src);
checkCorpReportExistence(reports, blockedDueToCoep, iframe.src);
checkCorpReportExistence(reports, redirect, iframe.src);
checkReportNonExistence(reports, dest, iframe.src);
}, 'subresource CORP in an iframe hosted by a service worker without COEP');
</script>$

View file

@ -89,8 +89,8 @@
element.removeAttribute("accent"); element.removeAttribute("accent");
element.setAttribute("accentunder", "TrUe"); element.setAttribute("accentunder", "TrUe");
assert_approx_equals(fontSize(element.children[0]), fontSizeAtScriptLevelZero, epsilon, "base"); assert_approx_equals(fontSize(element.children[0]), fontSizeAtScriptLevelZero, epsilon, "base");
assert_approx_equals(fontSize(element.children[1]), fontSizeAtScriptLevelZero, epsilon, "under"); assert_approx_equals(fontSize(element.children[1]), fontSizeAtScriptLevelZero * .71, epsilon, "over");
assert_approx_equals(fontSize(element.children[2]), fontSizeAtScriptLevelZero * .71, epsilon, "over"); assert_approx_equals(fontSize(element.children[2]), fontSizeAtScriptLevelZero, epsilon, "under");
}, "checking dynamic/case-insensitive accent/accentunder"); }, "checking dynamic/case-insensitive accent/accentunder");
done(); done();

View file

@ -1,5 +1,6 @@
// META: script=/resources/WebIDLParser.js // META: script=/resources/WebIDLParser.js
// META: script=/resources/idlharness.js // META: script=/resources/idlharness.js
// META: timeout=long
// https://w3c.github.io/mediacapture-image/ // https://w3c.github.io/mediacapture-image/

View file

@ -1,5 +1,6 @@
// META: script=/resources/WebIDLParser.js // META: script=/resources/WebIDLParser.js
// META: script=/resources/idlharness.js // META: script=/resources/idlharness.js
// META: timeout=long
'use strict'; 'use strict';

View file

@ -0,0 +1,53 @@
// META: global=window,worker
// META: script=/resources/WebIDLParser.js
// META: script=/resources/idlharness.js
// META: script=cache-storage/resources/test-helpers.js
// META: script=service-worker/resources/test-helpers.sub.js
// META: timeout=long
// https://w3c.github.io/ServiceWorker
idl_test(
['service-workers'],
['dom', 'html'],
async (idl_array, t) => {
self.cacheInstance = await create_temporary_cache(t);
idl_array.add_objects({
CacheStorage: ['caches'],
Cache: ['self.cacheInstance'],
ServiceWorkerContainer: ['navigator.serviceWorker']
});
// TODO: Add ServiceWorker and ServiceWorkerRegistration instances for the
// other worker scopes.
if (self.GLOBAL.isWindow()) {
idl_array.add_objects({
ServiceWorkerRegistration: ['registrationInstance'],
ServiceWorker: ['registrationInstance.installing']
});
const scope = 'service-worker/resources/scope/idlharness';
const registration = await service_worker_unregister_and_register(
t, 'service-worker/resources/empty-worker.js', scope);
t.add_cleanup(() => registration.unregister());
self.registrationInstance = registration;
} else if (self.ServiceWorkerGlobalScope) {
// self.ServiceWorkerGlobalScope should only be defined for the
// ServiceWorker scope, which allows us to detect and test the interfaces
// exposed only for ServiceWorker.
idl_array.add_objects({
Clients: ['clients'],
ExtendableEvent: ['new ExtendableEvent("type")'],
FetchEvent: ['new FetchEvent("type")'],
ServiceWorkerGlobalScope: ['self'],
ServiceWorkerRegistration: ['registration'],
ServiceWorker: ['serviceWorker'],
// TODO: Test instances of Client and WindowClient, e.g.
// Client: ['self.clientInstance'],
// WindowClient: ['self.windowClientInstance']
});
}
}
);

View file

@ -0,0 +1,25 @@
<!DOCTYPE html>
<title>Service Workers in data iframes</title>
<script src="/resources/testharness.js"></script>
<script src="/resources/testharnessreport.js"></script>
<script src="resources/test-helpers.sub.js"></script>
<body></body>
<script>
'use strict';
promise_test(t => {
const url = encodeURI(`data:text/html,<!DOCTYPE html>
<script>
parent.postMessage({ isDefined: 'serviceWorker' in navigator }, '*');
</` + `script>`);
var p = new Promise((resolve, reject) => {
window.addEventListener('message', event => {
resolve(event.data.isDefined);
});
});
with_iframe(url);
return p.then(isDefined => {
assert_false(isDefined, 'navigator.serviceWorker should not be defined in iframe');
});
}, 'navigator.serviceWorker is not available in a data: iframe');
</script>

View file

@ -1,70 +0,0 @@
<!DOCTYPE html>
<title>Service Worker: Interfaces</title>
<meta name="timeout" content="long">
<script src="/resources/testharness.js"></script>
<script src="/resources/testharnessreport.js"></script>
<script src="/resources/WebIDLParser.js"></script>
<script src="/resources/idlharness.js"></script>
<script src="resources/test-helpers.sub.js"></script>
<script>
'use strict';
promise_test(async (t) => {
const srcs = ['dom', 'html', 'service-workers'];
const [dom, html, serviceWorkerIdl] = await Promise.all(
srcs.map(i => fetch(`/interfaces/${i}.idl`).then(r => r.text())));
var idlArray = new IdlArray();
idlArray.add_idls(serviceWorkerIdl, { only: [
'ServiceWorkerGlobalScope',
'Client',
'WindowClient',
'Clients',
'ServiceWorker',
'ServiceWorkerState',
'ServiceWorkerUpdateViaCache',
'ServiceWorkerRegistration',
'EventTarget',
'NavigationPreloadManager',
'Cache',
'CacheStorage',
]});
idlArray.add_dependency_idls(dom);
idlArray.add_dependency_idls(html);
idlArray.add_objects({
ServiceWorkerContainer: ['navigator.serviceWorker']
});
var scope = 'resources/scope/interfaces-and-attributes';
return service_worker_unregister_and_register(
t, 'resources/empty-worker.js', scope)
.then(function(registration) {
t.add_cleanup(function() {
return registration.unregister();
});
window.registrationInstance = registration;
idlArray.add_objects({
ServiceWorkerRegistration: ['window.registrationInstance'],
ServiceWorker: ['window.registrationInstance.installing']
});
idlArray.test();
});
}, 'test setup (worker registration)');
promise_test(t => {
const url = encodeURI(`data:text/html,<!DOCTYPE html>
<script>
parent.postMessage({ isDefined: 'serviceWorker' in navigator }, '*');
</` + `script>`);
var p = new Promise((resolve, reject) => {
window.addEventListener('message', event => {
resolve(event.data.isDefined);
});
});
with_iframe(url);
return p.then(isDefined => {
assert_false(isDefined, 'navigator.serviceWorker should not be defined in iframe');
});
}, 'navigator.serviceWorker is not available in a data: iframe');
</script>

View file

@ -7,9 +7,10 @@
<script> <script>
'use strict'; 'use strict';
// NOTE: affected when 'resources/idlharness-worker.sub.js' srcs change: // interface-requirements-worker.sub.js checks additional interface
// const srcs = ['dom', 'html', 'service-workers']; // requirements, on top of the basic IDL that is validated in
// service-workers/idlharness.any.js
service_worker_test( service_worker_test(
'resources/idlharness-worker.sub.js', 'resources/interface-requirements-worker.sub.js',
'Interfaces and attributes in ServiceWorkerGlobalScope'); 'Interfaces and attributes in ServiceWorkerGlobalScope');
</script> </script>

View file

@ -0,0 +1,49 @@
<!DOCTYPE html>
<meta charset="utf-8">
<title>Service Worker: Verify nextHopProtocol is set correctly</title>
<script src="/resources/testharness.js"></script>
<script src="/resources/testharnessreport.js"></script>
<script src="resources/test-helpers.sub.js"></script>
<script>
async function getNextHopProtocol(frame, url) {
let final_url = new URL(url, self.location).href;
await frame.contentWindow.fetch(final_url).then(r => r.text());
let entryList = frame.contentWindow.performance.getEntriesByName(final_url);
let entry = entryList[entryList.length - 1];
return entry.nextHopProtocol;
}
async function runTest(t, base_url, expected_protocol) {
const scope = 'resources/empty.html?next-hop-protocol';
const script = 'resources/fetch-rewrite-worker.js';
let frame;
const registration =
await service_worker_unregister_and_register(t, script, scope);
t.add_cleanup(async _ => registration.unregister());
await wait_for_state(t, registration.installing, 'activated');
frame = await with_iframe(scope);
t.add_cleanup(_ => frame.remove());
assert_equals(await getNextHopProtocol(frame, `${base_url}?generate-png`),
'', 'nextHopProtocol is not set on synthetic response');
assert_equals(await getNextHopProtocol(frame, `${base_url}?ignore`),
expected_protocol, 'nextHopProtocol is set on fallback');
assert_equals(await getNextHopProtocol(frame, `${base_url}`),
expected_protocol, 'nextHopProtocol is set on pass-through');
assert_equals(await getNextHopProtocol(frame, `${base_url}?cache`),
expected_protocol, 'nextHopProtocol is set on cached response');
}
promise_test(async (t) => {
return runTest(t, 'resources/empty.js', 'http/1.1');
}, 'nextHopProtocol reports H1 correctly when routed via a service worker.');
// This may be expected to fail if the WPT infrastructure does not fully
// support H2 protocol testing yet.
promise_test(async (t) => {
return runTest(t, 'resources/empty.h2.js', 'h2');
}, 'nextHopProtocol reports H2 correctly when routed via a service worker.');
</script>

View file

@ -1,48 +1,9 @@
'use strict'; 'use strict';
importScripts('worker-testharness.js'); // This file checks additional interface requirements, on top of the basic IDL
importScripts('/resources/WebIDLParser.js'); // that is validated in service-workers/idlharness.any.js
importScripts('/resources/idlharness.js');
promise_test(async (t) => { importScripts('/resources/testharness.js');
const srcs = ['dom', 'html', 'service-workers'];
const [dom, html, serviceWorkerIdl] = await Promise.all(
srcs.map(i => fetch(`/interfaces/${i}.idl`).then(r => r.text())));
var idlArray = new IdlArray();
idlArray.add_idls(serviceWorkerIdl, { only: [
'ServiceWorkerGlobalScope',
'Client',
'WindowClient',
'Clients',
'ServiceWorker',
'ServiceWorkerState',
'ServiceWorkerUpdateViaCache',
'ServiceWorkerRegistration',
'EventTarget',
'NavigationPreloadManager',
'Cache',
'CacheStorage',
]});
idlArray.add_dependency_idls(dom);
idlArray.add_dependency_idls(html);
idlArray.add_objects({
ServiceWorkerGlobalScope: ['self'],
Clients: ['self.clients'],
ServiceWorkerRegistration: ['self.registration'],
CacheStorage: ['self.caches']
// TODO: Test instances of Client and WindowClient, e.g.
// Client: ['self.clientInstance'],
// WindowClient: ['self.windowClientInstance']
});
return create_temporary_cache(t)
.then(function(cache) {
self.cacheInstance = cache;
idlArray.add_objects({ Cache: ['self.cacheInstance'] });
idlArray.test();
});
}, 'test setup (cache creation)');
test(function() { test(function() {
var req = new Request('http://{{host}}/', var req = new Request('http://{{host}}/',

View file

@ -3,4 +3,3 @@ suggested_reviewers:
- Hexcles - Hexcles
- stephenmcgruer - stephenmcgruer
- LukeZielinski - LukeZielinski
- KyleJu

View file

@ -922,17 +922,22 @@ def run(**kwargs):
signal.signal(signal.SIGTERM, handle_signal) signal.signal(signal.SIGTERM, handle_signal)
signal.signal(signal.SIGINT, handle_signal) signal.signal(signal.SIGINT, handle_signal)
while (all(item.is_alive() for item in iter_procs(servers)) and while (all(subproc.is_alive() for subproc in iter_procs(servers)) and
not received_signal.is_set()): not received_signal.is_set()):
for item in iter_procs(servers): for subproc in iter_procs(servers):
item.join(1) subproc.join(1)
exited = [item for item in iter_procs(servers) if not item.is_alive()]
subject = "subprocess" if len(exited) == 1 else "subprocesses"
logger.info("%s %s exited:" % (len(exited), subject)) failed_subproc = 0
for subproc in iter_procs(servers):
for item in iter_procs(servers): if subproc.is_alive():
logger.info("Status of %s:\t%s" % (item.name, "running" if item.is_alive() else "not running")) logger.info('Status of subprocess "%s": running' % subproc.name)
else:
if subproc.exitcode == 0:
logger.info('Status of subprocess "%s": exited correctly' % subproc.name)
else:
logger.warning('Status of subprocess "%s": failed. Exit with non-zero status: %d' % (subproc.name, subproc.exitcode))
failed_subproc += 1
return failed_subproc
def main(): def main():

View file

@ -1,5 +1,6 @@
// META: script=/resources/WebIDLParser.js // META: script=/resources/WebIDLParser.js
// META: script=/resources/idlharness.js // META: script=/resources/idlharness.js
// META: timeout=long
// https://w3c.github.io/web-share/ // https://w3c.github.io/web-share/

View file

@ -0,0 +1,5 @@
spec: https://gpuweb.github.io/gpuweb/
suggested_reviewers:
- kainino0x
- JusSn
- kvark

View file

@ -0,0 +1,10 @@
# WebGPU Conformance Test Suite
The WebGPU CTS requires support for the WebGPU API. This requires both browser
support and hardware support, so this API cannot run on most automated testing
infrastructure. Tests inside this directory should always be skipped if
appropriate GPU hardware is not available.
The contents of this directory are automatically generated from TypeScript
sources which live upstream in the [WebGPU CTS](https://github.com/gpuweb/cts).
They are periodically built and pushed to WPT.

View file

@ -32,7 +32,7 @@ promise_test(async (t) => {
}); });
exchangeIceCandidates(pc1, pc2); exchangeIceCandidates(pc1, pc2);
await doSignalingHandshake(pc1, pc2); await exchangeOfferAnswer(pc1, pc2);
await resolver; await resolver;
}, 'In-band negotiated channel created on remote peer should match the same configuration as local ' + }, 'In-band negotiated channel created on remote peer should match the same configuration as local ' +
@ -57,7 +57,7 @@ promise_test(async (t) => {
}); });
exchangeIceCandidates(pc1, pc2); exchangeIceCandidates(pc1, pc2);
await doSignalingHandshake(pc1, pc2); await exchangeOfferAnswer(pc1, pc2);
await resolver; await resolver;
}, 'In-band negotiated channel created on remote peer should match the same (default) ' + }, 'In-band negotiated channel created on remote peer should match the same (default) ' +

View file

@ -52,7 +52,7 @@ promise_test(async t => {
v.addEventListener('loadedmetadata', resolve); v.addEventListener('loadedmetadata', resolve);
}); });
exchangeIceCandidates(pc1, pc2); exchangeIceCandidates(pc1, pc2);
doSignalingHandshake(pc1, pc2); exchangeOfferAnswer(pc1, pc2);
await metadataToBeLoaded; await metadataToBeLoaded;
// The basic signal is a track with signal 100. We replace this // The basic signal is a track with signal 100. We replace this
// with tracks with signal from 0 to 255 and see if they are all // with tracks with signal from 0 to 255 and see if they are all

View file

@ -297,7 +297,7 @@ promise_test(async t => {
}); });
}); });
exchangeIceCandidates(pc1, pc2); exchangeIceCandidates(pc1, pc2);
doSignalingHandshake(pc1, pc2); exchangeOfferAnswer(pc1, pc2);
await metadataToBeLoaded; await metadataToBeLoaded;
await detectSignal(t, v, 20); await detectSignal(t, v, 20);
await sender.replaceTrack(track2); await sender.replaceTrack(track2);