mirror of
https://github.com/servo/servo.git
synced 2025-06-27 02:23:41 +01:00
Update web-platform-tests to revision ae1e2d51f38e208f3d07a97b5d82f9ca0dda2c94
This commit is contained in:
WPT Sync Bot
parent
6c506ba260
commit
96553cb7e2
109 changed files with 3903 additions and 298 deletions
|
|
@ -0,0 +1,4 @@
|
|||
[hit-test-floats-002.html]
|
||||
[Hit test float]
|
||||
expected: FAIL
|
||||
|
||||
|
|
@ -0,0 +1,4 @@
|
|||
[hittest-before-pseudo.html]
|
||||
[Hit-testing text within a pseudo-element flex-item should return the flexbox as the hittest result.]
|
||||
expected: FAIL
|
||||
|
||||
|
|
@ -1,4 +0,0 @@
|
|||
[elementFromPoint-001.html]
|
||||
[CSSOM View - 5 - extensions to the Document interface]
|
||||
expected: FAIL
|
||||
|
||||
|
|
@ -17,3 +17,6 @@
|
|||
[test the top of layer]
|
||||
expected: FAIL
|
||||
|
||||
[test some point of the element: top left corner]
|
||||
expected: FAIL
|
||||
|
||||
|
|
|
|||
|
|
@ -312,15 +312,27 @@
|
|||
[Response: combined response Content-Type: text/html;" \\" text/plain ";charset=GBK]
|
||||
expected: NOTRUN
|
||||
|
||||
[<iframe>: combined response Content-Type: text/html;" text/plain]
|
||||
expected: FAIL
|
||||
|
||||
[<iframe>: separate response Content-Type: text/html;" text/plain]
|
||||
expected: FAIL
|
||||
|
||||
[<iframe>: separate response Content-Type: text/plain */*]
|
||||
expected: FAIL
|
||||
|
||||
[<iframe>: separate response Content-Type: text/html */*;charset=gbk]
|
||||
[<iframe>: combined response Content-Type: */* text/html]
|
||||
expected: FAIL
|
||||
|
||||
[<iframe>: separate response Content-Type: text/html */*]
|
||||
expected: FAIL
|
||||
|
||||
[<iframe>: separate response Content-Type: text/html;x=" text/plain]
|
||||
expected: FAIL
|
||||
|
||||
[<iframe>: combined response Content-Type: text/html;" \\" text/plain]
|
||||
expected: FAIL
|
||||
|
||||
[<iframe>: separate response Content-Type: text/html;" \\" text/plain]
|
||||
expected: FAIL
|
||||
|
||||
[<iframe>: combined response Content-Type: text/html;x=" text/plain]
|
||||
expected: FAIL
|
||||
|
||||
[<iframe>: separate response Content-Type: text/plain */*;charset=gbk]
|
||||
expected: FAIL
|
||||
|
||||
|
|
|
|||
|
|
@ -53,6 +53,9 @@
|
|||
[combined text/javascript ]
|
||||
expected: FAIL
|
||||
|
||||
[separate text/javascript x/x]
|
||||
expected: FAIL
|
||||
|
||||
[separate text/javascript; charset=windows-1252 text/javascript]
|
||||
expected: FAIL
|
||||
|
||||
|
|
|
|||
|
|
@ -1,4 +1,4 @@
|
|||
[traverse_the_history_5.html]
|
||||
[traverse_the_history_4.html]
|
||||
[Multiple history traversals, last would be aborted]
|
||||
expected: FAIL
|
||||
|
||||
|
|
@ -1,5 +1,4 @@
|
|||
[iframe_sandbox_popups_escaping-3.html]
|
||||
expected: TIMEOUT
|
||||
[Check that popups from a sandboxed iframe escape the sandbox if\n allow-popups-to-escape-sandbox is used]
|
||||
expected: TIMEOUT
|
||||
expected: FAIL
|
||||
|
||||
|
|
|
|||
|
|
@ -1,5 +1,5 @@
|
|||
[iframe_sandbox_popups_nonescaping-2.html]
|
||||
expected: TIMEOUT
|
||||
expected: CRASH
|
||||
[Check that popups from a sandboxed iframe do not escape the sandbox]
|
||||
expected: NOTRUN
|
||||
|
||||
|
|
|
|||
|
|
@ -1,5 +1,5 @@
|
|||
[iframe_sandbox_popups_nonescaping-3.html]
|
||||
expected: CRASH
|
||||
expected: TIMEOUT
|
||||
[Check that popups from a sandboxed iframe do not escape the sandbox]
|
||||
expected: NOTRUN
|
||||
|
||||
|
|
|
|||
|
|
@ -0,0 +1,4 @@
|
|||
[077.html]
|
||||
[ adding several types of scripts through the DOM and removing some of them confuses scheduler ]
|
||||
expected: FAIL
|
||||
|
||||
|
|
@ -0,0 +1,4 @@
|
|||
[referrer-strict-policies.sub.html]
|
||||
[The strict-* referrer policies compare the trustworthiness of a request's referrer string against its URL]
|
||||
expected: FAIL
|
||||
|
||||
|
|
@ -3,3 +3,6 @@
|
|||
[The incumbent settings object while executing the compiled callback via Web IDL's invoke must be that of the node document]
|
||||
expected: TIMEOUT
|
||||
|
||||
[The entry settings object while executing the compiled callback via Web IDL's invoke must be that of the node document]
|
||||
expected: FAIL
|
||||
|
||||
|
|
|
|||
|
|
@ -1,10 +1,9 @@
|
|||
[promise-job-entry.html]
|
||||
expected: TIMEOUT
|
||||
[Fulfillment handler on fulfilled promise]
|
||||
expected: FAIL
|
||||
|
||||
[Rejection handler on pending-then-rejected promise]
|
||||
expected: TIMEOUT
|
||||
expected: FAIL
|
||||
|
||||
[Sanity check: this all works as expected with no promises involved]
|
||||
expected: FAIL
|
||||
|
|
@ -16,5 +15,5 @@
|
|||
expected: FAIL
|
||||
|
||||
[Fulfillment handler on pending-then-fulfilled promise]
|
||||
expected: TIMEOUT
|
||||
expected: FAIL
|
||||
|
||||
|
|
|
|||
|
|
@ -143,3 +143,21 @@
|
|||
[Location's href: file://%C2%AD/p should throw]
|
||||
expected: FAIL
|
||||
|
||||
[XHR: \\\\\\.\\y: should throw]
|
||||
expected: FAIL
|
||||
|
||||
[XHR: \\\\\\.\\Y: should throw]
|
||||
expected: FAIL
|
||||
|
||||
[window.open(): \\\\\\.\\Y: should throw]
|
||||
expected: FAIL
|
||||
|
||||
[window.open(): \\\\\\.\\y: should throw]
|
||||
expected: FAIL
|
||||
|
||||
[Location's href: \\\\\\.\\y: should throw]
|
||||
expected: FAIL
|
||||
|
||||
[Location's href: \\\\\\.\\Y: should throw]
|
||||
expected: FAIL
|
||||
|
||||
|
|
|
|||
|
|
@ -113,6 +113,13 @@
|
|||
{}
|
||||
]
|
||||
],
|
||||
"orthogonal-flex-item-crash.html": [
|
||||
"056d6588835f6444234e75268c5550b057adfa13",
|
||||
[
|
||||
null,
|
||||
{}
|
||||
]
|
||||
],
|
||||
"padding-overflow-crash.html": [
|
||||
"fd0c333fabadb073b9977a63de6a8c5c3ed79042",
|
||||
[
|
||||
|
|
@ -264,6 +271,13 @@
|
|||
]
|
||||
},
|
||||
"css-scroll-anchoring": {
|
||||
"fullscreen-crash.html": [
|
||||
"545f2919b55ffe31f942e547d5299c00ee89d715",
|
||||
[
|
||||
null,
|
||||
{}
|
||||
]
|
||||
],
|
||||
"table-collapsed-borders-crash.html": [
|
||||
"aa699317e2734fece3d662ad102fdd2772680e25",
|
||||
[
|
||||
|
|
@ -131413,6 +131427,19 @@
|
|||
{}
|
||||
]
|
||||
],
|
||||
"align-items-008.html": [
|
||||
"88aa10690bed3222ef81fec56d9ee94b55d74652",
|
||||
[
|
||||
null,
|
||||
[
|
||||
[
|
||||
"/css/reference/ref-filled-green-100px-square.xht",
|
||||
"=="
|
||||
]
|
||||
],
|
||||
{}
|
||||
]
|
||||
],
|
||||
"align-items-baseline-overflow-non-visible.html": [
|
||||
"3c91bc5553084018b2c16cbeb6721077c8db54e2",
|
||||
[
|
||||
|
|
@ -145626,7 +145653,7 @@
|
|||
]
|
||||
],
|
||||
"abs-pos-003.html": [
|
||||
"c6b7d7b657ef89cd847388b9be28720d474329a9",
|
||||
"8551a0109ed720f8d6a770d5967770e8d9188228",
|
||||
[
|
||||
null,
|
||||
[
|
||||
|
|
@ -146002,6 +146029,32 @@
|
|||
{}
|
||||
]
|
||||
],
|
||||
"parent-repeat-auto-fit-001.html": [
|
||||
"12010c32f29c67222861e8a3e1f2bc20e650af1a",
|
||||
[
|
||||
null,
|
||||
[
|
||||
[
|
||||
"/css/css-grid/subgrid/parent-repeat-auto-fit-001-ref.html",
|
||||
"=="
|
||||
]
|
||||
],
|
||||
{}
|
||||
]
|
||||
],
|
||||
"parent-repeat-auto-fit-002.html": [
|
||||
"d46f59b99f557fb424ff0a7ab2a4962de23023c1",
|
||||
[
|
||||
null,
|
||||
[
|
||||
[
|
||||
"/css/css-grid/subgrid/parent-repeat-auto-fit-002-ref.html",
|
||||
"=="
|
||||
]
|
||||
],
|
||||
{}
|
||||
]
|
||||
],
|
||||
"repeat-auto-fill-001.html": [
|
||||
"9e57028c4cc2757eb3ec52cc214f902562413474",
|
||||
[
|
||||
|
|
@ -155983,6 +156036,19 @@
|
|||
{}
|
||||
]
|
||||
],
|
||||
"text-overflow-ellipsis-editing-input.html": [
|
||||
"b235ca503a80c42d2083ba78195d9b28e1307c22",
|
||||
[
|
||||
null,
|
||||
[
|
||||
[
|
||||
"/css/css-overflow/text-overflow-ellipsis-editing-input-ref.html",
|
||||
"=="
|
||||
]
|
||||
],
|
||||
{}
|
||||
]
|
||||
],
|
||||
"text-overflow-ellipsis-rtl-001.html": [
|
||||
"32284f89c2e5c4db774ba1a73fd3594f49606b06",
|
||||
[
|
||||
|
|
@ -163580,6 +163646,58 @@
|
|||
{}
|
||||
]
|
||||
],
|
||||
"block-aspect-ratio-015.tentative.html": [
|
||||
"3f9e833f1ece948d88ed2eeef5081a852687f3c6",
|
||||
[
|
||||
null,
|
||||
[
|
||||
[
|
||||
"/css/reference/ref-filled-green-100px-square.xht",
|
||||
"=="
|
||||
]
|
||||
],
|
||||
{}
|
||||
]
|
||||
],
|
||||
"block-aspect-ratio-016.tentative.html": [
|
||||
"7bd21e9196ed12605c0bb6f64110e3602a6245ad",
|
||||
[
|
||||
null,
|
||||
[
|
||||
[
|
||||
"/css/reference/ref-filled-green-100px-square.xht",
|
||||
"=="
|
||||
]
|
||||
],
|
||||
{}
|
||||
]
|
||||
],
|
||||
"block-aspect-ratio-017.tentative.html": [
|
||||
"4ea0d69a24f41a70790b4739e2ee8233927b6fe7",
|
||||
[
|
||||
null,
|
||||
[
|
||||
[
|
||||
"/css/reference/ref-filled-green-100px-square.xht",
|
||||
"=="
|
||||
]
|
||||
],
|
||||
{}
|
||||
]
|
||||
],
|
||||
"block-aspect-ratio-018.tentative.html": [
|
||||
"6c92b32c7b0fd45bace2d5bbf57c1f21c286682e",
|
||||
[
|
||||
null,
|
||||
[
|
||||
[
|
||||
"/css/reference/ref-filled-green-100px-square.xht",
|
||||
"=="
|
||||
]
|
||||
],
|
||||
{}
|
||||
]
|
||||
],
|
||||
"flex-aspect-ratio-001.tentative.html": [
|
||||
"3b477e299ad763a1c0108e16f05981c76c25bb77",
|
||||
[
|
||||
|
|
@ -204471,6 +204589,19 @@
|
|||
{}
|
||||
]
|
||||
],
|
||||
"text-orientation-initial.html": [
|
||||
"434e14ccb88f8fde666c7ab646bf882a15bea294",
|
||||
[
|
||||
null,
|
||||
[
|
||||
[
|
||||
"/css/css-writing-modes/text-orientation-initial-ref.html",
|
||||
"=="
|
||||
]
|
||||
],
|
||||
{}
|
||||
]
|
||||
],
|
||||
"text-orientation-mixed-srl-016.xht": [
|
||||
"4fd928a8764f79255dcfbb295544535334a6d6e2",
|
||||
[
|
||||
|
|
@ -205368,6 +205499,19 @@
|
|||
{}
|
||||
]
|
||||
],
|
||||
"writing-mode-initial.html": [
|
||||
"2e7c9272855eff95e38aecb793d40162c4da1e21",
|
||||
[
|
||||
null,
|
||||
[
|
||||
[
|
||||
"/css/css-writing-modes/writing-mode-initial-ref.html",
|
||||
"=="
|
||||
]
|
||||
],
|
||||
{}
|
||||
]
|
||||
],
|
||||
"writing-mode-vertical-lr-002.xht": [
|
||||
"7e03cefd3c9208e3377c6b670ba37f1b7a7ce482",
|
||||
[
|
||||
|
|
@ -242535,7 +242679,7 @@
|
|||
[]
|
||||
],
|
||||
".taskcluster.yml": [
|
||||
"f83710377347b28877d29d3d1363f1cc1e1dff15",
|
||||
"1716de40cf3b3ebf9691811f4bdd02049a4c05e2",
|
||||
[]
|
||||
],
|
||||
".well-known": {
|
||||
|
|
@ -245541,6 +245685,10 @@
|
|||
"greenbox.png": [
|
||||
"6e555e3b197ce2f448f59d61e1488a0175490145",
|
||||
[]
|
||||
],
|
||||
"user-activation.js": [
|
||||
"babd5b2cd32131a65d3eb81c4f5508fefff064cb",
|
||||
[]
|
||||
]
|
||||
}
|
||||
},
|
||||
|
|
@ -296952,7 +297100,7 @@
|
|||
[]
|
||||
],
|
||||
"abs-pos-003-ref.html": [
|
||||
"05e927399dd5ee78e14223fe33def32ceb49c5a9",
|
||||
"19180106e548c8a183ba903b7b9c6f3e443d79a9",
|
||||
[]
|
||||
],
|
||||
"auto-track-sizing-001-ref.html": [
|
||||
|
|
@ -297059,6 +297207,14 @@
|
|||
"1de585bd6230172b9d43556c897d3270c78d9e82",
|
||||
[]
|
||||
],
|
||||
"parent-repeat-auto-fit-001-ref.html": [
|
||||
"2217497cd2bf1813ecb585564788b81488079b85",
|
||||
[]
|
||||
],
|
||||
"parent-repeat-auto-fit-002-ref.html": [
|
||||
"a884a12b991ad2a36e9ea1def1b9ff811a785a00",
|
||||
[]
|
||||
],
|
||||
"repeat-auto-fill-001-ref.html": [
|
||||
"8cd0ef66b974e808463b51db603476adee3b5f5d",
|
||||
[]
|
||||
|
|
@ -299423,7 +299579,11 @@
|
|||
"c2c8914161af668cd57ce7ebac15b2100d93be8b",
|
||||
[]
|
||||
]
|
||||
}
|
||||
},
|
||||
"text-overflow-ellipsis-editing-input-ref.html": [
|
||||
"3902072bc58b7bf62290edafbce1b735288af716",
|
||||
[]
|
||||
]
|
||||
},
|
||||
"css-overscroll-behavior": {
|
||||
"META.yml": [
|
||||
|
|
@ -309992,6 +310152,10 @@
|
|||
"0010955e40522437cce426684b60e96c48f95414",
|
||||
[]
|
||||
],
|
||||
"text-orientation-initial-ref.html": [
|
||||
"322dde323ea8604c37d435f4d205e997a44e962f",
|
||||
[]
|
||||
],
|
||||
"text-orientation-mixed-srl-016-ref.xht": [
|
||||
"bae223a995da64c6a70d9d4e6a068685d7d018c8",
|
||||
[]
|
||||
|
|
@ -310116,6 +310280,10 @@
|
|||
"d7ddfd553d60bbb98243eb32090b76f24fe38113",
|
||||
[]
|
||||
],
|
||||
"writing-mode-initial-ref.html": [
|
||||
"6f7b84fa72ad042924dedba39503ed6ea40bbd20",
|
||||
[]
|
||||
],
|
||||
"writing-mode-vertical-rl-003-ref.htm": [
|
||||
"19c334329711df0af4515614173ebd0ebe818f00",
|
||||
[]
|
||||
|
|
@ -318610,7 +318778,7 @@
|
|||
"feature-policy-for-sandbox": {
|
||||
"resources": {
|
||||
"helper.js": [
|
||||
"eec189871ff82d18c6e8a3cc86ccf9c08597ca42",
|
||||
"4c553525300b998df74b9e5b273fa0a788dde8e4",
|
||||
[]
|
||||
],
|
||||
"opened_window.html": [
|
||||
|
|
@ -318618,7 +318786,7 @@
|
|||
[]
|
||||
],
|
||||
"opened_window.js": [
|
||||
"189eb155cbcfb1bf7a0cbcc84971e01be5c0bf5a",
|
||||
"d69c75cca00b9789511b2a94db054b89e5b69cb8",
|
||||
[]
|
||||
],
|
||||
"window_opener.html": [
|
||||
|
|
@ -318626,7 +318794,7 @@
|
|||
[]
|
||||
],
|
||||
"window_opener.js": [
|
||||
"263a17b524b14fcf8576f61c901df7c0b6afdeca",
|
||||
"6788c25f575b08f17ad35d4d22bfe642e04e9e63",
|
||||
[]
|
||||
]
|
||||
}
|
||||
|
|
@ -320185,7 +320353,7 @@
|
|||
[]
|
||||
],
|
||||
"operators.woff": [
|
||||
"bb747e06ba609d64d9ef6a583d43df25c00a6941",
|
||||
"5d7a588a9cd326d4d906d86c5b218942df27ce2d",
|
||||
[]
|
||||
],
|
||||
"radical-degreebottomraisepercent25-rulethickness1000.woff": [
|
||||
|
|
@ -330696,6 +330864,14 @@
|
|||
"3ae805d78d9ffbc265869f2403311006a37ddc10",
|
||||
[]
|
||||
],
|
||||
"import-referrer-checker-insecure.sub.js": [
|
||||
"2d6fd967120f5f1189c4ada726cbef7d7e537bae",
|
||||
[]
|
||||
],
|
||||
"import-referrer-checker-insecure.sub.js.headers": [
|
||||
"cb762eff806849df46dc758ef7b98b63f27f54c9",
|
||||
[]
|
||||
],
|
||||
"import-referrer-checker.sub.js": [
|
||||
"2c7dce9dffaf809887c8425b00d695019cde7064",
|
||||
[]
|
||||
|
|
@ -333781,7 +333957,7 @@
|
|||
[]
|
||||
],
|
||||
"operator-dictionary-tests.js": [
|
||||
"838a22c446b657fcb654d4a628037fb4204df97a",
|
||||
"b92a852738ffbde90152791c0d67304064e2eafb",
|
||||
[]
|
||||
]
|
||||
}
|
||||
|
|
@ -334123,7 +334299,7 @@
|
|||
[]
|
||||
],
|
||||
"operator-dictionary.json": [
|
||||
"2e9abe73b39f2c44765b7a351a6964d093313f6a",
|
||||
"5dd0ab537243e89316644ec681446c5ff5a8c679",
|
||||
[]
|
||||
]
|
||||
},
|
||||
|
|
@ -343465,7 +343641,7 @@
|
|||
[]
|
||||
],
|
||||
"manifest.py": [
|
||||
"f79edc8435293faed732243134ab0e4447f6b5d9",
|
||||
"19d1bbed0334b938d765fda6738f409a9793b306",
|
||||
[]
|
||||
],
|
||||
"sourcefile.py": [
|
||||
|
|
@ -349181,7 +349357,7 @@
|
|||
[]
|
||||
],
|
||||
"executormarionette.py": [
|
||||
"535923fdb5e9140f8b2c593557a50398f6532b47",
|
||||
"2eaf25801df50276f2b02447d68a3fc98c5c377e",
|
||||
[]
|
||||
],
|
||||
"executoropera.py": [
|
||||
|
|
@ -349260,7 +349436,7 @@
|
|||
[]
|
||||
],
|
||||
"font.py": [
|
||||
"daf0a1c1bfa221aa47981d93239021e4aefa74a9",
|
||||
"6226fc66fedf2afc96b5110f3524b00d185cc538",
|
||||
[]
|
||||
],
|
||||
"formatters": {
|
||||
|
|
@ -349344,7 +349520,7 @@
|
|||
[]
|
||||
],
|
||||
"testloader.py": [
|
||||
"cc9d1e539ac57c3dd5de355a66a59d2490c28351",
|
||||
"3a26efc554211a5248a790909d99893afe9ff674",
|
||||
[]
|
||||
],
|
||||
"testrunner.py": [
|
||||
|
|
@ -349516,11 +349692,11 @@
|
|||
}
|
||||
},
|
||||
"wptrunner.py": [
|
||||
"ce15c5fbbf0bdd3d1227612a4dac9f9e9c4c3f7c",
|
||||
"d0cc19481dbdedc45edfee9608d82deb4a196571",
|
||||
[]
|
||||
],
|
||||
"wpttest.py": [
|
||||
"27d7fbbbd7f41fd89261299986a18d5a4fdbb3ef",
|
||||
"4b43b73610a591808aec938932eca228c08342bf",
|
||||
[]
|
||||
]
|
||||
},
|
||||
|
|
@ -349842,7 +350018,7 @@
|
|||
[]
|
||||
],
|
||||
"response.py": [
|
||||
"f4009702f68ed06bdf863b6d701dd292cdb0259f",
|
||||
"b6f274474519846d298a29da0b3db3961999b24f",
|
||||
[]
|
||||
],
|
||||
"router.py": [
|
||||
|
|
@ -350405,7 +350581,7 @@
|
|||
[]
|
||||
],
|
||||
"urltestdata.json": [
|
||||
"b5b200e640c90d7f2887c1c0f4ac27c56ad7c6da",
|
||||
"dd40eaa5a9f179d6904776e619d6e7f618b2ebf4",
|
||||
[]
|
||||
]
|
||||
}
|
||||
|
|
@ -372462,17 +372638,21 @@
|
|||
]
|
||||
],
|
||||
"async-platform-specific-write-read.tentative.https.html": [
|
||||
"c1e8323f1186d628432ae5b983f0d9f81ba5f1ed",
|
||||
"685b5a58a809f43e7c1379055743d5536258681c",
|
||||
[
|
||||
null,
|
||||
{}
|
||||
{
|
||||
"testdriver": true
|
||||
}
|
||||
]
|
||||
],
|
||||
"async-raw-write-read.tentative.https.html": [
|
||||
"bd11a7f0f9a2a1f2e74d67f908d6ef2eaa2597f5",
|
||||
"e6882b344f86de62af5c31f17719a4de6f94b2bb",
|
||||
[
|
||||
null,
|
||||
{}
|
||||
{
|
||||
"testdriver": true
|
||||
}
|
||||
]
|
||||
],
|
||||
"clipboard-events-synthetic.html": [
|
||||
|
|
@ -383074,6 +383254,13 @@
|
|||
]
|
||||
]
|
||||
},
|
||||
"hittest-before-pseudo.html": [
|
||||
"afba77e06dba12f229779cae6a4b6265d95461bd",
|
||||
[
|
||||
null,
|
||||
{}
|
||||
]
|
||||
],
|
||||
"hittest-overlapping-margin.html": [
|
||||
"5c3601d96aeb42694c66aaff0845c1029474cda1",
|
||||
[
|
||||
|
|
@ -421571,16 +421758,14 @@
|
|||
},
|
||||
"feature-policy-for-sandbox": {
|
||||
"feature-propagation-to-auxiliary-context.html": [
|
||||
"118ccac489c53e14b238f29cbdbd634793e7a611",
|
||||
"86cdcb3b42702fe3d6dedfe13ddae348c3dd32e6",
|
||||
[
|
||||
null,
|
||||
{
|
||||
"timeout": "long"
|
||||
}
|
||||
{}
|
||||
]
|
||||
],
|
||||
"sandbox-policies-in-allow-attribute.html": [
|
||||
"a29d43e5fccabedf376ec5cd28fe213d7902081e",
|
||||
"c9e2d7119382882a663b3f25a0ba70b581ec9b5d",
|
||||
[
|
||||
null,
|
||||
{}
|
||||
|
|
@ -458642,6 +458827,13 @@
|
|||
{}
|
||||
]
|
||||
],
|
||||
"referrer-strict-policies.sub.html": [
|
||||
"1984d875b36668c0b8dbd53f24c50935af261fac",
|
||||
[
|
||||
null,
|
||||
{}
|
||||
]
|
||||
],
|
||||
"referrer-unsafe-url.sub.html": [
|
||||
"443731c1b81375b737eeb9723a0c81d19ceab521",
|
||||
[
|
||||
|
|
@ -466288,66 +466480,282 @@
|
|||
{}
|
||||
]
|
||||
],
|
||||
"operator-dictionary-001.html": [
|
||||
"e4e5c68b26344195844699e531dceacc835a8597",
|
||||
[
|
||||
null,
|
||||
{
|
||||
"timeout": "long"
|
||||
}
|
||||
]
|
||||
],
|
||||
"operator-dictionary-002.html": [
|
||||
"ede3adc210cd5c091c7f56bb234e55d475ebf292",
|
||||
[
|
||||
null,
|
||||
{
|
||||
"timeout": "long"
|
||||
}
|
||||
]
|
||||
],
|
||||
"operator-dictionary-003.html": [
|
||||
"bb3c638e58f820fded8b0d75064a92ebad51e592",
|
||||
[
|
||||
null,
|
||||
{
|
||||
"timeout": "long"
|
||||
}
|
||||
]
|
||||
],
|
||||
"operator-dictionary-004.html": [
|
||||
"79bf523a787bfca3508fd078d528dc6346632224",
|
||||
[
|
||||
null,
|
||||
{
|
||||
"timeout": "long"
|
||||
}
|
||||
]
|
||||
],
|
||||
"operator-dictionary-005.html": [
|
||||
"4c1ee6dd74288596f4a1718988ab33255a3321e8",
|
||||
[
|
||||
null,
|
||||
{
|
||||
"timeout": "long"
|
||||
}
|
||||
]
|
||||
],
|
||||
"operator-dictionary-006.html": [
|
||||
"cdd3e1618b5c1c7e20276eaa5a54799d3029ca06",
|
||||
[
|
||||
null,
|
||||
{
|
||||
"timeout": "long"
|
||||
}
|
||||
]
|
||||
],
|
||||
"operator-dictionary-combining.html": [
|
||||
"21befc92f01673ca7f3d4d2c007e9973d0f142e7",
|
||||
[
|
||||
null,
|
||||
{}
|
||||
]
|
||||
],
|
||||
"operator-dictionary-largeop-001.html": [
|
||||
"8a5d2089ff933864ebb2847503739de460527697",
|
||||
[
|
||||
null,
|
||||
{
|
||||
"timeout": "long"
|
||||
}
|
||||
]
|
||||
],
|
||||
"operator-dictionary-largeop-002.html": [
|
||||
"1650f01261f5c36f67aa6737f2941d80c9ca03cf",
|
||||
[
|
||||
null,
|
||||
{
|
||||
"timeout": "long"
|
||||
}
|
||||
]
|
||||
],
|
||||
"operator-dictionary-largeop-003.html": [
|
||||
"96847592044e94bb50e4ccf5d9b87fd490e4e488",
|
||||
[
|
||||
null,
|
||||
{
|
||||
"timeout": "long"
|
||||
}
|
||||
]
|
||||
],
|
||||
"operator-dictionary-largeop-004.html": [
|
||||
"08f5916b479b949a742ccd58e8678e3b37fceaf2",
|
||||
[
|
||||
null,
|
||||
{
|
||||
"timeout": "long"
|
||||
}
|
||||
]
|
||||
],
|
||||
"operator-dictionary-largeop-005.html": [
|
||||
"9245fbcad9b63238b9bece34c7abf3a8660628b9",
|
||||
[
|
||||
null,
|
||||
{
|
||||
"timeout": "long"
|
||||
}
|
||||
]
|
||||
],
|
||||
"operator-dictionary-largeop-006.html": [
|
||||
"b9d4b681b66f756ffbc60870d5e6d77254288d2e",
|
||||
[
|
||||
null,
|
||||
{
|
||||
"timeout": "long"
|
||||
}
|
||||
]
|
||||
],
|
||||
"operator-dictionary-movablelimits-001.html": [
|
||||
"09698a15fc78433490a08f17b6857f4ab2dce8f1",
|
||||
[
|
||||
null,
|
||||
{
|
||||
"timeout": "long"
|
||||
}
|
||||
]
|
||||
],
|
||||
"operator-dictionary-movablelimits-002.html": [
|
||||
"f3e9deb5afd3a980367f1e1eedf185ff0380a14c",
|
||||
[
|
||||
null,
|
||||
{
|
||||
"timeout": "long"
|
||||
}
|
||||
]
|
||||
],
|
||||
"operator-dictionary-movablelimits-003.html": [
|
||||
"f4c5137b5f32c43d826ba9a618658381c74ca9c2",
|
||||
[
|
||||
null,
|
||||
{
|
||||
"timeout": "long"
|
||||
}
|
||||
]
|
||||
],
|
||||
"operator-dictionary-movablelimits-004.html": [
|
||||
"9432c5dff0f6dd6aae88aa791f256fcfc8c4bf3d",
|
||||
[
|
||||
null,
|
||||
{
|
||||
"timeout": "long"
|
||||
}
|
||||
]
|
||||
],
|
||||
"operator-dictionary-movablelimits-005.html": [
|
||||
"fbffb440182dcea78e657ce5a8907c3d0fb79435",
|
||||
[
|
||||
null,
|
||||
{
|
||||
"timeout": "long"
|
||||
}
|
||||
]
|
||||
],
|
||||
"operator-dictionary-movablelimits-006.html": [
|
||||
"a6a6dfa0784fb2c98cbf728b01a229feab0e4824",
|
||||
[
|
||||
null,
|
||||
{
|
||||
"timeout": "long"
|
||||
}
|
||||
]
|
||||
],
|
||||
"operator-dictionary-spacing-001.html": [
|
||||
"a7781fb3f78951037a66c3a4432bbf8efc133392",
|
||||
[
|
||||
null,
|
||||
{
|
||||
"timeout": "long"
|
||||
}
|
||||
]
|
||||
],
|
||||
"operator-dictionary-spacing-002.html": [
|
||||
"5b524d9095aa66ab054c57441ea596f60edb1dad",
|
||||
[
|
||||
null,
|
||||
{
|
||||
"timeout": "long"
|
||||
}
|
||||
]
|
||||
],
|
||||
"operator-dictionary-spacing-003.html": [
|
||||
"abd8736419bb277fc0bf4050e654bc007cb0c164",
|
||||
[
|
||||
null,
|
||||
{
|
||||
"timeout": "long"
|
||||
}
|
||||
]
|
||||
],
|
||||
"operator-dictionary-spacing-004.html": [
|
||||
"09a1d8c8394fe5c54b7a60cee2e023437a78c525",
|
||||
[
|
||||
null,
|
||||
{
|
||||
"timeout": "long"
|
||||
}
|
||||
]
|
||||
],
|
||||
"operator-dictionary-spacing-005.html": [
|
||||
"fc56326beb41d1f9e2415261eb060c02b66adb96",
|
||||
[
|
||||
null,
|
||||
{
|
||||
"timeout": "long"
|
||||
}
|
||||
]
|
||||
],
|
||||
"operator-dictionary-spacing-006.html": [
|
||||
"2de9d66a0d383f3a77b55fe20935fe93ed33504f",
|
||||
[
|
||||
null,
|
||||
{
|
||||
"timeout": "long"
|
||||
}
|
||||
]
|
||||
],
|
||||
"operator-dictionary-stretchy-001.html": [
|
||||
"672a5d3f1b3f1ebd0af216f57f4831d66c231165",
|
||||
[
|
||||
null,
|
||||
{
|
||||
"timeout": "long"
|
||||
}
|
||||
]
|
||||
],
|
||||
"operator-dictionary-stretchy-002.html": [
|
||||
"bbf5b3e48a015dbfe217b74e9359ceed5408d1f4",
|
||||
[
|
||||
null,
|
||||
{
|
||||
"timeout": "long"
|
||||
}
|
||||
]
|
||||
],
|
||||
"operator-dictionary-stretchy-003.html": [
|
||||
"343ac09df3219b41218d85949af92e186e372ce1",
|
||||
[
|
||||
null,
|
||||
{
|
||||
"timeout": "long"
|
||||
}
|
||||
]
|
||||
],
|
||||
"operator-dictionary-stretchy-004.html": [
|
||||
"dd25c1121a5d88cfd9a12208f76736b19ea6cf9b",
|
||||
[
|
||||
null,
|
||||
{
|
||||
"timeout": "long"
|
||||
}
|
||||
]
|
||||
],
|
||||
"operator-dictionary-stretchy-005.html": [
|
||||
"4d716497436929d0268c806a906d57450e64335c",
|
||||
[
|
||||
null,
|
||||
{
|
||||
"timeout": "long"
|
||||
}
|
||||
]
|
||||
],
|
||||
"operator-dictionary-stretchy-006.html": [
|
||||
"2088168b07240547d449845f152304825b6589a2",
|
||||
[
|
||||
null,
|
||||
{
|
||||
"timeout": "long"
|
||||
}
|
||||
]
|
||||
],
|
||||
"operator-dictionary-symmetric-001.html": [
|
||||
"14b72da2833c8bec19a6c0df053cd48000eb8e64",
|
||||
[
|
||||
null,
|
||||
{
|
||||
"timeout": "long"
|
||||
}
|
||||
]
|
||||
],
|
||||
"operator-dictionary-symmetric-002.html": [
|
||||
"9f18d893d6bcd870865ff14307ead2f00ac0e944",
|
||||
[
|
||||
null,
|
||||
{
|
||||
"timeout": "long"
|
||||
}
|
||||
]
|
||||
],
|
||||
"operator-dictionary-symmetric-003.html": [
|
||||
"73b4b07889eaee702c4defc601899224b6d749bf",
|
||||
[
|
||||
null,
|
||||
{
|
||||
"timeout": "long"
|
||||
}
|
||||
]
|
||||
],
|
||||
"operator-dictionary-symmetric-004.html": [
|
||||
"6bd20562bd71f49a28394ee7261a1024597c2cdd",
|
||||
[
|
||||
null,
|
||||
{
|
||||
"timeout": "long"
|
||||
}
|
||||
]
|
||||
],
|
||||
"operator-dictionary-symmetric-005.html": [
|
||||
"13f045fb95184d6ff873017cb1b01f9ddc962709",
|
||||
[
|
||||
null,
|
||||
{
|
||||
"timeout": "long"
|
||||
}
|
||||
]
|
||||
],
|
||||
"operator-dictionary-symmetric-006.html": [
|
||||
"26267a76ab96f98a7d5f6283e664f420994a0c75",
|
||||
[
|
||||
null,
|
||||
{
|
||||
"timeout": "long"
|
||||
}
|
||||
]
|
||||
]
|
||||
},
|
||||
"radicals": {
|
||||
|
|
@ -474405,7 +474813,7 @@
|
|||
]
|
||||
],
|
||||
"pointerevent_capture_mouse.html": [
|
||||
"32056f09cc1fade179f2528205920b61479b9783",
|
||||
"bae2d14012fb20e2c6bf48ccbcb8f83d87110b83",
|
||||
[
|
||||
null,
|
||||
{
|
||||
|
|
@ -474681,7 +475089,7 @@
|
|||
]
|
||||
],
|
||||
"pointerevent_releasepointercapture_invalid_pointerid.html": [
|
||||
"f51674cb4293a8f7d021a057abc9da16766cd625",
|
||||
"71de19808992cc160dffaef54b1015edaf269569",
|
||||
[
|
||||
null,
|
||||
{
|
||||
|
|
@ -486558,6 +486966,13 @@
|
|||
}
|
||||
]
|
||||
],
|
||||
"cross-origin-status-codes.html": [
|
||||
"e8ece5ff2fea3d4d856cdf3774870c59080a1c45",
|
||||
[
|
||||
null,
|
||||
{}
|
||||
]
|
||||
],
|
||||
"crossorigin-sandwich-TAO.sub.html": [
|
||||
"695bd654bb57d35edbcdf8409aaf9c09af9f620e",
|
||||
[
|
||||
|
|
|
|||
|
|
@ -0,0 +1,4 @@
|
|||
[hit-test-floats-002.html]
|
||||
[Hit test float]
|
||||
expected: FAIL
|
||||
|
||||
|
|
@ -0,0 +1,4 @@
|
|||
[hittest-before-pseudo.html]
|
||||
[Hit-testing text within a pseudo-element flex-item should return the flexbox as the hittest result.]
|
||||
expected: FAIL
|
||||
|
||||
|
|
@ -1,4 +0,0 @@
|
|||
[elementFromPoint-001.html]
|
||||
[CSSOM View - 5 - extensions to the Document interface]
|
||||
expected: FAIL
|
||||
|
||||
|
|
@ -21,3 +21,6 @@
|
|||
[test the top of layer]
|
||||
expected: FAIL
|
||||
|
||||
[test some point of the element: top left corner]
|
||||
expected: FAIL
|
||||
|
||||
|
|
|
|||
|
|
@ -1,4 +0,0 @@
|
|||
[elementsFromPoint-invalid-cases.html]
|
||||
[The root element is the last element returned for otherwise empty queries within the viewport]
|
||||
expected: FAIL
|
||||
|
||||
|
|
@ -312,15 +312,27 @@
|
|||
[fetch(): separate response Content-Type: text/plain ]
|
||||
expected: NOTRUN
|
||||
|
||||
[<iframe>: combined response Content-Type: text/html;" text/plain]
|
||||
expected: FAIL
|
||||
|
||||
[<iframe>: separate response Content-Type: text/html;" text/plain]
|
||||
expected: FAIL
|
||||
|
||||
[<iframe>: separate response Content-Type: text/plain */*]
|
||||
expected: FAIL
|
||||
|
||||
[<iframe>: separate response Content-Type: text/html */*;charset=gbk]
|
||||
[<iframe>: combined response Content-Type: */* text/html]
|
||||
expected: FAIL
|
||||
|
||||
[<iframe>: separate response Content-Type: text/html */*]
|
||||
expected: FAIL
|
||||
|
||||
[<iframe>: separate response Content-Type: text/html;x=" text/plain]
|
||||
expected: FAIL
|
||||
|
||||
[<iframe>: combined response Content-Type: text/html;" \\" text/plain]
|
||||
expected: FAIL
|
||||
|
||||
[<iframe>: separate response Content-Type: text/html;" \\" text/plain]
|
||||
expected: FAIL
|
||||
|
||||
[<iframe>: combined response Content-Type: text/html;x=" text/plain]
|
||||
expected: FAIL
|
||||
|
||||
[<iframe>: separate response Content-Type: text/plain */*;charset=gbk]
|
||||
expected: FAIL
|
||||
|
||||
|
|
|
|||
|
|
@ -53,6 +53,9 @@
|
|||
[combined text/javascript ]
|
||||
expected: FAIL
|
||||
|
||||
[separate text/javascript x/x]
|
||||
expected: FAIL
|
||||
|
||||
[separate text/javascript; charset=windows-1252 text/javascript]
|
||||
expected: FAIL
|
||||
|
||||
|
|
|
|||
|
|
@ -1,4 +1,4 @@
|
|||
[traverse_the_history_5.html]
|
||||
[traverse_the_history_4.html]
|
||||
[Multiple history traversals, last would be aborted]
|
||||
expected: FAIL
|
||||
|
||||
|
|
@ -1,6 +1,5 @@
|
|||
[iframe_sandbox_popups_escaping-3.html]
|
||||
type: testharness
|
||||
expected: TIMEOUT
|
||||
[Check that popups from a sandboxed iframe escape the sandbox if\n allow-popups-to-escape-sandbox is used]
|
||||
expected: TIMEOUT
|
||||
expected: FAIL
|
||||
|
||||
|
|
|
|||
|
|
@ -1,6 +1,6 @@
|
|||
[iframe_sandbox_popups_nonescaping-2.html]
|
||||
type: testharness
|
||||
expected: TIMEOUT
|
||||
expected: CRASH
|
||||
[Check that popups from a sandboxed iframe do not escape the sandbox]
|
||||
expected: NOTRUN
|
||||
|
||||
|
|
|
|||
|
|
@ -1,6 +1,6 @@
|
|||
[iframe_sandbox_popups_nonescaping-3.html]
|
||||
type: testharness
|
||||
expected: CRASH
|
||||
expected: TIMEOUT
|
||||
[Check that popups from a sandboxed iframe do not escape the sandbox]
|
||||
expected: NOTRUN
|
||||
|
||||
|
|
|
|||
|
|
@ -0,0 +1,4 @@
|
|||
[077.html]
|
||||
[ adding several types of scripts through the DOM and removing some of them confuses scheduler ]
|
||||
expected: FAIL
|
||||
|
||||
|
|
@ -0,0 +1,4 @@
|
|||
[referrer-strict-policies.sub.html]
|
||||
[The strict-* referrer policies compare the trustworthiness of a request's referrer string against its URL]
|
||||
expected: FAIL
|
||||
|
||||
|
|
@ -4,3 +4,6 @@
|
|||
[The incumbent settings object while executing the compiled callback via Web IDL's invoke must be that of the node document]
|
||||
expected: TIMEOUT
|
||||
|
||||
[The entry settings object while executing the compiled callback via Web IDL's invoke must be that of the node document]
|
||||
expected: FAIL
|
||||
|
||||
|
|
|
|||
|
|
@ -1,10 +1,9 @@
|
|||
[promise-job-entry.html]
|
||||
expected: TIMEOUT
|
||||
[Fulfillment handler on fulfilled promise]
|
||||
expected: FAIL
|
||||
|
||||
[Rejection handler on pending-then-rejected promise]
|
||||
expected: TIMEOUT
|
||||
expected: FAIL
|
||||
|
||||
[Sanity check: this all works as expected with no promises involved]
|
||||
expected: FAIL
|
||||
|
|
@ -16,5 +15,5 @@
|
|||
expected: FAIL
|
||||
|
||||
[Fulfillment handler on pending-then-fulfilled promise]
|
||||
expected: TIMEOUT
|
||||
expected: FAIL
|
||||
|
||||
|
|
|
|||
|
|
@ -147,3 +147,21 @@
|
|||
[Location's href: file://%C2%AD/p should throw]
|
||||
expected: FAIL
|
||||
|
||||
[XHR: \\\\\\.\\y: should throw]
|
||||
expected: FAIL
|
||||
|
||||
[XHR: \\\\\\.\\Y: should throw]
|
||||
expected: FAIL
|
||||
|
||||
[window.open(): \\\\\\.\\Y: should throw]
|
||||
expected: FAIL
|
||||
|
||||
[window.open(): \\\\\\.\\y: should throw]
|
||||
expected: FAIL
|
||||
|
||||
[Location's href: \\\\\\.\\y: should throw]
|
||||
expected: FAIL
|
||||
|
||||
[Location's href: \\\\\\.\\Y: should throw]
|
||||
expected: FAIL
|
||||
|
||||
|
|
|
|||
|
|
@ -12,7 +12,7 @@ tasks:
|
|||
else:
|
||||
$if: 'tasks_for == "github-pull-request"'
|
||||
then:
|
||||
$if: 'event.action in ["opened", "reopened", "synchronize", "ready_for_review"] && !(event.pull_request.draft)'
|
||||
$if: 'event.action in ["opened", "reopened", "synchronize"]'
|
||||
then: true
|
||||
else: false
|
||||
else: false
|
||||
|
|
|
|||
|
|
@ -2,8 +2,12 @@
|
|||
<meta charset="utf-8">
|
||||
<title>Async Clipboard raw platform-specific write -> read tests</title>
|
||||
<link rel="help" href="https://w3c.github.io/clipboard-apis/#async-clipboard-api">
|
||||
<body>Body needed for test_driver.click()</body>
|
||||
<script src="/resources/testharness.js"></script>
|
||||
<script src="/resources/testharnessreport.js"></script>
|
||||
<script src="/resources/testdriver.js"></script>
|
||||
<script src="/resources/testdriver-vendor.js"></script>
|
||||
<script src="resources/user-activation.js"></script>
|
||||
<script>
|
||||
'use strict';
|
||||
|
||||
|
|
@ -11,6 +15,7 @@ async function rawWriteBeforeTest() {
|
|||
const format = 'RawClipboardDisabledFormat';
|
||||
const blob = new Blob(['RawClipboardDisabled'], {type: format});
|
||||
const clipboardItem = new ClipboardItem({[format]: blob}, {raw: true});
|
||||
await waitForUserActivation();
|
||||
await navigator.clipboard.write([clipboardItem]);
|
||||
}
|
||||
|
||||
|
|
@ -38,9 +43,11 @@ promise_test(async t => {
|
|||
assert_equals(blobInput.type, format.toLowerCase());
|
||||
const clipboardItemInput = new ClipboardItem(
|
||||
{[format]: blobInput}, {raw: true});
|
||||
await waitForUserActivation();
|
||||
await navigator.clipboard.write([clipboardItemInput]);
|
||||
|
||||
// Items should be readable on a raw clipboard after raw write.
|
||||
await waitForUserActivation();
|
||||
const clipboardItems = await navigator.clipboard.read({raw: true});
|
||||
assert_equals(clipboardItems.length, 1);
|
||||
const clipboardItem = clipboardItems[0];
|
||||
|
|
@ -57,7 +64,6 @@ promise_test(async t => {
|
|||
// accessible as text.
|
||||
const textOutput = await navigator.clipboard.readText();
|
||||
assert_equals(textOutput, dataToWrite);
|
||||
|
||||
}, 'Verify write and read clipboard given platform-specific raw input');
|
||||
</script>
|
||||
<p>
|
||||
|
|
|
|||
|
|
@ -2,8 +2,12 @@
|
|||
<meta charset="utf-8">
|
||||
<title>Async Clipboard raw write -> Async Clipboard raw read test</title>
|
||||
<link rel="help" href="https://w3c.github.io/clipboard-apis/#async-clipboard-api">
|
||||
<body>Body needed for test_driver.click()</body>
|
||||
<script src="/resources/testharness.js"></script>
|
||||
<script src="/resources/testharnessreport.js"></script>
|
||||
<script src="/resources/testdriver.js"></script>
|
||||
<script src="/resources/testdriver-vendor.js"></script>
|
||||
<script src="resources/user-activation.js"></script>
|
||||
<script>
|
||||
'use strict';
|
||||
|
||||
|
|
@ -16,6 +20,7 @@ promise_test(async t => {
|
|||
const blobInput2 = new Blob(['input data 2'], {type: format2});
|
||||
const clipboardItemInput = new ClipboardItem(
|
||||
{[format1]: blobInput1, [format2]: blobInput2}, {raw: true});
|
||||
await waitForUserActivation();
|
||||
await navigator.clipboard.write([clipboardItemInput]);
|
||||
|
||||
// Items may not be readable on the sanitized clipboard after raw write.
|
||||
|
|
@ -23,6 +28,7 @@ promise_test(async t => {
|
|||
navigator.clipboard.read({raw: false}));
|
||||
|
||||
// Items should be readable on a raw clipboard after raw write.
|
||||
await waitForUserActivation();
|
||||
const clipboardItems = await navigator.clipboard.read({raw: true});
|
||||
assert_equals(clipboardItems.length, 1);
|
||||
const clipboardItem = clipboardItems[0];
|
||||
|
|
@ -41,7 +47,6 @@ promise_test(async t => {
|
|||
assert_equals(data2, 'input data 2');
|
||||
|
||||
}, 'Verify write and read clipboard given 2 platform-neutral raw inputs');
|
||||
|
||||
</script>
|
||||
<p>
|
||||
Note: This is a manual test because it writes/reads to the shared system
|
||||
|
|
|
|||
|
|
@ -0,0 +1,21 @@
|
|||
'use strict';
|
||||
|
||||
// In order to use this function, please import testdriver.js and
|
||||
// testdriver-vendor.js, and include a <body> element.
|
||||
async function waitForUserActivation() {
|
||||
const loadedPromise = new Promise(resolve => {
|
||||
if(document.readyState == 'complete') {
|
||||
resolve();
|
||||
return;
|
||||
}
|
||||
window.addEventListener('load', resolve, {once: true});
|
||||
});
|
||||
await loadedPromise;
|
||||
|
||||
const clickedPromise = new Promise(resolve => {
|
||||
document.body.addEventListener('click', resolve, {once: true});
|
||||
});
|
||||
|
||||
test_driver.click(document.body);
|
||||
await clickedPromise;
|
||||
}
|
||||
|
|
@ -0,0 +1,12 @@
|
|||
<!DOCTYPE html>
|
||||
<link rel="match" href="../reference/ref-filled-green-100px-square.xht" />
|
||||
<link rel="help" href="https://crbug.com/1081086" />
|
||||
<meta name="assert" content="Tests that certain dynamic changes don't lead to an incorrectly sized flex-item." />
|
||||
<p>Test passes if there is a filled green square and <strong>no red</strong>.</p>
|
||||
<div id="target" style="display: flex; min-height: 200px;">
|
||||
<div style="width: 100px; min-height: 100px; background: green;"></div>
|
||||
</div>
|
||||
<script>
|
||||
document.body.offsetTop;
|
||||
document.getElementById('target').style.alignItems = 'flex-start';
|
||||
</script>
|
||||
|
|
@ -0,0 +1,21 @@
|
|||
<!DOCTYPE html>
|
||||
<link rel="help" href="https://crbug.com/1081789" />
|
||||
<link rel="stylesheet" type="text/css" href="/fonts/ahem.css" />
|
||||
<script src="/resources/testharness.js"></script>
|
||||
<script src="/resources/testharnessreport.js"></script>
|
||||
<style>
|
||||
#target::before {
|
||||
font: 50px/1 Ahem;
|
||||
display: inline-flex;
|
||||
content: "X";
|
||||
border: 2px solid black;
|
||||
color: green;
|
||||
}
|
||||
</style>
|
||||
<div id=target></div>
|
||||
<script>
|
||||
test(function(t) {
|
||||
const target = document.getElementById('target');
|
||||
assert_equals(target, document.elementFromPoint(30, 30));
|
||||
}, 'Hit-testing text within a pseudo-element flex-item should return the flexbox as the hittest result.');
|
||||
</script>
|
||||
|
|
@ -0,0 +1,18 @@
|
|||
<!DOCTYPE html>
|
||||
<link rel="help" href="https://crbug.com/1081086" />
|
||||
<meta name="assert" content="This test ensures that orthogonal flex and flex-items does not crash." />
|
||||
<link rel="stylesheet" type="text/css" href="/fonts/ahem.css" />
|
||||
<body style="width: 100px; height: 100px; font: 12px/1 Ahem;">
|
||||
<div style="display: flex; writing-mode: vertical-rl;">
|
||||
text text
|
||||
<div style="min-height: 0; writing-mode: horizontal-tb;">
|
||||
<span id="target"></span>
|
||||
text
|
||||
</div>
|
||||
</div>
|
||||
</body>
|
||||
<script>
|
||||
document.body.offsetTop;
|
||||
const target = document.getElementById('target');
|
||||
target.parentElement.appendChild(target);
|
||||
</script>
|
||||
|
|
@ -56,6 +56,7 @@ a {
|
|||
<div class="grid"><div class="subgrid t1"></div></div>
|
||||
<div class="grid"><div class="subgrid t1"><x></x></div></div>
|
||||
<div class="grid"><div class="subgrid t1"><x></x><x></x></div></div>
|
||||
<div class="grid"><div class="subgrid t1"></div></div>
|
||||
<div class="grid a"><div class="subgrid t1"></div></div>
|
||||
<div class="grid a"><div class="subgrid t1"><x></x></div></div>
|
||||
<div class="grid a"><div class="subgrid t1"><x></x></div></div>
|
||||
|
|
@ -68,6 +69,7 @@ a {
|
|||
|
||||
<div class="grid"><div class="subgrid t2"></div></div>
|
||||
<div class="grid"><div class="subgrid t2"><x></x></div></div>
|
||||
<div class="grid"><div class="subgrid t2"></div></div>
|
||||
<div class="grid"><div class="subgrid t2"><x></x><x></x></div></div>
|
||||
<div class="grid a"><div class="subgrid t2"></div></div>
|
||||
<div class="grid a"><div class="subgrid t2"><x></x></div></div>
|
||||
|
|
@ -81,6 +83,7 @@ a {
|
|||
|
||||
<div class="grid"><div class="subgrid t3"></div></div>
|
||||
<div class="grid"><div class="subgrid t3"><x></x></div></div>
|
||||
<div class="grid"><div class="subgrid t3"></div></div>
|
||||
<div class="grid"><div class="subgrid t3"><x></x><x></x></div></div>
|
||||
<div class="grid a"><div class="subgrid t3"></div></div>
|
||||
<div class="grid a"><div class="subgrid t3"><x></x></div></div>
|
||||
|
|
@ -96,6 +99,7 @@ a {
|
|||
|
||||
<div class="grid"><div class="subgrid t1"><a></a></div></div>
|
||||
<div class="grid"><div class="subgrid t1"><a></a><a></a></div></div>
|
||||
<div class="grid"><div class="subgrid t1"><a></a></div></div>
|
||||
<div class="grid a"><div class="subgrid t1"><a></a></div></div>
|
||||
<div class="grid a"><div class="subgrid t1"><a></a><a></a></div></div>
|
||||
<div class="grid c"><div class="subgrid t1"><a></a></div></div>
|
||||
|
|
@ -105,6 +109,7 @@ a {
|
|||
|
||||
<div class="grid"><div class="subgrid t2"><a></a></div></div>
|
||||
<div class="grid"><div class="subgrid t2"><a></a><a></a></div></div>
|
||||
<div class="grid"><div class="subgrid t2"><a></a></div></div>
|
||||
<div class="grid a"><div class="subgrid t2"><a></a></div></div>
|
||||
<div class="grid a"><div class="subgrid t2"><a></a><a></a></div></div>
|
||||
<div class="grid c"><div class="subgrid t2"><a></a></div></div>
|
||||
|
|
@ -112,6 +117,7 @@ a {
|
|||
<div class="grid r"><div class="subgrid t2"><a></a></div></div>
|
||||
<div class="grid r"><div class="subgrid t2"><a></a><a></a></div></div>
|
||||
|
||||
<div class="grid"><div class="subgrid t3"><a></a></div></div>
|
||||
<div class="grid"><div class="subgrid t3"><a></a></div></div>
|
||||
<div class="grid"><div class="subgrid t3"><a></a><a></a></div></div>
|
||||
<div class="grid a"><div class="subgrid t3"><a></a></div></div>
|
||||
|
|
|
|||
|
|
@ -45,6 +45,12 @@ a {
|
|||
background: purple;
|
||||
}
|
||||
|
||||
.o { overflow: hidden; }
|
||||
.abs {
|
||||
grid-auto-rows: 3em;
|
||||
grid-auto-columns: 3em;
|
||||
}
|
||||
.abs x { width:auto; height:auto; }
|
||||
</style>
|
||||
</head>
|
||||
<body>
|
||||
|
|
@ -52,6 +58,7 @@ a {
|
|||
<div class="grid"><div class="subgrid t1"></div></div>
|
||||
<div class="grid"><div class="subgrid t1"><x></x></div></div>
|
||||
<div class="grid"><div class="subgrid t1"><x></x><x></x></div></div>
|
||||
<div class="grid abs"><div class="subgrid t1 o"><x></x></div></div>
|
||||
<div class="grid a"><div class="subgrid t1"></div></div>
|
||||
<div class="grid a"><div class="subgrid t1"><x></x></div></div>
|
||||
<div class="grid a"><div class="subgrid t1"><x></x><x></x></div></div>
|
||||
|
|
@ -64,6 +71,7 @@ a {
|
|||
|
||||
<div class="grid"><div class="subgrid t2"></div></div>
|
||||
<div class="grid"><div class="subgrid t2"><x></x></div></div>
|
||||
<div class="grid abs"><div class="subgrid t2 o"><x></x></div></div>
|
||||
<div class="grid"><div class="subgrid t2"><x></x><x></x></div></div>
|
||||
<div class="grid a"><div class="subgrid t2"></div></div>
|
||||
<div class="grid a"><div class="subgrid t2"><x></x></div></div>
|
||||
|
|
@ -77,6 +85,7 @@ a {
|
|||
|
||||
<div class="grid"><div class="subgrid t3"></div></div>
|
||||
<div class="grid"><div class="subgrid t3"><x></x></div></div>
|
||||
<div class="grid abs"><div class="subgrid t3 o"><x></x></div></div>
|
||||
<div class="grid"><div class="subgrid t3"><x></x><x></x></div></div>
|
||||
<div class="grid a"><div class="subgrid t3"></div></div>
|
||||
<div class="grid a"><div class="subgrid t3"><x></x></div></div>
|
||||
|
|
@ -92,6 +101,7 @@ a {
|
|||
|
||||
<div class="grid"><div class="subgrid t1"><a></a></div></div>
|
||||
<div class="grid"><div class="subgrid t1"><a></a><a></a></div></div>
|
||||
<div class="grid abs"><div class="subgrid t1 o"><a></a></div></div>
|
||||
<div class="grid a"><div class="subgrid t1"><a></a></div></div>
|
||||
<div class="grid a"><div class="subgrid t1"><a></a><a></a></div></div>
|
||||
<div class="grid c"><div class="subgrid t1"><a></a></div></div>
|
||||
|
|
@ -101,6 +111,7 @@ a {
|
|||
|
||||
<div class="grid"><div class="subgrid t2"><a></a></div></div>
|
||||
<div class="grid"><div class="subgrid t2"><a></a><a></a></div></div>
|
||||
<div class="grid abs"><div class="subgrid t2 o"><a></a></div></div>
|
||||
<div class="grid a"><div class="subgrid t2"><a></a></div></div>
|
||||
<div class="grid a"><div class="subgrid t2"><a></a><a></a></div></div>
|
||||
<div class="grid c"><div class="subgrid t2"><a></a></div></div>
|
||||
|
|
@ -110,6 +121,7 @@ a {
|
|||
|
||||
<div class="grid"><div class="subgrid t3"><a></a></div></div>
|
||||
<div class="grid"><div class="subgrid t3"><a></a><a></a></div></div>
|
||||
<div class="grid abs"><div class="subgrid t3 o"><a></a></div></div>
|
||||
<div class="grid a"><div class="subgrid t3"><a></a></div></div>
|
||||
<div class="grid a"><div class="subgrid t3"><a></a><a></a></div></div>
|
||||
<div class="grid c"><div class="subgrid t3"><a></a></div></div>
|
||||
|
|
|
|||
|
|
@ -0,0 +1,436 @@
|
|||
<!DOCTYPE HTML>
|
||||
<!--
|
||||
Any copyright is dedicated to the Public Domain.
|
||||
http://creativecommons.org/publicdomain/zero/1.0/
|
||||
-->
|
||||
<html><head>
|
||||
<meta charset="utf-8">
|
||||
<title>Reference: subgrid inside a parent with repeat(auto-fit) columns</title>
|
||||
<link rel="author" title="Mats Palmgren" href="mailto:mats@mozilla.com">
|
||||
<style>
|
||||
html,body {
|
||||
color:black; background-color:white; font:10px/1 monospace; padding:0; margin:0;
|
||||
}
|
||||
|
||||
.grid {
|
||||
display: inline-grid;
|
||||
width: 50px;
|
||||
border: 1px solid;
|
||||
}
|
||||
|
||||
.subgrid {
|
||||
display: grid;
|
||||
grid-template-columns: subgrid;
|
||||
grid-column: 3 / span 4;
|
||||
grid-auto-rows: 8px;
|
||||
background: grey;
|
||||
}
|
||||
|
||||
.fit-0a { grid-template-columns: [y] 0px [z] 1px [z] 1px [z] 1px [z] 1px [z]; }
|
||||
.fit-0b { grid-template-columns: [x y] 0px [z] 1px [z] 1px [z] 1px [z]; }
|
||||
.fit-0c { grid-template-columns: [x] 1px [x y] 0px [y] 10px [y] 10px [y] 10px [z] 1px [z] 1px [z]; }
|
||||
.fit-0d { grid-template-columns: [x] 2px [x] 2px [x y] 10px [y] 10px [y] 10px [y] 10px [z] 1px [z]; }
|
||||
.fit-0e { grid-template-columns: [x] 2px [x] 2px [x] 2px [x y] 10px [y] 10px [y] 10px [y] 0px [z]; }
|
||||
.fit-0f { grid-template-columns: [x] 2px [x] 2px [x] 2px [x] 2px [x y] 10px [y] 10px [y] 0px [y] 0px; }
|
||||
.fit-0g { grid-template-columns: [x] 2px [x] 2px [x] 2px [x] 2px [x y] 10px [y] 10px [y] 0px [y] 0px [z] 1px [z]; }
|
||||
.fit-0h { grid-template-columns: [x] 2px [x] 2px [x] 2px [x] 2px [x] 2px [x] 2px [x y] 0px [y] 0px [y] 0px [z] 1px [z]; }
|
||||
.fit-0i { grid-template-columns: [x] 2px [x] 2px [x] 2px [x] 2px [x] 2px [x] 2px [x y] 0px [y] 0px [y] 0px [z]; }
|
||||
.fit-0j { grid-template-columns: [x] 2px [x] 2px [x] 2px [x] 2px [x] 2px [x] 2px [x y] 0px [y] 0px [y] 0px; }
|
||||
.fit-0k { grid-template-columns: [y] 0px [z] 10px [z] 10px [z] 10px [z] 10px [z] 10px [z] 10px [z] 10px [z] 10px [z] 10px [z] 10px [z] 10px [z] 10px [z] 10px [z] 10px [z] 10px [z] 10px [z] 10px [z] 10px [z] 10px [z] 10px [z] 10px [z] 10px [z] 10px [z] 10px [z] 10px [z] 10px [z] 10px [z] 10px [z] 10px [z] 10px [z] 10px [z] 10px [z] 10px [z] 10px [z] 10px [z] 10px [z] 10px [z] 10px [z] 10px [z] 10px [z] 10px [z] 10px [z] 10px [z] 10px [z] 10px [z] 10px [z] 10px [z] 10px [z] 10px [z] 10px [z] 10px [z] 10px [z] 10px [z] 10px [z] 10px [z] 10px [z] 10px [z] 10px [z] 10px [z] 10px [z] 10px [z] 10px [z] 10px [z] 10px [z] 10px [z] 10px [z] 10px [z] 10px [z] 10px [z] 10px [z] 10px [z] 10px [z] 10px [z] 10px [z] 10px [z] 10px [z] 10px [z] 10px [z] 10px [z] 10px [z] 10px [z] 10px [z] 10px [z] 10px [z] 10px [z] 10px [z] 10px [z] 10px [z] 10px [z] 10px [z] 10px [z] 10px [z] 10px [z] 10px [z] 10px [z] 10px [z] 10px [z] 10px [z] 10px [z] 10px; }
|
||||
.fit-0l { grid-template-columns: [x y] 0px [z] 10px [z] 10px [z] 10px [z] 10px [z] 10px [z] 10px [z] 10px [z] 10px [z] 10px [z] 10px [z] 10px [z] 10px [z] 10px [z] 10px [z] 10px [z] 10px [z] 10px [z] 10px [z] 10px [z] 10px [z] 10px [z] 10px [z] 10px [z] 10px [z] 10px [z] 10px [z] 10px [z] 10px [z] 10px [z] 10px [z] 10px [z] 10px [z] 10px [z] 10px [z] 10px [z] 10px [z] 10px [z] 10px [z] 10px [z] 10px [z] 10px [z] 10px [z] 10px [z] 10px [z] 10px [z] 10px [z] 10px [z] 10px [z] 10px [z] 10px [z] 10px [z] 10px [z] 10px [z] 10px [z] 10px [z] 10px [z] 10px [z] 10px [z] 10px [z] 10px [z] 10px [z] 10px [z] 10px [z] 10px [z] 10px [z] 10px [z] 10px [z] 10px [z] 10px [z] 10px [z] 10px [z] 10px [z] 10px [z] 10px [z] 10px [z] 10px [z] 10px [z] 10px [z] 10px [z] 10px [z] 10px [z] 10px [z] 10px [z] 10px [z] 10px [z] 10px [z] 10px [z] 10px [z] 10px [z] 10px [z] 10px [z] 10px [z] 10px [z] 10px [z] 10px [z] 10px [z] 10px [z] 10px [z] 10px [z] 10px; }
|
||||
.fit-0m { grid-template-columns: [x] 10px [x] 10px [x] 10px [x] 10px [x] 10px [x] 10px [x] 10px [x] 10px [x] 10px [x] 10px [x] 10px [x] 10px [x] 10px [x] 10px [x] 10px [x] 10px [x] 10px [x] 10px [x] 10px [x] 10px [x] 10px [x] 10px [x] 10px [x] 10px [x] 10px [x] 10px [x] 10px [x] 10px [x] 10px [x] 10px [x] 10px [x] 10px [x] 10px [x] 10px [x] 10px [x] 10px [x] 10px [x] 10px [x] 10px [x] 10px [x] 10px [x] 10px [x] 10px [x] 10px [x] 10px [x] 10px [x] 10px [x] 10px [x] 10px [x] 10px [x] 10px [x] 10px [x] 10px [x] 10px [x] 10px [x] 10px [x] 10px [x] 10px [x] 10px [x] 10px [x] 10px [x] 10px [x] 10px [x] 10px [x] 10px [x] 10px [x] 10px [x] 10px [x] 10px [x] 10px [x] 10px [x] 10px [x] 10px [x] 10px [x] 10px [x] 10px [x] 10px [x] 10px [x] 10px [x] 10px [x] 10px [x] 10px [x] 10px [x] 10px [x] 10px [x] 10px [x] 10px [x] 10px [x] 10px [x] 10px [x] 10px [x] 10px [x] 10px [x] 10px [x] 10px [x] 10px [x] 10px [x] 10px [x] 10px [x] 10px [y] 0px; }
|
||||
|
||||
.fit-1a { grid-template-columns: [y] 0px [y] 0px [y] 10px [y] 10px [z] 1px [z] 1px [z] 1px [z]; }
|
||||
.fit-1b { grid-template-columns: [x y] 0px [y] 0px [y] 10px [y] 10px [z] 1px [z] 1px [z]; }
|
||||
.fit-1c { grid-template-columns: [x] 2px [x y] 0px [y] 10px [y] 10px [y] 10px [z] 1px [z]; }
|
||||
.fit-1d { grid-template-columns: [x] 2px [x] 2px [x y] 10px [y] 10px [y] 10px [y] 10px [z]; }
|
||||
.fit-1e { grid-template-columns: [x] 2px [x] 2px [x] 2px [x y] 10px [y] 10px [y] 10px [y] 0px; }
|
||||
|
||||
.fit-2a { grid-template-columns: [y] 0px [y] 0px [y] 10px [y] 10px [z] 1px [z] 1px [z]; }
|
||||
.fit-2b { grid-template-columns: [x y] 0px [y] 0px [y] 10px [y] 10px [z] 1px [z]; }
|
||||
.fit-2c { grid-template-columns: [x] 2px [x y] 0px [y] 10px [y] 10px [y] 10px [z]; }
|
||||
.fit-2d { grid-template-columns: [x] 2px [x] 2px [x y] 10px [y] 10px [y] 10px [y] 10px; }
|
||||
|
||||
.fit-3a { grid-template-columns: [y] 0px [y] 0px [y] 10px [y] 10px [z] 1px [z]; }
|
||||
.fit-3b { grid-template-columns: [x y] 0px [y] 0px [y] 10px [y] 10px [y] 10px [z]; }
|
||||
.fit-3c { grid-template-columns: [x] 2px [x y] 0px [y] 10px [y] 10px [y] 10px; }
|
||||
|
||||
.fit-4a { grid-template-columns: [y] 0px [y] 0px [y] 10px [y] 10px [y] 10px [z]; }
|
||||
.fit-4b { grid-template-columns: [x y] 0px [y] 0px [y] 10px [y] 10px [y] 10px; }
|
||||
|
||||
.fit-5 { grid-template-columns: [y] 0px [y] 0px [y] 10px [y] 10px [y] 10px; }
|
||||
|
||||
.subgrid > :nth-child(2n) { background: black; }
|
||||
.subgrid > :nth-child(2n+1) { background: pink; }
|
||||
|
||||
</style>
|
||||
</head>
|
||||
<body>
|
||||
|
||||
<div class="grid fit-0a"><div class="subgrid">
|
||||
<div style="grid-column:y 5"></div>
|
||||
<div style="grid-column:y 4"></div>
|
||||
<div style="grid-column:y 3"></div>
|
||||
<div style="grid-column:y 2"></div>
|
||||
<div style="grid-column:y 1"></div>
|
||||
<div style="grid-column:y -1"></div>
|
||||
<div style="grid-column:y -2"></div>
|
||||
<div style="grid-column:y -3"></div>
|
||||
<div style="grid-column:y -4"></div>
|
||||
<div style="grid-column:y -5"></div>
|
||||
</div></div>
|
||||
|
||||
<div class="grid fit-0b"><div class="subgrid">
|
||||
<div style="grid-column:y 5"></div>
|
||||
<div style="grid-column:y 4"></div>
|
||||
<div style="grid-column:y 3"></div>
|
||||
<div style="grid-column:y 2"></div>
|
||||
<div style="grid-column:y 1"></div>
|
||||
<div style="grid-column:y -1"></div>
|
||||
<div style="grid-column:y -2"></div>
|
||||
<div style="grid-column:y -3"></div>
|
||||
<div style="grid-column:y -4"></div>
|
||||
<div style="grid-column:y -5"></div>
|
||||
</div></div>
|
||||
|
||||
<div class="grid fit-0c"><div class="subgrid">
|
||||
<div style="grid-column:y 5"></div>
|
||||
<div style="grid-column:y 4"></div>
|
||||
<div style="grid-column:y 3"></div>
|
||||
<div style="grid-column:y 2"></div>
|
||||
<div style="grid-column:y 1"></div>
|
||||
<div style="grid-column:y -1"></div>
|
||||
<div style="grid-column:y -2"></div>
|
||||
<div style="grid-column:y -3"></div>
|
||||
<div style="grid-column:y -4"></div>
|
||||
<div style="grid-column:y -5"></div>
|
||||
</div></div>
|
||||
|
||||
<div class="grid fit-0d"><div class="subgrid">
|
||||
<div style="grid-column:y 5"></div>
|
||||
<div style="grid-column:y 4"></div>
|
||||
<div style="grid-column:y 3"></div>
|
||||
<div style="grid-column:y 2"></div>
|
||||
<div style="grid-column:y 1"></div>
|
||||
<div style="grid-column:y -1"></div>
|
||||
<div style="grid-column:y -2"></div>
|
||||
<div style="grid-column:y -3"></div>
|
||||
<div style="grid-column:y -4"></div>
|
||||
<div style="grid-column:y -5"></div>
|
||||
</div></div>
|
||||
|
||||
<div class="grid fit-0e"><div class="subgrid">
|
||||
<div style="grid-column:y 5"></div>
|
||||
<div style="grid-column:y 4"></div>
|
||||
<div style="grid-column:y 3"></div>
|
||||
<div style="grid-column:y 2"></div>
|
||||
<div style="grid-column:y 1"></div>
|
||||
<div style="grid-column:y -1"></div>
|
||||
<div style="grid-column:y -2"></div>
|
||||
<div style="grid-column:y -3"></div>
|
||||
<div style="grid-column:y -4"></div>
|
||||
<div style="grid-column:y -5"></div>
|
||||
</div></div>
|
||||
|
||||
<div class="grid fit-0f"><div class="subgrid">
|
||||
<div style="grid-column:y 5"></div>
|
||||
<div style="grid-column:y 4"></div>
|
||||
<div style="grid-column:y 3"></div>
|
||||
<div style="grid-column:y 2"></div>
|
||||
<div style="grid-column:y 1"></div>
|
||||
<div style="grid-column:y -1"></div>
|
||||
<div style="grid-column:y -2"></div>
|
||||
<div style="grid-column:y -3"></div>
|
||||
<div style="grid-column:y -4"></div>
|
||||
<div style="grid-column:y -5"></div>
|
||||
</div></div>
|
||||
|
||||
<div class="grid fit-0g"><div class="subgrid">
|
||||
<div style="grid-column:y 5"></div>
|
||||
<div style="grid-column:y 4"></div>
|
||||
<div style="grid-column:y 3"></div>
|
||||
<div style="grid-column:y 2"></div>
|
||||
<div style="grid-column:y 1"></div>
|
||||
<div style="grid-column:y -1"></div>
|
||||
<div style="grid-column:y -2"></div>
|
||||
<div style="grid-column:y -3"></div>
|
||||
<div style="grid-column:y -4"></div>
|
||||
<div style="grid-column:y -5"></div>
|
||||
</div></div>
|
||||
|
||||
<div class="grid fit-0h"><div class="subgrid">
|
||||
<div style="grid-column:y 5"></div>
|
||||
<div style="grid-column:y 4"></div>
|
||||
<div style="grid-column:y 3"></div>
|
||||
<div style="grid-column:y 2"></div>
|
||||
<div style="grid-column:y 1"></div>
|
||||
<div style="grid-column:y -1"></div>
|
||||
<div style="grid-column:y -2"></div>
|
||||
<div style="grid-column:y -3"></div>
|
||||
<div style="grid-column:y -4"></div>
|
||||
<div style="grid-column:y -5"></div>
|
||||
</div></div>
|
||||
|
||||
<div class="grid fit-0i"><div class="subgrid">
|
||||
<div style="grid-column:y 5"></div>
|
||||
<div style="grid-column:y 4"></div>
|
||||
<div style="grid-column:y 3"></div>
|
||||
<div style="grid-column:y 2"></div>
|
||||
<div style="grid-column:y 1"></div>
|
||||
<div style="grid-column:y -1"></div>
|
||||
<div style="grid-column:y -2"></div>
|
||||
<div style="grid-column:y -3"></div>
|
||||
<div style="grid-column:y -4"></div>
|
||||
<div style="grid-column:y -5"></div>
|
||||
</div></div>
|
||||
|
||||
<div class="grid fit-0j"><div class="subgrid">
|
||||
<div style="grid-column:y 5"></div>
|
||||
<div style="grid-column:y 4"></div>
|
||||
<div style="grid-column:y 3"></div>
|
||||
<div style="grid-column:y 2"></div>
|
||||
<div style="grid-column:y 1"></div>
|
||||
<div style="grid-column:y -1"></div>
|
||||
<div style="grid-column:y -2"></div>
|
||||
<div style="grid-column:y -3"></div>
|
||||
<div style="grid-column:y -4"></div>
|
||||
<div style="grid-column:y -5"></div>
|
||||
</div></div>
|
||||
|
||||
<div class="grid fit-0k"><div class="subgrid">
|
||||
<div style="grid-column:y 5"></div>
|
||||
<div style="grid-column:y 4"></div>
|
||||
<div style="grid-column:y 3"></div>
|
||||
<div style="grid-column:y 2"></div>
|
||||
<div style="grid-column:y 1"></div>
|
||||
<div style="grid-column:y -1"></div>
|
||||
<div style="grid-column:y -2"></div>
|
||||
<div style="grid-column:y -3"></div>
|
||||
<div style="grid-column:y -4"></div>
|
||||
<div style="grid-column:y -5"></div>
|
||||
</div></div>
|
||||
|
||||
<div class="grid fit-0l"><div class="subgrid">
|
||||
<div style="grid-column:y 5"></div>
|
||||
<div style="grid-column:y 4"></div>
|
||||
<div style="grid-column:y 3"></div>
|
||||
<div style="grid-column:y 2"></div>
|
||||
<div style="grid-column:y 1"></div>
|
||||
<div style="grid-column:y -1"></div>
|
||||
<div style="grid-column:y -2"></div>
|
||||
<div style="grid-column:y -3"></div>
|
||||
<div style="grid-column:y -4"></div>
|
||||
<div style="grid-column:y -5"></div>
|
||||
</div></div>
|
||||
|
||||
<div class="grid fit-0m"><div class="subgrid">
|
||||
<div style="grid-column:y 5"></div>
|
||||
<div style="grid-column:y 4"></div>
|
||||
<div style="grid-column:y 3"></div>
|
||||
<div style="grid-column:y 2"></div>
|
||||
<div style="grid-column:y 1"></div>
|
||||
<div style="grid-column:y -1"></div>
|
||||
<div style="grid-column:y -2"></div>
|
||||
<div style="grid-column:y -3"></div>
|
||||
<div style="grid-column:y -4"></div>
|
||||
<div style="grid-column:y -5"></div>
|
||||
</div></div>
|
||||
|
||||
<div class="grid fit-1a"><div class="subgrid">
|
||||
<div style="grid-column:y 5"></div>
|
||||
<div style="grid-column:y 4"></div>
|
||||
<div style="grid-column:y 3"></div>
|
||||
<div style="grid-column:y 2"></div>
|
||||
<div style="grid-column:y 1"></div>
|
||||
<div style="grid-column:y -1"></div>
|
||||
<div style="grid-column:y -2"></div>
|
||||
<div style="grid-column:y -3"></div>
|
||||
<div style="grid-column:y -4"></div>
|
||||
<div style="grid-column:y -5"></div>
|
||||
</div></div>
|
||||
|
||||
<div class="grid fit-1b"><div class="subgrid">
|
||||
<div style="grid-column:y 5"></div>
|
||||
<div style="grid-column:y 4"></div>
|
||||
<div style="grid-column:y 3"></div>
|
||||
<div style="grid-column:y 2"></div>
|
||||
<div style="grid-column:y 1"></div>
|
||||
<div style="grid-column:y -1"></div>
|
||||
<div style="grid-column:y -2"></div>
|
||||
<div style="grid-column:y -3"></div>
|
||||
<div style="grid-column:y -4"></div>
|
||||
<div style="grid-column:y -5"></div>
|
||||
</div></div>
|
||||
|
||||
<div class="grid fit-1c"><div class="subgrid">
|
||||
<div style="grid-column:y 5"></div>
|
||||
<div style="grid-column:y 4"></div>
|
||||
<div style="grid-column:y 3"></div>
|
||||
<div style="grid-column:y 2"></div>
|
||||
<div style="grid-column:y 1"></div>
|
||||
<div style="grid-column:y -1"></div>
|
||||
<div style="grid-column:y -2"></div>
|
||||
<div style="grid-column:y -3"></div>
|
||||
<div style="grid-column:y -4"></div>
|
||||
<div style="grid-column:y -5"></div>
|
||||
</div></div>
|
||||
|
||||
<div class="grid fit-1d"><div class="subgrid">
|
||||
<div style="grid-column:y 5"></div>
|
||||
<div style="grid-column:y 4"></div>
|
||||
<div style="grid-column:y 3"></div>
|
||||
<div style="grid-column:y 2"></div>
|
||||
<div style="grid-column:y 1"></div>
|
||||
<div style="grid-column:y -1"></div>
|
||||
<div style="grid-column:y -2"></div>
|
||||
<div style="grid-column:y -3"></div>
|
||||
<div style="grid-column:y -4"></div>
|
||||
<div style="grid-column:y -5"></div>
|
||||
</div></div>
|
||||
|
||||
<div class="grid fit-1e"><div class="subgrid">
|
||||
<div style="grid-column:y 5"></div>
|
||||
<div style="grid-column:y 4"></div>
|
||||
<div style="grid-column:y 3"></div>
|
||||
<div style="grid-column:y 2"></div>
|
||||
<div style="grid-column:y 1"></div>
|
||||
<div style="grid-column:y -1"></div>
|
||||
<div style="grid-column:y -2"></div>
|
||||
<div style="grid-column:y -3"></div>
|
||||
<div style="grid-column:y -4"></div>
|
||||
<div style="grid-column:y -5"></div>
|
||||
</div></div>
|
||||
|
||||
<div class="grid fit-2a"><div class="subgrid">
|
||||
<div style="grid-column:y 5"></div>
|
||||
<div style="grid-column:y 4"></div>
|
||||
<div style="grid-column:y 3"></div>
|
||||
<div style="grid-column:y 2"></div>
|
||||
<div style="grid-column:y 1"></div>
|
||||
<div style="grid-column:y -1"></div>
|
||||
<div style="grid-column:y -2"></div>
|
||||
<div style="grid-column:y -3"></div>
|
||||
<div style="grid-column:y -4"></div>
|
||||
<div style="grid-column:y -5"></div>
|
||||
</div></div>
|
||||
|
||||
<div class="grid fit-2b"><div class="subgrid">
|
||||
<div style="grid-column:y 5"></div>
|
||||
<div style="grid-column:y 4"></div>
|
||||
<div style="grid-column:y 3"></div>
|
||||
<div style="grid-column:y 2"></div>
|
||||
<div style="grid-column:y 1"></div>
|
||||
<div style="grid-column:y -1"></div>
|
||||
<div style="grid-column:y -2"></div>
|
||||
<div style="grid-column:y -3"></div>
|
||||
<div style="grid-column:y -4"></div>
|
||||
<div style="grid-column:y -5"></div>
|
||||
</div></div>
|
||||
|
||||
<div class="grid fit-2c"><div class="subgrid">
|
||||
<div style="grid-column:y 5"></div>
|
||||
<div style="grid-column:y 4"></div>
|
||||
<div style="grid-column:y 3"></div>
|
||||
<div style="grid-column:y 2"></div>
|
||||
<div style="grid-column:y 1"></div>
|
||||
<div style="grid-column:y -1"></div>
|
||||
<div style="grid-column:y -2"></div>
|
||||
<div style="grid-column:y -3"></div>
|
||||
<div style="grid-column:y -4"></div>
|
||||
<div style="grid-column:y -5"></div>
|
||||
</div></div>
|
||||
|
||||
<div class="grid fit-2d"><div class="subgrid">
|
||||
<div style="grid-column:y 5"></div>
|
||||
<div style="grid-column:y 4"></div>
|
||||
<div style="grid-column:y 3"></div>
|
||||
<div style="grid-column:y 2"></div>
|
||||
<div style="grid-column:y 1"></div>
|
||||
<div style="grid-column:y -1"></div>
|
||||
<div style="grid-column:y -2"></div>
|
||||
<div style="grid-column:y -3"></div>
|
||||
<div style="grid-column:y -4"></div>
|
||||
<div style="grid-column:y -5"></div>
|
||||
</div></div>
|
||||
|
||||
<div class="grid fit-3a"><div class="subgrid">
|
||||
<div style="grid-column:y 5"></div>
|
||||
<div style="grid-column:y 4"></div>
|
||||
<div style="grid-column:y 3"></div>
|
||||
<div style="grid-column:y 2"></div>
|
||||
<div style="grid-column:y 1"></div>
|
||||
<div style="grid-column:y -1"></div>
|
||||
<div style="grid-column:y -2"></div>
|
||||
<div style="grid-column:y -3"></div>
|
||||
<div style="grid-column:y -4"></div>
|
||||
<div style="grid-column:y -5"></div>
|
||||
</div></div>
|
||||
|
||||
<div class="grid fit-3b"><div class="subgrid">
|
||||
<div style="grid-column:y 5"></div>
|
||||
<div style="grid-column:y 4"></div>
|
||||
<div style="grid-column:y 3"></div>
|
||||
<div style="grid-column:y 2"></div>
|
||||
<div style="grid-column:y 1"></div>
|
||||
<div style="grid-column:y -1"></div>
|
||||
<div style="grid-column:y -2"></div>
|
||||
<div style="grid-column:y -3"></div>
|
||||
<div style="grid-column:y -4"></div>
|
||||
<div style="grid-column:y -5"></div>
|
||||
</div></div>
|
||||
|
||||
<div class="grid fit-3c"><div class="subgrid">
|
||||
<div style="grid-column:y 5"></div>
|
||||
<div style="grid-column:y 4"></div>
|
||||
<div style="grid-column:y 3"></div>
|
||||
<div style="grid-column:y 2"></div>
|
||||
<div style="grid-column:y 1"></div>
|
||||
<div style="grid-column:y -1"></div>
|
||||
<div style="grid-column:y -2"></div>
|
||||
<div style="grid-column:y -3"></div>
|
||||
<div style="grid-column:y -4"></div>
|
||||
<div style="grid-column:y -5"></div>
|
||||
</div></div>
|
||||
|
||||
<div class="grid fit-4a"><div class="subgrid">
|
||||
<div style="grid-column:y 5"></div>
|
||||
<div style="grid-column:y 4"></div>
|
||||
<div style="grid-column:y 3"></div>
|
||||
<div style="grid-column:y 2"></div>
|
||||
<div style="grid-column:y 1"></div>
|
||||
<div style="grid-column:y -1"></div>
|
||||
<div style="grid-column:y -2"></div>
|
||||
<div style="grid-column:y -3"></div>
|
||||
<div style="grid-column:y -4"></div>
|
||||
<div style="grid-column:y -5"></div>
|
||||
</div></div>
|
||||
|
||||
<div class="grid fit-4b"><div class="subgrid">
|
||||
<div style="grid-column:y 5"></div>
|
||||
<div style="grid-column:y 4"></div>
|
||||
<div style="grid-column:y 3"></div>
|
||||
<div style="grid-column:y 2"></div>
|
||||
<div style="grid-column:y 1"></div>
|
||||
<div style="grid-column:y -1"></div>
|
||||
<div style="grid-column:y -2"></div>
|
||||
<div style="grid-column:y -3"></div>
|
||||
<div style="grid-column:y -4"></div>
|
||||
<div style="grid-column:y -5"></div>
|
||||
</div></div>
|
||||
|
||||
<div class="grid fit-5"><div class="subgrid">
|
||||
<div style="grid-column:y 5"></div>
|
||||
<div style="grid-column:y 4"></div>
|
||||
<div style="grid-column:y 3"></div>
|
||||
<div style="grid-column:y 2"></div>
|
||||
<div style="grid-column:y 1"></div>
|
||||
<div style="grid-column:y -1"></div>
|
||||
<div style="grid-column:y -2"></div>
|
||||
<div style="grid-column:y -3"></div>
|
||||
<div style="grid-column:y -4"></div>
|
||||
<div style="grid-column:y -5"></div>
|
||||
</div></div>
|
||||
|
||||
|
||||
</body>
|
||||
</html>
|
||||
|
|
@ -0,0 +1,479 @@
|
|||
<!DOCTYPE HTML>
|
||||
<!--
|
||||
Any copyright is dedicated to the Public Domain.
|
||||
http://creativecommons.org/publicdomain/zero/1.0/
|
||||
-->
|
||||
<html><head>
|
||||
<meta charset="utf-8">
|
||||
<title>CSS Grid Test: subgrid inside a parent with repeat(auto-fit) columns</title>
|
||||
<link rel="author" title="Mats Palmgren" href="mailto:mats@mozilla.com">
|
||||
<link rel="help" href="https://drafts.csswg.org/css-grid-2/">
|
||||
<link rel="match" href="parent-repeat-auto-fit-001-ref.html">
|
||||
<style>
|
||||
html,body {
|
||||
color:black; background-color:white; font:10px/1 monospace; padding:0; margin:0;
|
||||
}
|
||||
|
||||
.grid {
|
||||
display: inline-grid;
|
||||
width: 50px;
|
||||
border: 1px solid;
|
||||
}
|
||||
|
||||
.subgrid {
|
||||
display: grid;
|
||||
grid-template-columns: subgrid;
|
||||
grid-column: 3 / span 4;
|
||||
grid-auto-rows: 8px;
|
||||
background: grey;
|
||||
}
|
||||
|
||||
.fit-0a { grid-template-columns: repeat(auto-fit, [y] 30px) [z] 1px [z] 1px [z] 1px [z] 1px [z] }
|
||||
.fit-0b { grid-template-columns: [x] repeat(auto-fit, [y] 30px) [z] 1px [z] 1px [z] 1px [z] }
|
||||
.fit-0c { grid-template-columns: [x] 1px [x] repeat(auto-fit, [y] 10px) [z] 1px [z] 1px [z] }
|
||||
.fit-0d { grid-template-columns: [x] 2px [x] 2px [x] repeat(auto-fit, [y] 10px) [z] 1px [z] }
|
||||
.fit-0e { grid-template-columns: [x] 2px [x] 2px [x] 2px [x] repeat(auto-fit, [y] 10px) [z] }
|
||||
.fit-0f { grid-template-columns: [x] 2px [x] 2px [x] 2px [x] 2px [x] repeat(auto-fit, [y] 10px) }
|
||||
.fit-0g { grid-template-columns: [x] 2px [x] 2px [x] 2px [x] 2px [x] repeat(auto-fit, [y] 10px) [z] 1px [z] }
|
||||
.fit-0h { grid-template-columns: [x] 2px [x] 2px [x] 2px [x] 2px [x] 2px [x] 2px [x] repeat(auto-fit, [y] 10px) [z] 1px [z] }
|
||||
.fit-0i { grid-template-columns: [x] 2px [x] 2px [x] 2px [x] 2px [x] 2px [x] 2px [x] repeat(auto-fit, [y] 10px) [z] }
|
||||
.fit-0j { grid-template-columns: [x] 2px [x] 2px [x] 2px [x] 2px [x] 2px [x] 2px [x] repeat(auto-fit, [y] 10px) }
|
||||
.fit-0k { grid-template-columns: repeat(auto-fit, [y] 10px) repeat(100, [z] 10px) }
|
||||
.fit-0l { grid-template-columns: [x] repeat(auto-fit, [y] 10px) repeat(100, [z] 10px) }
|
||||
.fit-0m { grid-template-columns: repeat(100, [x] 10px) repeat(auto-fit, [y] 10px) }
|
||||
|
||||
.fit-1a { grid-template-columns: repeat(auto-fit, [y] 10px) [z] 1px [z] 1px [z] 1px [z] }
|
||||
.fit-1b { grid-template-columns: [x] repeat(auto-fit, [y] 10px) [z] 1px [z] 1px [z] }
|
||||
.fit-1c { grid-template-columns: [x] 2px [x] repeat(auto-fit, [y] 10px) [z] 1px [z] }
|
||||
.fit-1d { grid-template-columns: [x] 2px [x] 2px [x] repeat(auto-fit, [y] 10px) [z] }
|
||||
.fit-1e { grid-template-columns: [x] 2px [x] 2px [x] 2px [x] repeat(auto-fit, [y] 10px) }
|
||||
|
||||
.fit-2a { grid-template-columns: repeat(auto-fit, [y] 10px) [z] 1px [z] 1px [z] }
|
||||
.fit-2b { grid-template-columns: [x] repeat(auto-fit, [y] 10px) [z] 1px [z] }
|
||||
.fit-2c { grid-template-columns: [x] 2px [x] repeat(auto-fit, [y] 10px) [z] }
|
||||
.fit-2d { grid-template-columns: [x] 2px [x] 2px [x] repeat(auto-fit, [y] 10px) }
|
||||
|
||||
.fit-3a { grid-template-columns: repeat(auto-fit, [y] 10px) [z] 1px [z] }
|
||||
.fit-3b { grid-template-columns: [x] repeat(auto-fit, [y] 10px) [z] }
|
||||
.fit-3c { grid-template-columns: [x] 2px [x] repeat(auto-fit, [y] 10px) }
|
||||
|
||||
.fit-4a { grid-template-columns: repeat(auto-fit, [y] 10px) [z] }
|
||||
.fit-4b { grid-template-columns: [x] repeat(auto-fit, [y] 10px) }
|
||||
|
||||
.fit-5 { grid-template-columns: repeat(auto-fit, [y] 10px) }
|
||||
|
||||
.subgrid > :nth-child(2n) { background: black; }
|
||||
.subgrid > :nth-child(2n+1) { background: pink; }
|
||||
|
||||
</style>
|
||||
</head>
|
||||
<body>
|
||||
|
||||
<div class="grid fit-0a"><div class="subgrid">
|
||||
<div style="grid-column:y 5"></div>
|
||||
<div style="grid-column:y 4"></div>
|
||||
<div style="grid-column:y 3"></div>
|
||||
<div style="grid-column:y 2"></div>
|
||||
<div style="grid-column:y 1"></div>
|
||||
<div style="grid-column:y -1"></div>
|
||||
<div style="grid-column:y -2"></div>
|
||||
<div style="grid-column:y -3"></div>
|
||||
<div style="grid-column:y -4"></div>
|
||||
<div style="grid-column:y -5"></div>
|
||||
</div></div>
|
||||
|
||||
<div class="grid fit-0b"><div class="subgrid">
|
||||
<div style="grid-column:y 5"></div>
|
||||
<div style="grid-column:y 4"></div>
|
||||
<div style="grid-column:y 3"></div>
|
||||
<div style="grid-column:y 2"></div>
|
||||
<div style="grid-column:y 1"></div>
|
||||
<div style="grid-column:y -1"></div>
|
||||
<div style="grid-column:y -2"></div>
|
||||
<div style="grid-column:y -3"></div>
|
||||
<div style="grid-column:y -4"></div>
|
||||
<div style="grid-column:y -5"></div>
|
||||
</div></div>
|
||||
|
||||
<div class="grid fit-0c"><div class="subgrid">
|
||||
<div style="grid-column:y 5"></div>
|
||||
<div style="grid-column:y 4"></div>
|
||||
<div style="grid-column:y 3"></div>
|
||||
<div style="grid-column:y 2"></div>
|
||||
<div style="grid-column:y 1"></div>
|
||||
<div style="grid-column:y -1"></div>
|
||||
<div style="grid-column:y -2"></div>
|
||||
<div style="grid-column:y -3"></div>
|
||||
<div style="grid-column:y -4"></div>
|
||||
<div style="grid-column:y -5"></div>
|
||||
</div></div>
|
||||
|
||||
<div class="grid fit-0d"><div class="subgrid">
|
||||
<div style="grid-column:y 5"></div>
|
||||
<div style="grid-column:y 4"></div>
|
||||
<div style="grid-column:y 3"></div>
|
||||
<div style="grid-column:y 2"></div>
|
||||
<div style="grid-column:y 1"></div>
|
||||
<div style="grid-column:y -1"></div>
|
||||
<div style="grid-column:y -2"></div>
|
||||
<div style="grid-column:y -3"></div>
|
||||
<div style="grid-column:y -4"></div>
|
||||
<div style="grid-column:y -5"></div>
|
||||
</div></div>
|
||||
|
||||
<div class="grid fit-0e"><div class="subgrid">
|
||||
<div style="grid-column:y 5"></div>
|
||||
<div style="grid-column:y 4"></div>
|
||||
<div style="grid-column:y 3"></div>
|
||||
<div style="grid-column:y 2"></div>
|
||||
<div style="grid-column:y 1"></div>
|
||||
<div style="grid-column:y -1"></div>
|
||||
<div style="grid-column:y -2"></div>
|
||||
<div style="grid-column:y -3"></div>
|
||||
<div style="grid-column:y -4"></div>
|
||||
<div style="grid-column:y -5"></div>
|
||||
</div></div>
|
||||
|
||||
<div class="grid fit-0f"><div class="subgrid">
|
||||
<div style="grid-column:y 5"></div>
|
||||
<div style="grid-column:y 4"></div>
|
||||
<div style="grid-column:y 3"></div>
|
||||
<div style="grid-column:y 2"></div>
|
||||
<div style="grid-column:y 1"></div>
|
||||
<div style="grid-column:y -1"></div>
|
||||
<div style="grid-column:y -2"></div>
|
||||
<div style="grid-column:y -3"></div>
|
||||
<div style="grid-column:y -4"></div>
|
||||
<div style="grid-column:y -5"></div>
|
||||
</div></div>
|
||||
|
||||
<div class="grid fit-0g"><div class="subgrid">
|
||||
<div style="grid-column:y 5"></div>
|
||||
<div style="grid-column:y 4"></div>
|
||||
<div style="grid-column:y 3"></div>
|
||||
<div style="grid-column:y 2"></div>
|
||||
<div style="grid-column:y 1"></div>
|
||||
<div style="grid-column:y -1"></div>
|
||||
<div style="grid-column:y -2"></div>
|
||||
<div style="grid-column:y -3"></div>
|
||||
<div style="grid-column:y -4"></div>
|
||||
<div style="grid-column:y -5"></div>
|
||||
</div></div>
|
||||
|
||||
<div class="grid fit-0h"><div class="subgrid">
|
||||
<div style="grid-column:y 5"></div>
|
||||
<div style="grid-column:y 4"></div>
|
||||
<div style="grid-column:y 3"></div>
|
||||
<div style="grid-column:y 2"></div>
|
||||
<div style="grid-column:y 1"></div>
|
||||
<div style="grid-column:y -1"></div>
|
||||
<div style="grid-column:y -2"></div>
|
||||
<div style="grid-column:y -3"></div>
|
||||
<div style="grid-column:y -4"></div>
|
||||
<div style="grid-column:y -5"></div>
|
||||
</div></div>
|
||||
|
||||
<div class="grid fit-0i"><div class="subgrid">
|
||||
<div style="grid-column:y 5"></div>
|
||||
<div style="grid-column:y 4"></div>
|
||||
<div style="grid-column:y 3"></div>
|
||||
<div style="grid-column:y 2"></div>
|
||||
<div style="grid-column:y 1"></div>
|
||||
<div style="grid-column:y -1"></div>
|
||||
<div style="grid-column:y -2"></div>
|
||||
<div style="grid-column:y -3"></div>
|
||||
<div style="grid-column:y -4"></div>
|
||||
<div style="grid-column:y -5"></div>
|
||||
</div></div>
|
||||
|
||||
<div class="grid fit-0j"><div class="subgrid">
|
||||
<div style="grid-column:y 5"></div>
|
||||
<div style="grid-column:y 4"></div>
|
||||
<div style="grid-column:y 3"></div>
|
||||
<div style="grid-column:y 2"></div>
|
||||
<div style="grid-column:y 1"></div>
|
||||
<div style="grid-column:y -1"></div>
|
||||
<div style="grid-column:y -2"></div>
|
||||
<div style="grid-column:y -3"></div>
|
||||
<div style="grid-column:y -4"></div>
|
||||
<div style="grid-column:y -5"></div>
|
||||
</div></div>
|
||||
|
||||
<div class="grid fit-0k"><div class="subgrid">
|
||||
<div style="grid-column:y 5"></div>
|
||||
<div style="grid-column:y 4"></div>
|
||||
<div style="grid-column:y 3"></div>
|
||||
<div style="grid-column:y 2"></div>
|
||||
<div style="grid-column:y 1"></div>
|
||||
<div style="grid-column:y -1"></div>
|
||||
<div style="grid-column:y -2"></div>
|
||||
<div style="grid-column:y -3"></div>
|
||||
<div style="grid-column:y -4"></div>
|
||||
<div style="grid-column:y -5"></div>
|
||||
</div></div>
|
||||
|
||||
<div class="grid fit-0l"><div class="subgrid">
|
||||
<div style="grid-column:y 5"></div>
|
||||
<div style="grid-column:y 4"></div>
|
||||
<div style="grid-column:y 3"></div>
|
||||
<div style="grid-column:y 2"></div>
|
||||
<div style="grid-column:y 1"></div>
|
||||
<div style="grid-column:y -1"></div>
|
||||
<div style="grid-column:y -2"></div>
|
||||
<div style="grid-column:y -3"></div>
|
||||
<div style="grid-column:y -4"></div>
|
||||
<div style="grid-column:y -5"></div>
|
||||
</div></div>
|
||||
|
||||
<div class="grid fit-0m"><div class="subgrid">
|
||||
<div style="grid-column:y 5"></div>
|
||||
<div style="grid-column:y 4"></div>
|
||||
<div style="grid-column:y 3"></div>
|
||||
<div style="grid-column:y 2"></div>
|
||||
<div style="grid-column:y 1"></div>
|
||||
<div style="grid-column:y -1"></div>
|
||||
<div style="grid-column:y -2"></div>
|
||||
<div style="grid-column:y -3"></div>
|
||||
<div style="grid-column:y -4"></div>
|
||||
<div style="grid-column:y -5"></div>
|
||||
</div></div>
|
||||
|
||||
<div class="grid fit-1a"><div class="subgrid">
|
||||
<div style="grid-column:y 5"></div>
|
||||
<div style="grid-column:y 4"></div>
|
||||
<div style="grid-column:y 3"></div>
|
||||
<div style="grid-column:y 2"></div>
|
||||
<div style="grid-column:y 1"></div>
|
||||
<div style="grid-column:y -1"></div>
|
||||
<div style="grid-column:y -2"></div>
|
||||
<div style="grid-column:y -3"></div>
|
||||
<div style="grid-column:y -4"></div>
|
||||
<div style="grid-column:y -5"></div>
|
||||
</div></div>
|
||||
|
||||
<div class="grid fit-1b"><div class="subgrid">
|
||||
<div style="grid-column:y 5"></div>
|
||||
<div style="grid-column:y 4"></div>
|
||||
<div style="grid-column:y 3"></div>
|
||||
<div style="grid-column:y 2"></div>
|
||||
<div style="grid-column:y 1"></div>
|
||||
<div style="grid-column:y -1"></div>
|
||||
<div style="grid-column:y -2"></div>
|
||||
<div style="grid-column:y -3"></div>
|
||||
<div style="grid-column:y -4"></div>
|
||||
<div style="grid-column:y -5"></div>
|
||||
</div></div>
|
||||
|
||||
<div class="grid fit-1c"><div class="subgrid">
|
||||
<div style="grid-column:y 5"></div>
|
||||
<div style="grid-column:y 4"></div>
|
||||
<div style="grid-column:y 3"></div>
|
||||
<div style="grid-column:y 2"></div>
|
||||
<div style="grid-column:y 1"></div>
|
||||
<div style="grid-column:y -1"></div>
|
||||
<div style="grid-column:y -2"></div>
|
||||
<div style="grid-column:y -3"></div>
|
||||
<div style="grid-column:y -4"></div>
|
||||
<div style="grid-column:y -5"></div>
|
||||
</div></div>
|
||||
|
||||
<div class="grid fit-1d"><div class="subgrid">
|
||||
<div style="grid-column:y 5"></div>
|
||||
<div style="grid-column:y 4"></div>
|
||||
<div style="grid-column:y 3"></div>
|
||||
<div style="grid-column:y 2"></div>
|
||||
<div style="grid-column:y 1"></div>
|
||||
<div style="grid-column:y -1"></div>
|
||||
<div style="grid-column:y -2"></div>
|
||||
<div style="grid-column:y -3"></div>
|
||||
<div style="grid-column:y -4"></div>
|
||||
<div style="grid-column:y -5"></div>
|
||||
</div></div>
|
||||
|
||||
<div class="grid fit-1e"><div class="subgrid">
|
||||
<div style="grid-column:y 5"></div>
|
||||
<div style="grid-column:y 4"></div>
|
||||
<div style="grid-column:y 3"></div>
|
||||
<div style="grid-column:y 2"></div>
|
||||
<div style="grid-column:y 1"></div>
|
||||
<div style="grid-column:y -1"></div>
|
||||
<div style="grid-column:y -2"></div>
|
||||
<div style="grid-column:y -3"></div>
|
||||
<div style="grid-column:y -4"></div>
|
||||
<div style="grid-column:y -5"></div>
|
||||
</div></div>
|
||||
|
||||
<div class="grid fit-2a"><div class="subgrid">
|
||||
<div style="grid-column:y 5"></div>
|
||||
<div style="grid-column:y 4"></div>
|
||||
<div style="grid-column:y 3"></div>
|
||||
<div style="grid-column:y 2"></div>
|
||||
<div style="grid-column:y 1"></div>
|
||||
<div style="grid-column:y -1"></div>
|
||||
<div style="grid-column:y -2"></div>
|
||||
<div style="grid-column:y -3"></div>
|
||||
<div style="grid-column:y -4"></div>
|
||||
<div style="grid-column:y -5"></div>
|
||||
</div></div>
|
||||
|
||||
<div class="grid fit-2b"><div class="subgrid">
|
||||
<div style="grid-column:y 5"></div>
|
||||
<div style="grid-column:y 4"></div>
|
||||
<div style="grid-column:y 3"></div>
|
||||
<div style="grid-column:y 2"></div>
|
||||
<div style="grid-column:y 1"></div>
|
||||
<div style="grid-column:y -1"></div>
|
||||
<div style="grid-column:y -2"></div>
|
||||
<div style="grid-column:y -3"></div>
|
||||
<div style="grid-column:y -4"></div>
|
||||
<div style="grid-column:y -5"></div>
|
||||
</div></div>
|
||||
|
||||
<div class="grid fit-2c"><div class="subgrid">
|
||||
<div style="grid-column:y 5"></div>
|
||||
<div style="grid-column:y 4"></div>
|
||||
<div style="grid-column:y 3"></div>
|
||||
<div style="grid-column:y 2"></div>
|
||||
<div style="grid-column:y 1"></div>
|
||||
<div style="grid-column:y -1"></div>
|
||||
<div style="grid-column:y -2"></div>
|
||||
<div style="grid-column:y -3"></div>
|
||||
<div style="grid-column:y -4"></div>
|
||||
<div style="grid-column:y -5"></div>
|
||||
</div></div>
|
||||
|
||||
<div class="grid fit-2d"><div class="subgrid">
|
||||
<div style="grid-column:y 5"></div>
|
||||
<div style="grid-column:y 4"></div>
|
||||
<div style="grid-column:y 3"></div>
|
||||
<div style="grid-column:y 2"></div>
|
||||
<div style="grid-column:y 1"></div>
|
||||
<div style="grid-column:y -1"></div>
|
||||
<div style="grid-column:y -2"></div>
|
||||
<div style="grid-column:y -3"></div>
|
||||
<div style="grid-column:y -4"></div>
|
||||
<div style="grid-column:y -5"></div>
|
||||
</div></div>
|
||||
|
||||
<div class="grid fit-3a"><div class="subgrid">
|
||||
<div style="grid-column:y 5"></div>
|
||||
<div style="grid-column:y 4"></div>
|
||||
<div style="grid-column:y 3"></div>
|
||||
<div style="grid-column:y 2"></div>
|
||||
<div style="grid-column:y 1"></div>
|
||||
<div style="grid-column:y -1"></div>
|
||||
<div style="grid-column:y -2"></div>
|
||||
<div style="grid-column:y -3"></div>
|
||||
<div style="grid-column:y -4"></div>
|
||||
<div style="grid-column:y -5"></div>
|
||||
</div></div>
|
||||
|
||||
<div class="grid fit-3b"><div class="subgrid">
|
||||
<div style="grid-column:y 5"></div>
|
||||
<div style="grid-column:y 4"></div>
|
||||
<div style="grid-column:y 3"></div>
|
||||
<div style="grid-column:y 2"></div>
|
||||
<div style="grid-column:y 1"></div>
|
||||
<div style="grid-column:y -1"></div>
|
||||
<div style="grid-column:y -2"></div>
|
||||
<div style="grid-column:y -3"></div>
|
||||
<div style="grid-column:y -4"></div>
|
||||
<div style="grid-column:y -5"></div>
|
||||
</div></div>
|
||||
|
||||
<div class="grid fit-3c"><div class="subgrid">
|
||||
<div style="grid-column:y 5"></div>
|
||||
<div style="grid-column:y 4"></div>
|
||||
<div style="grid-column:y 3"></div>
|
||||
<div style="grid-column:y 2"></div>
|
||||
<div style="grid-column:y 1"></div>
|
||||
<div style="grid-column:y -1"></div>
|
||||
<div style="grid-column:y -2"></div>
|
||||
<div style="grid-column:y -3"></div>
|
||||
<div style="grid-column:y -4"></div>
|
||||
<div style="grid-column:y -5"></div>
|
||||
</div></div>
|
||||
|
||||
<div class="grid fit-4a"><div class="subgrid">
|
||||
<div style="grid-column:y 5"></div>
|
||||
<div style="grid-column:y 4"></div>
|
||||
<div style="grid-column:y 3"></div>
|
||||
<div style="grid-column:y 2"></div>
|
||||
<div style="grid-column:y 1"></div>
|
||||
<div style="grid-column:y -1"></div>
|
||||
<div style="grid-column:y -2"></div>
|
||||
<div style="grid-column:y -3"></div>
|
||||
<div style="grid-column:y -4"></div>
|
||||
<div style="grid-column:y -5"></div>
|
||||
</div></div>
|
||||
|
||||
<div class="grid fit-4b"><div class="subgrid">
|
||||
<div style="grid-column:y 5"></div>
|
||||
<div style="grid-column:y 4"></div>
|
||||
<div style="grid-column:y 3"></div>
|
||||
<div style="grid-column:y 2"></div>
|
||||
<div style="grid-column:y 1"></div>
|
||||
<div style="grid-column:y -1"></div>
|
||||
<div style="grid-column:y -2"></div>
|
||||
<div style="grid-column:y -3"></div>
|
||||
<div style="grid-column:y -4"></div>
|
||||
<div style="grid-column:y -5"></div>
|
||||
</div></div>
|
||||
|
||||
<div class="grid fit-5"><div class="subgrid">
|
||||
<div style="grid-column:y 5"></div>
|
||||
<div style="grid-column:y 4"></div>
|
||||
<div style="grid-column:y 3"></div>
|
||||
<div style="grid-column:y 2"></div>
|
||||
<div style="grid-column:y 1"></div>
|
||||
<div style="grid-column:y -1"></div>
|
||||
<div style="grid-column:y -2"></div>
|
||||
<div style="grid-column:y -3"></div>
|
||||
<div style="grid-column:y -4"></div>
|
||||
<div style="grid-column:y -5"></div>
|
||||
</div></div>
|
||||
|
||||
<script>
|
||||
const expectedResults = [
|
||||
"[y] 0px [z] 1px [z] 1px [z] 1px [z] 1px [z]",
|
||||
"[x y] 0px [z] 1px [z] 1px [z] 1px [z]",
|
||||
"[x] 1px [x y] 0px [y] 10px [y] 10px [y] 10px [z] 1px [z] 1px [z]",
|
||||
"[x] 2px [x] 2px [x y] 10px [y] 10px [y] 10px [y] 10px [z] 1px [z]",
|
||||
"[x] 2px [x] 2px [x] 2px [x y] 10px [y] 10px [y] 10px [y] 0px [z]",
|
||||
"[x] 2px [x] 2px [x] 2px [x] 2px [x y] 10px [y] 10px [y] 0px [y] 0px",
|
||||
"[x] 2px [x] 2px [x] 2px [x] 2px [x y] 10px [y] 10px [y] 0px [y] 0px [z] 1px [z]",
|
||||
"[x] 2px [x] 2px [x] 2px [x] 2px [x] 2px [x] 2px [x y] 0px [y] 0px [y] 0px [z] 1px [z]",
|
||||
"[x] 2px [x] 2px [x] 2px [x] 2px [x] 2px [x] 2px [x y] 0px [y] 0px [y] 0px [z]",
|
||||
"[x] 2px [x] 2px [x] 2px [x] 2px [x] 2px [x] 2px [x y] 0px [y] 0px [y] 0px",
|
||||
"[y] 0px [z] 10px [z] 10px [z] 10px [z] 10px [z] 10px [z] 10px [z] 10px [z] 10px [z] 10px [z] 10px [z] 10px [z] 10px [z] 10px [z] 10px [z] 10px [z] 10px [z] 10px [z] 10px [z] 10px [z] 10px [z] 10px [z] 10px [z] 10px [z] 10px [z] 10px [z] 10px [z] 10px [z] 10px [z] 10px [z] 10px [z] 10px [z] 10px [z] 10px [z] 10px [z] 10px [z] 10px [z] 10px [z] 10px [z] 10px [z] 10px [z] 10px [z] 10px [z] 10px [z] 10px [z] 10px [z] 10px [z] 10px [z] 10px [z] 10px [z] 10px [z] 10px [z] 10px [z] 10px [z] 10px [z] 10px [z] 10px [z] 10px [z] 10px [z] 10px [z] 10px [z] 10px [z] 10px [z] 10px [z] 10px [z] 10px [z] 10px [z] 10px [z] 10px [z] 10px [z] 10px [z] 10px [z] 10px [z] 10px [z] 10px [z] 10px [z] 10px [z] 10px [z] 10px [z] 10px [z] 10px [z] 10px [z] 10px [z] 10px [z] 10px [z] 10px [z] 10px [z] 10px [z] 10px [z] 10px [z] 10px [z] 10px [z] 10px [z] 10px [z] 10px [z] 10px [z] 10px [z] 10px [z] 10px [z] 10px [z] 10px",
|
||||
"[x y] 0px [z] 10px [z] 10px [z] 10px [z] 10px [z] 10px [z] 10px [z] 10px [z] 10px [z] 10px [z] 10px [z] 10px [z] 10px [z] 10px [z] 10px [z] 10px [z] 10px [z] 10px [z] 10px [z] 10px [z] 10px [z] 10px [z] 10px [z] 10px [z] 10px [z] 10px [z] 10px [z] 10px [z] 10px [z] 10px [z] 10px [z] 10px [z] 10px [z] 10px [z] 10px [z] 10px [z] 10px [z] 10px [z] 10px [z] 10px [z] 10px [z] 10px [z] 10px [z] 10px [z] 10px [z] 10px [z] 10px [z] 10px [z] 10px [z] 10px [z] 10px [z] 10px [z] 10px [z] 10px [z] 10px [z] 10px [z] 10px [z] 10px [z] 10px [z] 10px [z] 10px [z] 10px [z] 10px [z] 10px [z] 10px [z] 10px [z] 10px [z] 10px [z] 10px [z] 10px [z] 10px [z] 10px [z] 10px [z] 10px [z] 10px [z] 10px [z] 10px [z] 10px [z] 10px [z] 10px [z] 10px [z] 10px [z] 10px [z] 10px [z] 10px [z] 10px [z] 10px [z] 10px [z] 10px [z] 10px [z] 10px [z] 10px [z] 10px [z] 10px [z] 10px [z] 10px [z] 10px [z] 10px [z] 10px [z] 10px [z] 10px",
|
||||
"[x] 10px [x] 10px [x] 10px [x] 10px [x] 10px [x] 10px [x] 10px [x] 10px [x] 10px [x] 10px [x] 10px [x] 10px [x] 10px [x] 10px [x] 10px [x] 10px [x] 10px [x] 10px [x] 10px [x] 10px [x] 10px [x] 10px [x] 10px [x] 10px [x] 10px [x] 10px [x] 10px [x] 10px [x] 10px [x] 10px [x] 10px [x] 10px [x] 10px [x] 10px [x] 10px [x] 10px [x] 10px [x] 10px [x] 10px [x] 10px [x] 10px [x] 10px [x] 10px [x] 10px [x] 10px [x] 10px [x] 10px [x] 10px [x] 10px [x] 10px [x] 10px [x] 10px [x] 10px [x] 10px [x] 10px [x] 10px [x] 10px [x] 10px [x] 10px [x] 10px [x] 10px [x] 10px [x] 10px [x] 10px [x] 10px [x] 10px [x] 10px [x] 10px [x] 10px [x] 10px [x] 10px [x] 10px [x] 10px [x] 10px [x] 10px [x] 10px [x] 10px [x] 10px [x] 10px [x] 10px [x] 10px [x] 10px [x] 10px [x] 10px [x] 10px [x] 10px [x] 10px [x] 10px [x] 10px [x] 10px [x] 10px [x] 10px [x] 10px [x] 10px [x] 10px [x] 10px [x] 10px [x] 10px [x] 10px [x] 10px [y] 0px",
|
||||
"[y] 0px [y] 0px [y] 10px [y] 10px [z] 1px [z] 1px [z] 1px [z]",
|
||||
"[x y] 0px [y] 0px [y] 10px [y] 10px [z] 1px [z] 1px [z]",
|
||||
"[x] 2px [x y] 0px [y] 10px [y] 10px [y] 10px [z] 1px [z]",
|
||||
"[x] 2px [x] 2px [x y] 10px [y] 10px [y] 10px [y] 10px [z]",
|
||||
"[x] 2px [x] 2px [x] 2px [x y] 10px [y] 10px [y] 10px [y] 0px",
|
||||
"[y] 0px [y] 0px [y] 10px [y] 10px [z] 1px [z] 1px [z]",
|
||||
"[x y] 0px [y] 0px [y] 10px [y] 10px [z] 1px [z]",
|
||||
"[x] 2px [x y] 0px [y] 10px [y] 10px [y] 10px [z]",
|
||||
"[x] 2px [x] 2px [x y] 10px [y] 10px [y] 10px [y] 10px",
|
||||
"[y] 0px [y] 0px [y] 10px [y] 10px [z] 1px [z]",
|
||||
"[x y] 0px [y] 0px [y] 10px [y] 10px [y] 10px [z]",
|
||||
"[x] 2px [x y] 0px [y] 10px [y] 10px [y] 10px",
|
||||
"[y] 0px [y] 0px [y] 10px [y] 10px [y] 10px [z]",
|
||||
"[x y] 0px [y] 0px [y] 10px [y] 10px [y] 10px",
|
||||
"[y] 0px [y] 0px [y] 10px [y] 10px [y] 10px",
|
||||
];
|
||||
[...document.querySelectorAll('.grid')].forEach(function(grid, i) {
|
||||
let actual = window.getComputedStyle(grid)['grid-template-columns'];
|
||||
let expected = expectedResults[i];
|
||||
if (actual != expected) {
|
||||
let err = "Unexpected getComputedStyle value for grid " + i + " with className '" + grid.className + "':" +
|
||||
" Actual: \"" + actual + "\", Expected: \"" + expected + "\"";
|
||||
document.body.appendChild(document.createTextNode(err));
|
||||
}
|
||||
});
|
||||
</script>
|
||||
|
||||
</body>
|
||||
</html>
|
||||
|
|
@ -0,0 +1,440 @@
|
|||
<!DOCTYPE HTML>
|
||||
<!--
|
||||
Any copyright is dedicated to the Public Domain.
|
||||
http://creativecommons.org/publicdomain/zero/1.0/
|
||||
-->
|
||||
<html><head>
|
||||
<meta charset="utf-8">
|
||||
<title>Reference: subgrid inside a parent with repeat(auto-fit) rows</title>
|
||||
<link rel="author" title="Mats Palmgren" href="mailto:mats@mozilla.com">
|
||||
<style>
|
||||
html,body {
|
||||
color:black; background-color:white; font:10px/1 monospace; padding:0; margin:0;
|
||||
}
|
||||
|
||||
.grid {
|
||||
display: inline-grid;
|
||||
height: 50px;
|
||||
width: 50px;
|
||||
grid-template-columns: repeat(auto-fit, 10px);
|
||||
border: 1px solid;
|
||||
vertical-align: top;
|
||||
}
|
||||
|
||||
.subgrid {
|
||||
display: grid;
|
||||
grid: subgrid / subgrid;
|
||||
grid-column: 1 / -1;
|
||||
grid-row: 3 / span 4;
|
||||
grid-auto-columns: 8px;
|
||||
background: grey;
|
||||
}
|
||||
|
||||
.fit-0a { grid-template-rows: [y] 0px [z] 1px [z] 1px [z] 1px [z] 1px [z]; }
|
||||
.fit-0b { grid-template-rows: [x y] 0px [z] 1px [z] 1px [z] 1px [z]; }
|
||||
.fit-0c { grid-template-rows: [x] 1px [x y] 0px [y] 10px [y] 10px [y] 10px [z] 1px [z] 1px [z]; }
|
||||
.fit-0d { grid-template-rows: [x] 2px [x] 2px [x y] 10px [y] 10px [y] 10px [y] 10px [z] 1px [z]; }
|
||||
.fit-0e { grid-template-rows: [x] 2px [x] 2px [x] 2px [x y] 10px [y] 10px [y] 10px [y] 0px [z]; }
|
||||
.fit-0f { grid-template-rows: [x] 2px [x] 2px [x] 2px [x] 2px [x y] 10px [y] 10px [y] 0px [y] 0px; }
|
||||
.fit-0g { grid-template-rows: [x] 2px [x] 2px [x] 2px [x] 2px [x y] 10px [y] 10px [y] 0px [y] 0px [z] 1px [z]; }
|
||||
.fit-0h { grid-template-rows: [x] 2px [x] 2px [x] 2px [x] 2px [x] 2px [x] 2px [x y] 0px [y] 0px [y] 0px [z] 1px [z]; }
|
||||
.fit-0i { grid-template-rows: [x] 2px [x] 2px [x] 2px [x] 2px [x] 2px [x] 2px [x y] 0px [y] 0px [y] 0px [z]; }
|
||||
.fit-0j { grid-template-rows: [x] 2px [x] 2px [x] 2px [x] 2px [x] 2px [x] 2px [x y] 0px [y] 0px [y] 0px; }
|
||||
.fit-0k { grid-template-rows: [y] 0px [z] 10px [z] 10px [z] 10px [z] 10px [z] 10px [z] 10px [z] 10px [z] 10px [z] 10px [z] 10px [z] 10px [z] 10px [z] 10px [z] 10px [z] 10px [z] 10px [z] 10px [z] 10px [z] 10px [z] 10px [z] 10px [z] 10px [z] 10px [z] 10px [z] 10px [z] 10px [z] 10px [z] 10px [z] 10px [z] 10px [z] 10px [z] 10px [z] 10px [z] 10px [z] 10px [z] 10px [z] 10px [z] 10px [z] 10px [z] 10px [z] 10px [z] 10px [z] 10px [z] 10px [z] 10px [z] 10px [z] 10px [z] 10px [z] 10px [z] 10px [z] 10px [z] 10px [z] 10px [z] 10px [z] 10px [z] 10px [z] 10px [z] 10px [z] 10px [z] 10px [z] 10px [z] 10px [z] 10px [z] 10px [z] 10px [z] 10px [z] 10px [z] 10px [z] 10px [z] 10px [z] 10px [z] 10px [z] 10px [z] 10px [z] 10px [z] 10px [z] 10px [z] 10px [z] 10px [z] 10px [z] 10px [z] 10px [z] 10px [z] 10px [z] 10px [z] 10px [z] 10px [z] 10px [z] 10px [z] 10px [z] 10px [z] 10px [z] 10px [z] 10px [z] 10px [z] 10px [z] 10px [z] 10px [z] 10px [z] 10px; }
|
||||
.fit-0l { grid-template-rows: [x y] 0px [z] 10px [z] 10px [z] 10px [z] 10px [z] 10px [z] 10px [z] 10px [z] 10px [z] 10px [z] 10px [z] 10px [z] 10px [z] 10px [z] 10px [z] 10px [z] 10px [z] 10px [z] 10px [z] 10px [z] 10px [z] 10px [z] 10px [z] 10px [z] 10px [z] 10px [z] 10px [z] 10px [z] 10px [z] 10px [z] 10px [z] 10px [z] 10px [z] 10px [z] 10px [z] 10px [z] 10px [z] 10px [z] 10px [z] 10px [z] 10px [z] 10px [z] 10px [z] 10px [z] 10px [z] 10px [z] 10px [z] 10px [z] 10px [z] 10px [z] 10px [z] 10px [z] 10px [z] 10px [z] 10px [z] 10px [z] 10px [z] 10px [z] 10px [z] 10px [z] 10px [z] 10px [z] 10px [z] 10px [z] 10px [z] 10px [z] 10px [z] 10px [z] 10px [z] 10px [z] 10px [z] 10px [z] 10px [z] 10px [z] 10px [z] 10px [z] 10px [z] 10px [z] 10px [z] 10px [z] 10px [z] 10px [z] 10px [z] 10px [z] 10px [z] 10px [z] 10px [z] 10px [z] 10px [z] 10px [z] 10px [z] 10px [z] 10px [z] 10px [z] 10px [z] 10px [z] 10px [z] 10px [z] 10px [z] 10px [z] 10px; }
|
||||
.fit-0m { grid-template-rows: [x] 10px [x] 10px [x] 10px [x] 10px [x] 10px [x] 10px [x] 10px [x] 10px [x] 10px [x] 10px [x] 10px [x] 10px [x] 10px [x] 10px [x] 10px [x] 10px [x] 10px [x] 10px [x] 10px [x] 10px [x] 10px [x] 10px [x] 10px [x] 10px [x] 10px [x] 10px [x] 10px [x] 10px [x] 10px [x] 10px [x] 10px [x] 10px [x] 10px [x] 10px [x] 10px [x] 10px [x] 10px [x] 10px [x] 10px [x] 10px [x] 10px [x] 10px [x] 10px [x] 10px [x] 10px [x] 10px [x] 10px [x] 10px [x] 10px [x] 10px [x] 10px [x] 10px [x] 10px [x] 10px [x] 10px [x] 10px [x] 10px [x] 10px [x] 10px [x] 10px [x] 10px [x] 10px [x] 10px [x] 10px [x] 10px [x] 10px [x] 10px [x] 10px [x] 10px [x] 10px [x] 10px [x] 10px [x] 10px [x] 10px [x] 10px [x] 10px [x] 10px [x] 10px [x] 10px [x] 10px [x] 10px [x] 10px [x] 10px [x] 10px [x] 10px [x] 10px [x] 10px [x] 10px [x] 10px [x] 10px [x] 10px [x] 10px [x] 10px [x] 10px [x] 10px [x] 10px [x] 10px [x] 10px [x] 10px [x] 10px [y] 0px; }
|
||||
|
||||
.fit-1a { grid-template-rows: [y] 0px [y] 0px [y] 10px [y] 10px [z] 1px [z] 1px [z] 1px [z]; }
|
||||
.fit-1b { grid-template-rows: [x y] 0px [y] 0px [y] 10px [y] 10px [z] 1px [z] 1px [z]; }
|
||||
.fit-1c { grid-template-rows: [x] 2px [x y] 0px [y] 10px [y] 10px [y] 10px [z] 1px [z]; }
|
||||
.fit-1d { grid-template-rows: [x] 2px [x] 2px [x y] 10px [y] 10px [y] 10px [y] 10px [z]; }
|
||||
.fit-1e { grid-template-rows: [x] 2px [x] 2px [x] 2px [x y] 10px [y] 10px [y] 10px [y] 0px; }
|
||||
|
||||
.fit-2a { grid-template-rows: [y] 0px [y] 0px [y] 10px [y] 10px [z] 1px [z] 1px [z]; }
|
||||
.fit-2b { grid-template-rows: [x y] 0px [y] 0px [y] 10px [y] 10px [z] 1px [z]; }
|
||||
.fit-2c { grid-template-rows: [x] 2px [x y] 0px [y] 10px [y] 10px [y] 10px [z]; }
|
||||
.fit-2d { grid-template-rows: [x] 2px [x] 2px [x y] 10px [y] 10px [y] 10px [y] 10px; }
|
||||
|
||||
.fit-3a { grid-template-rows: [y] 0px [y] 0px [y] 10px [y] 10px [z] 1px [z]; }
|
||||
.fit-3b { grid-template-rows: [x y] 0px [y] 0px [y] 10px [y] 10px [y] 10px [z]; }
|
||||
.fit-3c { grid-template-rows: [x] 2px [x y] 0px [y] 10px [y] 10px [y] 10px; }
|
||||
|
||||
.fit-4a { grid-template-rows: [y] 0px [y] 0px [y] 10px [y] 10px [y] 10px [z]; }
|
||||
.fit-4b { grid-template-rows: [x y] 0px [y] 0px [y] 10px [y] 10px [y] 10px; }
|
||||
|
||||
.fit-5 { grid-template-rows: [y] 0px [y] 0px [y] 10px [y] 10px [y] 10px; }
|
||||
|
||||
.subgrid > :nth-child(2n) { background: black; }
|
||||
.subgrid > :nth-child(2n+1) { background: pink; }
|
||||
|
||||
</style>
|
||||
</head>
|
||||
<body>
|
||||
|
||||
<div class="grid fit-0a"><div class="subgrid">
|
||||
<div style="grid-row:y 5"></div>
|
||||
<div style="grid-row:y 4"></div>
|
||||
<div style="grid-row:y 3"></div>
|
||||
<div style="grid-row:y 2"></div>
|
||||
<div style="grid-row:y 1"></div>
|
||||
<div style="grid-row:y -1"></div>
|
||||
<div style="grid-row:y -2"></div>
|
||||
<div style="grid-row:y -3"></div>
|
||||
<div style="grid-row:y -4"></div>
|
||||
<div style="grid-row:y -5"></div>
|
||||
</div></div>
|
||||
|
||||
<div class="grid fit-0b"><div class="subgrid" style="grid-column-start:2">
|
||||
<div style="grid-row:y 5"></div>
|
||||
<div style="grid-row:y 4"></div>
|
||||
<div style="grid-row:y 3"></div>
|
||||
<div style="grid-row:y 2"></div>
|
||||
<div style="grid-row:y 1"></div>
|
||||
<div style="grid-row:y -1"></div>
|
||||
<div style="grid-row:y -2"></div>
|
||||
<div style="grid-row:y -3"></div>
|
||||
<div style="grid-row:y -4"></div>
|
||||
<div style="grid-row:y -5"></div>
|
||||
</div></div>
|
||||
|
||||
<div class="grid fit-0c"><div class="subgrid" style="grid-column-start:3">
|
||||
<div style="grid-row:y 5"></div>
|
||||
<div style="grid-row:y 4"></div>
|
||||
<div style="grid-row:y 3"></div>
|
||||
<div style="grid-row:y 2"></div>
|
||||
<div style="grid-row:y 1"></div>
|
||||
<div style="grid-row:y -1"></div>
|
||||
<div style="grid-row:y -2"></div>
|
||||
<div style="grid-row:y -3"></div>
|
||||
<div style="grid-row:y -4"></div>
|
||||
<div style="grid-row:y -5"></div>
|
||||
</div></div>
|
||||
|
||||
<div class="grid fit-0d"><div class="subgrid" style="grid-column-start:4">
|
||||
<div style="grid-row:y 5"></div>
|
||||
<div style="grid-row:y 4"></div>
|
||||
<div style="grid-row:y 3"></div>
|
||||
<div style="grid-row:y 2"></div>
|
||||
<div style="grid-row:y 1"></div>
|
||||
<div style="grid-row:y -1"></div>
|
||||
<div style="grid-row:y -2"></div>
|
||||
<div style="grid-row:y -3"></div>
|
||||
<div style="grid-row:y -4"></div>
|
||||
<div style="grid-row:y -5"></div>
|
||||
</div></div>
|
||||
|
||||
<div class="grid fit-0e"><div class="subgrid" style="grid-column-start:5">
|
||||
<div style="grid-row:y 5"></div>
|
||||
<div style="grid-row:y 4"></div>
|
||||
<div style="grid-row:y 3"></div>
|
||||
<div style="grid-row:y 2"></div>
|
||||
<div style="grid-row:y 1"></div>
|
||||
<div style="grid-row:y -1"></div>
|
||||
<div style="grid-row:y -2"></div>
|
||||
<div style="grid-row:y -3"></div>
|
||||
<div style="grid-row:y -4"></div>
|
||||
<div style="grid-row:y -5"></div>
|
||||
</div></div>
|
||||
|
||||
<div class="grid fit-0f"><div class="subgrid" style="grid-column-start:6">
|
||||
<div style="grid-row:y 5"></div>
|
||||
<div style="grid-row:y 4"></div>
|
||||
<div style="grid-row:y 3"></div>
|
||||
<div style="grid-row:y 2"></div>
|
||||
<div style="grid-row:y 1"></div>
|
||||
<div style="grid-row:y -1"></div>
|
||||
<div style="grid-row:y -2"></div>
|
||||
<div style="grid-row:y -3"></div>
|
||||
<div style="grid-row:y -4"></div>
|
||||
<div style="grid-row:y -5"></div>
|
||||
</div></div>
|
||||
|
||||
<div class="grid fit-0g"><div class="subgrid" style="grid-column-end:-2">
|
||||
<div style="grid-row:y 5"></div>
|
||||
<div style="grid-row:y 4"></div>
|
||||
<div style="grid-row:y 3"></div>
|
||||
<div style="grid-row:y 2"></div>
|
||||
<div style="grid-row:y 1"></div>
|
||||
<div style="grid-row:y -1"></div>
|
||||
<div style="grid-row:y -2"></div>
|
||||
<div style="grid-row:y -3"></div>
|
||||
<div style="grid-row:y -4"></div>
|
||||
<div style="grid-row:y -5"></div>
|
||||
</div></div>
|
||||
|
||||
<div class="grid fit-0h"><div class="subgrid" style="grid-column-end:-3">
|
||||
<div style="grid-row:y 5"></div>
|
||||
<div style="grid-row:y 4"></div>
|
||||
<div style="grid-row:y 3"></div>
|
||||
<div style="grid-row:y 2"></div>
|
||||
<div style="grid-row:y 1"></div>
|
||||
<div style="grid-row:y -1"></div>
|
||||
<div style="grid-row:y -2"></div>
|
||||
<div style="grid-row:y -3"></div>
|
||||
<div style="grid-row:y -4"></div>
|
||||
<div style="grid-row:y -5"></div>
|
||||
</div></div>
|
||||
|
||||
<div class="grid fit-0i"><div class="subgrid" style="grid-column-end:-4">
|
||||
<div style="grid-row:y 5"></div>
|
||||
<div style="grid-row:y 4"></div>
|
||||
<div style="grid-row:y 3"></div>
|
||||
<div style="grid-row:y 2"></div>
|
||||
<div style="grid-row:y 1"></div>
|
||||
<div style="grid-row:y -1"></div>
|
||||
<div style="grid-row:y -2"></div>
|
||||
<div style="grid-row:y -3"></div>
|
||||
<div style="grid-row:y -4"></div>
|
||||
<div style="grid-row:y -5"></div>
|
||||
</div></div>
|
||||
|
||||
<div class="grid fit-0j"><div class="subgrid" style="grid-column-end:-5">
|
||||
<div style="grid-row:y 5"></div>
|
||||
<div style="grid-row:y 4"></div>
|
||||
<div style="grid-row:y 3"></div>
|
||||
<div style="grid-row:y 2"></div>
|
||||
<div style="grid-row:y 1"></div>
|
||||
<div style="grid-row:y -1"></div>
|
||||
<div style="grid-row:y -2"></div>
|
||||
<div style="grid-row:y -3"></div>
|
||||
<div style="grid-row:y -4"></div>
|
||||
<div style="grid-row:y -5"></div>
|
||||
</div></div>
|
||||
|
||||
<div class="grid fit-0k"><div class="subgrid" style="grid-column-end:-6">
|
||||
<div style="grid-row:y 5"></div>
|
||||
<div style="grid-row:y 4"></div>
|
||||
<div style="grid-row:y 3"></div>
|
||||
<div style="grid-row:y 2"></div>
|
||||
<div style="grid-row:y 1"></div>
|
||||
<div style="grid-row:y -1"></div>
|
||||
<div style="grid-row:y -2"></div>
|
||||
<div style="grid-row:y -3"></div>
|
||||
<div style="grid-row:y -4"></div>
|
||||
<div style="grid-row:y -5"></div>
|
||||
</div></div>
|
||||
|
||||
<div class="grid fit-0l"><div class="subgrid" style="grid-column:2/-2">
|
||||
<div style="grid-row:y 5"></div>
|
||||
<div style="grid-row:y 4"></div>
|
||||
<div style="grid-row:y 3"></div>
|
||||
<div style="grid-row:y 2"></div>
|
||||
<div style="grid-row:y 1"></div>
|
||||
<div style="grid-row:y -1"></div>
|
||||
<div style="grid-row:y -2"></div>
|
||||
<div style="grid-row:y -3"></div>
|
||||
<div style="grid-row:y -4"></div>
|
||||
<div style="grid-row:y -5"></div>
|
||||
</div></div>
|
||||
|
||||
<div class="grid fit-0m"><div class="subgrid" style="grid-column:3/-3">
|
||||
<div style="grid-row:y 5"></div>
|
||||
<div style="grid-row:y 4"></div>
|
||||
<div style="grid-row:y 3"></div>
|
||||
<div style="grid-row:y 2"></div>
|
||||
<div style="grid-row:y 1"></div>
|
||||
<div style="grid-row:y -1"></div>
|
||||
<div style="grid-row:y -2"></div>
|
||||
<div style="grid-row:y -3"></div>
|
||||
<div style="grid-row:y -4"></div>
|
||||
<div style="grid-row:y -5"></div>
|
||||
</div></div>
|
||||
|
||||
<div class="grid fit-1a"><div class="subgrid" style="grid-column:2/-3">
|
||||
<div style="grid-row:y 5"></div>
|
||||
<div style="grid-row:y 4"></div>
|
||||
<div style="grid-row:y 3"></div>
|
||||
<div style="grid-row:y 2"></div>
|
||||
<div style="grid-row:y 1"></div>
|
||||
<div style="grid-row:y -1"></div>
|
||||
<div style="grid-row:y -2"></div>
|
||||
<div style="grid-row:y -3"></div>
|
||||
<div style="grid-row:y -4"></div>
|
||||
<div style="grid-row:y -5"></div>
|
||||
</div></div>
|
||||
|
||||
<div class="grid fit-1b"><div class="subgrid" style="grid-column:3/-2">
|
||||
<div style="grid-row:y 5"></div>
|
||||
<div style="grid-row:y 4"></div>
|
||||
<div style="grid-row:y 3"></div>
|
||||
<div style="grid-row:y 2"></div>
|
||||
<div style="grid-row:y 1"></div>
|
||||
<div style="grid-row:y -1"></div>
|
||||
<div style="grid-row:y -2"></div>
|
||||
<div style="grid-row:y -3"></div>
|
||||
<div style="grid-row:y -4"></div>
|
||||
<div style="grid-row:y -5"></div>
|
||||
</div></div>
|
||||
|
||||
<div class="grid fit-1c"><div class="subgrid">
|
||||
<div style="grid-row:y 5"></div>
|
||||
<div style="grid-row:y 4"></div>
|
||||
<div style="grid-row:y 3"></div>
|
||||
<div style="grid-row:y 2"></div>
|
||||
<div style="grid-row:y 1"></div>
|
||||
<div style="grid-row:y -1"></div>
|
||||
<div style="grid-row:y -2"></div>
|
||||
<div style="grid-row:y -3"></div>
|
||||
<div style="grid-row:y -4"></div>
|
||||
<div style="grid-row:y -5"></div>
|
||||
</div></div>
|
||||
|
||||
<div class="grid fit-1d"><div class="subgrid">
|
||||
<div style="grid-row:y 5"></div>
|
||||
<div style="grid-row:y 4"></div>
|
||||
<div style="grid-row:y 3"></div>
|
||||
<div style="grid-row:y 2"></div>
|
||||
<div style="grid-row:y 1"></div>
|
||||
<div style="grid-row:y -1"></div>
|
||||
<div style="grid-row:y -2"></div>
|
||||
<div style="grid-row:y -3"></div>
|
||||
<div style="grid-row:y -4"></div>
|
||||
<div style="grid-row:y -5"></div>
|
||||
</div></div>
|
||||
|
||||
<div class="grid fit-1e"><div class="subgrid">
|
||||
<div style="grid-row:y 5"></div>
|
||||
<div style="grid-row:y 4"></div>
|
||||
<div style="grid-row:y 3"></div>
|
||||
<div style="grid-row:y 2"></div>
|
||||
<div style="grid-row:y 1"></div>
|
||||
<div style="grid-row:y -1"></div>
|
||||
<div style="grid-row:y -2"></div>
|
||||
<div style="grid-row:y -3"></div>
|
||||
<div style="grid-row:y -4"></div>
|
||||
<div style="grid-row:y -5"></div>
|
||||
</div></div>
|
||||
|
||||
<div class="grid fit-2a"><div class="subgrid">
|
||||
<div style="grid-row:y 5"></div>
|
||||
<div style="grid-row:y 4"></div>
|
||||
<div style="grid-row:y 3"></div>
|
||||
<div style="grid-row:y 2"></div>
|
||||
<div style="grid-row:y 1"></div>
|
||||
<div style="grid-row:y -1"></div>
|
||||
<div style="grid-row:y -2"></div>
|
||||
<div style="grid-row:y -3"></div>
|
||||
<div style="grid-row:y -4"></div>
|
||||
<div style="grid-row:y -5"></div>
|
||||
</div></div>
|
||||
|
||||
<div class="grid fit-2b"><div class="subgrid">
|
||||
<div style="grid-row:y 5"></div>
|
||||
<div style="grid-row:y 4"></div>
|
||||
<div style="grid-row:y 3"></div>
|
||||
<div style="grid-row:y 2"></div>
|
||||
<div style="grid-row:y 1"></div>
|
||||
<div style="grid-row:y -1"></div>
|
||||
<div style="grid-row:y -2"></div>
|
||||
<div style="grid-row:y -3"></div>
|
||||
<div style="grid-row:y -4"></div>
|
||||
<div style="grid-row:y -5"></div>
|
||||
</div></div>
|
||||
|
||||
<div class="grid fit-2c"><div class="subgrid">
|
||||
<div style="grid-row:y 5"></div>
|
||||
<div style="grid-row:y 4"></div>
|
||||
<div style="grid-row:y 3"></div>
|
||||
<div style="grid-row:y 2"></div>
|
||||
<div style="grid-row:y 1"></div>
|
||||
<div style="grid-row:y -1"></div>
|
||||
<div style="grid-row:y -2"></div>
|
||||
<div style="grid-row:y -3"></div>
|
||||
<div style="grid-row:y -4"></div>
|
||||
<div style="grid-row:y -5"></div>
|
||||
</div></div>
|
||||
|
||||
<div class="grid fit-2d"><div class="subgrid">
|
||||
<div style="grid-row:y 5"></div>
|
||||
<div style="grid-row:y 4"></div>
|
||||
<div style="grid-row:y 3"></div>
|
||||
<div style="grid-row:y 2"></div>
|
||||
<div style="grid-row:y 1"></div>
|
||||
<div style="grid-row:y -1"></div>
|
||||
<div style="grid-row:y -2"></div>
|
||||
<div style="grid-row:y -3"></div>
|
||||
<div style="grid-row:y -4"></div>
|
||||
<div style="grid-row:y -5"></div>
|
||||
</div></div>
|
||||
|
||||
<div class="grid fit-3a"><div class="subgrid">
|
||||
<div style="grid-row:y 5"></div>
|
||||
<div style="grid-row:y 4"></div>
|
||||
<div style="grid-row:y 3"></div>
|
||||
<div style="grid-row:y 2"></div>
|
||||
<div style="grid-row:y 1"></div>
|
||||
<div style="grid-row:y -1"></div>
|
||||
<div style="grid-row:y -2"></div>
|
||||
<div style="grid-row:y -3"></div>
|
||||
<div style="grid-row:y -4"></div>
|
||||
<div style="grid-row:y -5"></div>
|
||||
</div></div>
|
||||
|
||||
<div class="grid fit-3b"><div class="subgrid">
|
||||
<div style="grid-row:y 5"></div>
|
||||
<div style="grid-row:y 4"></div>
|
||||
<div style="grid-row:y 3"></div>
|
||||
<div style="grid-row:y 2"></div>
|
||||
<div style="grid-row:y 1"></div>
|
||||
<div style="grid-row:y -1"></div>
|
||||
<div style="grid-row:y -2"></div>
|
||||
<div style="grid-row:y -3"></div>
|
||||
<div style="grid-row:y -4"></div>
|
||||
<div style="grid-row:y -5"></div>
|
||||
</div></div>
|
||||
|
||||
<div class="grid fit-3c"><div class="subgrid">
|
||||
<div style="grid-row:y 5"></div>
|
||||
<div style="grid-row:y 4"></div>
|
||||
<div style="grid-row:y 3"></div>
|
||||
<div style="grid-row:y 2"></div>
|
||||
<div style="grid-row:y 1"></div>
|
||||
<div style="grid-row:y -1"></div>
|
||||
<div style="grid-row:y -2"></div>
|
||||
<div style="grid-row:y -3"></div>
|
||||
<div style="grid-row:y -4"></div>
|
||||
<div style="grid-row:y -5"></div>
|
||||
</div></div>
|
||||
|
||||
<div class="grid fit-4a"><div class="subgrid">
|
||||
<div style="grid-row:y 5"></div>
|
||||
<div style="grid-row:y 4"></div>
|
||||
<div style="grid-row:y 3"></div>
|
||||
<div style="grid-row:y 2"></div>
|
||||
<div style="grid-row:y 1"></div>
|
||||
<div style="grid-row:y -1"></div>
|
||||
<div style="grid-row:y -2"></div>
|
||||
<div style="grid-row:y -3"></div>
|
||||
<div style="grid-row:y -4"></div>
|
||||
<div style="grid-row:y -5"></div>
|
||||
</div></div>
|
||||
|
||||
<div class="grid fit-4b"><div class="subgrid">
|
||||
<div style="grid-row:y 5"></div>
|
||||
<div style="grid-row:y 4"></div>
|
||||
<div style="grid-row:y 3"></div>
|
||||
<div style="grid-row:y 2"></div>
|
||||
<div style="grid-row:y 1"></div>
|
||||
<div style="grid-row:y -1"></div>
|
||||
<div style="grid-row:y -2"></div>
|
||||
<div style="grid-row:y -3"></div>
|
||||
<div style="grid-row:y -4"></div>
|
||||
<div style="grid-row:y -5"></div>
|
||||
</div></div>
|
||||
|
||||
<div class="grid fit-5"><div class="subgrid">
|
||||
<div style="grid-row:y 5"></div>
|
||||
<div style="grid-row:y 4"></div>
|
||||
<div style="grid-row:y 3"></div>
|
||||
<div style="grid-row:y 2"></div>
|
||||
<div style="grid-row:y 1"></div>
|
||||
<div style="grid-row:y -1"></div>
|
||||
<div style="grid-row:y -2"></div>
|
||||
<div style="grid-row:y -3"></div>
|
||||
<div style="grid-row:y -4"></div>
|
||||
<div style="grid-row:y -5"></div>
|
||||
</div></div>
|
||||
|
||||
|
||||
</body>
|
||||
</html>
|
||||
|
|
@ -0,0 +1,483 @@
|
|||
<!DOCTYPE HTML>
|
||||
<!--
|
||||
Any copyright is dedicated to the Public Domain.
|
||||
http://creativecommons.org/publicdomain/zero/1.0/
|
||||
-->
|
||||
<html><head>
|
||||
<meta charset="utf-8">
|
||||
<title>CSS Grid Test: subgrid inside a parent with repeat(auto-fit) rows</title>
|
||||
<link rel="author" title="Mats Palmgren" href="mailto:mats@mozilla.com">
|
||||
<link rel="help" href="https://drafts.csswg.org/css-grid-2/">
|
||||
<link rel="match" href="parent-repeat-auto-fit-002-ref.html">
|
||||
<style>
|
||||
html,body {
|
||||
color:black; background-color:white; font:10px/1 monospace; padding:0; margin:0;
|
||||
}
|
||||
|
||||
.grid {
|
||||
display: inline-grid;
|
||||
height: 50px;
|
||||
width: 50px;
|
||||
grid-template-columns: repeat(auto-fit, 10px);
|
||||
border: 1px solid;
|
||||
vertical-align: top;
|
||||
}
|
||||
|
||||
.subgrid {
|
||||
display: grid;
|
||||
grid: subgrid / subgrid;
|
||||
grid-column: 1 / -1;
|
||||
grid-row: 3 / span 4;
|
||||
grid-auto-columns: 8px;
|
||||
background: grey;
|
||||
}
|
||||
|
||||
.fit-0a { grid-template-rows: repeat(auto-fit, [y] 30px) [z] 1px [z] 1px [z] 1px [z] 1px [z] }
|
||||
.fit-0b { grid-template-rows: [x] repeat(auto-fit, [y] 30px) [z] 1px [z] 1px [z] 1px [z] }
|
||||
.fit-0c { grid-template-rows: [x] 1px [x] repeat(auto-fit, [y] 10px) [z] 1px [z] 1px [z] }
|
||||
.fit-0d { grid-template-rows: [x] 2px [x] 2px [x] repeat(auto-fit, [y] 10px) [z] 1px [z] }
|
||||
.fit-0e { grid-template-rows: [x] 2px [x] 2px [x] 2px [x] repeat(auto-fit, [y] 10px) [z] }
|
||||
.fit-0f { grid-template-rows: [x] 2px [x] 2px [x] 2px [x] 2px [x] repeat(auto-fit, [y] 10px) }
|
||||
.fit-0g { grid-template-rows: [x] 2px [x] 2px [x] 2px [x] 2px [x] repeat(auto-fit, [y] 10px) [z] 1px [z] }
|
||||
.fit-0h { grid-template-rows: [x] 2px [x] 2px [x] 2px [x] 2px [x] 2px [x] 2px [x] repeat(auto-fit, [y] 10px) [z] 1px [z] }
|
||||
.fit-0i { grid-template-rows: [x] 2px [x] 2px [x] 2px [x] 2px [x] 2px [x] 2px [x] repeat(auto-fit, [y] 10px) [z] }
|
||||
.fit-0j { grid-template-rows: [x] 2px [x] 2px [x] 2px [x] 2px [x] 2px [x] 2px [x] repeat(auto-fit, [y] 10px) }
|
||||
.fit-0k { grid-template-rows: repeat(auto-fit, [y] 10px) repeat(100, [z] 10px) }
|
||||
.fit-0l { grid-template-rows: [x] repeat(auto-fit, [y] 10px) repeat(100, [z] 10px) }
|
||||
.fit-0m { grid-template-rows: repeat(100, [x] 10px) repeat(auto-fit, [y] 10px) }
|
||||
|
||||
.fit-1a { grid-template-rows: repeat(auto-fit, [y] 10px) [z] 1px [z] 1px [z] 1px [z] }
|
||||
.fit-1b { grid-template-rows: [x] repeat(auto-fit, [y] 10px) [z] 1px [z] 1px [z] }
|
||||
.fit-1c { grid-template-rows: [x] 2px [x] repeat(auto-fit, [y] 10px) [z] 1px [z] }
|
||||
.fit-1d { grid-template-rows: [x] 2px [x] 2px [x] repeat(auto-fit, [y] 10px) [z] }
|
||||
.fit-1e { grid-template-rows: [x] 2px [x] 2px [x] 2px [x] repeat(auto-fit, [y] 10px) }
|
||||
|
||||
.fit-2a { grid-template-rows: repeat(auto-fit, [y] 10px) [z] 1px [z] 1px [z] }
|
||||
.fit-2b { grid-template-rows: [x] repeat(auto-fit, [y] 10px) [z] 1px [z] }
|
||||
.fit-2c { grid-template-rows: [x] 2px [x] repeat(auto-fit, [y] 10px) [z] }
|
||||
.fit-2d { grid-template-rows: [x] 2px [x] 2px [x] repeat(auto-fit, [y] 10px) }
|
||||
|
||||
.fit-3a { grid-template-rows: repeat(auto-fit, [y] 10px) [z] 1px [z] }
|
||||
.fit-3b { grid-template-rows: [x] repeat(auto-fit, [y] 10px) [z] }
|
||||
.fit-3c { grid-template-rows: [x] 2px [x] repeat(auto-fit, [y] 10px) }
|
||||
|
||||
.fit-4a { grid-template-rows: repeat(auto-fit, [y] 10px) [z] }
|
||||
.fit-4b { grid-template-rows: [x] repeat(auto-fit, [y] 10px) }
|
||||
|
||||
.fit-5 { grid-template-rows: repeat(auto-fit, [y] 10px) }
|
||||
|
||||
.subgrid > :nth-child(2n) { background: black; }
|
||||
.subgrid > :nth-child(2n+1) { background: pink; }
|
||||
|
||||
</style>
|
||||
</head>
|
||||
<body>
|
||||
|
||||
<div class="grid fit-0a"><div class="subgrid">
|
||||
<div style="grid-row:y 5"></div>
|
||||
<div style="grid-row:y 4"></div>
|
||||
<div style="grid-row:y 3"></div>
|
||||
<div style="grid-row:y 2"></div>
|
||||
<div style="grid-row:y 1"></div>
|
||||
<div style="grid-row:y -1"></div>
|
||||
<div style="grid-row:y -2"></div>
|
||||
<div style="grid-row:y -3"></div>
|
||||
<div style="grid-row:y -4"></div>
|
||||
<div style="grid-row:y -5"></div>
|
||||
</div></div>
|
||||
|
||||
<div class="grid fit-0b"><div class="subgrid" style="grid-column-start:2">
|
||||
<div style="grid-row:y 5"></div>
|
||||
<div style="grid-row:y 4"></div>
|
||||
<div style="grid-row:y 3"></div>
|
||||
<div style="grid-row:y 2"></div>
|
||||
<div style="grid-row:y 1"></div>
|
||||
<div style="grid-row:y -1"></div>
|
||||
<div style="grid-row:y -2"></div>
|
||||
<div style="grid-row:y -3"></div>
|
||||
<div style="grid-row:y -4"></div>
|
||||
<div style="grid-row:y -5"></div>
|
||||
</div></div>
|
||||
|
||||
<div class="grid fit-0c"><div class="subgrid" style="grid-column-start:3">
|
||||
<div style="grid-row:y 5"></div>
|
||||
<div style="grid-row:y 4"></div>
|
||||
<div style="grid-row:y 3"></div>
|
||||
<div style="grid-row:y 2"></div>
|
||||
<div style="grid-row:y 1"></div>
|
||||
<div style="grid-row:y -1"></div>
|
||||
<div style="grid-row:y -2"></div>
|
||||
<div style="grid-row:y -3"></div>
|
||||
<div style="grid-row:y -4"></div>
|
||||
<div style="grid-row:y -5"></div>
|
||||
</div></div>
|
||||
|
||||
<div class="grid fit-0d"><div class="subgrid" style="grid-column-start:4">
|
||||
<div style="grid-row:y 5"></div>
|
||||
<div style="grid-row:y 4"></div>
|
||||
<div style="grid-row:y 3"></div>
|
||||
<div style="grid-row:y 2"></div>
|
||||
<div style="grid-row:y 1"></div>
|
||||
<div style="grid-row:y -1"></div>
|
||||
<div style="grid-row:y -2"></div>
|
||||
<div style="grid-row:y -3"></div>
|
||||
<div style="grid-row:y -4"></div>
|
||||
<div style="grid-row:y -5"></div>
|
||||
</div></div>
|
||||
|
||||
<div class="grid fit-0e"><div class="subgrid" style="grid-column-start:5">
|
||||
<div style="grid-row:y 5"></div>
|
||||
<div style="grid-row:y 4"></div>
|
||||
<div style="grid-row:y 3"></div>
|
||||
<div style="grid-row:y 2"></div>
|
||||
<div style="grid-row:y 1"></div>
|
||||
<div style="grid-row:y -1"></div>
|
||||
<div style="grid-row:y -2"></div>
|
||||
<div style="grid-row:y -3"></div>
|
||||
<div style="grid-row:y -4"></div>
|
||||
<div style="grid-row:y -5"></div>
|
||||
</div></div>
|
||||
|
||||
<div class="grid fit-0f"><div class="subgrid" style="grid-column-start:6">
|
||||
<div style="grid-row:y 5"></div>
|
||||
<div style="grid-row:y 4"></div>
|
||||
<div style="grid-row:y 3"></div>
|
||||
<div style="grid-row:y 2"></div>
|
||||
<div style="grid-row:y 1"></div>
|
||||
<div style="grid-row:y -1"></div>
|
||||
<div style="grid-row:y -2"></div>
|
||||
<div style="grid-row:y -3"></div>
|
||||
<div style="grid-row:y -4"></div>
|
||||
<div style="grid-row:y -5"></div>
|
||||
</div></div>
|
||||
|
||||
<div class="grid fit-0g"><div class="subgrid" style="grid-column-end:-2">
|
||||
<div style="grid-row:y 5"></div>
|
||||
<div style="grid-row:y 4"></div>
|
||||
<div style="grid-row:y 3"></div>
|
||||
<div style="grid-row:y 2"></div>
|
||||
<div style="grid-row:y 1"></div>
|
||||
<div style="grid-row:y -1"></div>
|
||||
<div style="grid-row:y -2"></div>
|
||||
<div style="grid-row:y -3"></div>
|
||||
<div style="grid-row:y -4"></div>
|
||||
<div style="grid-row:y -5"></div>
|
||||
</div></div>
|
||||
|
||||
<div class="grid fit-0h"><div class="subgrid" style="grid-column-end:-3">
|
||||
<div style="grid-row:y 5"></div>
|
||||
<div style="grid-row:y 4"></div>
|
||||
<div style="grid-row:y 3"></div>
|
||||
<div style="grid-row:y 2"></div>
|
||||
<div style="grid-row:y 1"></div>
|
||||
<div style="grid-row:y -1"></div>
|
||||
<div style="grid-row:y -2"></div>
|
||||
<div style="grid-row:y -3"></div>
|
||||
<div style="grid-row:y -4"></div>
|
||||
<div style="grid-row:y -5"></div>
|
||||
</div></div>
|
||||
|
||||
<div class="grid fit-0i"><div class="subgrid" style="grid-column-end:-4">
|
||||
<div style="grid-row:y 5"></div>
|
||||
<div style="grid-row:y 4"></div>
|
||||
<div style="grid-row:y 3"></div>
|
||||
<div style="grid-row:y 2"></div>
|
||||
<div style="grid-row:y 1"></div>
|
||||
<div style="grid-row:y -1"></div>
|
||||
<div style="grid-row:y -2"></div>
|
||||
<div style="grid-row:y -3"></div>
|
||||
<div style="grid-row:y -4"></div>
|
||||
<div style="grid-row:y -5"></div>
|
||||
</div></div>
|
||||
|
||||
<div class="grid fit-0j"><div class="subgrid" style="grid-column-end:-5">
|
||||
<div style="grid-row:y 5"></div>
|
||||
<div style="grid-row:y 4"></div>
|
||||
<div style="grid-row:y 3"></div>
|
||||
<div style="grid-row:y 2"></div>
|
||||
<div style="grid-row:y 1"></div>
|
||||
<div style="grid-row:y -1"></div>
|
||||
<div style="grid-row:y -2"></div>
|
||||
<div style="grid-row:y -3"></div>
|
||||
<div style="grid-row:y -4"></div>
|
||||
<div style="grid-row:y -5"></div>
|
||||
</div></div>
|
||||
|
||||
<div class="grid fit-0k"><div class="subgrid" style="grid-column-end:-6">
|
||||
<div style="grid-row:y 5"></div>
|
||||
<div style="grid-row:y 4"></div>
|
||||
<div style="grid-row:y 3"></div>
|
||||
<div style="grid-row:y 2"></div>
|
||||
<div style="grid-row:y 1"></div>
|
||||
<div style="grid-row:y -1"></div>
|
||||
<div style="grid-row:y -2"></div>
|
||||
<div style="grid-row:y -3"></div>
|
||||
<div style="grid-row:y -4"></div>
|
||||
<div style="grid-row:y -5"></div>
|
||||
</div></div>
|
||||
|
||||
<div class="grid fit-0l"><div class="subgrid" style="grid-column:2/-2">
|
||||
<div style="grid-row:y 5"></div>
|
||||
<div style="grid-row:y 4"></div>
|
||||
<div style="grid-row:y 3"></div>
|
||||
<div style="grid-row:y 2"></div>
|
||||
<div style="grid-row:y 1"></div>
|
||||
<div style="grid-row:y -1"></div>
|
||||
<div style="grid-row:y -2"></div>
|
||||
<div style="grid-row:y -3"></div>
|
||||
<div style="grid-row:y -4"></div>
|
||||
<div style="grid-row:y -5"></div>
|
||||
</div></div>
|
||||
|
||||
<div class="grid fit-0m"><div class="subgrid" style="grid-column:3/-3">
|
||||
<div style="grid-row:y 5"></div>
|
||||
<div style="grid-row:y 4"></div>
|
||||
<div style="grid-row:y 3"></div>
|
||||
<div style="grid-row:y 2"></div>
|
||||
<div style="grid-row:y 1"></div>
|
||||
<div style="grid-row:y -1"></div>
|
||||
<div style="grid-row:y -2"></div>
|
||||
<div style="grid-row:y -3"></div>
|
||||
<div style="grid-row:y -4"></div>
|
||||
<div style="grid-row:y -5"></div>
|
||||
</div></div>
|
||||
|
||||
<div class="grid fit-1a"><div class="subgrid" style="grid-column:2/-3">
|
||||
<div style="grid-row:y 5"></div>
|
||||
<div style="grid-row:y 4"></div>
|
||||
<div style="grid-row:y 3"></div>
|
||||
<div style="grid-row:y 2"></div>
|
||||
<div style="grid-row:y 1"></div>
|
||||
<div style="grid-row:y -1"></div>
|
||||
<div style="grid-row:y -2"></div>
|
||||
<div style="grid-row:y -3"></div>
|
||||
<div style="grid-row:y -4"></div>
|
||||
<div style="grid-row:y -5"></div>
|
||||
</div></div>
|
||||
|
||||
<div class="grid fit-1b"><div class="subgrid" style="grid-column:3/-2">
|
||||
<div style="grid-row:y 5"></div>
|
||||
<div style="grid-row:y 4"></div>
|
||||
<div style="grid-row:y 3"></div>
|
||||
<div style="grid-row:y 2"></div>
|
||||
<div style="grid-row:y 1"></div>
|
||||
<div style="grid-row:y -1"></div>
|
||||
<div style="grid-row:y -2"></div>
|
||||
<div style="grid-row:y -3"></div>
|
||||
<div style="grid-row:y -4"></div>
|
||||
<div style="grid-row:y -5"></div>
|
||||
</div></div>
|
||||
|
||||
<div class="grid fit-1c"><div class="subgrid">
|
||||
<div style="grid-row:y 5"></div>
|
||||
<div style="grid-row:y 4"></div>
|
||||
<div style="grid-row:y 3"></div>
|
||||
<div style="grid-row:y 2"></div>
|
||||
<div style="grid-row:y 1"></div>
|
||||
<div style="grid-row:y -1"></div>
|
||||
<div style="grid-row:y -2"></div>
|
||||
<div style="grid-row:y -3"></div>
|
||||
<div style="grid-row:y -4"></div>
|
||||
<div style="grid-row:y -5"></div>
|
||||
</div></div>
|
||||
|
||||
<div class="grid fit-1d"><div class="subgrid">
|
||||
<div style="grid-row:y 5"></div>
|
||||
<div style="grid-row:y 4"></div>
|
||||
<div style="grid-row:y 3"></div>
|
||||
<div style="grid-row:y 2"></div>
|
||||
<div style="grid-row:y 1"></div>
|
||||
<div style="grid-row:y -1"></div>
|
||||
<div style="grid-row:y -2"></div>
|
||||
<div style="grid-row:y -3"></div>
|
||||
<div style="grid-row:y -4"></div>
|
||||
<div style="grid-row:y -5"></div>
|
||||
</div></div>
|
||||
|
||||
<div class="grid fit-1e"><div class="subgrid">
|
||||
<div style="grid-row:y 5"></div>
|
||||
<div style="grid-row:y 4"></div>
|
||||
<div style="grid-row:y 3"></div>
|
||||
<div style="grid-row:y 2"></div>
|
||||
<div style="grid-row:y 1"></div>
|
||||
<div style="grid-row:y -1"></div>
|
||||
<div style="grid-row:y -2"></div>
|
||||
<div style="grid-row:y -3"></div>
|
||||
<div style="grid-row:y -4"></div>
|
||||
<div style="grid-row:y -5"></div>
|
||||
</div></div>
|
||||
|
||||
<div class="grid fit-2a"><div class="subgrid">
|
||||
<div style="grid-row:y 5"></div>
|
||||
<div style="grid-row:y 4"></div>
|
||||
<div style="grid-row:y 3"></div>
|
||||
<div style="grid-row:y 2"></div>
|
||||
<div style="grid-row:y 1"></div>
|
||||
<div style="grid-row:y -1"></div>
|
||||
<div style="grid-row:y -2"></div>
|
||||
<div style="grid-row:y -3"></div>
|
||||
<div style="grid-row:y -4"></div>
|
||||
<div style="grid-row:y -5"></div>
|
||||
</div></div>
|
||||
|
||||
<div class="grid fit-2b"><div class="subgrid">
|
||||
<div style="grid-row:y 5"></div>
|
||||
<div style="grid-row:y 4"></div>
|
||||
<div style="grid-row:y 3"></div>
|
||||
<div style="grid-row:y 2"></div>
|
||||
<div style="grid-row:y 1"></div>
|
||||
<div style="grid-row:y -1"></div>
|
||||
<div style="grid-row:y -2"></div>
|
||||
<div style="grid-row:y -3"></div>
|
||||
<div style="grid-row:y -4"></div>
|
||||
<div style="grid-row:y -5"></div>
|
||||
</div></div>
|
||||
|
||||
<div class="grid fit-2c"><div class="subgrid">
|
||||
<div style="grid-row:y 5"></div>
|
||||
<div style="grid-row:y 4"></div>
|
||||
<div style="grid-row:y 3"></div>
|
||||
<div style="grid-row:y 2"></div>
|
||||
<div style="grid-row:y 1"></div>
|
||||
<div style="grid-row:y -1"></div>
|
||||
<div style="grid-row:y -2"></div>
|
||||
<div style="grid-row:y -3"></div>
|
||||
<div style="grid-row:y -4"></div>
|
||||
<div style="grid-row:y -5"></div>
|
||||
</div></div>
|
||||
|
||||
<div class="grid fit-2d"><div class="subgrid">
|
||||
<div style="grid-row:y 5"></div>
|
||||
<div style="grid-row:y 4"></div>
|
||||
<div style="grid-row:y 3"></div>
|
||||
<div style="grid-row:y 2"></div>
|
||||
<div style="grid-row:y 1"></div>
|
||||
<div style="grid-row:y -1"></div>
|
||||
<div style="grid-row:y -2"></div>
|
||||
<div style="grid-row:y -3"></div>
|
||||
<div style="grid-row:y -4"></div>
|
||||
<div style="grid-row:y -5"></div>
|
||||
</div></div>
|
||||
|
||||
<div class="grid fit-3a"><div class="subgrid">
|
||||
<div style="grid-row:y 5"></div>
|
||||
<div style="grid-row:y 4"></div>
|
||||
<div style="grid-row:y 3"></div>
|
||||
<div style="grid-row:y 2"></div>
|
||||
<div style="grid-row:y 1"></div>
|
||||
<div style="grid-row:y -1"></div>
|
||||
<div style="grid-row:y -2"></div>
|
||||
<div style="grid-row:y -3"></div>
|
||||
<div style="grid-row:y -4"></div>
|
||||
<div style="grid-row:y -5"></div>
|
||||
</div></div>
|
||||
|
||||
<div class="grid fit-3b"><div class="subgrid">
|
||||
<div style="grid-row:y 5"></div>
|
||||
<div style="grid-row:y 4"></div>
|
||||
<div style="grid-row:y 3"></div>
|
||||
<div style="grid-row:y 2"></div>
|
||||
<div style="grid-row:y 1"></div>
|
||||
<div style="grid-row:y -1"></div>
|
||||
<div style="grid-row:y -2"></div>
|
||||
<div style="grid-row:y -3"></div>
|
||||
<div style="grid-row:y -4"></div>
|
||||
<div style="grid-row:y -5"></div>
|
||||
</div></div>
|
||||
|
||||
<div class="grid fit-3c"><div class="subgrid">
|
||||
<div style="grid-row:y 5"></div>
|
||||
<div style="grid-row:y 4"></div>
|
||||
<div style="grid-row:y 3"></div>
|
||||
<div style="grid-row:y 2"></div>
|
||||
<div style="grid-row:y 1"></div>
|
||||
<div style="grid-row:y -1"></div>
|
||||
<div style="grid-row:y -2"></div>
|
||||
<div style="grid-row:y -3"></div>
|
||||
<div style="grid-row:y -4"></div>
|
||||
<div style="grid-row:y -5"></div>
|
||||
</div></div>
|
||||
|
||||
<div class="grid fit-4a"><div class="subgrid">
|
||||
<div style="grid-row:y 5"></div>
|
||||
<div style="grid-row:y 4"></div>
|
||||
<div style="grid-row:y 3"></div>
|
||||
<div style="grid-row:y 2"></div>
|
||||
<div style="grid-row:y 1"></div>
|
||||
<div style="grid-row:y -1"></div>
|
||||
<div style="grid-row:y -2"></div>
|
||||
<div style="grid-row:y -3"></div>
|
||||
<div style="grid-row:y -4"></div>
|
||||
<div style="grid-row:y -5"></div>
|
||||
</div></div>
|
||||
|
||||
<div class="grid fit-4b"><div class="subgrid">
|
||||
<div style="grid-row:y 5"></div>
|
||||
<div style="grid-row:y 4"></div>
|
||||
<div style="grid-row:y 3"></div>
|
||||
<div style="grid-row:y 2"></div>
|
||||
<div style="grid-row:y 1"></div>
|
||||
<div style="grid-row:y -1"></div>
|
||||
<div style="grid-row:y -2"></div>
|
||||
<div style="grid-row:y -3"></div>
|
||||
<div style="grid-row:y -4"></div>
|
||||
<div style="grid-row:y -5"></div>
|
||||
</div></div>
|
||||
|
||||
<div class="grid fit-5"><div class="subgrid">
|
||||
<div style="grid-row:y 5"></div>
|
||||
<div style="grid-row:y 4"></div>
|
||||
<div style="grid-row:y 3"></div>
|
||||
<div style="grid-row:y 2"></div>
|
||||
<div style="grid-row:y 1"></div>
|
||||
<div style="grid-row:y -1"></div>
|
||||
<div style="grid-row:y -2"></div>
|
||||
<div style="grid-row:y -3"></div>
|
||||
<div style="grid-row:y -4"></div>
|
||||
<div style="grid-row:y -5"></div>
|
||||
</div></div>
|
||||
|
||||
<script>
|
||||
const expectedResults = [
|
||||
"[y] 0px [z] 1px [z] 1px [z] 1px [z] 1px [z]",
|
||||
"[x y] 0px [z] 1px [z] 1px [z] 1px [z]",
|
||||
"[x] 1px [x y] 0px [y] 10px [y] 10px [y] 10px [z] 1px [z] 1px [z]",
|
||||
"[x] 2px [x] 2px [x y] 10px [y] 10px [y] 10px [y] 10px [z] 1px [z]",
|
||||
"[x] 2px [x] 2px [x] 2px [x y] 10px [y] 10px [y] 10px [y] 0px [z]",
|
||||
"[x] 2px [x] 2px [x] 2px [x] 2px [x y] 10px [y] 10px [y] 0px [y] 0px",
|
||||
"[x] 2px [x] 2px [x] 2px [x] 2px [x y] 10px [y] 10px [y] 0px [y] 0px [z] 1px [z]",
|
||||
"[x] 2px [x] 2px [x] 2px [x] 2px [x] 2px [x] 2px [x y] 0px [y] 0px [y] 0px [z] 1px [z]",
|
||||
"[x] 2px [x] 2px [x] 2px [x] 2px [x] 2px [x] 2px [x y] 0px [y] 0px [y] 0px [z]",
|
||||
"[x] 2px [x] 2px [x] 2px [x] 2px [x] 2px [x] 2px [x y] 0px [y] 0px [y] 0px",
|
||||
"[y] 0px [z] 10px [z] 10px [z] 10px [z] 10px [z] 10px [z] 10px [z] 10px [z] 10px [z] 10px [z] 10px [z] 10px [z] 10px [z] 10px [z] 10px [z] 10px [z] 10px [z] 10px [z] 10px [z] 10px [z] 10px [z] 10px [z] 10px [z] 10px [z] 10px [z] 10px [z] 10px [z] 10px [z] 10px [z] 10px [z] 10px [z] 10px [z] 10px [z] 10px [z] 10px [z] 10px [z] 10px [z] 10px [z] 10px [z] 10px [z] 10px [z] 10px [z] 10px [z] 10px [z] 10px [z] 10px [z] 10px [z] 10px [z] 10px [z] 10px [z] 10px [z] 10px [z] 10px [z] 10px [z] 10px [z] 10px [z] 10px [z] 10px [z] 10px [z] 10px [z] 10px [z] 10px [z] 10px [z] 10px [z] 10px [z] 10px [z] 10px [z] 10px [z] 10px [z] 10px [z] 10px [z] 10px [z] 10px [z] 10px [z] 10px [z] 10px [z] 10px [z] 10px [z] 10px [z] 10px [z] 10px [z] 10px [z] 10px [z] 10px [z] 10px [z] 10px [z] 10px [z] 10px [z] 10px [z] 10px [z] 10px [z] 10px [z] 10px [z] 10px [z] 10px [z] 10px [z] 10px [z] 10px [z] 10px [z] 10px [z] 10px",
|
||||
"[x y] 0px [z] 10px [z] 10px [z] 10px [z] 10px [z] 10px [z] 10px [z] 10px [z] 10px [z] 10px [z] 10px [z] 10px [z] 10px [z] 10px [z] 10px [z] 10px [z] 10px [z] 10px [z] 10px [z] 10px [z] 10px [z] 10px [z] 10px [z] 10px [z] 10px [z] 10px [z] 10px [z] 10px [z] 10px [z] 10px [z] 10px [z] 10px [z] 10px [z] 10px [z] 10px [z] 10px [z] 10px [z] 10px [z] 10px [z] 10px [z] 10px [z] 10px [z] 10px [z] 10px [z] 10px [z] 10px [z] 10px [z] 10px [z] 10px [z] 10px [z] 10px [z] 10px [z] 10px [z] 10px [z] 10px [z] 10px [z] 10px [z] 10px [z] 10px [z] 10px [z] 10px [z] 10px [z] 10px [z] 10px [z] 10px [z] 10px [z] 10px [z] 10px [z] 10px [z] 10px [z] 10px [z] 10px [z] 10px [z] 10px [z] 10px [z] 10px [z] 10px [z] 10px [z] 10px [z] 10px [z] 10px [z] 10px [z] 10px [z] 10px [z] 10px [z] 10px [z] 10px [z] 10px [z] 10px [z] 10px [z] 10px [z] 10px [z] 10px [z] 10px [z] 10px [z] 10px [z] 10px [z] 10px [z] 10px [z] 10px [z] 10px",
|
||||
"[x] 10px [x] 10px [x] 10px [x] 10px [x] 10px [x] 10px [x] 10px [x] 10px [x] 10px [x] 10px [x] 10px [x] 10px [x] 10px [x] 10px [x] 10px [x] 10px [x] 10px [x] 10px [x] 10px [x] 10px [x] 10px [x] 10px [x] 10px [x] 10px [x] 10px [x] 10px [x] 10px [x] 10px [x] 10px [x] 10px [x] 10px [x] 10px [x] 10px [x] 10px [x] 10px [x] 10px [x] 10px [x] 10px [x] 10px [x] 10px [x] 10px [x] 10px [x] 10px [x] 10px [x] 10px [x] 10px [x] 10px [x] 10px [x] 10px [x] 10px [x] 10px [x] 10px [x] 10px [x] 10px [x] 10px [x] 10px [x] 10px [x] 10px [x] 10px [x] 10px [x] 10px [x] 10px [x] 10px [x] 10px [x] 10px [x] 10px [x] 10px [x] 10px [x] 10px [x] 10px [x] 10px [x] 10px [x] 10px [x] 10px [x] 10px [x] 10px [x] 10px [x] 10px [x] 10px [x] 10px [x] 10px [x] 10px [x] 10px [x] 10px [x] 10px [x] 10px [x] 10px [x] 10px [x] 10px [x] 10px [x] 10px [x] 10px [x] 10px [x] 10px [x] 10px [x] 10px [x] 10px [x] 10px [x] 10px [x] 10px [y] 0px",
|
||||
"[y] 0px [y] 0px [y] 10px [y] 10px [z] 1px [z] 1px [z] 1px [z]",
|
||||
"[x y] 0px [y] 0px [y] 10px [y] 10px [z] 1px [z] 1px [z]",
|
||||
"[x] 2px [x y] 0px [y] 10px [y] 10px [y] 10px [z] 1px [z]",
|
||||
"[x] 2px [x] 2px [x y] 10px [y] 10px [y] 10px [y] 10px [z]",
|
||||
"[x] 2px [x] 2px [x] 2px [x y] 10px [y] 10px [y] 10px [y] 0px",
|
||||
"[y] 0px [y] 0px [y] 10px [y] 10px [z] 1px [z] 1px [z]",
|
||||
"[x y] 0px [y] 0px [y] 10px [y] 10px [z] 1px [z]",
|
||||
"[x] 2px [x y] 0px [y] 10px [y] 10px [y] 10px [z]",
|
||||
"[x] 2px [x] 2px [x y] 10px [y] 10px [y] 10px [y] 10px",
|
||||
"[y] 0px [y] 0px [y] 10px [y] 10px [z] 1px [z]",
|
||||
"[x y] 0px [y] 0px [y] 10px [y] 10px [y] 10px [z]",
|
||||
"[x] 2px [x y] 0px [y] 10px [y] 10px [y] 10px",
|
||||
"[y] 0px [y] 0px [y] 10px [y] 10px [y] 10px [z]",
|
||||
"[x y] 0px [y] 0px [y] 10px [y] 10px [y] 10px",
|
||||
"[y] 0px [y] 0px [y] 10px [y] 10px [y] 10px",
|
||||
];
|
||||
[...document.querySelectorAll('.grid')].forEach(function(grid, i) {
|
||||
let actual = window.getComputedStyle(grid)['grid-template-rows'];
|
||||
let expected = expectedResults[i];
|
||||
if (actual != expected) {
|
||||
let err = "Unexpected getComputedStyle value for grid " + i + " with className '" + grid.className + "':" +
|
||||
" Actual: \"" + actual + "\", Expected: \"" + expected + "\"";
|
||||
document.body.appendChild(document.createTextNode(err));
|
||||
}
|
||||
});
|
||||
</script>
|
||||
|
||||
</body>
|
||||
</html>
|
||||
|
|
@ -0,0 +1,10 @@
|
|||
<!doctype html>
|
||||
<title>CSS Test Reference</title>
|
||||
<style>
|
||||
input {
|
||||
all: initial;
|
||||
width: 100px;
|
||||
}
|
||||
</style>
|
||||
<p>You should not see an ellipsis for the text below.</p>
|
||||
<input id="input_element" value="xxxxxxxxxxxxxxxxxxxx">
|
||||
|
|
@ -0,0 +1,20 @@
|
|||
<!doctype html>
|
||||
<title>CSS Overflow Test: text-overflow:ellipsis not rendered while editing</title>
|
||||
<link rel="help" href="https://drafts.csswg.org/css-overflow/#ellipsis-interaction">
|
||||
<link rel="match" href="text-overflow-ellipsis-editing-input-ref.html">
|
||||
<!-- The specification says it "may" render ellipsis as clip while editing, but
|
||||
all current engines do for input elements. -->
|
||||
<style>
|
||||
input {
|
||||
all: initial;
|
||||
width: 100px;
|
||||
text-overflow: ellipsis;
|
||||
caret-color: transparent;
|
||||
}
|
||||
</style>
|
||||
<p>You should not see an ellipsis for the text below.</p>
|
||||
<input id="input_element" value="xxxxxxxxxxxxxxxxxxxx">
|
||||
<script>
|
||||
input_element.offsetTop;
|
||||
input_element.focus();
|
||||
</script>
|
||||
|
|
@ -0,0 +1,33 @@
|
|||
<!DOCTYPE html>
|
||||
<html class="test-wait">
|
||||
<link rel="help" href="https://drafts.csswg.org/css-scroll-anchoring/">
|
||||
<link rel="help" href="https://bugs.chromium.org/p/chromium/issues/detail?id=823150">
|
||||
|
||||
<script src="/resources/testdriver.js"></script>
|
||||
<script src="/resources/testdriver-vendor.js"></script>
|
||||
|
||||
<style>
|
||||
|
||||
#a { height: 700px; }
|
||||
#b { border: 4px solid #ccc; }
|
||||
|
||||
</style>
|
||||
<div id="a"><div id="b"></div></div>
|
||||
<script>
|
||||
|
||||
onload = () => {
|
||||
test_driver.bless("requestFullscreen", step2);
|
||||
};
|
||||
step2 = () => {
|
||||
b.requestFullscreen();
|
||||
b.addEventListener('fullscreenchange', step3);
|
||||
};
|
||||
step3 = () => {
|
||||
document.designMode = "on";
|
||||
document.execCommand("selectAll");
|
||||
document.execCommand("formatBlock", false, "p");
|
||||
document.documentElement.classList.remove('test-wait');
|
||||
};
|
||||
|
||||
</script>
|
||||
</html>
|
||||
|
|
@ -0,0 +1,11 @@
|
|||
<!DOCTYPE html>
|
||||
<title>CSS aspect-ratio: div inline size + min-width: auto</title>
|
||||
<link rel="author" title="Google LLC" href="https://www.google.com/">
|
||||
<link rel="help" href="https://drafts.csswg.org/css-sizing-4/#aspect-ratio">
|
||||
<link rel="match" href="../../reference/ref-filled-green-100px-square.xht" />
|
||||
|
||||
<p>Test passes if there is a filled green square and <strong>no red</strong>.</p>
|
||||
|
||||
<div style="background: green; height: 100px; aspect-ratio: 1/2;">
|
||||
<div style="width: 100px;"></div>
|
||||
</div>
|
||||
|
|
@ -0,0 +1,12 @@
|
|||
<!DOCTYPE html>
|
||||
<title>CSS aspect-ratio: div inline size + min-width: auto</title>
|
||||
<link rel="author" title="Google LLC" href="https://www.google.com/">
|
||||
<link rel="help" href="https://drafts.csswg.org/css-sizing-4/#aspect-ratio">
|
||||
<link rel="match" href="../../reference/ref-filled-green-100px-square.xht" />
|
||||
<meta name="assert" content="With min-width: auto and content smaller than the aspect ratio size, we should still size per aspect-ratio">
|
||||
|
||||
<p>Test passes if there is a filled green square and <strong>no red</strong>.</p>
|
||||
|
||||
<div style="background: green; height: 100px; aspect-ratio: 1/1;">
|
||||
<div style="width: 50px"></div>
|
||||
</div>
|
||||
|
|
@ -0,0 +1,11 @@
|
|||
<!DOCTYPE html>
|
||||
<title>CSS aspect-ratio: div inline size + min-width: auto</title>
|
||||
<link rel="author" title="Google LLC" href="https://www.google.com/">
|
||||
<link rel="help" href="https://drafts.csswg.org/css-sizing-4/#aspect-ratio">
|
||||
<link rel="match" href="../../reference/ref-filled-green-100px-square.xht" />
|
||||
|
||||
<p>Test passes if there is a filled green square and <strong>no red</strong>.</p>
|
||||
|
||||
<div style="writing-mode: vertical-lr; background: green; width: 100px; aspect-ratio: 2/1;">
|
||||
<div style="height: 100px"></div>
|
||||
</div>
|
||||
|
|
@ -0,0 +1,13 @@
|
|||
<!DOCTYPE html>
|
||||
<title>CSS aspect-ratio: div inline size + min-width: auto</title>
|
||||
<link rel="author" title="Google LLC" href="https://www.google.com/">
|
||||
<link rel="help" href="https://drafts.csswg.org/css-sizing-4/#aspect-ratio">
|
||||
<link rel="match" href="../../reference/ref-filled-green-100px-square.xht" />
|
||||
<meta name="assert" content="Setting overflow to non-visible/clip should not apply min-width: auto">
|
||||
|
||||
<p>Test passes if there is a filled green square and <strong>no red</strong>.</p>
|
||||
|
||||
<div style="background: green; height: 100px; aspect-ratio: 1/1; overflow: hidden;">
|
||||
<div style="width: 100px; display: inline-block;"></div>
|
||||
<div style="width: 500px; display: inline-block; background: red;"></div>
|
||||
</div>
|
||||
|
|
@ -0,0 +1,7 @@
|
|||
<!DOCTYPE html>
|
||||
<div style="writing-mode:vertical-rl">
|
||||
<div>
|
||||
vertical
|
||||
</div>
|
||||
</div>
|
||||
|
||||
|
|
@ -0,0 +1,10 @@
|
|||
<!DOCTYPE html>
|
||||
<link rel=help href="https://drafts.csswg.org/css-writing-modes-4/#text-orientation">
|
||||
<link rel=help href="https://crbug.com/1081659">
|
||||
<link rel="match" href="text-orientation-initial-ref.html">
|
||||
<div style="writing-mode:vertical-rl;text-orientation:upright">
|
||||
<div style="text-orientation:initial">
|
||||
vertical
|
||||
</div>
|
||||
</div>
|
||||
|
||||
|
|
@ -0,0 +1,6 @@
|
|||
<!DOCTYPE html>
|
||||
<div>
|
||||
<div>
|
||||
horizontal
|
||||
</div>
|
||||
</div>
|
||||
|
|
@ -0,0 +1,9 @@
|
|||
<!DOCTYPE html>
|
||||
<link rel=help href="https://drafts.csswg.org/css-writing-modes-4/#block-flow">
|
||||
<link rel=help href="https://crbug.com/1081659">
|
||||
<link rel="match" href="writing-mode-initial-ref.html">
|
||||
<div style="writing-mode:vertical-rl">
|
||||
<div style="writing-mode:initial">
|
||||
horizontal
|
||||
</div>
|
||||
</div>
|
||||
|
|
@ -1,6 +1,5 @@
|
|||
<!DOCTYPE html>
|
||||
<head>
|
||||
<meta name="timeout" content="long">
|
||||
<script src="/resources/testharness.js"></script>
|
||||
<script src="/resources/testharnessreport.js"></script>
|
||||
</head>
|
||||
|
|
@ -16,46 +15,55 @@ const iframe_src = "/feature-policy/feature-policy-for-sandbox/resources/window_
|
|||
const window_url_main = "/feature-policy/feature-policy-for-sandbox/resources/opened_window.html";
|
||||
|
||||
promise_test( async () => {
|
||||
for (const feature of features_that_propagate) {
|
||||
const iframe = await add_iframe(
|
||||
{src: iframe_src, allow: `${feature} 'none'`});
|
||||
iframe.contentWindow.postMessage({type: "feature", feature: feature}, "*");
|
||||
const iframe_state = await feature_update(feature);
|
||||
assert_false(iframe_state, `'${feature}' is not disabled in <iframe>.'`);
|
||||
const iframe = await add_iframe({
|
||||
src: iframe_src,
|
||||
allow: features_that_propagate.map(feature => `${feature} 'none'`).join(", ")
|
||||
});
|
||||
|
||||
iframe.contentWindow.postMessage(
|
||||
{type: "features", features: features_that_propagate}, "*");
|
||||
const iframe_states = await feature_update();
|
||||
for (const [feature, state] of iframe_states)
|
||||
assert_false(state, `'${feature}' is not disabled in <iframe>.'`);
|
||||
|
||||
iframe.contentWindow.postMessage({
|
||||
type: "open_window",
|
||||
url: `${window_url_main}?${feature}`
|
||||
url: `${window_url_main}?${features_that_propagate.join("&")}`
|
||||
}, "*");
|
||||
const window_state = await feature_update(feature);
|
||||
assert_false(window_state,
|
||||
`'${feature}' is not disabled in new window.`);
|
||||
const window_states = await feature_update();
|
||||
for (const [feature, state] of iframe_states)
|
||||
assert_false(state, `'${feature}' is not disabled in new window.`);
|
||||
|
||||
const did_close = await close_aux_window(iframe);
|
||||
assert_true(did_close);
|
||||
iframe.parentElement.removeChild(iframe);
|
||||
}
|
||||
}, "Verify feature policies are inherited by the auxiliary browsing context " +
|
||||
"if opened from a non-sandboxed same-origin <iframe>.");
|
||||
|
||||
promise_test( async () => {
|
||||
for (const feature of features_that_propagate) {
|
||||
const iframe = await add_iframe({
|
||||
src: iframe_src,
|
||||
allow: `${feature} 'none'`,
|
||||
sandbox: "allow-scripts allow-popups allow-popups-to-escape-sandbox"});
|
||||
iframe.contentWindow.postMessage({type: "feature", feature: feature}, "*");
|
||||
const iframe_state = await feature_update(feature);
|
||||
assert_false(iframe_state,
|
||||
`'${feature}' is not disabled in <iframe>.'`);
|
||||
allow: features_that_propagate.map(feature => `${feature} 'none'`).join(", "),
|
||||
sandbox: "allow-scripts allow-popups allow-popups-to-escape-sandbox"
|
||||
});
|
||||
|
||||
iframe.contentWindow.postMessage(
|
||||
{type: "features", features: features_that_propagate}, "*");
|
||||
const iframe_states = await feature_update();
|
||||
for (const [feature, state] of iframe_states)
|
||||
assert_false(state, `'${feature}' is not disabled in <iframe>.'`);
|
||||
|
||||
iframe.contentWindow.postMessage({
|
||||
type: "open_window",
|
||||
url: `${window_url_main}?${feature}`
|
||||
url: `${window_url_main}?${features_that_propagate.join("&")}`
|
||||
}, "*");
|
||||
const window_state = await feature_update(feature);
|
||||
assert_true(window_state, `'${feature}' is disabled.`);
|
||||
const window_states = await feature_update();
|
||||
for (const [feature, state] of window_states)
|
||||
assert_true(state, `'${feature}' is disabled in new window.`);
|
||||
|
||||
const did_close = await close_aux_window(iframe);
|
||||
assert_true(did_close);
|
||||
iframe.parentElement.removeChild(iframe);
|
||||
}
|
||||
}, "Verify feature policies are NOT inherited by the auxiliary browsing " +
|
||||
"context if opened from a sandboxed same-origin <iframe> which allows " +
|
||||
"popups to escape sandbox.");
|
||||
|
|
|
|||
|
|
@ -52,29 +52,30 @@ function wait_for_raf_count(c) {
|
|||
}
|
||||
|
||||
// Returns a promise which is resolved with the next/already received message
|
||||
// with feature update for |feature|. The resolved value is the state of the
|
||||
// feature |feature|. If |optional_timeout| is provided, after the given delay
|
||||
// with features update for |features|. The resolved value is the state of the
|
||||
// features |features|. If |optional_timeout| is provided, after the given delay
|
||||
// (in terms of rafs) the promise is resolved with false.
|
||||
function feature_update(feature, optional_timeout_rafs) {
|
||||
function feature_update(optional_timeout_rafs) {
|
||||
function reset_for_next_update() {
|
||||
return new Promise((r) => {
|
||||
const state = last_feature_message.state;
|
||||
const states = last_feature_message.states;
|
||||
last_feature_message = null;
|
||||
r(state);
|
||||
r(states);
|
||||
});
|
||||
}
|
||||
if (last_feature_message && last_feature_message.feature === feature)
|
||||
|
||||
if (last_feature_message)
|
||||
return reset_for_next_update();
|
||||
|
||||
if (optional_timeout_rafs) {
|
||||
wait_for_raf_count(optional_timeout_rafs).then (() => {
|
||||
last_feature_message = {state: false};
|
||||
last_feature_message = {states: []};
|
||||
on_new_feature_callback();
|
||||
});
|
||||
}
|
||||
|
||||
return new Promise((r) => on_new_feature_callback = r)
|
||||
.then(() => reset_for_next_update());
|
||||
.then(reset_for_next_update);
|
||||
}
|
||||
|
||||
function close_aux_window(iframe) {
|
||||
|
|
@ -88,7 +89,7 @@ function on_message(e) {
|
|||
var msg = e.data;
|
||||
assert_true("type" in msg);
|
||||
switch (msg.type) {
|
||||
case "feature":
|
||||
case "features":
|
||||
on_feature_msg(msg);
|
||||
break;
|
||||
case "close_window":
|
||||
|
|
@ -98,9 +99,8 @@ function on_message(e) {
|
|||
}
|
||||
|
||||
function on_feature_msg(msg) {
|
||||
assert_true("feature" in msg);
|
||||
assert_true("state" in msg);
|
||||
last_feature_message = msg
|
||||
assert_true("states" in msg);
|
||||
last_feature_message = msg;
|
||||
if (on_new_feature_callback) {
|
||||
on_new_feature_callback();
|
||||
on_new_feature_callback = null;
|
||||
|
|
|
|||
|
|
@ -1,7 +1,9 @@
|
|||
var feature = window.location.search.substr(1);
|
||||
var state = document.featurePolicy.allowsFeature(feature);
|
||||
const features = window.location.search.substr(1).split("&");
|
||||
const states = features
|
||||
.map(feature => [feature, document.featurePolicy.allowsFeature(feature)]);
|
||||
|
||||
// TODO(ekaramad): We might at some point choose a different propagation
|
||||
// strategy with rel=noopener. This test should adapt accordingly (perhaps use
|
||||
// broadcast channels).
|
||||
window.opener.parent.postMessage(
|
||||
{type: "feature", feature: feature, state: state}, "*");
|
||||
{type: "features", states: states}, "*");
|
||||
|
|
|
|||
|
|
@ -2,12 +2,13 @@ var auxiliary_context = null;
|
|||
window.addEventListener("message", (e) => {
|
||||
var msg = e.data;
|
||||
switch (msg.type) {
|
||||
case "feature":
|
||||
var state = document.featurePolicy.allowsFeature(msg.feature);
|
||||
case "features":
|
||||
e.source.postMessage({
|
||||
type: "feature",
|
||||
feature: msg.feature,
|
||||
state: state}, "*");
|
||||
type: "features",
|
||||
states:
|
||||
msg.features
|
||||
.map(feature => [feature, document.featurePolicy.allowsFeature(feature)])
|
||||
}, "*");
|
||||
break;
|
||||
case "open_window":
|
||||
auxiliary_context = window.open(msg.url);
|
||||
|
|
|
|||
|
|
@ -12,35 +12,53 @@
|
|||
const iframe_src = "/feature-policy/feature-policy-for-sandbox/resources/window_opener.html";
|
||||
|
||||
promise_test( async () => {
|
||||
for (const feature of sandbox_features) {
|
||||
// For the test to work correctly we need "scripts";
|
||||
const sandbox_flags = feature === "scripts" ? "" : "allow-scripts";
|
||||
const iframe = await add_iframe(
|
||||
{src: iframe_src, allow: `${feature} *`, sandbox: sandbox_flags});
|
||||
iframe.contentWindow.postMessage({type: "feature", feature: feature}, "*");
|
||||
const iframe_state = await feature_update(feature);
|
||||
assert_true(iframe_state,
|
||||
`'${feature}' should not be disabled in <iframe>.'`);
|
||||
const iframe = await add_iframe({
|
||||
src: iframe_src,
|
||||
allow: sandbox_features.map(feature => `${feature} *`).join(", "),
|
||||
sandbox: ""
|
||||
});
|
||||
|
||||
iframe.contentWindow.postMessage({type: "features", features: sandbox_features}, "*");
|
||||
const iframe_states = await feature_update();
|
||||
for (const [feature, state] of iframe_states)
|
||||
assert_true(state, `'${feature}' should not be disabled in <iframe>.'`);
|
||||
|
||||
iframe.parentElement.removeChild(iframe);
|
||||
}
|
||||
}, "Verify that when a sandbox related feature is enabled in 'allow' then " +
|
||||
" the feature will be enabled regardless of sandbox attribute's value.");
|
||||
|
||||
promise_test( async () => {
|
||||
for (const feature of sandbox_features) {
|
||||
const sandbox_flags = `allow-${feature} allow-scripts`;
|
||||
const non_script_sandbox_features =
|
||||
sandbox_features.filter(feature => feature !== "scripts");
|
||||
const sandbox_flags =
|
||||
sandbox_features.map(feature => `allow-${feature}`).join(" ");
|
||||
const allow_attribute =
|
||||
non_script_sandbox_features.map(feature => `${feature} 'none'`).join(", ");
|
||||
|
||||
const iframe = await add_iframe(
|
||||
{src: iframe_src, allow: `${feature} 'none'`, sandbox: sandbox_flags});
|
||||
iframe.contentWindow.postMessage({type: "feature", feature: feature}, "*");
|
||||
// 'scripts' will block running code in the subframe and no update can be
|
||||
// sent. A timeout determines the feature is disabled.
|
||||
const timeout = (feature === "scripts") ? 10 : false;
|
||||
const iframe_state = await feature_update(feature, timeout);
|
||||
assert_false(iframe_state,
|
||||
`'${feature}' should be disabled in <iframe>.'`);
|
||||
{src: iframe_src, allow: allow_attribute, sandbox: sandbox_flags});
|
||||
|
||||
iframe.contentWindow.postMessage(
|
||||
{type: "features", features: non_script_sandbox_features}, "*");
|
||||
const iframe_states = await feature_update();
|
||||
for (const [feature, state] of iframe_states)
|
||||
assert_false(state, `'${feature}' should be disabled in <iframe>.'`);
|
||||
|
||||
iframe.parentElement.removeChild(iframe);
|
||||
}
|
||||
}, "Verify that when a sandbox related feature is disabled in 'allow' then " +
|
||||
}, "Verify that when a sandbox related feature (except scripts) is disabled in 'allow' then " +
|
||||
" the feature will be disabled regardless of sandbox attribute's value.");
|
||||
|
||||
promise_test( async () => {
|
||||
const iframe = await add_iframe(
|
||||
{src: iframe_src, allow: "scripts 'none'", sandbox: "allow-scripts"});
|
||||
|
||||
iframe.contentWindow.postMessage(
|
||||
{type: "features", features: ['scripts']}, "*");
|
||||
const iframe_states = await feature_update(10);
|
||||
|
||||
assert_equals(iframe_states.length, 0);
|
||||
iframe.parentElement.removeChild(iframe);
|
||||
}, "Verify that when scripts is disabled in 'allow' then " +
|
||||
" the feature will be disabled regardless of sandbox attribute's value.");
|
||||
</script>
|
||||
</body>
|
||||
Binary file not shown.
|
|
@ -0,0 +1,38 @@
|
|||
<!DOCTYPE html>
|
||||
<html>
|
||||
<head>
|
||||
<title>Referrer with the strict-origin referrer policy</title>
|
||||
<meta name="referrer" content="strict-origin">
|
||||
<script src="/resources/testharness.js"></script>
|
||||
<script src="/resources/testharnessreport.js"></script>
|
||||
</head>
|
||||
<body>
|
||||
<script type="module">
|
||||
|
||||
// "name" parameter is necessary for bypassing the module map in descendant import.
|
||||
|
||||
import { referrer as insecureImport } from "./resources/import-referrer-checker-insecure.sub.js?name=insecure_import";
|
||||
import { referrer as secureImport } from "https://{{domains[www]}}:{{ports[https][0]}}/html/semantics/scripting-1/the-script-element/module/resources/import-referrer-checker-insecure.sub.js?name=secure_import";
|
||||
|
||||
const origin = (new URL(location.href)).origin + "/";
|
||||
|
||||
test(t => {
|
||||
assert_equals(
|
||||
insecureImport, origin,
|
||||
"A document with the strict-origin referrer policy served over HTTP, " +
|
||||
"imports an module script over HTTP, that imports a descendant script " +
|
||||
"over HTTP. The request for the descendant script is sent with a " +
|
||||
"`Referer` header with the page's origin");
|
||||
|
||||
assert_equals(
|
||||
secureImport, "",
|
||||
"A document with the strict-origin referrer policy served over HTTP, " +
|
||||
"imports an module script over HTTPS, that imports a descendant script " +
|
||||
"over HTTP. The request for the descendant script is sent with no " +
|
||||
"`Referer` header");
|
||||
}, "The strict-* referrer policies compare the trustworthiness of a " +
|
||||
"request's referrer string against its URL");
|
||||
|
||||
</script>
|
||||
</body>
|
||||
</html>
|
||||
|
|
@ -0,0 +1 @@
|
|||
export { referrer } from 'http://{{host}}:{{ports[http][0]}}/html/semantics/scripting-1/the-script-element/module/resources/referrer-checker.py?name={{GET[name]}}';
|
||||
|
|
@ -0,0 +1 @@
|
|||
Access-Control-Allow-Origin: *
|
||||
|
|
@ -20,7 +20,7 @@
|
|||
window.addEventListener("load", () => { document.fonts.ready.then(runTests); });
|
||||
async function runTests() {
|
||||
let json = await fetchOperatorDictionary();
|
||||
OperatorDictionaryTests.run(json, "symmetric");
|
||||
OperatorDictionaryTests.run(json, "largeop", 0);
|
||||
done();
|
||||
}
|
||||
</script>
|
||||
|
|
@ -20,7 +20,7 @@
|
|||
window.addEventListener("load", () => { document.fonts.ready.then(runTests); });
|
||||
async function runTests() {
|
||||
let json = await fetchOperatorDictionary();
|
||||
OperatorDictionaryTests.run(json, "accent");
|
||||
OperatorDictionaryTests.run(json, "largeop", 1);
|
||||
done();
|
||||
}
|
||||
</script>
|
||||
|
|
@ -20,7 +20,7 @@
|
|||
window.addEventListener("load", () => { document.fonts.ready.then(runTests); });
|
||||
async function runTests() {
|
||||
let json = await fetchOperatorDictionary();
|
||||
OperatorDictionaryTests.run(json, "largeop");
|
||||
OperatorDictionaryTests.run(json, "largeop", 2);
|
||||
done();
|
||||
}
|
||||
</script>
|
||||
|
|
@ -20,7 +20,7 @@
|
|||
window.addEventListener("load", () => { document.fonts.ready.then(runTests); });
|
||||
async function runTests() {
|
||||
let json = await fetchOperatorDictionary();
|
||||
OperatorDictionaryTests.run(json, "stretchy");
|
||||
OperatorDictionaryTests.run(json, "largeop", 3);
|
||||
done();
|
||||
}
|
||||
</script>
|
||||
|
|
@ -0,0 +1,31 @@
|
|||
<!DOCTYPE html>
|
||||
<html>
|
||||
<head>
|
||||
<meta charset="utf-8">
|
||||
<title>Operator dictionary</title>
|
||||
<link rel="help" href="https://mathml-refresh.github.io/mathml-core/#operator-fence-separator-or-accent-mo">
|
||||
<link rel="help" href="https://mathml-refresh.github.io/mathml-core/#dictionary-based-attributes">
|
||||
<link rel="help" href="https://mathml-refresh.github.io/mathml-core/#operator-dictionary">
|
||||
<link rel="help" href="https://mathml-refresh.github.io/mathml-core/#stretchy-operator-axis">
|
||||
<meta name="assert" content="Verify default properties for characters that are in the operator dictionary, as well as for U+00A0 NO-BREAK SPACE">
|
||||
<meta name="timeout" content="long">
|
||||
<script src="/resources/testharness.js"></script>
|
||||
<script src="/resources/testharnessreport.js"></script>
|
||||
<script src="/mathml/support/feature-detection.js"></script>
|
||||
<script src="/mathml/support/operator-dictionary.js"></script>
|
||||
<script src="./support/operator-dictionary-tests.js"></script>
|
||||
<link rel="stylesheet" href="./support/operator-dictionary-tests.css"/>
|
||||
<script>
|
||||
setup({ explicit_done: true });
|
||||
window.addEventListener("load", () => { document.fonts.ready.then(runTests); });
|
||||
async function runTests() {
|
||||
let json = await fetchOperatorDictionary();
|
||||
OperatorDictionaryTests.run(json, "largeop", 4);
|
||||
done();
|
||||
}
|
||||
</script>
|
||||
</head>
|
||||
<body>
|
||||
<div id="log"></div>
|
||||
</body>
|
||||
</html>
|
||||
|
|
@ -0,0 +1,31 @@
|
|||
<!DOCTYPE html>
|
||||
<html>
|
||||
<head>
|
||||
<meta charset="utf-8">
|
||||
<title>Operator dictionary</title>
|
||||
<link rel="help" href="https://mathml-refresh.github.io/mathml-core/#operator-fence-separator-or-accent-mo">
|
||||
<link rel="help" href="https://mathml-refresh.github.io/mathml-core/#dictionary-based-attributes">
|
||||
<link rel="help" href="https://mathml-refresh.github.io/mathml-core/#operator-dictionary">
|
||||
<link rel="help" href="https://mathml-refresh.github.io/mathml-core/#stretchy-operator-axis">
|
||||
<meta name="assert" content="Verify default properties for characters that are in the operator dictionary, as well as for U+00A0 NO-BREAK SPACE">
|
||||
<meta name="timeout" content="long">
|
||||
<script src="/resources/testharness.js"></script>
|
||||
<script src="/resources/testharnessreport.js"></script>
|
||||
<script src="/mathml/support/feature-detection.js"></script>
|
||||
<script src="/mathml/support/operator-dictionary.js"></script>
|
||||
<script src="./support/operator-dictionary-tests.js"></script>
|
||||
<link rel="stylesheet" href="./support/operator-dictionary-tests.css"/>
|
||||
<script>
|
||||
setup({ explicit_done: true });
|
||||
window.addEventListener("load", () => { document.fonts.ready.then(runTests); });
|
||||
async function runTests() {
|
||||
let json = await fetchOperatorDictionary();
|
||||
OperatorDictionaryTests.run(json, "largeop", 5);
|
||||
done();
|
||||
}
|
||||
</script>
|
||||
</head>
|
||||
<body>
|
||||
<div id="log"></div>
|
||||
</body>
|
||||
</html>
|
||||
|
|
@ -20,7 +20,7 @@
|
|||
window.addEventListener("load", () => { document.fonts.ready.then(runTests); });
|
||||
async function runTests() {
|
||||
let json = await fetchOperatorDictionary();
|
||||
OperatorDictionaryTests.run(json, "lspace/rspace");
|
||||
OperatorDictionaryTests.run(json, "movablelimits", 0);
|
||||
done();
|
||||
}
|
||||
</script>
|
||||
|
|
@ -20,7 +20,7 @@
|
|||
window.addEventListener("load", () => { document.fonts.ready.then(runTests); });
|
||||
async function runTests() {
|
||||
let json = await fetchOperatorDictionary();
|
||||
OperatorDictionaryTests.run(json, "movablelimits");
|
||||
OperatorDictionaryTests.run(json, "movablelimits", 1);
|
||||
done();
|
||||
}
|
||||
</script>
|
||||
|
|
@ -0,0 +1,31 @@
|
|||
<!DOCTYPE html>
|
||||
<html>
|
||||
<head>
|
||||
<meta charset="utf-8">
|
||||
<title>Operator dictionary</title>
|
||||
<link rel="help" href="https://mathml-refresh.github.io/mathml-core/#operator-fence-separator-or-accent-mo">
|
||||
<link rel="help" href="https://mathml-refresh.github.io/mathml-core/#dictionary-based-attributes">
|
||||
<link rel="help" href="https://mathml-refresh.github.io/mathml-core/#operator-dictionary">
|
||||
<link rel="help" href="https://mathml-refresh.github.io/mathml-core/#stretchy-operator-axis">
|
||||
<meta name="assert" content="Verify default properties for characters that are in the operator dictionary, as well as for U+00A0 NO-BREAK SPACE">
|
||||
<meta name="timeout" content="long">
|
||||
<script src="/resources/testharness.js"></script>
|
||||
<script src="/resources/testharnessreport.js"></script>
|
||||
<script src="/mathml/support/feature-detection.js"></script>
|
||||
<script src="/mathml/support/operator-dictionary.js"></script>
|
||||
<script src="./support/operator-dictionary-tests.js"></script>
|
||||
<link rel="stylesheet" href="./support/operator-dictionary-tests.css"/>
|
||||
<script>
|
||||
setup({ explicit_done: true });
|
||||
window.addEventListener("load", () => { document.fonts.ready.then(runTests); });
|
||||
async function runTests() {
|
||||
let json = await fetchOperatorDictionary();
|
||||
OperatorDictionaryTests.run(json, "movablelimits", 2);
|
||||
done();
|
||||
}
|
||||
</script>
|
||||
</head>
|
||||
<body>
|
||||
<div id="log"></div>
|
||||
</body>
|
||||
</html>
|
||||
|
|
@ -0,0 +1,31 @@
|
|||
<!DOCTYPE html>
|
||||
<html>
|
||||
<head>
|
||||
<meta charset="utf-8">
|
||||
<title>Operator dictionary</title>
|
||||
<link rel="help" href="https://mathml-refresh.github.io/mathml-core/#operator-fence-separator-or-accent-mo">
|
||||
<link rel="help" href="https://mathml-refresh.github.io/mathml-core/#dictionary-based-attributes">
|
||||
<link rel="help" href="https://mathml-refresh.github.io/mathml-core/#operator-dictionary">
|
||||
<link rel="help" href="https://mathml-refresh.github.io/mathml-core/#stretchy-operator-axis">
|
||||
<meta name="assert" content="Verify default properties for characters that are in the operator dictionary, as well as for U+00A0 NO-BREAK SPACE">
|
||||
<meta name="timeout" content="long">
|
||||
<script src="/resources/testharness.js"></script>
|
||||
<script src="/resources/testharnessreport.js"></script>
|
||||
<script src="/mathml/support/feature-detection.js"></script>
|
||||
<script src="/mathml/support/operator-dictionary.js"></script>
|
||||
<script src="./support/operator-dictionary-tests.js"></script>
|
||||
<link rel="stylesheet" href="./support/operator-dictionary-tests.css"/>
|
||||
<script>
|
||||
setup({ explicit_done: true });
|
||||
window.addEventListener("load", () => { document.fonts.ready.then(runTests); });
|
||||
async function runTests() {
|
||||
let json = await fetchOperatorDictionary();
|
||||
OperatorDictionaryTests.run(json, "movablelimits", 3);
|
||||
done();
|
||||
}
|
||||
</script>
|
||||
</head>
|
||||
<body>
|
||||
<div id="log"></div>
|
||||
</body>
|
||||
</html>
|
||||
|
|
@ -0,0 +1,31 @@
|
|||
<!DOCTYPE html>
|
||||
<html>
|
||||
<head>
|
||||
<meta charset="utf-8">
|
||||
<title>Operator dictionary</title>
|
||||
<link rel="help" href="https://mathml-refresh.github.io/mathml-core/#operator-fence-separator-or-accent-mo">
|
||||
<link rel="help" href="https://mathml-refresh.github.io/mathml-core/#dictionary-based-attributes">
|
||||
<link rel="help" href="https://mathml-refresh.github.io/mathml-core/#operator-dictionary">
|
||||
<link rel="help" href="https://mathml-refresh.github.io/mathml-core/#stretchy-operator-axis">
|
||||
<meta name="assert" content="Verify default properties for characters that are in the operator dictionary, as well as for U+00A0 NO-BREAK SPACE">
|
||||
<meta name="timeout" content="long">
|
||||
<script src="/resources/testharness.js"></script>
|
||||
<script src="/resources/testharnessreport.js"></script>
|
||||
<script src="/mathml/support/feature-detection.js"></script>
|
||||
<script src="/mathml/support/operator-dictionary.js"></script>
|
||||
<script src="./support/operator-dictionary-tests.js"></script>
|
||||
<link rel="stylesheet" href="./support/operator-dictionary-tests.css"/>
|
||||
<script>
|
||||
setup({ explicit_done: true });
|
||||
window.addEventListener("load", () => { document.fonts.ready.then(runTests); });
|
||||
async function runTests() {
|
||||
let json = await fetchOperatorDictionary();
|
||||
OperatorDictionaryTests.run(json, "movablelimits", 4);
|
||||
done();
|
||||
}
|
||||
</script>
|
||||
</head>
|
||||
<body>
|
||||
<div id="log"></div>
|
||||
</body>
|
||||
</html>
|
||||
|
|
@ -0,0 +1,31 @@
|
|||
<!DOCTYPE html>
|
||||
<html>
|
||||
<head>
|
||||
<meta charset="utf-8">
|
||||
<title>Operator dictionary</title>
|
||||
<link rel="help" href="https://mathml-refresh.github.io/mathml-core/#operator-fence-separator-or-accent-mo">
|
||||
<link rel="help" href="https://mathml-refresh.github.io/mathml-core/#dictionary-based-attributes">
|
||||
<link rel="help" href="https://mathml-refresh.github.io/mathml-core/#operator-dictionary">
|
||||
<link rel="help" href="https://mathml-refresh.github.io/mathml-core/#stretchy-operator-axis">
|
||||
<meta name="assert" content="Verify default properties for characters that are in the operator dictionary, as well as for U+00A0 NO-BREAK SPACE">
|
||||
<meta name="timeout" content="long">
|
||||
<script src="/resources/testharness.js"></script>
|
||||
<script src="/resources/testharnessreport.js"></script>
|
||||
<script src="/mathml/support/feature-detection.js"></script>
|
||||
<script src="/mathml/support/operator-dictionary.js"></script>
|
||||
<script src="./support/operator-dictionary-tests.js"></script>
|
||||
<link rel="stylesheet" href="./support/operator-dictionary-tests.css"/>
|
||||
<script>
|
||||
setup({ explicit_done: true });
|
||||
window.addEventListener("load", () => { document.fonts.ready.then(runTests); });
|
||||
async function runTests() {
|
||||
let json = await fetchOperatorDictionary();
|
||||
OperatorDictionaryTests.run(json, "movablelimits", 5);
|
||||
done();
|
||||
}
|
||||
</script>
|
||||
</head>
|
||||
<body>
|
||||
<div id="log"></div>
|
||||
</body>
|
||||
</html>
|
||||
|
|
@ -0,0 +1,31 @@
|
|||
<!DOCTYPE html>
|
||||
<html>
|
||||
<head>
|
||||
<meta charset="utf-8">
|
||||
<title>Operator dictionary</title>
|
||||
<link rel="help" href="https://mathml-refresh.github.io/mathml-core/#operator-fence-separator-or-accent-mo">
|
||||
<link rel="help" href="https://mathml-refresh.github.io/mathml-core/#dictionary-based-attributes">
|
||||
<link rel="help" href="https://mathml-refresh.github.io/mathml-core/#operator-dictionary">
|
||||
<link rel="help" href="https://mathml-refresh.github.io/mathml-core/#stretchy-operator-axis">
|
||||
<meta name="assert" content="Verify default properties for characters that are in the operator dictionary, as well as for U+00A0 NO-BREAK SPACE">
|
||||
<meta name="timeout" content="long">
|
||||
<script src="/resources/testharness.js"></script>
|
||||
<script src="/resources/testharnessreport.js"></script>
|
||||
<script src="/mathml/support/feature-detection.js"></script>
|
||||
<script src="/mathml/support/operator-dictionary.js"></script>
|
||||
<script src="./support/operator-dictionary-tests.js"></script>
|
||||
<link rel="stylesheet" href="./support/operator-dictionary-tests.css"/>
|
||||
<script>
|
||||
setup({ explicit_done: true });
|
||||
window.addEventListener("load", () => { document.fonts.ready.then(runTests); });
|
||||
async function runTests() {
|
||||
let json = await fetchOperatorDictionary();
|
||||
OperatorDictionaryTests.run(json, "lspace/rspace", 0);
|
||||
done();
|
||||
}
|
||||
</script>
|
||||
</head>
|
||||
<body>
|
||||
<div id="log"></div>
|
||||
</body>
|
||||
</html>
|
||||
|
|
@ -0,0 +1,31 @@
|
|||
<!DOCTYPE html>
|
||||
<html>
|
||||
<head>
|
||||
<meta charset="utf-8">
|
||||
<title>Operator dictionary</title>
|
||||
<link rel="help" href="https://mathml-refresh.github.io/mathml-core/#operator-fence-separator-or-accent-mo">
|
||||
<link rel="help" href="https://mathml-refresh.github.io/mathml-core/#dictionary-based-attributes">
|
||||
<link rel="help" href="https://mathml-refresh.github.io/mathml-core/#operator-dictionary">
|
||||
<link rel="help" href="https://mathml-refresh.github.io/mathml-core/#stretchy-operator-axis">
|
||||
<meta name="assert" content="Verify default properties for characters that are in the operator dictionary, as well as for U+00A0 NO-BREAK SPACE">
|
||||
<meta name="timeout" content="long">
|
||||
<script src="/resources/testharness.js"></script>
|
||||
<script src="/resources/testharnessreport.js"></script>
|
||||
<script src="/mathml/support/feature-detection.js"></script>
|
||||
<script src="/mathml/support/operator-dictionary.js"></script>
|
||||
<script src="./support/operator-dictionary-tests.js"></script>
|
||||
<link rel="stylesheet" href="./support/operator-dictionary-tests.css"/>
|
||||
<script>
|
||||
setup({ explicit_done: true });
|
||||
window.addEventListener("load", () => { document.fonts.ready.then(runTests); });
|
||||
async function runTests() {
|
||||
let json = await fetchOperatorDictionary();
|
||||
OperatorDictionaryTests.run(json, "lspace/rspace", 1);
|
||||
done();
|
||||
}
|
||||
</script>
|
||||
</head>
|
||||
<body>
|
||||
<div id="log"></div>
|
||||
</body>
|
||||
</html>
|
||||
|
|
@ -0,0 +1,31 @@
|
|||
<!DOCTYPE html>
|
||||
<html>
|
||||
<head>
|
||||
<meta charset="utf-8">
|
||||
<title>Operator dictionary</title>
|
||||
<link rel="help" href="https://mathml-refresh.github.io/mathml-core/#operator-fence-separator-or-accent-mo">
|
||||
<link rel="help" href="https://mathml-refresh.github.io/mathml-core/#dictionary-based-attributes">
|
||||
<link rel="help" href="https://mathml-refresh.github.io/mathml-core/#operator-dictionary">
|
||||
<link rel="help" href="https://mathml-refresh.github.io/mathml-core/#stretchy-operator-axis">
|
||||
<meta name="assert" content="Verify default properties for characters that are in the operator dictionary, as well as for U+00A0 NO-BREAK SPACE">
|
||||
<meta name="timeout" content="long">
|
||||
<script src="/resources/testharness.js"></script>
|
||||
<script src="/resources/testharnessreport.js"></script>
|
||||
<script src="/mathml/support/feature-detection.js"></script>
|
||||
<script src="/mathml/support/operator-dictionary.js"></script>
|
||||
<script src="./support/operator-dictionary-tests.js"></script>
|
||||
<link rel="stylesheet" href="./support/operator-dictionary-tests.css"/>
|
||||
<script>
|
||||
setup({ explicit_done: true });
|
||||
window.addEventListener("load", () => { document.fonts.ready.then(runTests); });
|
||||
async function runTests() {
|
||||
let json = await fetchOperatorDictionary();
|
||||
OperatorDictionaryTests.run(json, "lspace/rspace", 2);
|
||||
done();
|
||||
}
|
||||
</script>
|
||||
</head>
|
||||
<body>
|
||||
<div id="log"></div>
|
||||
</body>
|
||||
</html>
|
||||
|
|
@ -0,0 +1,31 @@
|
|||
<!DOCTYPE html>
|
||||
<html>
|
||||
<head>
|
||||
<meta charset="utf-8">
|
||||
<title>Operator dictionary</title>
|
||||
<link rel="help" href="https://mathml-refresh.github.io/mathml-core/#operator-fence-separator-or-accent-mo">
|
||||
<link rel="help" href="https://mathml-refresh.github.io/mathml-core/#dictionary-based-attributes">
|
||||
<link rel="help" href="https://mathml-refresh.github.io/mathml-core/#operator-dictionary">
|
||||
<link rel="help" href="https://mathml-refresh.github.io/mathml-core/#stretchy-operator-axis">
|
||||
<meta name="assert" content="Verify default properties for characters that are in the operator dictionary, as well as for U+00A0 NO-BREAK SPACE">
|
||||
<meta name="timeout" content="long">
|
||||
<script src="/resources/testharness.js"></script>
|
||||
<script src="/resources/testharnessreport.js"></script>
|
||||
<script src="/mathml/support/feature-detection.js"></script>
|
||||
<script src="/mathml/support/operator-dictionary.js"></script>
|
||||
<script src="./support/operator-dictionary-tests.js"></script>
|
||||
<link rel="stylesheet" href="./support/operator-dictionary-tests.css"/>
|
||||
<script>
|
||||
setup({ explicit_done: true });
|
||||
window.addEventListener("load", () => { document.fonts.ready.then(runTests); });
|
||||
async function runTests() {
|
||||
let json = await fetchOperatorDictionary();
|
||||
OperatorDictionaryTests.run(json, "lspace/rspace", 3);
|
||||
done();
|
||||
}
|
||||
</script>
|
||||
</head>
|
||||
<body>
|
||||
<div id="log"></div>
|
||||
</body>
|
||||
</html>
|
||||
|
|
@ -0,0 +1,31 @@
|
|||
<!DOCTYPE html>
|
||||
<html>
|
||||
<head>
|
||||
<meta charset="utf-8">
|
||||
<title>Operator dictionary</title>
|
||||
<link rel="help" href="https://mathml-refresh.github.io/mathml-core/#operator-fence-separator-or-accent-mo">
|
||||
<link rel="help" href="https://mathml-refresh.github.io/mathml-core/#dictionary-based-attributes">
|
||||
<link rel="help" href="https://mathml-refresh.github.io/mathml-core/#operator-dictionary">
|
||||
<link rel="help" href="https://mathml-refresh.github.io/mathml-core/#stretchy-operator-axis">
|
||||
<meta name="assert" content="Verify default properties for characters that are in the operator dictionary, as well as for U+00A0 NO-BREAK SPACE">
|
||||
<meta name="timeout" content="long">
|
||||
<script src="/resources/testharness.js"></script>
|
||||
<script src="/resources/testharnessreport.js"></script>
|
||||
<script src="/mathml/support/feature-detection.js"></script>
|
||||
<script src="/mathml/support/operator-dictionary.js"></script>
|
||||
<script src="./support/operator-dictionary-tests.js"></script>
|
||||
<link rel="stylesheet" href="./support/operator-dictionary-tests.css"/>
|
||||
<script>
|
||||
setup({ explicit_done: true });
|
||||
window.addEventListener("load", () => { document.fonts.ready.then(runTests); });
|
||||
async function runTests() {
|
||||
let json = await fetchOperatorDictionary();
|
||||
OperatorDictionaryTests.run(json, "lspace/rspace", 4);
|
||||
done();
|
||||
}
|
||||
</script>
|
||||
</head>
|
||||
<body>
|
||||
<div id="log"></div>
|
||||
</body>
|
||||
</html>
|
||||
|
|
@ -0,0 +1,31 @@
|
|||
<!DOCTYPE html>
|
||||
<html>
|
||||
<head>
|
||||
<meta charset="utf-8">
|
||||
<title>Operator dictionary</title>
|
||||
<link rel="help" href="https://mathml-refresh.github.io/mathml-core/#operator-fence-separator-or-accent-mo">
|
||||
<link rel="help" href="https://mathml-refresh.github.io/mathml-core/#dictionary-based-attributes">
|
||||
<link rel="help" href="https://mathml-refresh.github.io/mathml-core/#operator-dictionary">
|
||||
<link rel="help" href="https://mathml-refresh.github.io/mathml-core/#stretchy-operator-axis">
|
||||
<meta name="assert" content="Verify default properties for characters that are in the operator dictionary, as well as for U+00A0 NO-BREAK SPACE">
|
||||
<meta name="timeout" content="long">
|
||||
<script src="/resources/testharness.js"></script>
|
||||
<script src="/resources/testharnessreport.js"></script>
|
||||
<script src="/mathml/support/feature-detection.js"></script>
|
||||
<script src="/mathml/support/operator-dictionary.js"></script>
|
||||
<script src="./support/operator-dictionary-tests.js"></script>
|
||||
<link rel="stylesheet" href="./support/operator-dictionary-tests.css"/>
|
||||
<script>
|
||||
setup({ explicit_done: true });
|
||||
window.addEventListener("load", () => { document.fonts.ready.then(runTests); });
|
||||
async function runTests() {
|
||||
let json = await fetchOperatorDictionary();
|
||||
OperatorDictionaryTests.run(json, "lspace/rspace", 5);
|
||||
done();
|
||||
}
|
||||
</script>
|
||||
</head>
|
||||
<body>
|
||||
<div id="log"></div>
|
||||
</body>
|
||||
</html>
|
||||
|
|
@ -0,0 +1,31 @@
|
|||
<!DOCTYPE html>
|
||||
<html>
|
||||
<head>
|
||||
<meta charset="utf-8">
|
||||
<title>Operator dictionary</title>
|
||||
<link rel="help" href="https://mathml-refresh.github.io/mathml-core/#operator-fence-separator-or-accent-mo">
|
||||
<link rel="help" href="https://mathml-refresh.github.io/mathml-core/#dictionary-based-attributes">
|
||||
<link rel="help" href="https://mathml-refresh.github.io/mathml-core/#operator-dictionary">
|
||||
<link rel="help" href="https://mathml-refresh.github.io/mathml-core/#stretchy-operator-axis">
|
||||
<meta name="assert" content="Verify default properties for characters that are in the operator dictionary, as well as for U+00A0 NO-BREAK SPACE">
|
||||
<meta name="timeout" content="long">
|
||||
<script src="/resources/testharness.js"></script>
|
||||
<script src="/resources/testharnessreport.js"></script>
|
||||
<script src="/mathml/support/feature-detection.js"></script>
|
||||
<script src="/mathml/support/operator-dictionary.js"></script>
|
||||
<script src="./support/operator-dictionary-tests.js"></script>
|
||||
<link rel="stylesheet" href="./support/operator-dictionary-tests.css"/>
|
||||
<script>
|
||||
setup({ explicit_done: true });
|
||||
window.addEventListener("load", () => { document.fonts.ready.then(runTests); });
|
||||
async function runTests() {
|
||||
let json = await fetchOperatorDictionary();
|
||||
OperatorDictionaryTests.run(json, "stretchy", 0);
|
||||
done();
|
||||
}
|
||||
</script>
|
||||
</head>
|
||||
<body>
|
||||
<div id="log"></div>
|
||||
</body>
|
||||
</html>
|
||||
|
|
@ -0,0 +1,31 @@
|
|||
<!DOCTYPE html>
|
||||
<html>
|
||||
<head>
|
||||
<meta charset="utf-8">
|
||||
<title>Operator dictionary</title>
|
||||
<link rel="help" href="https://mathml-refresh.github.io/mathml-core/#operator-fence-separator-or-accent-mo">
|
||||
<link rel="help" href="https://mathml-refresh.github.io/mathml-core/#dictionary-based-attributes">
|
||||
<link rel="help" href="https://mathml-refresh.github.io/mathml-core/#operator-dictionary">
|
||||
<link rel="help" href="https://mathml-refresh.github.io/mathml-core/#stretchy-operator-axis">
|
||||
<meta name="assert" content="Verify default properties for characters that are in the operator dictionary, as well as for U+00A0 NO-BREAK SPACE">
|
||||
<meta name="timeout" content="long">
|
||||
<script src="/resources/testharness.js"></script>
|
||||
<script src="/resources/testharnessreport.js"></script>
|
||||
<script src="/mathml/support/feature-detection.js"></script>
|
||||
<script src="/mathml/support/operator-dictionary.js"></script>
|
||||
<script src="./support/operator-dictionary-tests.js"></script>
|
||||
<link rel="stylesheet" href="./support/operator-dictionary-tests.css"/>
|
||||
<script>
|
||||
setup({ explicit_done: true });
|
||||
window.addEventListener("load", () => { document.fonts.ready.then(runTests); });
|
||||
async function runTests() {
|
||||
let json = await fetchOperatorDictionary();
|
||||
OperatorDictionaryTests.run(json, "stretchy", 1);
|
||||
done();
|
||||
}
|
||||
</script>
|
||||
</head>
|
||||
<body>
|
||||
<div id="log"></div>
|
||||
</body>
|
||||
</html>
|
||||
|
|
@ -0,0 +1,31 @@
|
|||
<!DOCTYPE html>
|
||||
<html>
|
||||
<head>
|
||||
<meta charset="utf-8">
|
||||
<title>Operator dictionary</title>
|
||||
<link rel="help" href="https://mathml-refresh.github.io/mathml-core/#operator-fence-separator-or-accent-mo">
|
||||
<link rel="help" href="https://mathml-refresh.github.io/mathml-core/#dictionary-based-attributes">
|
||||
<link rel="help" href="https://mathml-refresh.github.io/mathml-core/#operator-dictionary">
|
||||
<link rel="help" href="https://mathml-refresh.github.io/mathml-core/#stretchy-operator-axis">
|
||||
<meta name="assert" content="Verify default properties for characters that are in the operator dictionary, as well as for U+00A0 NO-BREAK SPACE">
|
||||
<meta name="timeout" content="long">
|
||||
<script src="/resources/testharness.js"></script>
|
||||
<script src="/resources/testharnessreport.js"></script>
|
||||
<script src="/mathml/support/feature-detection.js"></script>
|
||||
<script src="/mathml/support/operator-dictionary.js"></script>
|
||||
<script src="./support/operator-dictionary-tests.js"></script>
|
||||
<link rel="stylesheet" href="./support/operator-dictionary-tests.css"/>
|
||||
<script>
|
||||
setup({ explicit_done: true });
|
||||
window.addEventListener("load", () => { document.fonts.ready.then(runTests); });
|
||||
async function runTests() {
|
||||
let json = await fetchOperatorDictionary();
|
||||
OperatorDictionaryTests.run(json, "stretchy", 2);
|
||||
done();
|
||||
}
|
||||
</script>
|
||||
</head>
|
||||
<body>
|
||||
<div id="log"></div>
|
||||
</body>
|
||||
</html>
|
||||
|
|
@ -0,0 +1,31 @@
|
|||
<!DOCTYPE html>
|
||||
<html>
|
||||
<head>
|
||||
<meta charset="utf-8">
|
||||
<title>Operator dictionary</title>
|
||||
<link rel="help" href="https://mathml-refresh.github.io/mathml-core/#operator-fence-separator-or-accent-mo">
|
||||
<link rel="help" href="https://mathml-refresh.github.io/mathml-core/#dictionary-based-attributes">
|
||||
<link rel="help" href="https://mathml-refresh.github.io/mathml-core/#operator-dictionary">
|
||||
<link rel="help" href="https://mathml-refresh.github.io/mathml-core/#stretchy-operator-axis">
|
||||
<meta name="assert" content="Verify default properties for characters that are in the operator dictionary, as well as for U+00A0 NO-BREAK SPACE">
|
||||
<meta name="timeout" content="long">
|
||||
<script src="/resources/testharness.js"></script>
|
||||
<script src="/resources/testharnessreport.js"></script>
|
||||
<script src="/mathml/support/feature-detection.js"></script>
|
||||
<script src="/mathml/support/operator-dictionary.js"></script>
|
||||
<script src="./support/operator-dictionary-tests.js"></script>
|
||||
<link rel="stylesheet" href="./support/operator-dictionary-tests.css"/>
|
||||
<script>
|
||||
setup({ explicit_done: true });
|
||||
window.addEventListener("load", () => { document.fonts.ready.then(runTests); });
|
||||
async function runTests() {
|
||||
let json = await fetchOperatorDictionary();
|
||||
OperatorDictionaryTests.run(json, "stretchy", 3);
|
||||
done();
|
||||
}
|
||||
</script>
|
||||
</head>
|
||||
<body>
|
||||
<div id="log"></div>
|
||||
</body>
|
||||
</html>
|
||||
|
|
@ -0,0 +1,31 @@
|
|||
<!DOCTYPE html>
|
||||
<html>
|
||||
<head>
|
||||
<meta charset="utf-8">
|
||||
<title>Operator dictionary</title>
|
||||
<link rel="help" href="https://mathml-refresh.github.io/mathml-core/#operator-fence-separator-or-accent-mo">
|
||||
<link rel="help" href="https://mathml-refresh.github.io/mathml-core/#dictionary-based-attributes">
|
||||
<link rel="help" href="https://mathml-refresh.github.io/mathml-core/#operator-dictionary">
|
||||
<link rel="help" href="https://mathml-refresh.github.io/mathml-core/#stretchy-operator-axis">
|
||||
<meta name="assert" content="Verify default properties for characters that are in the operator dictionary, as well as for U+00A0 NO-BREAK SPACE">
|
||||
<meta name="timeout" content="long">
|
||||
<script src="/resources/testharness.js"></script>
|
||||
<script src="/resources/testharnessreport.js"></script>
|
||||
<script src="/mathml/support/feature-detection.js"></script>
|
||||
<script src="/mathml/support/operator-dictionary.js"></script>
|
||||
<script src="./support/operator-dictionary-tests.js"></script>
|
||||
<link rel="stylesheet" href="./support/operator-dictionary-tests.css"/>
|
||||
<script>
|
||||
setup({ explicit_done: true });
|
||||
window.addEventListener("load", () => { document.fonts.ready.then(runTests); });
|
||||
async function runTests() {
|
||||
let json = await fetchOperatorDictionary();
|
||||
OperatorDictionaryTests.run(json, "stretchy", 4);
|
||||
done();
|
||||
}
|
||||
</script>
|
||||
</head>
|
||||
<body>
|
||||
<div id="log"></div>
|
||||
</body>
|
||||
</html>
|
||||
|
|
@ -0,0 +1,31 @@
|
|||
<!DOCTYPE html>
|
||||
<html>
|
||||
<head>
|
||||
<meta charset="utf-8">
|
||||
<title>Operator dictionary</title>
|
||||
<link rel="help" href="https://mathml-refresh.github.io/mathml-core/#operator-fence-separator-or-accent-mo">
|
||||
<link rel="help" href="https://mathml-refresh.github.io/mathml-core/#dictionary-based-attributes">
|
||||
<link rel="help" href="https://mathml-refresh.github.io/mathml-core/#operator-dictionary">
|
||||
<link rel="help" href="https://mathml-refresh.github.io/mathml-core/#stretchy-operator-axis">
|
||||
<meta name="assert" content="Verify default properties for characters that are in the operator dictionary, as well as for U+00A0 NO-BREAK SPACE">
|
||||
<meta name="timeout" content="long">
|
||||
<script src="/resources/testharness.js"></script>
|
||||
<script src="/resources/testharnessreport.js"></script>
|
||||
<script src="/mathml/support/feature-detection.js"></script>
|
||||
<script src="/mathml/support/operator-dictionary.js"></script>
|
||||
<script src="./support/operator-dictionary-tests.js"></script>
|
||||
<link rel="stylesheet" href="./support/operator-dictionary-tests.css"/>
|
||||
<script>
|
||||
setup({ explicit_done: true });
|
||||
window.addEventListener("load", () => { document.fonts.ready.then(runTests); });
|
||||
async function runTests() {
|
||||
let json = await fetchOperatorDictionary();
|
||||
OperatorDictionaryTests.run(json, "stretchy", 5);
|
||||
done();
|
||||
}
|
||||
</script>
|
||||
</head>
|
||||
<body>
|
||||
<div id="log"></div>
|
||||
</body>
|
||||
</html>
|
||||
|
|
@ -0,0 +1,31 @@
|
|||
<!DOCTYPE html>
|
||||
<html>
|
||||
<head>
|
||||
<meta charset="utf-8">
|
||||
<title>Operator dictionary</title>
|
||||
<link rel="help" href="https://mathml-refresh.github.io/mathml-core/#operator-fence-separator-or-accent-mo">
|
||||
<link rel="help" href="https://mathml-refresh.github.io/mathml-core/#dictionary-based-attributes">
|
||||
<link rel="help" href="https://mathml-refresh.github.io/mathml-core/#operator-dictionary">
|
||||
<link rel="help" href="https://mathml-refresh.github.io/mathml-core/#stretchy-operator-axis">
|
||||
<meta name="assert" content="Verify default properties for characters that are in the operator dictionary, as well as for U+00A0 NO-BREAK SPACE">
|
||||
<meta name="timeout" content="long">
|
||||
<script src="/resources/testharness.js"></script>
|
||||
<script src="/resources/testharnessreport.js"></script>
|
||||
<script src="/mathml/support/feature-detection.js"></script>
|
||||
<script src="/mathml/support/operator-dictionary.js"></script>
|
||||
<script src="./support/operator-dictionary-tests.js"></script>
|
||||
<link rel="stylesheet" href="./support/operator-dictionary-tests.css"/>
|
||||
<script>
|
||||
setup({ explicit_done: true });
|
||||
window.addEventListener("load", () => { document.fonts.ready.then(runTests); });
|
||||
async function runTests() {
|
||||
let json = await fetchOperatorDictionary();
|
||||
OperatorDictionaryTests.run(json, "symmetric", 0);
|
||||
done();
|
||||
}
|
||||
</script>
|
||||
</head>
|
||||
<body>
|
||||
<div id="log"></div>
|
||||
</body>
|
||||
</html>
|
||||
|
|
@ -0,0 +1,31 @@
|
|||
<!DOCTYPE html>
|
||||
<html>
|
||||
<head>
|
||||
<meta charset="utf-8">
|
||||
<title>Operator dictionary</title>
|
||||
<link rel="help" href="https://mathml-refresh.github.io/mathml-core/#operator-fence-separator-or-accent-mo">
|
||||
<link rel="help" href="https://mathml-refresh.github.io/mathml-core/#dictionary-based-attributes">
|
||||
<link rel="help" href="https://mathml-refresh.github.io/mathml-core/#operator-dictionary">
|
||||
<link rel="help" href="https://mathml-refresh.github.io/mathml-core/#stretchy-operator-axis">
|
||||
<meta name="assert" content="Verify default properties for characters that are in the operator dictionary, as well as for U+00A0 NO-BREAK SPACE">
|
||||
<meta name="timeout" content="long">
|
||||
<script src="/resources/testharness.js"></script>
|
||||
<script src="/resources/testharnessreport.js"></script>
|
||||
<script src="/mathml/support/feature-detection.js"></script>
|
||||
<script src="/mathml/support/operator-dictionary.js"></script>
|
||||
<script src="./support/operator-dictionary-tests.js"></script>
|
||||
<link rel="stylesheet" href="./support/operator-dictionary-tests.css"/>
|
||||
<script>
|
||||
setup({ explicit_done: true });
|
||||
window.addEventListener("load", () => { document.fonts.ready.then(runTests); });
|
||||
async function runTests() {
|
||||
let json = await fetchOperatorDictionary();
|
||||
OperatorDictionaryTests.run(json, "symmetric", 1);
|
||||
done();
|
||||
}
|
||||
</script>
|
||||
</head>
|
||||
<body>
|
||||
<div id="log"></div>
|
||||
</body>
|
||||
</html>
|
||||
|
|
@ -0,0 +1,31 @@
|
|||
<!DOCTYPE html>
|
||||
<html>
|
||||
<head>
|
||||
<meta charset="utf-8">
|
||||
<title>Operator dictionary</title>
|
||||
<link rel="help" href="https://mathml-refresh.github.io/mathml-core/#operator-fence-separator-or-accent-mo">
|
||||
<link rel="help" href="https://mathml-refresh.github.io/mathml-core/#dictionary-based-attributes">
|
||||
<link rel="help" href="https://mathml-refresh.github.io/mathml-core/#operator-dictionary">
|
||||
<link rel="help" href="https://mathml-refresh.github.io/mathml-core/#stretchy-operator-axis">
|
||||
<meta name="assert" content="Verify default properties for characters that are in the operator dictionary, as well as for U+00A0 NO-BREAK SPACE">
|
||||
<meta name="timeout" content="long">
|
||||
<script src="/resources/testharness.js"></script>
|
||||
<script src="/resources/testharnessreport.js"></script>
|
||||
<script src="/mathml/support/feature-detection.js"></script>
|
||||
<script src="/mathml/support/operator-dictionary.js"></script>
|
||||
<script src="./support/operator-dictionary-tests.js"></script>
|
||||
<link rel="stylesheet" href="./support/operator-dictionary-tests.css"/>
|
||||
<script>
|
||||
setup({ explicit_done: true });
|
||||
window.addEventListener("load", () => { document.fonts.ready.then(runTests); });
|
||||
async function runTests() {
|
||||
let json = await fetchOperatorDictionary();
|
||||
OperatorDictionaryTests.run(json, "symmetric", 2);
|
||||
done();
|
||||
}
|
||||
</script>
|
||||
</head>
|
||||
<body>
|
||||
<div id="log"></div>
|
||||
</body>
|
||||
</html>
|
||||
|
|
@ -0,0 +1,31 @@
|
|||
<!DOCTYPE html>
|
||||
<html>
|
||||
<head>
|
||||
<meta charset="utf-8">
|
||||
<title>Operator dictionary</title>
|
||||
<link rel="help" href="https://mathml-refresh.github.io/mathml-core/#operator-fence-separator-or-accent-mo">
|
||||
<link rel="help" href="https://mathml-refresh.github.io/mathml-core/#dictionary-based-attributes">
|
||||
<link rel="help" href="https://mathml-refresh.github.io/mathml-core/#operator-dictionary">
|
||||
<link rel="help" href="https://mathml-refresh.github.io/mathml-core/#stretchy-operator-axis">
|
||||
<meta name="assert" content="Verify default properties for characters that are in the operator dictionary, as well as for U+00A0 NO-BREAK SPACE">
|
||||
<meta name="timeout" content="long">
|
||||
<script src="/resources/testharness.js"></script>
|
||||
<script src="/resources/testharnessreport.js"></script>
|
||||
<script src="/mathml/support/feature-detection.js"></script>
|
||||
<script src="/mathml/support/operator-dictionary.js"></script>
|
||||
<script src="./support/operator-dictionary-tests.js"></script>
|
||||
<link rel="stylesheet" href="./support/operator-dictionary-tests.css"/>
|
||||
<script>
|
||||
setup({ explicit_done: true });
|
||||
window.addEventListener("load", () => { document.fonts.ready.then(runTests); });
|
||||
async function runTests() {
|
||||
let json = await fetchOperatorDictionary();
|
||||
OperatorDictionaryTests.run(json, "symmetric", 3);
|
||||
done();
|
||||
}
|
||||
</script>
|
||||
</head>
|
||||
<body>
|
||||
<div id="log"></div>
|
||||
</body>
|
||||
</html>
|
||||
|
|
@ -0,0 +1,31 @@
|
|||
<!DOCTYPE html>
|
||||
<html>
|
||||
<head>
|
||||
<meta charset="utf-8">
|
||||
<title>Operator dictionary</title>
|
||||
<link rel="help" href="https://mathml-refresh.github.io/mathml-core/#operator-fence-separator-or-accent-mo">
|
||||
<link rel="help" href="https://mathml-refresh.github.io/mathml-core/#dictionary-based-attributes">
|
||||
<link rel="help" href="https://mathml-refresh.github.io/mathml-core/#operator-dictionary">
|
||||
<link rel="help" href="https://mathml-refresh.github.io/mathml-core/#stretchy-operator-axis">
|
||||
<meta name="assert" content="Verify default properties for characters that are in the operator dictionary, as well as for U+00A0 NO-BREAK SPACE">
|
||||
<meta name="timeout" content="long">
|
||||
<script src="/resources/testharness.js"></script>
|
||||
<script src="/resources/testharnessreport.js"></script>
|
||||
<script src="/mathml/support/feature-detection.js"></script>
|
||||
<script src="/mathml/support/operator-dictionary.js"></script>
|
||||
<script src="./support/operator-dictionary-tests.js"></script>
|
||||
<link rel="stylesheet" href="./support/operator-dictionary-tests.css"/>
|
||||
<script>
|
||||
setup({ explicit_done: true });
|
||||
window.addEventListener("load", () => { document.fonts.ready.then(runTests); });
|
||||
async function runTests() {
|
||||
let json = await fetchOperatorDictionary();
|
||||
OperatorDictionaryTests.run(json, "symmetric", 4);
|
||||
done();
|
||||
}
|
||||
</script>
|
||||
</head>
|
||||
<body>
|
||||
<div id="log"></div>
|
||||
</body>
|
||||
</html>
|
||||
|
|
@ -0,0 +1,31 @@
|
|||
<!DOCTYPE html>
|
||||
<html>
|
||||
<head>
|
||||
<meta charset="utf-8">
|
||||
<title>Operator dictionary</title>
|
||||
<link rel="help" href="https://mathml-refresh.github.io/mathml-core/#operator-fence-separator-or-accent-mo">
|
||||
<link rel="help" href="https://mathml-refresh.github.io/mathml-core/#dictionary-based-attributes">
|
||||
<link rel="help" href="https://mathml-refresh.github.io/mathml-core/#operator-dictionary">
|
||||
<link rel="help" href="https://mathml-refresh.github.io/mathml-core/#stretchy-operator-axis">
|
||||
<meta name="assert" content="Verify default properties for characters that are in the operator dictionary, as well as for U+00A0 NO-BREAK SPACE">
|
||||
<meta name="timeout" content="long">
|
||||
<script src="/resources/testharness.js"></script>
|
||||
<script src="/resources/testharnessreport.js"></script>
|
||||
<script src="/mathml/support/feature-detection.js"></script>
|
||||
<script src="/mathml/support/operator-dictionary.js"></script>
|
||||
<script src="./support/operator-dictionary-tests.js"></script>
|
||||
<link rel="stylesheet" href="./support/operator-dictionary-tests.css"/>
|
||||
<script>
|
||||
setup({ explicit_done: true });
|
||||
window.addEventListener("load", () => { document.fonts.ready.then(runTests); });
|
||||
async function runTests() {
|
||||
let json = await fetchOperatorDictionary();
|
||||
OperatorDictionaryTests.run(json, "symmetric", 5);
|
||||
done();
|
||||
}
|
||||
</script>
|
||||
</head>
|
||||
<body>
|
||||
<div id="log"></div>
|
||||
</body>
|
||||
</html>
|
||||
|
|
@ -187,60 +187,32 @@ symmetric for "${parsedKey.characters}" (${parsedKey.form}): \
|
|||
div.style.display = "none";
|
||||
},
|
||||
|
||||
"accent": function(json, key) {
|
||||
let parsedKey = splitKey(key);
|
||||
let entry = json.dictionary[key];
|
||||
let epsilon = 1;
|
||||
|
||||
// FIXME: Should really detect accent support...
|
||||
assert_true(MathMLFeatureDetection.has_mover());
|
||||
var defaultValue = defaultPropertyValue(entry, "accent");
|
||||
document.body.insertAdjacentHTML("beforeend", `<div>\
|
||||
accent for "${parsedKey.characters}" (${parsedKey.form}): \
|
||||
<math>\
|
||||
<mover>\
|
||||
<mn> </mn>\
|
||||
<mo form="${parsedKey.form}">${parsedKey.characters}</mo>\
|
||||
</mover>\
|
||||
</math>\
|
||||
VS \
|
||||
<math>\
|
||||
<mover>\
|
||||
<mn> </mn>\
|
||||
<mo form="${parsedKey.form}" accent="${defaultValue}">${parsedKey.characters}</mo>\
|
||||
</mover>\
|
||||
</math>\
|
||||
</div>`);
|
||||
var div = document.body.lastElementChild;
|
||||
var movers = div.getElementsByTagName("mover");
|
||||
function gapBetweenBaseAndScript(mover) {
|
||||
return mover.children[0].getBoundingClientRect().top -
|
||||
mover.children[1].getBoundingClientRect().bottom;
|
||||
}
|
||||
var gap = gapBetweenBaseAndScript(movers[0])
|
||||
var gapRef = gapBetweenBaseAndScript(movers[1])
|
||||
assert_approx_equals(gap, gapRef, epsilon, `Accent property for ${key} should be '${defaultValue}'`);
|
||||
div.style.display = "none";
|
||||
},
|
||||
|
||||
run: function(json, name) {
|
||||
run: function(json, name, fileIndex) {
|
||||
// The operator dictionary has more than one thousand of entries so the
|
||||
// tests are grouped in chunks so that these don't get much more
|
||||
// importance than other MathML tests. For easy debugging, one can set the
|
||||
// chunk size to 1. Also, note that the test div will remain visible for
|
||||
// failed tests.
|
||||
const entryPerChunk = 50
|
||||
const filesPerProperty = 6
|
||||
|
||||
var counter = 0;
|
||||
var test;
|
||||
|
||||
for (key in json.dictionary) {
|
||||
|
||||
if (counter % entryPerChunk === 0) {
|
||||
// Skip this key if it does not belong to that test file.
|
||||
if (counter % filesPerProperty != fileIndex) {
|
||||
counter++;
|
||||
continue;
|
||||
}
|
||||
|
||||
var counterInFile = (counter - fileIndex) / filesPerProperty;
|
||||
if (counterInFile % entryPerChunk === 0) {
|
||||
// Start of a new chunk.
|
||||
// Complete current async tests and create new ones for the next chunk.
|
||||
if (test) test.done();
|
||||
test = async_test(`Operator dictionary chunk ${1 + counter / entryPerChunk} - ${name}`);
|
||||
test = async_test(`Operator dictionary chunk ${1 + counterInFile / entryPerChunk} - ${name}`);
|
||||
}
|
||||
|
||||
test.step(function() {
|
||||
|
|
|
|||
File diff suppressed because one or more lines are too long
|
|
@ -40,6 +40,10 @@
|
|||
var ownEventForTheCapturedTargetGot = false;
|
||||
var count=0;
|
||||
var event_log = [];
|
||||
var actions_promise1;
|
||||
var actions_promise2;
|
||||
var actions_promise3;
|
||||
var actions_promise4;
|
||||
|
||||
var detected_pointertypes = {};
|
||||
add_completion_callback(end_of_test);
|
||||
|
|
@ -64,12 +68,16 @@
|
|||
});
|
||||
|
||||
on_event(target0, 'gotpointercapture', function(e) {
|
||||
actions_promise3.then( () => {
|
||||
test_gotpointercapture.done();
|
||||
});
|
||||
event_log.push('gotpointercapture@target0');
|
||||
});
|
||||
|
||||
on_event(target0, 'lostpointercapture', function(e) {
|
||||
actions_promise4.then( () => {
|
||||
test_lostpointercapture.done();
|
||||
});
|
||||
isPointerCapture = false;
|
||||
event_log.push('lostpointercapture@target0');
|
||||
});
|
||||
|
|
@ -84,11 +92,13 @@
|
|||
on_event(target0, "pointermove", function (event) {
|
||||
detected_pointertypes[ event.pointerType ] = true;
|
||||
if(!pointermoveNoCaptureGot0) {
|
||||
actions_promise2 = actions_promise1.then( () => {
|
||||
test_pointermove0.done();
|
||||
event_log.push('pointermove@target0');
|
||||
pointermoveNoCaptureGot0 = true;
|
||||
// Second dispatch a pointer move to target1.
|
||||
new test_driver.Actions().pointerMove(0, 0, {origin: target1}).send();
|
||||
return new test_driver.Actions().pointerMove(0, 0, {origin: target1}).send();
|
||||
});
|
||||
}
|
||||
if(isPointerCapture) {
|
||||
if(!pointermoveCaptureGot0) {
|
||||
|
|
@ -105,7 +115,9 @@
|
|||
event_log.push('pointermove@target0');
|
||||
pointermoveCaptureGot0 = true;
|
||||
// Fourth dispatch a pointer move to target0.
|
||||
new test_driver.Actions().pointerMove(0, 0, {origin: target0}).send();
|
||||
actions_promise4 = actions_promise3.then( () => {
|
||||
return new test_driver.Actions().pointerMove(0, 0, {origin: target0}).send();
|
||||
});
|
||||
}
|
||||
if((event.clientX > target0.getBoundingClientRect().left)&&
|
||||
(event.clientX < target0.getBoundingClientRect().right)&&
|
||||
|
|
@ -122,7 +134,7 @@
|
|||
});
|
||||
|
||||
// First dispatch a pointer move to target0.
|
||||
new test_driver.Actions().pointerMove(0, 0, {origin: target0}).send();
|
||||
actions_promise1 = new test_driver.Actions().pointerMove(0, 0, {origin: target0}).send();
|
||||
|
||||
on_event(target1, "pointermove", function (event) {
|
||||
test(function() {
|
||||
|
|
@ -130,17 +142,19 @@
|
|||
}, "pointermove shouldn't trigger for the purple rectangle while the black rectangle has capture");
|
||||
|
||||
if(!pointermoveNoCaptureGot1) {
|
||||
actions_promise3 = actions_promise2.then( () => {
|
||||
test_pointermove1.done();
|
||||
event_log.push('pointermove@target1');
|
||||
pointermoveNoCaptureGot1 = true;
|
||||
// Third, drag the mouse from btnCapture, target1 to target0.
|
||||
new test_driver.Actions()
|
||||
return new test_driver.Actions()
|
||||
.pointerMove(0, 0, {origin: btnCapture})
|
||||
.pointerDown()
|
||||
.pointerMove(0, 0, {origin: target1})
|
||||
.pointerMove(0, 0, {origin: target0})
|
||||
.pointerUp()
|
||||
.send();
|
||||
});
|
||||
}
|
||||
});
|
||||
}
|
||||
|
|
|
|||
|
|
@ -26,6 +26,7 @@
|
|||
add_completion_callback(showPointerTypes);
|
||||
|
||||
var INVALID_POINTERID = 314159265358973923;
|
||||
var actions_promise;
|
||||
|
||||
function run() {
|
||||
var target0 = document.getElementById("target0");
|
||||
|
|
@ -41,7 +42,10 @@
|
|||
"It should not be possible to release capture an invalid pointer id");
|
||||
});
|
||||
|
||||
test_pointerEvent.done(); // complete test
|
||||
// Make sure the test finishes after all the input actions are completed.
|
||||
actions_promise.then( () => {
|
||||
test_pointerEvent.done();
|
||||
});
|
||||
});
|
||||
|
||||
// set pointer capture
|
||||
|
|
@ -51,7 +55,7 @@
|
|||
});
|
||||
|
||||
// Inject mouse inputs.
|
||||
new test_driver.Actions()
|
||||
actions_promise = new test_driver.Actions()
|
||||
.pointerMove(0, 0, {origin: target0})
|
||||
.pointerDown()
|
||||
.pointerMove(10, 0, {origin: target0})
|
||||
|
|
|
|||
|
|
@ -0,0 +1,48 @@
|
|||
<!doctype html>
|
||||
<html>
|
||||
<head>
|
||||
<script src="/resources/testharness.js"></script>
|
||||
<script src="/resources/testharnessreport.js"></script>
|
||||
<script src=/common/get-host-info.sub.js></script>
|
||||
</head>
|
||||
<body>
|
||||
<img id="img_200">
|
||||
<img id="img_307">
|
||||
<img id="img_404">
|
||||
<img id="img_502">
|
||||
<script id="script_200"></script>
|
||||
<script id="script_307"></script>
|
||||
<script id="script_404"></script>
|
||||
<script id="script_502"></script>
|
||||
<script>
|
||||
async_test(t => {
|
||||
let destUrl = get_host_info().HTTP_REMOTE_ORIGIN + '/resource-timing/resources/';
|
||||
let statusCodes = ['200', '307', '404', '502'];
|
||||
statusCodes.forEach(status => {
|
||||
document.getElementById('img_' + status).src = destUrl + 'status-code.py?status=' + status;
|
||||
document.getElementById('script_' + status).src = destUrl + 'status-code.py?status=' + status + '&script=1';
|
||||
});
|
||||
let nameMap = {};
|
||||
let firstEntry = null;
|
||||
// We will check that the non-timestamp values of the entry match for all entries.
|
||||
const keys = ['entryType', 'nextHopProtocol', 'transferSize', 'encodedBodySize', 'decodedBodySize'];
|
||||
new PerformanceObserver(t.step_func(entryList => {
|
||||
entryList.getEntries().forEach(entry => {
|
||||
if (!entry.name.includes("status-code"))
|
||||
return;
|
||||
|
||||
nameMap[entry.name] = true;
|
||||
if (!firstEntry) {
|
||||
firstEntry = entry;
|
||||
} else {
|
||||
keys.forEach(key => {
|
||||
assert_equals(entry[key], firstEntry[key], `Discernible difference in ${key} for ${entry.name}`);
|
||||
});
|
||||
}
|
||||
});
|
||||
if (Object.keys(nameMap).length === 8) {
|
||||
t.done();
|
||||
}
|
||||
})).observe({entryTypes: ['resource']});
|
||||
}, "Make sure cross origin resource fetch failures with different status codes are indistinguishable");
|
||||
</script>
|
||||
Some files were not shown because too many files have changed in this diff Show more
Loading…
Add table
Add a link
Reference in a new issue