mirror of
https://github.com/servo/servo.git
synced 2025-06-27 18:43:40 +01:00
Update web-platform-tests to revision 6856483bcc86322198f10e0c42385a7f9127eb66
This commit is contained in:
WPT Sync Bot
parent
b1a2b6b5bf
commit
ff06f1d031
265 changed files with 7539 additions and 988 deletions
File diff suppressed because it is too large
Load diff
|
|
@ -5,3 +5,27 @@
|
|||
[Access-Control-Expose-Headers parsing: #2]
|
||||
expected: FAIL
|
||||
|
||||
[Parsing: Access-Control-Expose-Headers%3A%20bb-8%2C%20no%20no]
|
||||
expected: FAIL
|
||||
|
||||
[Parsing: Access-Control-Expose-Headers%3A%20bb-8%0B]
|
||||
expected: FAIL
|
||||
|
||||
[Parsing: Access-Control-Expose-Headers%3A%20%40%23%24%23%25%25%26%5E%26%5E*()()11!%2Cbb-8]
|
||||
expected: FAIL
|
||||
|
||||
[Parsing: Access-Control-Expose-Headers%3A%20bb-8%2C%2C%40%23%24%23%25%25%26%5E%26%5E*()()11!]
|
||||
expected: FAIL
|
||||
|
||||
[Parsing: Access-Control-Expose-Headers%3A%20%22bb-8%22%2Cbb-8]
|
||||
expected: FAIL
|
||||
|
||||
[Parsing: Access-Control-Expose-Headers%3A%20bb-8%0B%2Cbb-8]
|
||||
expected: FAIL
|
||||
|
||||
[Parsing: Access-Control-Expose-Headers%3A%20bb-8%0D%0AAccess-Control-Expose-Headers%3A%20no%20no]
|
||||
expected: FAIL
|
||||
|
||||
[Parsing: Access-Control-Expose-Headers%3A%20bb-8%0C]
|
||||
expected: FAIL
|
||||
|
||||
|
|
|
|||
|
|
@ -0,0 +1,39 @@
|
|||
[cors-safelisted-request-header.any.worker.html]
|
||||
[No preflight for {"content-type":"text/plain;"}]
|
||||
expected: FAIL
|
||||
|
||||
[Preflight for {"content-type":"text/plain\\f"}]
|
||||
expected: FAIL
|
||||
|
||||
[Preflight for {"content-type":"application/x-www-form-urlencoded;"}]
|
||||
expected: FAIL
|
||||
|
||||
[No preflight for {"content-type":"text/plain;garbage"}]
|
||||
expected: FAIL
|
||||
|
||||
[Preflight for {"content-type":"text/plain;garbage\\u0001\\u0002"}]
|
||||
expected: FAIL
|
||||
|
||||
[Preflight for {"content-type":"text/plain\\u000b"}]
|
||||
expected: FAIL
|
||||
|
||||
|
||||
[cors-safelisted-request-header.any.html]
|
||||
[No preflight for {"content-type":"text/plain;"}]
|
||||
expected: FAIL
|
||||
|
||||
[Preflight for {"content-type":"text/plain\\f"}]
|
||||
expected: FAIL
|
||||
|
||||
[Preflight for {"content-type":"application/x-www-form-urlencoded;"}]
|
||||
expected: FAIL
|
||||
|
||||
[No preflight for {"content-type":"text/plain;garbage"}]
|
||||
expected: FAIL
|
||||
|
||||
[Preflight for {"content-type":"text/plain;garbage\\u0001\\u0002"}]
|
||||
expected: FAIL
|
||||
|
||||
[Preflight for {"content-type":"text/plain\\u000b"}]
|
||||
expected: FAIL
|
||||
|
||||
|
|
@ -0,0 +1,2 @@
|
|||
[flex-wrap-002.html]
|
||||
expected: FAIL
|
||||
|
|
@ -0,0 +1,2 @@
|
|||
[tab-stop-threshold-001.html]
|
||||
expected: FAIL
|
||||
|
|
@ -0,0 +1,2 @@
|
|||
[tab-stop-threshold-002.html]
|
||||
expected: FAIL
|
||||
|
|
@ -20,3 +20,12 @@
|
|||
[e.style['rotate'\] = "400grad z" should set the property value]
|
||||
expected: FAIL
|
||||
|
||||
[e.style['rotate'\] = "1 0 0 400grad" should set the property value]
|
||||
expected: FAIL
|
||||
|
||||
[e.style['rotate'\] = "0 1 0 400grad" should set the property value]
|
||||
expected: FAIL
|
||||
|
||||
[e.style['rotate'\] = "0 0 1 400grad" should set the property value]
|
||||
expected: FAIL
|
||||
|
||||
|
|
|
|||
|
|
@ -71,6 +71,9 @@
|
|||
[text-indent intermediate]
|
||||
expected: FAIL
|
||||
|
||||
[opacity end]
|
||||
[border-top-width end]
|
||||
expected: FAIL
|
||||
|
||||
[border-bottom-width end]
|
||||
expected: FAIL
|
||||
|
||||
|
|
|
|||
|
|
@ -0,0 +1,4 @@
|
|||
[elementsFromPoint-invalid-cases.html]
|
||||
[The root element is the last element returned for valid queries]
|
||||
expected: FAIL
|
||||
|
||||
|
|
@ -0,0 +1,2 @@
|
|||
[backdrop-filter-basic-background-color.html]
|
||||
expected: FAIL
|
||||
|
|
@ -0,0 +1,2 @@
|
|||
[backdrop-filter-basic-opacity.html]
|
||||
expected: FAIL
|
||||
|
|
@ -0,0 +1,2 @@
|
|||
[backdrop-filter-basic.html]
|
||||
expected: FAIL
|
||||
|
|
@ -0,0 +1,2 @@
|
|||
[backdrop-filter-border-radius.html]
|
||||
expected: FAIL
|
||||
|
|
@ -0,0 +1,2 @@
|
|||
[backdrop-filter-isolation-isolate.html]
|
||||
expected: FAIL
|
||||
|
|
@ -0,0 +1,2 @@
|
|||
[backdrop-filter-isolation.html]
|
||||
expected: FAIL
|
||||
|
|
@ -1,3 +0,0 @@
|
|||
[filter-contrast-003.html]
|
||||
type: reftest
|
||||
expected: FAIL
|
||||
|
|
@ -1,3 +0,0 @@
|
|||
[filter-grayscale-002.html]
|
||||
type: reftest
|
||||
expected: FAIL
|
||||
|
|
@ -1,3 +0,0 @@
|
|||
[filter-grayscale-003.html]
|
||||
type: reftest
|
||||
expected: FAIL
|
||||
|
|
@ -0,0 +1,2 @@
|
|||
[filtered-block-is-container.html]
|
||||
expected: FAIL
|
||||
|
|
@ -0,0 +1,2 @@
|
|||
[filtered-html-is-not-container.html]
|
||||
expected: FAIL
|
||||
|
|
@ -0,0 +1,2 @@
|
|||
[filters-test-brightness-003.html]
|
||||
expected: FAIL
|
||||
16
tests/wpt/metadata/encoding/utf-32-from-win1252.html.ini
Normal file
16
tests/wpt/metadata/encoding/utf-32-from-win1252.html.ini
Normal file
|
|
@ -0,0 +1,16 @@
|
|||
[utf-32-from-win1252.html]
|
||||
[Expect resources/utf-32-little-endian-bom.xml to parse as UTF-16LE]
|
||||
expected: FAIL
|
||||
|
||||
[Expect resources/utf-32-little-endian-bom.html to parse as UTF-16LE]
|
||||
expected: FAIL
|
||||
|
||||
[Expect resources/utf-32-big-endian-bom.html to parse as windows-1252]
|
||||
expected: FAIL
|
||||
|
||||
[Expect resources/utf-32-little-endian-nobom.html to parse as windows-1252]
|
||||
expected: FAIL
|
||||
|
||||
[Expect resources/utf-32-big-endian-nobom.html to parse as windows-1252]
|
||||
expected: FAIL
|
||||
|
||||
|
|
@ -0,0 +1,11 @@
|
|||
[document_domain_feature_policy.tentative.sub.html]
|
||||
expected: TIMEOUT
|
||||
[Default "document-domain" feature policy ["*"\] allows cross-origin iframes.]
|
||||
expected: TIMEOUT
|
||||
|
||||
[Default "document-domain" feature policy ["*"\] allows same-origin iframes.]
|
||||
expected: TIMEOUT
|
||||
|
||||
[Feature policy "document-domain" can be disabled in cross-origin iframes using "allow" attribute.]
|
||||
expected: FAIL
|
||||
|
||||
|
|
@ -5,5 +5,5 @@
|
|||
expected: NOTRUN
|
||||
|
||||
[calling play() on a sufficiently long video should trigger timeupdate event]
|
||||
expected: NOTRUN
|
||||
expected: FAIL
|
||||
|
||||
|
|
|
|||
|
|
@ -5,14 +5,29 @@
|
|||
expected: TIMEOUT
|
||||
|
||||
[picture: source (max-width:500px) valid image, img valid image, resize to wide]
|
||||
expected: TIMEOUT
|
||||
expected: FAIL
|
||||
|
||||
[picture: source (max-width:500px) valid image, img broken image, resize to narrow]
|
||||
expected: TIMEOUT
|
||||
|
||||
[picture: source (max-width:500px) valid image, img valid image, resize to narrow]
|
||||
expected: TIMEOUT
|
||||
expected: FAIL
|
||||
|
||||
[picture: same URL in source (max-width:500px) and img, resize to narrow]
|
||||
expected: FAIL
|
||||
|
||||
[picture: source (max-width:500px) broken image, img valid image, resize to narrow]
|
||||
expected: FAIL
|
||||
|
||||
[img (srcset 1 cand) valid image, resize to wide]
|
||||
expected: FAIL
|
||||
|
||||
[picture: same URL in source (max-width:500px) and img, resize to wide]
|
||||
expected: FAIL
|
||||
|
||||
[img (srcset 1 cand) valid image, resize to narrow]
|
||||
expected: FAIL
|
||||
|
||||
[picture: source (max-width:500px) valid image, img broken image, resize to wide]
|
||||
expected: FAIL
|
||||
|
||||
|
|
|
|||
|
|
@ -1,5 +1,4 @@
|
|||
[parse-a-sizes-attribute-standards-mode.html]
|
||||
expected: TIMEOUT
|
||||
[<img srcset="/images/green-1x1.png?e59 50w, /images/green-16x16.png?e59 51w" sizes="(min-width:0) or (min-width:unknown-mf-value) 1px"> ref sizes="1px" (standards mode)]
|
||||
expected: FAIL
|
||||
|
||||
|
|
|
|||
|
|
@ -36,45 +36,12 @@
|
|||
[change state from tel to range]
|
||||
expected: FAIL
|
||||
|
||||
[change state from url to text]
|
||||
expected: FAIL
|
||||
|
||||
[change state from url to search]
|
||||
expected: FAIL
|
||||
|
||||
[change state from url to tel]
|
||||
expected: FAIL
|
||||
|
||||
[change state from url to password]
|
||||
expected: FAIL
|
||||
|
||||
[change state from url to datetime]
|
||||
expected: FAIL
|
||||
|
||||
[change state from url to range]
|
||||
expected: FAIL
|
||||
|
||||
[change state from email to hidden]
|
||||
expected: FAIL
|
||||
|
||||
[change state from email to checkbox]
|
||||
expected: FAIL
|
||||
|
||||
[change state from email to radio]
|
||||
expected: FAIL
|
||||
|
||||
[change state from email to submit]
|
||||
expected: FAIL
|
||||
|
||||
[change state from email to image]
|
||||
expected: FAIL
|
||||
|
||||
[change state from email to reset]
|
||||
expected: FAIL
|
||||
|
||||
[change state from email to button]
|
||||
expected: FAIL
|
||||
|
||||
[change state from email to datetime]
|
||||
expected: FAIL
|
||||
|
||||
|
|
@ -141,27 +108,6 @@
|
|||
[change state from number to range]
|
||||
expected: FAIL
|
||||
|
||||
[change state from range to hidden]
|
||||
expected: FAIL
|
||||
|
||||
[change state from range to checkbox]
|
||||
expected: FAIL
|
||||
|
||||
[change state from range to radio]
|
||||
expected: FAIL
|
||||
|
||||
[change state from range to submit]
|
||||
expected: FAIL
|
||||
|
||||
[change state from range to image]
|
||||
expected: FAIL
|
||||
|
||||
[change state from range to reset]
|
||||
expected: FAIL
|
||||
|
||||
[change state from range to button]
|
||||
expected: FAIL
|
||||
|
||||
[change state from range to email]
|
||||
expected: FAIL
|
||||
|
||||
|
|
@ -222,21 +168,6 @@
|
|||
[change state from datetime-local to range]
|
||||
expected: FAIL
|
||||
|
||||
[change state from range to text]
|
||||
expected: FAIL
|
||||
|
||||
[change state from range to search]
|
||||
expected: FAIL
|
||||
|
||||
[change state from range to tel]
|
||||
expected: FAIL
|
||||
|
||||
[change state from range to url]
|
||||
expected: FAIL
|
||||
|
||||
[change state from range to password]
|
||||
expected: FAIL
|
||||
|
||||
[change state from color to range]
|
||||
expected: FAIL
|
||||
|
||||
|
|
|
|||
|
|
@ -1,7 +0,0 @@
|
|||
[toggleEvent.html]
|
||||
[Calling open twice on 'details' fires only one toggle event]
|
||||
expected: FAIL
|
||||
|
||||
[Setting open=true to opened 'details' element should not fire a toggle event at the 'details' element]
|
||||
expected: FAIL
|
||||
|
||||
|
|
@ -9,6 +9,3 @@
|
|||
[document.open should throw an InvalidStateError with XML document even when the ignore-opens-during-unload counter is greater than 0 (during pagehide event)]
|
||||
expected: FAIL
|
||||
|
||||
[document.open should throw an InvalidStateError with XML document even when there is an active parser executing script]
|
||||
expected: FAIL
|
||||
|
||||
|
|
|
|||
|
|
@ -12,6 +12,3 @@
|
|||
[Verifies the resolution of entry.startTime is at least 5 microseconds.]
|
||||
expected: TIMEOUT
|
||||
|
||||
[Verifies the resolution of performance.now() is at least 5 microseconds.]
|
||||
expected: FAIL
|
||||
|
||||
|
|
|
|||
|
|
@ -1,4 +1,4 @@
|
|||
[limited-quirks.html]
|
||||
[no-quirks.html]
|
||||
[top: -\\31 .5]
|
||||
expected: FAIL
|
||||
|
||||
283
tests/wpt/metadata/quirks/unitless-length/quirks.html.ini
Normal file
283
tests/wpt/metadata/quirks/unitless-length/quirks.html.ini
Normal file
|
|
@ -0,0 +1,283 @@
|
|||
[quirks.html]
|
||||
[top: -\\31 .5]
|
||||
expected: FAIL
|
||||
|
||||
[bottom: -1A]
|
||||
expected: FAIL
|
||||
|
||||
[bottom: -1a]
|
||||
expected: FAIL
|
||||
|
||||
[top: @1]
|
||||
expected: FAIL
|
||||
|
||||
[top: "1a"]
|
||||
expected: FAIL
|
||||
|
||||
[top: @a]
|
||||
expected: FAIL
|
||||
|
||||
[bottom: "1"]
|
||||
expected: FAIL
|
||||
|
||||
[bottom: -/**/1]
|
||||
expected: FAIL
|
||||
|
||||
[top: +/**/1]
|
||||
expected: FAIL
|
||||
|
||||
[bottom: @1a]
|
||||
expected: FAIL
|
||||
|
||||
[top: 1\\31 ]
|
||||
expected: FAIL
|
||||
|
||||
[top: url('1')]
|
||||
expected: FAIL
|
||||
|
||||
[bottom: -\\31 ]
|
||||
expected: FAIL
|
||||
|
||||
[top: calc(1)]
|
||||
expected: FAIL
|
||||
|
||||
[top: \\31 ]
|
||||
expected: FAIL
|
||||
|
||||
[bottom: +1\\31 ]
|
||||
expected: FAIL
|
||||
|
||||
[bottom: 1\\31 .5]
|
||||
expected: FAIL
|
||||
|
||||
[bottom: #0001]
|
||||
expected: FAIL
|
||||
|
||||
[top: calc(2 * 2px)]
|
||||
expected: FAIL
|
||||
|
||||
[bottom: 1a]
|
||||
expected: FAIL
|
||||
|
||||
[bottom: A]
|
||||
expected: FAIL
|
||||
|
||||
[bottom: #01]
|
||||
expected: FAIL
|
||||
|
||||
[top: +\\31 .5]
|
||||
expected: FAIL
|
||||
|
||||
[bottom: #1]
|
||||
expected: FAIL
|
||||
|
||||
[top: -/**/1]
|
||||
expected: FAIL
|
||||
|
||||
[bottom: +\\31 .5]
|
||||
expected: FAIL
|
||||
|
||||
[bottom: \\31 ]
|
||||
expected: FAIL
|
||||
|
||||
[bottom: calc(1)]
|
||||
expected: FAIL
|
||||
|
||||
[top: #001]
|
||||
expected: FAIL
|
||||
|
||||
[top: +\\31 ]
|
||||
expected: FAIL
|
||||
|
||||
[bottom: +\\31 ]
|
||||
expected: FAIL
|
||||
|
||||
[top: +1.5]
|
||||
expected: FAIL
|
||||
|
||||
[top: +1\\31 ]
|
||||
expected: FAIL
|
||||
|
||||
[bottom: @a]
|
||||
expected: FAIL
|
||||
|
||||
[bottom: @1]
|
||||
expected: FAIL
|
||||
|
||||
[top: #1]
|
||||
expected: FAIL
|
||||
|
||||
[top: 1a]
|
||||
expected: FAIL
|
||||
|
||||
[bottom: +1a]
|
||||
expected: FAIL
|
||||
|
||||
[bottom: +1A]
|
||||
expected: FAIL
|
||||
|
||||
[bottom: "a"]
|
||||
expected: FAIL
|
||||
|
||||
[top: #00001]
|
||||
expected: FAIL
|
||||
|
||||
[bottom: -1\\31 .5]
|
||||
expected: FAIL
|
||||
|
||||
[top: "1"]
|
||||
expected: FAIL
|
||||
|
||||
[bottom: 1.5]
|
||||
expected: FAIL
|
||||
|
||||
[bottom: -\\31 .5]
|
||||
expected: FAIL
|
||||
|
||||
[bottom: url('1')]
|
||||
expected: FAIL
|
||||
|
||||
[bottom: -1.5]
|
||||
expected: FAIL
|
||||
|
||||
[top: \\31 .5]
|
||||
expected: FAIL
|
||||
|
||||
[bottom: "1a"]
|
||||
expected: FAIL
|
||||
|
||||
[bottom: calc(2 * 2px)]
|
||||
expected: FAIL
|
||||
|
||||
[bottom: +1\\31 .5]
|
||||
expected: FAIL
|
||||
|
||||
[bottom: 1\\31 ]
|
||||
expected: FAIL
|
||||
|
||||
[bottom: +/**/1]
|
||||
expected: FAIL
|
||||
|
||||
[bottom: #00001]
|
||||
expected: FAIL
|
||||
|
||||
[top: url(1)]
|
||||
expected: FAIL
|
||||
|
||||
[bottom: #001]
|
||||
expected: FAIL
|
||||
|
||||
[top: +1\\31 .5]
|
||||
expected: FAIL
|
||||
|
||||
[top: -1a]
|
||||
expected: FAIL
|
||||
|
||||
[top: -1A]
|
||||
expected: FAIL
|
||||
|
||||
[bottom: url(1)]
|
||||
expected: FAIL
|
||||
|
||||
[top: a]
|
||||
expected: FAIL
|
||||
|
||||
[top: A]
|
||||
expected: FAIL
|
||||
|
||||
[top: #000001]
|
||||
expected: FAIL
|
||||
|
||||
[top: 1]
|
||||
expected: FAIL
|
||||
|
||||
[top: 1\\31 .5]
|
||||
expected: FAIL
|
||||
|
||||
[bottom: a]
|
||||
expected: FAIL
|
||||
|
||||
[bottom: 1]
|
||||
expected: FAIL
|
||||
|
||||
[bottom: +1]
|
||||
expected: FAIL
|
||||
|
||||
[bottom: #000001]
|
||||
expected: FAIL
|
||||
|
||||
[bottom: +a]
|
||||
expected: FAIL
|
||||
|
||||
[bottom: +A]
|
||||
expected: FAIL
|
||||
|
||||
[top: 1.5]
|
||||
expected: FAIL
|
||||
|
||||
[top: +A]
|
||||
expected: FAIL
|
||||
|
||||
[top: +a]
|
||||
expected: FAIL
|
||||
|
||||
[top: +1]
|
||||
expected: FAIL
|
||||
|
||||
[top: -1.5]
|
||||
expected: FAIL
|
||||
|
||||
[top: -1\\31 .5]
|
||||
expected: FAIL
|
||||
|
||||
[top: +1a]
|
||||
expected: FAIL
|
||||
|
||||
[top: +1A]
|
||||
expected: FAIL
|
||||
|
||||
[top: @1a]
|
||||
expected: FAIL
|
||||
|
||||
[bottom: \\31 .5]
|
||||
expected: FAIL
|
||||
|
||||
[top: "a"]
|
||||
expected: FAIL
|
||||
|
||||
[top: #01]
|
||||
expected: FAIL
|
||||
|
||||
[bottom: +1.5]
|
||||
expected: FAIL
|
||||
|
||||
[bottom: -A]
|
||||
expected: FAIL
|
||||
|
||||
[bottom: -a]
|
||||
expected: FAIL
|
||||
|
||||
[bottom: -1\\31 ]
|
||||
expected: FAIL
|
||||
|
||||
[top: #0001]
|
||||
expected: FAIL
|
||||
|
||||
[bottom: -1]
|
||||
expected: FAIL
|
||||
|
||||
[top: -\\31 ]
|
||||
expected: FAIL
|
||||
|
||||
[top: -A]
|
||||
expected: FAIL
|
||||
|
||||
[top: -a]
|
||||
expected: FAIL
|
||||
|
||||
[top: -1]
|
||||
expected: FAIL
|
||||
|
||||
[top: -1\\31 ]
|
||||
expected: FAIL
|
||||
|
||||
|
|
@ -1,5 +1,6 @@
|
|||
[005.html]
|
||||
type: testharness
|
||||
expected: ERROR
|
||||
[dedicated worker in shared worker in dedicated worker]
|
||||
expected: FAIL
|
||||
|
||||
|
|
|
|||
|
|
@ -210,3 +210,171 @@
|
|||
[39) MIME types need to be parsed and serialized: x/x;test]
|
||||
expected: FAIL
|
||||
|
||||
[16) MIME types need to be parsed and serialized: text/html;charset='gbk']
|
||||
expected: FAIL
|
||||
|
||||
[63) MIME types need to be parsed and serialized: </>]
|
||||
expected: FAIL
|
||||
|
||||
[23) MIME types need to be parsed and serialized: text/html;";charset=gbk]
|
||||
expected: FAIL
|
||||
|
||||
[13) MIME types need to be parsed and serialized: text/html;charset=\x0cgbk]
|
||||
expected: FAIL
|
||||
|
||||
[47) MIME types need to be parsed and serialized: x/x\n\r\t ;x=x]
|
||||
expected: FAIL
|
||||
|
||||
[60) MIME types need to be parsed and serialized: bogus/]
|
||||
expected: FAIL
|
||||
|
||||
[37) MIME types need to be parsed and serialized: text/html;charset=";charset=GBK]
|
||||
expected: FAIL
|
||||
|
||||
[61) MIME types need to be parsed and serialized: bogus/ ]
|
||||
expected: FAIL
|
||||
|
||||
[30) MIME types need to be parsed and serialized: text/html;charset=gbk"]
|
||||
expected: FAIL
|
||||
|
||||
[29) MIME types need to be parsed and serialized: text/html;charset="gbk]
|
||||
expected: FAIL
|
||||
|
||||
[57) MIME types need to be parsed and serialized: \t]
|
||||
expected: FAIL
|
||||
|
||||
[27) MIME types need to be parsed and serialized: text/html;charset=";charset=foo";charset=GBK]
|
||||
expected: FAIL
|
||||
|
||||
[14) MIME types need to be parsed and serialized: text/html;\x0bcharset=gbk]
|
||||
expected: FAIL
|
||||
|
||||
[56) MIME types need to be parsed and serialized: ]
|
||||
expected: FAIL
|
||||
|
||||
[65) MIME types need to be parsed and serialized: ÿ/ÿ]
|
||||
expected: FAIL
|
||||
|
||||
[59) MIME types need to be parsed and serialized: bogus]
|
||||
expected: FAIL
|
||||
|
||||
[51) MIME types need to be parsed and serialized: x/x;test=<3D>;x=x]
|
||||
expected: FAIL
|
||||
|
||||
[64) MIME types need to be parsed and serialized: (/)]
|
||||
expected: FAIL
|
||||
|
||||
[44) MIME types need to be parsed and serialized: x/x;test="\\]
|
||||
expected: FAIL
|
||||
|
||||
[26) MIME types need to be parsed and serialized: text/html;charset= ";charset=GBK]
|
||||
expected: FAIL
|
||||
|
||||
[17) MIME types need to be parsed and serialized: text/html;charset='gbk]
|
||||
expected: FAIL
|
||||
|
||||
[25) MIME types need to be parsed and serialized: text/html;;;;charset=gbk]
|
||||
expected: FAIL
|
||||
|
||||
[66) MIME types need to be parsed and serialized: text/html(;doesnot=matter]
|
||||
expected: FAIL
|
||||
|
||||
[19) MIME types need to be parsed and serialized: text/html;charset=';charset=GBK]
|
||||
expected: FAIL
|
||||
|
||||
[21) MIME types need to be parsed and serialized: text/html;test=;charset=gbk]
|
||||
expected: FAIL
|
||||
|
||||
[20) MIME types need to be parsed and serialized: text/html;test;charset=gbk]
|
||||
expected: FAIL
|
||||
|
||||
[15) MIME types need to be parsed and serialized: text/html;\x0ccharset=gbk]
|
||||
expected: FAIL
|
||||
|
||||
[62) MIME types need to be parsed and serialized: bogus/bogus/;]
|
||||
expected: FAIL
|
||||
|
||||
[33) MIME types need to be parsed and serialized: text/html;charset="\\ gbk"]
|
||||
expected: FAIL
|
||||
|
||||
[67) MIME types need to be parsed and serialized: {/}]
|
||||
expected: FAIL
|
||||
|
||||
[35) MIME types need to be parsed and serialized: text/html;charset="gbk"x]
|
||||
expected: FAIL
|
||||
|
||||
[28) MIME types need to be parsed and serialized: text/html;charset="gbk"]
|
||||
expected: FAIL
|
||||
|
||||
[46) MIME types need to be parsed and serialized: x/x;x=\t]
|
||||
expected: FAIL
|
||||
|
||||
[68) MIME types need to be parsed and serialized: Ā/Ā]
|
||||
expected: FAIL
|
||||
|
||||
[50) MIME types need to be parsed and serialized: text/html;test=ÿ;charset=gbk]
|
||||
expected: FAIL
|
||||
|
||||
[41) MIME types need to be parsed and serialized: !#$%&'*+-.^_`|~0123456789ABCDEFGHIJKLMNOPQRSTUVWXYZabcdefghijklmnopqrstuvwxyz/!#$%&'*+-.^_`|~0123456789ABCDEFGHIJKLMNOPQRSTUVWXYZabcdefghijklmnopqrstuvwxyz;!#$%&'*+-.^_`|~0123456789ABCDEFGHIJKLMNOPQRSTUVWXYZabcdefghijklmnopqrstuvwxyz=!#$%&'*+-.^_`|~0123456789ABCDEFGHIJKLMNOPQRSTUVWXYZabcdefghijklmnopqrstuvwxyz]
|
||||
expected: FAIL
|
||||
|
||||
[54) MIME types need to be parsed and serialized: x/x\x0b]
|
||||
expected: FAIL
|
||||
|
||||
[42) MIME types need to be parsed and serialized: x/x;x="\t !\\"#$%&'()*+,-./0123456789:;<=>?@ABCDEFGHIJKLMNOPQRSTUVWXYZ[\\\\\]^_`abcdefghijklmnopqrstuvwxyz{|}~
¡¢£¤¥¦§¨©ª«¬®¯°±²³´µ¶·¸¹º»¼½¾¿ÀÁÂÃÄÅÆÇÈÉÊËÌÍÎÏÐÑÒÓÔÕÖ×ØÙÚÛÜÝÞßàáâãäåæçèéêëìíîïðñòóôõö÷øùúûüýþÿ"]
|
||||
expected: FAIL
|
||||
|
||||
[43) MIME types need to be parsed and serialized: x/x;test]
|
||||
expected: FAIL
|
||||
|
||||
[36) MIME types need to be parsed and serialized: text/html;charset="";charset=GBK]
|
||||
expected: FAIL
|
||||
|
||||
[38) MIME types need to be parsed and serialized: text/html;charset={gbk}]
|
||||
expected: FAIL
|
||||
|
||||
[34) MIME types need to be parsed and serialized: text/html;charset="\\g\\b\\k"]
|
||||
expected: FAIL
|
||||
|
||||
[45) MIME types need to be parsed and serialized: x/x;x= ]
|
||||
expected: FAIL
|
||||
|
||||
[52) MIME types need to be parsed and serialized: \x0bx/x]
|
||||
expected: FAIL
|
||||
|
||||
[48) MIME types need to be parsed and serialized: \n\r\t x/x;x=x\n\r\t ]
|
||||
expected: FAIL
|
||||
|
||||
[31) MIME types need to be parsed and serialized: text/html;charset=" gbk"]
|
||||
expected: FAIL
|
||||
|
||||
[49) MIME types need to be parsed and serialized: x/x;\n\r\t x=x\n\r\t ;x=y]
|
||||
expected: FAIL
|
||||
|
||||
[22) MIME types need to be parsed and serialized: text/html;';charset=gbk]
|
||||
expected: FAIL
|
||||
|
||||
[58) MIME types need to be parsed and serialized: /]
|
||||
expected: FAIL
|
||||
|
||||
[12) MIME types need to be parsed and serialized: text/html;charset=\x0bgbk]
|
||||
expected: FAIL
|
||||
|
||||
[32) MIME types need to be parsed and serialized: text/html;charset="gbk "]
|
||||
expected: FAIL
|
||||
|
||||
[53) MIME types need to be parsed and serialized: \x0cx/x]
|
||||
expected: FAIL
|
||||
|
||||
[55) MIME types need to be parsed and serialized: x/x\x0c]
|
||||
expected: FAIL
|
||||
|
||||
[24) MIME types need to be parsed and serialized: text/html ; ; charset=gbk]
|
||||
expected: FAIL
|
||||
|
||||
[18) MIME types need to be parsed and serialized: text/html;charset=gbk']
|
||||
expected: FAIL
|
||||
|
||||
[39) MIME types need to be parsed and serialized: text/html;0123456789012345678901234567890123456789012345678901234567890123456789012345678901234567890123456789012345678901234567890123456789=x;charset=gbk]
|
||||
expected: FAIL
|
||||
|
||||
|
|
|
|||
|
|
@ -26,8 +26,9 @@ function performChromiumSetup() {
|
|||
// Load the Chromium-specific resources.
|
||||
let prefix = '/resources/chromium';
|
||||
let extra = [];
|
||||
if (window.location.pathname.includes('/LayoutTests/')) {
|
||||
let root = window.location.pathname.match(/.*LayoutTests/);
|
||||
const pathname = window.location.pathname;
|
||||
if (pathname.includes('/LayoutTests/') || pathname.includes('/web_tests/')) {
|
||||
let root = pathname.match(/.*(?:LayoutTests|web_tests)/);
|
||||
prefix = `${root}/external/wpt/resources/chromium`;
|
||||
extra = [
|
||||
`${root}/resources/bluetooth/bluetooth-fake-adapter.js`,
|
||||
|
|
|
|||
|
|
@ -1,13 +1,15 @@
|
|||
function exposeTest(resource, desc) {
|
||||
const url = new URL("resources/" + resource, location.href).href.replace("://", "://élève.");
|
||||
promise_test(() => fetch("resources/access-control-expose-headers.json").then(res => res.json()).then(runTests), "Loading JSON…");
|
||||
|
||||
function runTests(allTestData) {
|
||||
allTestData.forEach(testData => {
|
||||
const encodedInput = encodeURIComponent(testData.input);
|
||||
promise_test(() => {
|
||||
const relativeURL = "resources/expose-headers.py?expose=" + encodedInput,
|
||||
url = new URL(relativeURL, location.href).href.replace("://", "://élève.");
|
||||
return fetch(url).then(res => {
|
||||
assert_equals(res.headers.get("content-language"), "sure")
|
||||
assert_equals(res.headers.get("x-custom"), null);
|
||||
assert_equals(res.headers.get("content-language"), "mkay");
|
||||
assert_equals(res.headers.get("bb-8"), (testData.exposed ? "hey" : null));
|
||||
});
|
||||
}, "Parsing: " + encodedInput);
|
||||
})
|
||||
}, "Access-Control-Expose-Headers parsing: " + desc);
|
||||
}
|
||||
|
||||
exposeTest("access-control-expose-headers-parsing.asis", "#1");
|
||||
exposeTest("access-control-expose-headers-parsing-2.asis", "#2")
|
||||
|
|
|
|||
|
|
@ -0,0 +1,43 @@
|
|||
// META: script=support.js?pipe=sub
|
||||
// META: script=/common/utils.js
|
||||
|
||||
// This is based on simple-requests.htm, with modifications to make the code more modern and test
|
||||
// more esoteric cases of header value parsing.
|
||||
|
||||
function safelist(headers, expectPreflight = false) {
|
||||
promise_test(async t => {
|
||||
const uuid = token(),
|
||||
url = CROSSDOMAIN + "resources/preflight.py?token=" + uuid,
|
||||
checkURL = "resources/preflight.py?check&token=" + uuid,
|
||||
request = () => fetch(url, { method: "POST", headers, body: "data" });
|
||||
if (expectPreflight) {
|
||||
await promise_rejects(t, TypeError(), request());
|
||||
} else {
|
||||
const response = await request();
|
||||
assert_equals(response.headers.get("content-type"), "text/plain");
|
||||
assert_equals(await response.text(), "NO");
|
||||
}
|
||||
const checkResponse = await fetch(checkURL, { method: "POST", body: "data" });
|
||||
assert_equals(await checkResponse.text(), (expectPreflight ? "1" : "0"));
|
||||
}, (expectPreflight ? "Preflight" : "No preflight") + " for " + JSON.stringify(headers));
|
||||
}
|
||||
|
||||
[
|
||||
["text /plain", true],
|
||||
["text\t/\tplain", true],
|
||||
["text/plain;"],
|
||||
["text/plain;garbage"],
|
||||
["text/plain;garbage\u0001\u0002", true],
|
||||
["text/plain,", true],
|
||||
[",text/plain", true],
|
||||
["text/plain,text/plain", true],
|
||||
["text/plain,x/x", true],
|
||||
["text/plain\u000B", true],
|
||||
["text/plain\u000C", true],
|
||||
["application/www-form-urlencoded", true],
|
||||
["application/x-www-form-urlencoded;\u007F", true],
|
||||
["multipart/form-data"],
|
||||
["multipart/form-data;\"", true]
|
||||
].forEach(([mimeType, preflight = false]) => {
|
||||
safelist({"content-type": mimeType}, preflight);
|
||||
})
|
||||
|
|
@ -1,8 +0,0 @@
|
|||
HTTP/1.1 200 OK
|
||||
Access-Control-Allow-Origin: *
|
||||
Access-Control-Expose-Headers: not valid
|
||||
Access-Control-Expose-Headers: x-custom
|
||||
X-Custom: test
|
||||
Content-Language: sure
|
||||
|
||||
TEST
|
||||
|
|
@ -1,7 +0,0 @@
|
|||
HTTP/1.1 200 OK
|
||||
Access-Control-Allow-Origin: *
|
||||
Access-Control-Expose-Headers: not valid, x-custom
|
||||
X-Custom: test
|
||||
Content-Language: sure
|
||||
|
||||
TEST
|
||||
|
|
@ -0,0 +1,62 @@
|
|||
[
|
||||
{
|
||||
"input": "access-control-expose-headers: BB-8",
|
||||
"exposed": true
|
||||
},
|
||||
{
|
||||
"input": "Access-Control-Expose-Headers: bb-8,,@#$#%%&^&^*()()11!",
|
||||
"exposed": false
|
||||
},
|
||||
{
|
||||
"input": "Access-Control-Expose-Headers: bb-8, no no",
|
||||
"exposed": false
|
||||
},
|
||||
{
|
||||
"input": "Access-Control-Expose-Headers: @#$#%%&^&^*()()11!,bb-8",
|
||||
"exposed": false
|
||||
},
|
||||
{
|
||||
"input": "Access-Control-Expose-Headers: bb-8\r\nAccess-Control-Expose-Headers: no",
|
||||
"exposed": true
|
||||
},
|
||||
{
|
||||
"input": "Access-Control-Expose-Headers: bb-8\r\nAccess-Control-Expose-Headers: no no",
|
||||
"exposed": false
|
||||
},
|
||||
{
|
||||
"input": "Access-Control-Expose-Headers: no\r\nAccess-Control-Expose-Headers: bb-8",
|
||||
"exposed": true
|
||||
},
|
||||
{
|
||||
"input": "Access-Control-Expose-Headers:\r\nAccess-Control-Expose-Headers: bb-8",
|
||||
"exposed": true
|
||||
},
|
||||
{
|
||||
"input": "Access-Control-Expose-Headers: ,bb-8",
|
||||
"exposed": true
|
||||
},
|
||||
{
|
||||
"input": "Access-Control-Expose-Headers: bb-8\u000C",
|
||||
"exposed": false
|
||||
},
|
||||
{
|
||||
"input": "Access-Control-Expose-Headers: bb-8\u000B",
|
||||
"exposed": false
|
||||
},
|
||||
{
|
||||
"input": "Access-Control-Expose-Headers: bb-8\u000B,bb-8",
|
||||
"exposed": false
|
||||
},
|
||||
{
|
||||
"input": "Access-Control-Expose-Headers: 'bb-8'",
|
||||
"exposed": false
|
||||
},
|
||||
{
|
||||
"input": "Access-Control-Expose-Headers: 'bb-8',bb-8",
|
||||
"exposed": true
|
||||
},
|
||||
{
|
||||
"input": "Access-Control-Expose-Headers: \"bb-8\",bb-8",
|
||||
"exposed": false
|
||||
}
|
||||
]
|
||||
|
|
@ -0,0 +1,10 @@
|
|||
def main(request, response):
|
||||
response.add_required_headers = False
|
||||
output = "HTTP/1.1 221 ALL YOUR BASE BELONG TO H1\r\n"
|
||||
output += "Access-Control-Allow-Origin: *\r\n"
|
||||
output += "BB-8: hey\r\n"
|
||||
output += "Content-Language: mkay\r\n"
|
||||
output += request.GET.first("expose") + "\r\n"
|
||||
output += "\r\n"
|
||||
response.writer.write(output)
|
||||
response.close_connection = True
|
||||
|
|
@ -0,0 +1,22 @@
|
|||
<!DOCTYPE html>
|
||||
<html>
|
||||
<head>
|
||||
<title>CSS Background Test: A single size value with a 1x1 image should work as intended</title>
|
||||
<link rel="author" title="schenney" href="mailto:schenney@chromium.org">
|
||||
<link rel="help" href="http://www.w3.org/TR/css3-background/#the-background-size">
|
||||
<link rel="match" href="reference/background-size-one-value-1x1-image-ref.html">
|
||||
<style type="text/css">
|
||||
.backgroundSize{
|
||||
background: url("support/1x1-green.png");
|
||||
background-size: 50%;
|
||||
background-repeat: repeat-y;
|
||||
height: 100px;
|
||||
}
|
||||
</style>
|
||||
</head>
|
||||
<body>
|
||||
<div style="background: #7957d5">
|
||||
<div class="backgroundSize"></div>
|
||||
</div>
|
||||
</body>
|
||||
</html>
|
||||
|
|
@ -0,0 +1,20 @@
|
|||
<!DOCTYPE html>
|
||||
<html>
|
||||
<head>
|
||||
<title>CSS Background Test Reference</title>
|
||||
<link rel="author" title="schenney" href="mailto:schenney@chromium.org">
|
||||
<style type="text/css">
|
||||
.backgroundSize{
|
||||
background: url("../support/1x1-green.png");
|
||||
background-size: 50% 100%;
|
||||
background-repeat: repeat-y;
|
||||
height: 100px;
|
||||
}
|
||||
</style>
|
||||
</head>
|
||||
<body>
|
||||
<div style="background: #7957d5">
|
||||
<div class="backgroundSize"></div>
|
||||
</div>
|
||||
</body>
|
||||
</html>
|
||||
|
|
@ -1,3 +0,0 @@
|
|||
spec: https://drafts.fxtf.org/filter-effects/
|
||||
suggested_reviewers:
|
||||
- chrishtr
|
||||
|
|
@ -0,0 +1,30 @@
|
|||
<!DOCTYPE html>
|
||||
<link rel="author" title="Google LLC" href="http://www.google.com" />
|
||||
<link rel="help" href="https://drafts.csswg.org/css-flexbox/#cross-sizing" />
|
||||
<title>css-flexbox: Tests that we size items in a wrapping column flexbox as fit-content</title>
|
||||
<link rel="match" href="../reference/ref-filled-green-100px-square.xht" />
|
||||
<meta name="assert" content="The flexbox here should have two flex lines, each 50px wide and 100px tall. The flex items overflow but are transparent." />
|
||||
|
||||
<p>Test passes if there is a filled green square and <strong>no red</strong>.</p>
|
||||
|
||||
<!-- This makes sure that we only see green if the flex items are sized correctly -->
|
||||
<div style="position: absolute; width: 100px; height: 100px; background: green;"></div>
|
||||
|
||||
<div style="display: flex; flex-direction: column; flex-wrap: wrap; width: 50px; height: 100px; line-height: 20px;">
|
||||
<div style="background-color: red; height: 100px;">
|
||||
<!-- These zero-height divs give the flex item has a min-content width of
|
||||
25px and a max-content width of 125px -->
|
||||
<div style="width: 25px; display: inline-block;"></div>
|
||||
<div style="width: 25px; display: inline-block;"></div>
|
||||
<div style="width: 25px; display: inline-block;"></div>
|
||||
<div style="width: 25px; display: inline-block;"></div>
|
||||
<div style="width: 25px; display: inline-block;"></div>
|
||||
</div>
|
||||
<div style="background-color: red; height: 100px;">
|
||||
<div style="width: 25px; display: inline-block;"></div>
|
||||
<div style="width: 25px; display: inline-block;"></div>
|
||||
<div style="width: 25px; display: inline-block;"></div>
|
||||
<div style="width: 25px; display: inline-block;"></div>
|
||||
<div style="width: 25px; display: inline-block;"></div>
|
||||
</div>
|
||||
</div>
|
||||
|
|
@ -0,0 +1,23 @@
|
|||
<!DOCTYPE html>
|
||||
<link rel="author" title="Google LLC" href="http://www.google.com" />
|
||||
<link rel="help" href="https://drafts.csswg.org/css-flexbox/#cross-sizing" />
|
||||
<title>css-flexbox: Tests that we size items in a wrapping column flexbox as fit-content</title>
|
||||
<link rel="match" href="../reference/ref-filled-green-100px-square.xht" />
|
||||
<meta name="assert" content="The flexbox here should have one flex line, 100px by 100px. The flex items overflow but are transparent." />
|
||||
|
||||
<p>Test passes if there is a filled green square and <strong>no red</strong>.</p>
|
||||
|
||||
<!-- This makes sure that we only see green if the flex items are sized correctly -->
|
||||
<div style="position: absolute; width: 100px; height: 100px; background: green;"></div>
|
||||
|
||||
<div style="display: flex; flex-direction: column; flex-wrap: wrap; width: 100px; height: 100px; line-height: 20x;">
|
||||
<div style="background-color: red; height: 100px;">
|
||||
<!-- These zero-height divs give the flex item has a min-content width of
|
||||
50px and a max-content width of 250px -->
|
||||
<div style="width: 50px; display: inline-block;"></div>
|
||||
<div style="width: 50px; display: inline-block;"></div>
|
||||
<div style="width: 50px; display: inline-block;"></div>
|
||||
<div style="width: 50px; display: inline-block;"></div>
|
||||
<div style="width: 50px; display: inline-block;"></div>
|
||||
</div>
|
||||
</div>
|
||||
|
|
@ -0,0 +1,95 @@
|
|||
<!DOCTYPE html>
|
||||
<meta charset="utf-8">
|
||||
<title>CSS container Layout Test Reference</title>
|
||||
<link rel="author" title="Manuel Rego Casasnovas" href="mailto:rego@igalia.com">
|
||||
<style>
|
||||
.container {
|
||||
margin: 10px;
|
||||
background: grey;
|
||||
}
|
||||
|
||||
.scrollX {
|
||||
overflow-x: scroll;
|
||||
}
|
||||
|
||||
.scrollY {
|
||||
overflow-y: scroll;
|
||||
}
|
||||
|
||||
.fixedSize {
|
||||
width: 200px;
|
||||
height: 50px;
|
||||
}
|
||||
|
||||
.container > div {
|
||||
background: cyan;
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
}
|
||||
|
||||
.directionRTL {
|
||||
direction: rtl;
|
||||
}
|
||||
</style>
|
||||
|
||||
<p>The test passes if it has the same output than the reference.</p>
|
||||
|
||||
<div style="float: left; width: 350px;">
|
||||
|
||||
<h2>direction: ltr;</h2>
|
||||
|
||||
<div class="container scrollX">
|
||||
<div>item</div>
|
||||
</div>
|
||||
|
||||
<div class="container scrollY">
|
||||
<div>item</div>
|
||||
</div>
|
||||
|
||||
<div class="container scrollX scrollY">
|
||||
<div>item</div>
|
||||
</div>
|
||||
|
||||
<div class="container fixedSize scrollX">
|
||||
<div>item</div>
|
||||
</div>
|
||||
|
||||
<div class="container fixedSize scrollY">
|
||||
<div>item</div>
|
||||
</div>
|
||||
|
||||
<div class="container fixedSize scrollX scrollY">
|
||||
<div>item</div>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
|
||||
<div style="float: left; width: 350px;">
|
||||
|
||||
<h2>direction: rtl;</h2>
|
||||
|
||||
<div class="directionRTL container scrollX">
|
||||
<div>item</div>
|
||||
</div>
|
||||
|
||||
<div class="directionRTL container scrollY">
|
||||
<div>item</div>
|
||||
</div>
|
||||
|
||||
<div class="directionRTL container scrollX scrollY">
|
||||
<div>item</div>
|
||||
</div>
|
||||
|
||||
<div class="directionRTL container fixedSize scrollX">
|
||||
<div>item</div>
|
||||
</div>
|
||||
|
||||
<div class="directionRTL container fixedSize scrollY">
|
||||
<div>item</div>
|
||||
</div>
|
||||
|
||||
<div class="directionRTL container fixedSize scrollX scrollY">
|
||||
<div>item</div>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
|
|
@ -0,0 +1,92 @@
|
|||
<!DOCTYPE html>
|
||||
<meta charset="utf-8">
|
||||
<title>CSS Grid Layout Test: Grid container with scrollbars</title>
|
||||
<link rel="author" title="Manuel Rego Casasnovas" href="mailto:rego@igalia.com">
|
||||
<link rel="help" href="https://drafts.csswg.org/css-grid/#grid-model">
|
||||
<link rel="match" href="grid-container-scrollbar-001-ref.html">
|
||||
<meta name="assert" content="This test verifes that scrollbars are properly painted on grid containers, and are shown in the expected position depending on the direction.">
|
||||
<link href="support/grid.css" rel="stylesheet">
|
||||
<style>
|
||||
.grid {
|
||||
margin: 10px;
|
||||
}
|
||||
|
||||
.scrollX {
|
||||
overflow-x: scroll;
|
||||
}
|
||||
|
||||
.scrollY {
|
||||
overflow-y: scroll;
|
||||
}
|
||||
|
||||
.fixedSize {
|
||||
width: 200px;
|
||||
height: 50px;
|
||||
}
|
||||
|
||||
.grid > div {
|
||||
background: cyan;
|
||||
}
|
||||
</style>
|
||||
|
||||
<p>The test passes if it has the same output than the reference.</p>
|
||||
|
||||
<div style="float: left; width: 350px;">
|
||||
|
||||
<h2>direction: ltr;</h2>
|
||||
|
||||
<div class="grid scrollX">
|
||||
<div>item</div>
|
||||
</div>
|
||||
|
||||
<div class="grid scrollY">
|
||||
<div>item</div>
|
||||
</div>
|
||||
|
||||
<div class="grid scrollX scrollY">
|
||||
<div>item</div>
|
||||
</div>
|
||||
|
||||
<div class="grid fixedSize scrollX">
|
||||
<div>item</div>
|
||||
</div>
|
||||
|
||||
<div class="grid fixedSize scrollY">
|
||||
<div>item</div>
|
||||
</div>
|
||||
|
||||
<div class="grid fixedSize scrollX scrollY">
|
||||
<div>item</div>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
|
||||
<div style="float: left; width: 350px;">
|
||||
|
||||
<h2>direction: rtl;</h2>
|
||||
|
||||
<div class="directionRTL grid scrollX">
|
||||
<div>item</div>
|
||||
</div>
|
||||
|
||||
<div class="directionRTL grid scrollY">
|
||||
<div>item</div>
|
||||
</div>
|
||||
|
||||
<div class="directionRTL grid scrollX scrollY">
|
||||
<div>item</div>
|
||||
</div>
|
||||
|
||||
<div class="directionRTL grid fixedSize scrollX">
|
||||
<div>item</div>
|
||||
</div>
|
||||
|
||||
<div class="directionRTL grid fixedSize scrollY">
|
||||
<div>item</div>
|
||||
</div>
|
||||
|
||||
<div class="directionRTL grid fixedSize scrollX scrollY">
|
||||
<div>item</div>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
|
|
@ -0,0 +1,96 @@
|
|||
<!DOCTYPE html>
|
||||
<meta charset="utf-8">
|
||||
<title>CSS container Layout Test Reference</title>
|
||||
<link rel="author" title="Manuel Rego Casasnovas" href="mailto:rego@igalia.com">
|
||||
<style>
|
||||
.container {
|
||||
margin: 10px;
|
||||
background: grey;
|
||||
writing-mode: vertical-lr;
|
||||
}
|
||||
|
||||
.scrollX {
|
||||
overflow-x: scroll;
|
||||
}
|
||||
|
||||
.scrollY {
|
||||
overflow-y: scroll;
|
||||
}
|
||||
|
||||
.fixedSize {
|
||||
width: 200px;
|
||||
height: 50px;
|
||||
}
|
||||
|
||||
.container > div {
|
||||
background: cyan;
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
}
|
||||
|
||||
.directionRTL {
|
||||
direction: rtl;
|
||||
}
|
||||
</style>
|
||||
|
||||
<p>The test passes if it has the same output than the reference.</p>
|
||||
|
||||
<div style="float: left; width: 350px;">
|
||||
|
||||
<h2>direction: ltr;</h2>
|
||||
|
||||
<div class="container scrollX">
|
||||
<div>item</div>
|
||||
</div>
|
||||
|
||||
<div class="container scrollY">
|
||||
<div>item</div>
|
||||
</div>
|
||||
|
||||
<div class="container scrollX scrollY">
|
||||
<div>item</div>
|
||||
</div>
|
||||
|
||||
<div class="container fixedSize scrollX">
|
||||
<div>item</div>
|
||||
</div>
|
||||
|
||||
<div class="container fixedSize scrollY">
|
||||
<div>item</div>
|
||||
</div>
|
||||
|
||||
<div class="container fixedSize scrollX scrollY">
|
||||
<div>item</div>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
|
||||
<div style="float: left; width: 350px;">
|
||||
|
||||
<h2>direction: rtl;</h2>
|
||||
|
||||
<div class="directionRTL container scrollX">
|
||||
<div>item</div>
|
||||
</div>
|
||||
|
||||
<div class="directionRTL container scrollY">
|
||||
<div>item</div>
|
||||
</div>
|
||||
|
||||
<div class="directionRTL container scrollX scrollY">
|
||||
<div>item</div>
|
||||
</div>
|
||||
|
||||
<div class="directionRTL container fixedSize scrollX">
|
||||
<div>item</div>
|
||||
</div>
|
||||
|
||||
<div class="directionRTL container fixedSize scrollY">
|
||||
<div>item</div>
|
||||
</div>
|
||||
|
||||
<div class="directionRTL container fixedSize scrollX scrollY">
|
||||
<div>item</div>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
|
|
@ -0,0 +1,93 @@
|
|||
<!DOCTYPE html>
|
||||
<meta charset="utf-8">
|
||||
<title>CSS Grid Layout Test: Grid container with scrollbars</title>
|
||||
<link rel="author" title="Manuel Rego Casasnovas" href="mailto:rego@igalia.com">
|
||||
<link rel="help" href="https://drafts.csswg.org/css-grid/#grid-model">
|
||||
<link rel="match" href="grid-container-scrollbar-vertical-lr-001-ref.html">
|
||||
<meta name="assert" content="This test verifes that scrollbars are properly painted on grid containers, and are shown in the expected position depending on the direction.">
|
||||
<link href="support/grid.css" rel="stylesheet">
|
||||
<style>
|
||||
.grid {
|
||||
margin: 10px;
|
||||
writing-mode: vertical-lr;
|
||||
}
|
||||
|
||||
.scrollX {
|
||||
overflow-x: scroll;
|
||||
}
|
||||
|
||||
.scrollY {
|
||||
overflow-y: scroll;
|
||||
}
|
||||
|
||||
.fixedSize {
|
||||
width: 200px;
|
||||
height: 50px;
|
||||
}
|
||||
|
||||
.grid > div {
|
||||
background: cyan;
|
||||
}
|
||||
</style>
|
||||
|
||||
<p>The test passes if it has the same output than the reference.</p>
|
||||
|
||||
<div style="float: left; width: 350px;">
|
||||
|
||||
<h2>direction: ltr;</h2>
|
||||
|
||||
<div class="grid scrollX">
|
||||
<div>item</div>
|
||||
</div>
|
||||
|
||||
<div class="grid scrollY">
|
||||
<div>item</div>
|
||||
</div>
|
||||
|
||||
<div class="grid scrollX scrollY">
|
||||
<div>item</div>
|
||||
</div>
|
||||
|
||||
<div class="grid fixedSize scrollX">
|
||||
<div>item</div>
|
||||
</div>
|
||||
|
||||
<div class="grid fixedSize scrollY">
|
||||
<div>item</div>
|
||||
</div>
|
||||
|
||||
<div class="grid fixedSize scrollX scrollY">
|
||||
<div>item</div>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
|
||||
<div style="float: left; width: 350px;">
|
||||
|
||||
<h2>direction: rtl;</h2>
|
||||
|
||||
<div class="directionRTL grid scrollX">
|
||||
<div>item</div>
|
||||
</div>
|
||||
|
||||
<div class="directionRTL grid scrollY">
|
||||
<div>item</div>
|
||||
</div>
|
||||
|
||||
<div class="directionRTL grid scrollX scrollY">
|
||||
<div>item</div>
|
||||
</div>
|
||||
|
||||
<div class="directionRTL grid fixedSize scrollX">
|
||||
<div>item</div>
|
||||
</div>
|
||||
|
||||
<div class="directionRTL grid fixedSize scrollY">
|
||||
<div>item</div>
|
||||
</div>
|
||||
|
||||
<div class="directionRTL grid fixedSize scrollX scrollY">
|
||||
<div>item</div>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
|
|
@ -0,0 +1,96 @@
|
|||
<!DOCTYPE html>
|
||||
<meta charset="utf-8">
|
||||
<title>CSS container Layout Test Reference</title>
|
||||
<link rel="author" title="Manuel Rego Casasnovas" href="mailto:rego@igalia.com">
|
||||
<style>
|
||||
.container {
|
||||
margin: 10px;
|
||||
background: grey;
|
||||
writing-mode: vertical-rl;
|
||||
}
|
||||
|
||||
.scrollX {
|
||||
overflow-x: scroll;
|
||||
}
|
||||
|
||||
.scrollY {
|
||||
overflow-y: scroll;
|
||||
}
|
||||
|
||||
.fixedSize {
|
||||
width: 200px;
|
||||
height: 50px;
|
||||
}
|
||||
|
||||
.container > div {
|
||||
background: cyan;
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
}
|
||||
|
||||
.directionRTL {
|
||||
direction: rtl;
|
||||
}
|
||||
</style>
|
||||
|
||||
<p>The test passes if it has the same output than the reference.</p>
|
||||
|
||||
<div style="float: left; width: 350px;">
|
||||
|
||||
<h2>direction: ltr;</h2>
|
||||
|
||||
<div class="container scrollX">
|
||||
<div>item</div>
|
||||
</div>
|
||||
|
||||
<div class="container scrollY">
|
||||
<div>item</div>
|
||||
</div>
|
||||
|
||||
<div class="container scrollX scrollY">
|
||||
<div>item</div>
|
||||
</div>
|
||||
|
||||
<div class="container fixedSize scrollX">
|
||||
<div>item</div>
|
||||
</div>
|
||||
|
||||
<div class="container fixedSize scrollY">
|
||||
<div>item</div>
|
||||
</div>
|
||||
|
||||
<div class="container fixedSize scrollX scrollY">
|
||||
<div>item</div>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
|
||||
<div style="float: left; width: 350px;">
|
||||
|
||||
<h2>direction: rtl;</h2>
|
||||
|
||||
<div class="directionRTL container scrollX">
|
||||
<div>item</div>
|
||||
</div>
|
||||
|
||||
<div class="directionRTL container scrollY">
|
||||
<div>item</div>
|
||||
</div>
|
||||
|
||||
<div class="directionRTL container scrollX scrollY">
|
||||
<div>item</div>
|
||||
</div>
|
||||
|
||||
<div class="directionRTL container fixedSize scrollX">
|
||||
<div>item</div>
|
||||
</div>
|
||||
|
||||
<div class="directionRTL container fixedSize scrollY">
|
||||
<div>item</div>
|
||||
</div>
|
||||
|
||||
<div class="directionRTL container fixedSize scrollX scrollY">
|
||||
<div>item</div>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
|
|
@ -0,0 +1,93 @@
|
|||
<!DOCTYPE html>
|
||||
<meta charset="utf-8">
|
||||
<title>CSS Grid Layout Test: Grid container with scrollbars</title>
|
||||
<link rel="author" title="Manuel Rego Casasnovas" href="mailto:rego@igalia.com">
|
||||
<link rel="help" href="https://drafts.csswg.org/css-grid/#grid-model">
|
||||
<link rel="match" href="grid-container-scrollbar-vertical-rl-001-ref.html">
|
||||
<meta name="assert" content="This test verifes that scrollbars are properly painted on grid containers, and are shown in the expected position depending on the direction.">
|
||||
<link href="support/grid.css" rel="stylesheet">
|
||||
<style>
|
||||
.grid {
|
||||
margin: 10px;
|
||||
writing-mode: vertical-rl;
|
||||
}
|
||||
|
||||
.scrollX {
|
||||
overflow-x: scroll;
|
||||
}
|
||||
|
||||
.scrollY {
|
||||
overflow-y: scroll;
|
||||
}
|
||||
|
||||
.fixedSize {
|
||||
width: 200px;
|
||||
height: 50px;
|
||||
}
|
||||
|
||||
.grid > div {
|
||||
background: cyan;
|
||||
}
|
||||
</style>
|
||||
|
||||
<p>The test passes if it has the same output than the reference.</p>
|
||||
|
||||
<div style="float: left; width: 350px;">
|
||||
|
||||
<h2>direction: ltr;</h2>
|
||||
|
||||
<div class="grid scrollX">
|
||||
<div>item</div>
|
||||
</div>
|
||||
|
||||
<div class="grid scrollY">
|
||||
<div>item</div>
|
||||
</div>
|
||||
|
||||
<div class="grid scrollX scrollY">
|
||||
<div>item</div>
|
||||
</div>
|
||||
|
||||
<div class="grid fixedSize scrollX">
|
||||
<div>item</div>
|
||||
</div>
|
||||
|
||||
<div class="grid fixedSize scrollY">
|
||||
<div>item</div>
|
||||
</div>
|
||||
|
||||
<div class="grid fixedSize scrollX scrollY">
|
||||
<div>item</div>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
|
||||
<div style="float: left; width: 350px;">
|
||||
|
||||
<h2>direction: rtl;</h2>
|
||||
|
||||
<div class="directionRTL grid scrollX">
|
||||
<div>item</div>
|
||||
</div>
|
||||
|
||||
<div class="directionRTL grid scrollY">
|
||||
<div>item</div>
|
||||
</div>
|
||||
|
||||
<div class="directionRTL grid scrollX scrollY">
|
||||
<div>item</div>
|
||||
</div>
|
||||
|
||||
<div class="directionRTL grid fixedSize scrollX">
|
||||
<div>item</div>
|
||||
</div>
|
||||
|
||||
<div class="directionRTL grid fixedSize scrollY">
|
||||
<div>item</div>
|
||||
</div>
|
||||
|
||||
<div class="directionRTL grid fixedSize scrollX scrollY">
|
||||
<div>item</div>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
|
|
@ -19,11 +19,10 @@ test_valid_value("grid-template-areas", '"1st 2nd 3rd"');
|
|||
test_valid_value("grid-template-areas", '"first second" "third fourth"');
|
||||
test_valid_value("grid-template-areas", '"first second" "third ." "1st 2nd" "3rd 4th"');
|
||||
|
||||
// Firefox preserves specific whitespace and full stop sequences.
|
||||
// Other browsers consolidate to ' ' and '.'
|
||||
test_valid_value("grid-template-areas", '" a \t b "', '"a b"'); // Fails in Firefox
|
||||
test_valid_value("grid-template-areas", '"c\td"', ['"c d"', '"c\\9 d"']);
|
||||
test_valid_value("grid-template-areas", '"first ..."', ['"first ."', '"first ..."']);
|
||||
// https://github.com/w3c/csswg-drafts/issues/3261
|
||||
test_valid_value("grid-template-areas", '" a \t b "', '"a b"');
|
||||
test_valid_value("grid-template-areas", '"c\td"', '"c d"');
|
||||
test_valid_value("grid-template-areas", '"first ..."', '"first ."');
|
||||
</script>
|
||||
</body>
|
||||
</html>
|
||||
|
|
|
|||
|
|
@ -0,0 +1,49 @@
|
|||
<!DOCTYPE html>
|
||||
<html>
|
||||
<meta charset="utf-8">
|
||||
<title>CSS Multi-column Layout Test: multi-column and margin bottom of last child</title>
|
||||
<link rel="author" title="Ting-Yu Lin" href="tlin@mozilla.com">
|
||||
<link rel="author" title="Mozilla" href="http://www.mozilla.org/">
|
||||
<link rel="help" href="https://drafts.csswg.org/css-multicol-1/#the-multi-column-model">
|
||||
<link rel="match" href="../reference/ref-filled-green-100px-square-only.html">
|
||||
<meta name="assert" content="This test checks the margin-bottom of the last child of a multi-column should not affect its parent's margin-bottom.">
|
||||
|
||||
<style>
|
||||
article {
|
||||
font: 25px/25px Ahem;
|
||||
color: green;
|
||||
background-color: green;
|
||||
width: 100px;
|
||||
column-count: 2;
|
||||
column-gap: 0;
|
||||
margin-bottom: 0;
|
||||
orphans: 1;
|
||||
widows: 1;
|
||||
}
|
||||
|
||||
article div:last-child {
|
||||
margin-bottom: 13px;
|
||||
}
|
||||
</style>
|
||||
|
||||
<body>
|
||||
<p>Test passes if there is a filled green square.</p>
|
||||
<article>
|
||||
<div>a1 a2 a3 a4</div>
|
||||
<div>a5</div>
|
||||
</article>
|
||||
<article>b1 b2</article>
|
||||
|
||||
<!--
|
||||
Expected result:
|
||||
|
||||
|------+------|
|
||||
| a1 | a4 |
|
||||
| a2 | a5 |
|
||||
| a3 |margin|
|
||||
|------+------|
|
||||
| b1 | b2 |
|
||||
|------+------|
|
||||
-->
|
||||
</body>
|
||||
</html>
|
||||
|
|
@ -0,0 +1,28 @@
|
|||
<!DOCTYPE html>
|
||||
<html>
|
||||
<meta charset="utf-8">
|
||||
<title>CSS Multi-column Layout Test Reference: Add the spanner as the first child of the columns</title>
|
||||
<link rel="author" title="Ting-Yu Lin" href="tlin@mozilla.com">
|
||||
<link rel="author" title="Mozilla" href="http://www.mozilla.org/">
|
||||
|
||||
<style>
|
||||
#column {
|
||||
column-count: 3;
|
||||
column-rule: 6px solid;
|
||||
width: 400px;
|
||||
outline: 1px solid black;
|
||||
}
|
||||
h3 {
|
||||
column-span: all;
|
||||
outline: 1px solid blue;
|
||||
}
|
||||
</style>
|
||||
|
||||
<body>
|
||||
<article id="column">
|
||||
<h3>spanner</h3>
|
||||
<div>block1</div>
|
||||
<div>block2</div>
|
||||
</article>
|
||||
</body>
|
||||
</html>
|
||||
|
|
@ -0,0 +1,46 @@
|
|||
<!DOCTYPE html>
|
||||
<html class="reftest-wait">
|
||||
<meta charset="utf-8">
|
||||
<title>CSS Multi-column Layout Test: Add the spanner as the first child of the columns</title>
|
||||
<link rel="author" title="Ting-Yu Lin" href="tlin@mozilla.com">
|
||||
<link rel="author" title="Mozilla" href="http://www.mozilla.org/">
|
||||
<link rel="help" href="https://drafts.csswg.org/css-multicol-1/#column-span">
|
||||
<link rel="match" href="multicol-span-all-dynamic-add-001-ref.html">
|
||||
<meta name="assert" content="This test checks a dynamically added 'column-span' element should be rendered correctly.">
|
||||
|
||||
<script>
|
||||
function runTest() {
|
||||
document.body.offsetHeight;
|
||||
|
||||
/* Add the spanner as the first child of the columns. */
|
||||
var spanner = document.createElement("h3");
|
||||
var text = document.createTextNode("spanner");
|
||||
spanner.appendChild(text);
|
||||
|
||||
var column = document.getElementById("column");
|
||||
column.insertBefore(spanner, column.children[0]);
|
||||
|
||||
document.documentElement.removeAttribute("class");
|
||||
}
|
||||
</script>
|
||||
|
||||
<style>
|
||||
#column {
|
||||
column-count: 3;
|
||||
column-rule: 6px solid;
|
||||
width: 400px;
|
||||
outline: 1px solid black;
|
||||
}
|
||||
h3 {
|
||||
column-span: all;
|
||||
outline: 1px solid blue;
|
||||
}
|
||||
</style>
|
||||
|
||||
<body onload="runTest();">
|
||||
<article id="column">
|
||||
<div>block1</div>
|
||||
<div>block2</div>
|
||||
</article>
|
||||
</body>
|
||||
</html>
|
||||
|
|
@ -0,0 +1,28 @@
|
|||
<!DOCTYPE html>
|
||||
<html>
|
||||
<meta charset="utf-8">
|
||||
<title>CSS Multi-column Layout Test Reference: Add the spanner as the second child of the columns</title>
|
||||
<link rel="author" title="Ting-Yu Lin" href="tlin@mozilla.com">
|
||||
<link rel="author" title="Mozilla" href="http://www.mozilla.org/">
|
||||
|
||||
<style>
|
||||
#column {
|
||||
column-count: 3;
|
||||
column-rule: 6px solid;
|
||||
width: 400px;
|
||||
outline: 1px solid black;
|
||||
}
|
||||
h3 {
|
||||
column-span: all;
|
||||
outline: 1px solid blue;
|
||||
}
|
||||
</style>
|
||||
|
||||
<body>
|
||||
<article id="column">
|
||||
<div>block1</div>
|
||||
<h3>spanner</h3>
|
||||
<div>block2</div>
|
||||
</article>
|
||||
</body>
|
||||
</html>
|
||||
|
|
@ -0,0 +1,46 @@
|
|||
<!DOCTYPE html>
|
||||
<html class="reftest-wait">
|
||||
<meta charset="utf-8">
|
||||
<title>CSS Multi-column Layout Test: Add the spanner as the second child of the columns</title>
|
||||
<link rel="author" title="Ting-Yu Lin" href="tlin@mozilla.com">
|
||||
<link rel="author" title="Mozilla" href="http://www.mozilla.org/">
|
||||
<link rel="help" href="https://drafts.csswg.org/css-multicol-1/#column-span">
|
||||
<link rel="match" href="multicol-span-all-dynamic-add-002-ref.html">
|
||||
<meta name="assert" content="This test checks a dynamically added 'column-span' element should be rendered correctly.">
|
||||
|
||||
<script>
|
||||
function runTest() {
|
||||
document.body.offsetHeight;
|
||||
|
||||
/* Add the spanner as the second child of the columns. */
|
||||
var spanner = document.createElement("h3");
|
||||
var text = document.createTextNode("spanner");
|
||||
spanner.appendChild(text);
|
||||
|
||||
var column = document.getElementById("column");
|
||||
column.insertBefore(spanner, column.children[1]);
|
||||
|
||||
document.documentElement.removeAttribute("class");
|
||||
}
|
||||
</script>
|
||||
|
||||
<style>
|
||||
#column {
|
||||
column-count: 3;
|
||||
column-rule: 6px solid;
|
||||
width: 400px;
|
||||
outline: 1px solid black;
|
||||
}
|
||||
h3 {
|
||||
column-span: all;
|
||||
outline: 1px solid blue;
|
||||
}
|
||||
</style>
|
||||
|
||||
<body onload="runTest();">
|
||||
<article id="column">
|
||||
<div>block1</div>
|
||||
<div>block2</div>
|
||||
</article>
|
||||
</body>
|
||||
</html>
|
||||
|
|
@ -0,0 +1,27 @@
|
|||
<!DOCTYPE html>
|
||||
<html>
|
||||
<meta charset="utf-8">
|
||||
<title>CSS Multi-column Layout Test Reference: Add the spanner in block1. It should correctly span across all columns</title>
|
||||
<link rel="author" title="Ting-Yu Lin" href="tlin@mozilla.com">
|
||||
<link rel="author" title="Mozilla" href="http://www.mozilla.org/">
|
||||
|
||||
<style>
|
||||
#column {
|
||||
column-count: 3;
|
||||
column-rule: 6px solid;
|
||||
width: 400px;
|
||||
outline: 1px solid black;
|
||||
}
|
||||
h3 {
|
||||
column-span: all;
|
||||
outline: 1px solid blue;
|
||||
}
|
||||
</style>
|
||||
|
||||
<body>
|
||||
<article id="column">
|
||||
<div>block1<h3>spanner</h3></div>
|
||||
<div>block2</div>
|
||||
</article>
|
||||
</body>
|
||||
</html>
|
||||
|
|
@ -0,0 +1,46 @@
|
|||
<!DOCTYPE html>
|
||||
<html class="reftest-wait">
|
||||
<meta charset="utf-8">
|
||||
<title>CSS Multi-column Layout Test: Add the spanner in block1. It should correctly span across all columns</title>
|
||||
<link rel="author" title="Ting-Yu Lin" href="tlin@mozilla.com">
|
||||
<link rel="author" title="Mozilla" href="http://www.mozilla.org/">
|
||||
<link rel="help" href="https://drafts.csswg.org/css-multicol-1/#column-span">
|
||||
<link rel="match" href="multicol-span-all-dynamic-add-003-ref.html">
|
||||
<meta name="assert" content="This test checks a dynamically added 'column-span' element should be rendered correctly.">
|
||||
|
||||
<script>
|
||||
function runTest() {
|
||||
document.body.offsetHeight;
|
||||
|
||||
/* Add the spanner in block1. It should correctly span across all columns. */
|
||||
var spanner = document.createElement("h3");
|
||||
var text = document.createTextNode("spanner");
|
||||
spanner.appendChild(text);
|
||||
|
||||
var block1 = document.getElementById("block1");
|
||||
block1.appendChild(spanner);
|
||||
|
||||
document.documentElement.removeAttribute("class");
|
||||
}
|
||||
</script>
|
||||
|
||||
<style>
|
||||
#column {
|
||||
column-count: 3;
|
||||
column-rule: 6px solid;
|
||||
width: 400px;
|
||||
outline: 1px solid black;
|
||||
}
|
||||
h3 {
|
||||
column-span: all;
|
||||
outline: 1px solid blue;
|
||||
}
|
||||
</style>
|
||||
|
||||
<body onload="runTest();">
|
||||
<article id="column">
|
||||
<div id="block1">block1</div>
|
||||
<div>block2</div>
|
||||
</article>
|
||||
</body>
|
||||
</html>
|
||||
|
|
@ -0,0 +1,37 @@
|
|||
<!DOCTYPE html>
|
||||
<html>
|
||||
<meta charset="utf-8">
|
||||
<title>CSS Multi-column Layout Test Reference: Add the spanner to the inner column</title>
|
||||
<link rel="author" title="Ting-Yu Lin" href="tlin@mozilla.com">
|
||||
<link rel="author" title="Mozilla" href="http://www.mozilla.org/">
|
||||
|
||||
<style>
|
||||
body {
|
||||
width: 600px;
|
||||
}
|
||||
article {
|
||||
column-count: 2;
|
||||
column-rule: 6px solid;
|
||||
outline: 1px solid black;
|
||||
}
|
||||
h3 {
|
||||
column-span: all;
|
||||
outline: 1px solid blue;
|
||||
}
|
||||
</style>
|
||||
|
||||
<body>
|
||||
<article>
|
||||
<article>
|
||||
<div>inner block1</div>
|
||||
<h3>spanner</h3>
|
||||
<div>inner block2</div>
|
||||
</article>
|
||||
<article>
|
||||
<div>inner block3</div>
|
||||
<h3>static spanner</h3>
|
||||
<div>inner block4</div>
|
||||
</article>
|
||||
</article>
|
||||
</body>
|
||||
</html>
|
||||
|
|
@ -0,0 +1,55 @@
|
|||
<!DOCTYPE html>
|
||||
<html class="reftest-wait">
|
||||
<meta charset="utf-8">
|
||||
<title>CSS Multi-column Layout Test: Add the spanner to the inner column</title>
|
||||
<link rel="author" title="Ting-Yu Lin" href="tlin@mozilla.com">
|
||||
<link rel="author" title="Mozilla" href="http://www.mozilla.org/">
|
||||
<link rel="help" href="https://drafts.csswg.org/css-multicol-1/#column-span">
|
||||
<link rel="match" href="multicol-span-all-dynamic-add-004-ref.html">
|
||||
<meta name="assert" content="This test checks a dynamically added 'column-span' element should be rendered correctly.">
|
||||
|
||||
<script>
|
||||
function runTest() {
|
||||
document.body.offsetHeight;
|
||||
|
||||
/* Add the spanner to the inner column. */
|
||||
var spanner = document.createElement("h3");
|
||||
var text = document.createTextNode("spanner");
|
||||
spanner.appendChild(text);
|
||||
|
||||
var innerColumn = document.getElementById("inner-column");
|
||||
innerColumn.insertBefore(spanner, innerColumn.children[1]);
|
||||
|
||||
document.documentElement.removeAttribute("class");
|
||||
}
|
||||
</script>
|
||||
|
||||
<style>
|
||||
body {
|
||||
width: 600px;
|
||||
}
|
||||
article {
|
||||
column-count: 2;
|
||||
column-rule: 6px solid;
|
||||
outline: 1px solid black;
|
||||
}
|
||||
h3 {
|
||||
column-span: all;
|
||||
outline: 1px solid blue;
|
||||
}
|
||||
</style>
|
||||
|
||||
<body onload="runTest();">
|
||||
<article id="column">
|
||||
<article id="inner-column">
|
||||
<div>inner block1</div>
|
||||
<div>inner block2</div>
|
||||
</article>
|
||||
<article>
|
||||
<div>inner block3</div>
|
||||
<h3>static spanner</h3>
|
||||
<div>inner block4</div>
|
||||
</article>
|
||||
</article>
|
||||
</body>
|
||||
</html>
|
||||
|
|
@ -0,0 +1,48 @@
|
|||
<!DOCTYPE html>
|
||||
<html class="reftest-wait">
|
||||
<meta charset="utf-8">
|
||||
<title>CSS Multi-column Layout Test: Add block1 before block2. It should join the column content box with
|
||||
block2, not with the spanner</title>
|
||||
<link rel="author" title="Ting-Yu Lin" href="tlin@mozilla.com">
|
||||
<link rel="author" title="Mozilla" href="http://www.mozilla.org/">
|
||||
<link rel="help" href="https://drafts.csswg.org/css-multicol-1/#column-span">
|
||||
<link rel="match" href="multicol-span-all-dynamic-add-001-ref.html">
|
||||
<meta name="assert" content="This test checks a dynamically added block element should be rendered correctly in a column hierarchy containing a column-span.">
|
||||
|
||||
<script>
|
||||
function runTest() {
|
||||
document.body.offsetHeight;
|
||||
|
||||
/* Add block1 before block2. It should join the column content box with
|
||||
block2, not with the spanner. */
|
||||
var block = document.createElement("div");
|
||||
var text = document.createTextNode("block1");
|
||||
block.appendChild(text);
|
||||
|
||||
var column = document.getElementById("column");
|
||||
column.insertBefore(block, column.children[1]);
|
||||
|
||||
document.documentElement.removeAttribute("class");
|
||||
}
|
||||
</script>
|
||||
|
||||
<style>
|
||||
#column {
|
||||
column-count: 3;
|
||||
column-rule: 6px solid;
|
||||
width: 400px;
|
||||
outline: 1px solid black;
|
||||
}
|
||||
h3 {
|
||||
column-span: all;
|
||||
outline: 1px solid blue;
|
||||
}
|
||||
</style>
|
||||
|
||||
<body onload="runTest();">
|
||||
<article id="column">
|
||||
<h3>spanner</h3>
|
||||
<div>block2</div>
|
||||
</article>
|
||||
</body>
|
||||
</html>
|
||||
|
|
@ -0,0 +1,44 @@
|
|||
<!DOCTYPE html>
|
||||
<html class="reftest-wait">
|
||||
<meta charset="utf-8">
|
||||
<title>CSS Multi-column Layout Test: Append a text in column-span</title>
|
||||
<link rel="author" title="Ting-Yu Lin" href="tlin@mozilla.com">
|
||||
<link rel="author" title="Mozilla" href="http://www.mozilla.org/">
|
||||
<link rel="help" href="https://drafts.csswg.org/css-multicol-1/#column-span">
|
||||
<link rel="match" href="multicol-span-all-dynamic-add-002-ref.html">
|
||||
<meta name="assert" content="This test checks adding a text in column-span should be rendered correctly.">
|
||||
|
||||
<script>
|
||||
function runTest() {
|
||||
document.body.offsetHeight;
|
||||
|
||||
/* Append a text in column-span */
|
||||
var text = document.createTextNode("spanner");
|
||||
var spanner = document.getElementById("spanner");
|
||||
spanner.appendChild(text)
|
||||
|
||||
document.documentElement.removeAttribute("class");
|
||||
}
|
||||
</script>
|
||||
|
||||
<style>
|
||||
#column {
|
||||
column-count: 3;
|
||||
column-rule: 6px solid;
|
||||
width: 400px;
|
||||
outline: 1px solid black;
|
||||
}
|
||||
h3 {
|
||||
column-span: all;
|
||||
outline: 1px solid blue;
|
||||
}
|
||||
</style>
|
||||
|
||||
<body onload="runTest();">
|
||||
<article id="column">
|
||||
<div>block1</div>
|
||||
<h3 id="spanner"></h3>
|
||||
<div>block2</div>
|
||||
</article>
|
||||
</body>
|
||||
</html>
|
||||
|
|
@ -0,0 +1,32 @@
|
|||
<!DOCTYPE html>
|
||||
<html>
|
||||
<meta charset="utf-8">
|
||||
<title>CSS Multi-column Layout Test Reference: Append the block to the inline element which contains "column-span"</title>
|
||||
<link rel="author" title="Ting-Yu Lin" href="tlin@mozilla.com">
|
||||
<link rel="author" title="Mozilla" href="http://www.mozilla.org/">
|
||||
|
||||
<style>
|
||||
#column {
|
||||
column-count: 3;
|
||||
column-rule: 6px solid;
|
||||
width: 400px;
|
||||
outline: 1px solid black;
|
||||
}
|
||||
h3 {
|
||||
column-span: all;
|
||||
outline: 1px solid blue;
|
||||
}
|
||||
</style>
|
||||
|
||||
<body>
|
||||
<article id="column">
|
||||
<span id="span">
|
||||
inline1
|
||||
<h3>spanner</h3>
|
||||
<div>block1</div>
|
||||
inline2
|
||||
<div>block2</div>
|
||||
</span>
|
||||
</article>
|
||||
</body>
|
||||
</html>
|
||||
|
|
@ -0,0 +1,50 @@
|
|||
<!DOCTYPE html>
|
||||
<html class="reftest-wait">
|
||||
<meta charset="utf-8">
|
||||
<title>CSS Multi-column Layout Test: Append the block to the inline element which contains "column-span"</title>
|
||||
<link rel="author" title="Ting-Yu Lin" href="tlin@mozilla.com">
|
||||
<link rel="author" title="Mozilla" href="http://www.mozilla.org/">
|
||||
<link rel="help" href="https://drafts.csswg.org/css-multicol-1/#column-span">
|
||||
<link rel="match" href="multicol-span-all-dynamic-add-007-ref.html">
|
||||
<meta name="assert" content="This test checks a dynamically added block element should be rendered correctly.">
|
||||
|
||||
<script>
|
||||
function runTest() {
|
||||
document.body.offsetHeight;
|
||||
|
||||
/* Append the block to the inline element which contains "column-span". */
|
||||
var block = document.createElement("div");
|
||||
var text = document.createTextNode("block2");
|
||||
block.appendChild(text);
|
||||
|
||||
var span = document.getElementById("span");
|
||||
span.appendChild(block);
|
||||
|
||||
document.documentElement.removeAttribute("class");
|
||||
}
|
||||
</script>
|
||||
|
||||
<style>
|
||||
#column {
|
||||
column-count: 3;
|
||||
column-rule: 6px solid;
|
||||
width: 400px;
|
||||
outline: 1px solid black;
|
||||
}
|
||||
h3 {
|
||||
column-span: all;
|
||||
outline: 1px solid blue;
|
||||
}
|
||||
</style>
|
||||
|
||||
<body onload="runTest();">
|
||||
<article id="column">
|
||||
<span id="span">
|
||||
inline1
|
||||
<h3>spanner</h3>
|
||||
<div>block1</div>
|
||||
inline2
|
||||
</span>
|
||||
</article>
|
||||
</body>
|
||||
</html>
|
||||
|
|
@ -0,0 +1,30 @@
|
|||
<!DOCTYPE html>
|
||||
<html>
|
||||
<meta charset="utf-8">
|
||||
<title>CSS Multi-column Layout Test Reference: Add a nested multi-column spanner to the outer column</title>
|
||||
<link rel="author" title="Ting-Yu Lin" href="tlin@mozilla.com">
|
||||
<link rel="author" title="Mozilla" href="http://www.mozilla.org/">
|
||||
|
||||
<style>
|
||||
#column {
|
||||
column-count: 3;
|
||||
column-rule: 6px solid;
|
||||
width: 400px;
|
||||
outline: 1px solid black;
|
||||
}
|
||||
h3 {
|
||||
column-count: 2;
|
||||
column-span: all;
|
||||
outline: 1px solid blue;
|
||||
}
|
||||
</style>
|
||||
|
||||
<body>
|
||||
<article id="column">
|
||||
<div>block1</div>
|
||||
<h3>multi-column spanner</h3>
|
||||
<h3>spanner</h3>
|
||||
<div>block2</div>
|
||||
</article>
|
||||
</body>
|
||||
</html>
|
||||
|
|
@ -0,0 +1,48 @@
|
|||
<!DOCTYPE html>
|
||||
<html class="reftest-wait">
|
||||
<meta charset="utf-8">
|
||||
<title>CSS Multi-column Layout Test: Add a nested multi-column spanner to the outer column</title>
|
||||
<link rel="author" title="Ting-Yu Lin" href="tlin@mozilla.com">
|
||||
<link rel="author" title="Mozilla" href="http://www.mozilla.org/">
|
||||
<link rel="help" href="https://drafts.csswg.org/css-multicol-1/#column-span">
|
||||
<link rel="match" href="multicol-span-all-dynamic-add-008-ref.html">
|
||||
<meta name="assert" content="This test checks a dynamically added 'column-span' element should be rendered correctly.">
|
||||
|
||||
<script>
|
||||
function runTest() {
|
||||
document.body.offsetHeight;
|
||||
|
||||
/* Add a nested multi-column spanner to the outer column. */
|
||||
var spanner = document.createElement("h3");
|
||||
var text = document.createTextNode("multi-column spanner");
|
||||
spanner.appendChild(text);
|
||||
|
||||
var column = document.getElementById("column");
|
||||
column.insertBefore(spanner, column.children[1]);
|
||||
|
||||
document.documentElement.removeAttribute("class");
|
||||
}
|
||||
</script>
|
||||
|
||||
<style>
|
||||
#column {
|
||||
column-count: 3;
|
||||
column-rule: 6px solid;
|
||||
width: 400px;
|
||||
outline: 1px solid black;
|
||||
}
|
||||
h3 {
|
||||
column-count: 2;
|
||||
column-span: all;
|
||||
outline: 1px solid blue;
|
||||
}
|
||||
</style>
|
||||
|
||||
<body onload="runTest();">
|
||||
<article id="column">
|
||||
<div>block1</div>
|
||||
<h3>spanner</h3>
|
||||
<div>block2</div>
|
||||
</article>
|
||||
</body>
|
||||
</html>
|
||||
|
|
@ -0,0 +1,27 @@
|
|||
<!DOCTYPE html>
|
||||
<html>
|
||||
<meta charset="utf-8">
|
||||
<title>CSS Multi-column Layout Test Reference: Remove the spanner as the first child</title>
|
||||
<link rel="author" title="Ting-Yu Lin" href="tlin@mozilla.com">
|
||||
<link rel="author" title="Mozilla" href="http://www.mozilla.org/">
|
||||
|
||||
<style>
|
||||
#column {
|
||||
column-count: 3;
|
||||
column-rule: 6px solid;
|
||||
width: 400px;
|
||||
outline: 1px solid black;
|
||||
}
|
||||
h3 {
|
||||
column-span: all;
|
||||
outline: 1px solid blue;
|
||||
}
|
||||
</style>
|
||||
|
||||
<body>
|
||||
<article id="column">
|
||||
<div>block1</div>
|
||||
<div>block2</div>
|
||||
</article>
|
||||
</body>
|
||||
</html>
|
||||
|
|
@ -0,0 +1,41 @@
|
|||
<!DOCTYPE html>
|
||||
<html class="reftest-wait">
|
||||
<meta charset="utf-8">
|
||||
<title>CSS Multi-column Layout Test: Remove the spanner as the first child</title>
|
||||
<link rel="author" title="Ting-Yu Lin" href="tlin@mozilla.com">
|
||||
<link rel="author" title="Mozilla" href="http://www.mozilla.org/">
|
||||
<link rel="help" href="https://drafts.csswg.org/css-multicol-1/#column-span">
|
||||
<link rel="match" href="multicol-span-all-dynamic-remove-001-ref.html">
|
||||
<meta name="assert" content="This test checks removing a 'column-span' element should be rendered correctly.">
|
||||
|
||||
<script>
|
||||
function runTest() {
|
||||
document.body.offsetHeight;
|
||||
|
||||
document.getElementById("spanner").remove();
|
||||
|
||||
document.documentElement.removeAttribute("class");
|
||||
}
|
||||
</script>
|
||||
|
||||
<style>
|
||||
#column {
|
||||
column-count: 3;
|
||||
column-rule: 6px solid;
|
||||
width: 400px;
|
||||
outline: 1px solid black;
|
||||
}
|
||||
h3 {
|
||||
column-span: all;
|
||||
outline: 1px solid blue;
|
||||
}
|
||||
</style>
|
||||
|
||||
<body onload="runTest();">
|
||||
<article id="column">
|
||||
<h3 id="spanner">spanner</h3>
|
||||
<div>block1</div>
|
||||
<div>block2</div>
|
||||
</article>
|
||||
</body>
|
||||
</html>
|
||||
|
|
@ -0,0 +1,28 @@
|
|||
<!DOCTYPE html>
|
||||
<html>
|
||||
<meta charset="utf-8">
|
||||
<title>CSS Multi-column Layout Test Reference: Remove the spanner in nested blocks</title>
|
||||
<link rel="author" title="Ting-Yu Lin" href="tlin@mozilla.com">
|
||||
<link rel="author" title="Mozilla" href="http://www.mozilla.org/">
|
||||
|
||||
<style>
|
||||
#column {
|
||||
column-count: 3;
|
||||
column-rule: 6px solid;
|
||||
width: 400px;
|
||||
outline: 1px solid black;
|
||||
}
|
||||
h3 {
|
||||
column-span: all;
|
||||
outline: 1px solid blue;
|
||||
}
|
||||
</style>
|
||||
|
||||
<body>
|
||||
<article id="column">
|
||||
<div>block1</div>
|
||||
<div><div></div></div>
|
||||
<div>block2</div>
|
||||
</article>
|
||||
</body>
|
||||
</html>
|
||||
|
|
@ -0,0 +1,41 @@
|
|||
<!DOCTYPE html>
|
||||
<html class="reftest-wait">
|
||||
<meta charset="utf-8">
|
||||
<title>CSS Multi-column Layout Test: Remove the spanner in nested blocks</title>
|
||||
<link rel="author" title="Ting-Yu Lin" href="tlin@mozilla.com">
|
||||
<link rel="author" title="Mozilla" href="http://www.mozilla.org/">
|
||||
<link rel="help" href="https://drafts.csswg.org/css-multicol-1/#column-span">
|
||||
<link rel="match" href="multicol-span-all-dynamic-remove-002-ref.html">
|
||||
<meta name="assert" content="This test checks removing a 'column-span' element should be rendered correctly.">
|
||||
|
||||
<script>
|
||||
function runTest() {
|
||||
document.body.offsetHeight;
|
||||
|
||||
document.getElementById("spanner").remove();
|
||||
|
||||
document.documentElement.removeAttribute("class");
|
||||
}
|
||||
</script>
|
||||
|
||||
<style>
|
||||
#column {
|
||||
column-count: 3;
|
||||
column-rule: 6px solid;
|
||||
width: 400px;
|
||||
outline: 1px solid black;
|
||||
}
|
||||
h3 {
|
||||
column-span: all;
|
||||
outline: 1px solid blue;
|
||||
}
|
||||
</style>
|
||||
|
||||
<body onload="runTest();">
|
||||
<article id="column">
|
||||
<div>block1</div>
|
||||
<div><div><h3 id="spanner">spanner</h3></div></div>
|
||||
<div>block2</div>
|
||||
</article>
|
||||
</body>
|
||||
</html>
|
||||
|
|
@ -0,0 +1,40 @@
|
|||
<!DOCTYPE html>
|
||||
<html class="reftest-wait">
|
||||
<meta charset="utf-8">
|
||||
<title>CSS Multi-column Layout Test: Remove the spanner in a block</title>
|
||||
<link rel="author" title="Ting-Yu Lin" href="tlin@mozilla.com">
|
||||
<link rel="author" title="Mozilla" href="http://www.mozilla.org/">
|
||||
<link rel="help" href="https://drafts.csswg.org/css-multicol-1/#column-span">
|
||||
<link rel="match" href="multicol-span-all-dynamic-remove-001-ref.html">
|
||||
<meta name="assert" content="This test checks removing a 'column-span' element should be rendered correctly.">
|
||||
|
||||
<script>
|
||||
function runTest() {
|
||||
document.body.offsetHeight;
|
||||
|
||||
document.getElementById("spanner").remove();
|
||||
|
||||
document.documentElement.removeAttribute("class");
|
||||
}
|
||||
</script>
|
||||
|
||||
<style>
|
||||
#column {
|
||||
column-count: 3;
|
||||
column-rule: 6px solid;
|
||||
width: 400px;
|
||||
outline: 1px solid black;
|
||||
}
|
||||
h3 {
|
||||
column-span: all;
|
||||
outline: 1px solid blue;
|
||||
}
|
||||
</style>
|
||||
|
||||
<body onload="runTest();">
|
||||
<article id="column">
|
||||
<div id="block1">block1<h3 id="spanner">spanner</h3></div>
|
||||
<div>block2</div>
|
||||
</article>
|
||||
</body>
|
||||
</html>
|
||||
|
|
@ -0,0 +1,31 @@
|
|||
<!DOCTYPE html>
|
||||
<html>
|
||||
<meta charset="utf-8">
|
||||
<title>CSS Multi-column Layout Test Reference: Remove the spanner with block siblings in an inline element</title>
|
||||
<link rel="author" title="Ting-Yu Lin" href="tlin@mozilla.com">
|
||||
<link rel="author" title="Mozilla" href="http://www.mozilla.org/">
|
||||
|
||||
<style>
|
||||
#column {
|
||||
column-count: 3;
|
||||
column-rule: 6px solid;
|
||||
width: 400px;
|
||||
outline: 1px solid black;
|
||||
}
|
||||
h3 {
|
||||
column-span: all;
|
||||
outline: 1px solid blue;
|
||||
}
|
||||
</style>
|
||||
|
||||
<body>
|
||||
<article id="column">
|
||||
<span>
|
||||
inline1
|
||||
<div>block1</div>
|
||||
inline2
|
||||
<div>block2</div>
|
||||
</span>
|
||||
</article>
|
||||
</body>
|
||||
</html>
|
||||
|
|
@ -0,0 +1,45 @@
|
|||
<!DOCTYPE html>
|
||||
<html class="reftest-wait">
|
||||
<meta charset="utf-8">
|
||||
<title>CSS Multi-column Layout Test: Remove the spanner with a block sibling in an inline element</title>
|
||||
<link rel="author" title="Ting-Yu Lin" href="tlin@mozilla.com">
|
||||
<link rel="author" title="Mozilla" href="http://www.mozilla.org/">
|
||||
<link rel="help" href="https://drafts.csswg.org/css-multicol-1/#column-span">
|
||||
<link rel="match" href="multicol-span-all-dynamic-remove-004-ref.html">
|
||||
<meta name="assert" content="This test checks removing a 'column-span' element should be rendered correctly.">
|
||||
|
||||
<script>
|
||||
function runTest() {
|
||||
document.body.offsetHeight;
|
||||
|
||||
document.getElementById("spanner").remove();
|
||||
|
||||
document.documentElement.removeAttribute("class");
|
||||
}
|
||||
</script>
|
||||
|
||||
<style>
|
||||
#column {
|
||||
column-count: 3;
|
||||
column-rule: 6px solid;
|
||||
width: 400px;
|
||||
outline: 1px solid black;
|
||||
}
|
||||
h3 {
|
||||
column-span: all;
|
||||
outline: 1px solid blue;
|
||||
}
|
||||
</style>
|
||||
|
||||
<body onload="runTest();">
|
||||
<article id="column">
|
||||
<span>
|
||||
inline1
|
||||
<h3 id="spanner">spanner</h3>
|
||||
<div>block1</div>
|
||||
inline2
|
||||
<div>block2</div>
|
||||
</span>
|
||||
</article>
|
||||
</body>
|
||||
</html>
|
||||
|
|
@ -0,0 +1,27 @@
|
|||
<!DOCTYPE html>
|
||||
<html>
|
||||
<meta charset="utf-8">
|
||||
<title>CSS Multi-column Layout Test Reference: Remove a block with spanner siblings</title>
|
||||
<link rel="author" title="Ting-Yu Lin" href="tlin@mozilla.com">
|
||||
<link rel="author" title="Mozilla" href="http://www.mozilla.org/">
|
||||
|
||||
<style>
|
||||
#column {
|
||||
column-count: 3;
|
||||
column-rule: 6px solid;
|
||||
width: 400px;
|
||||
outline: 1px solid black;
|
||||
}
|
||||
h3 {
|
||||
column-span: all;
|
||||
outline: 1px solid blue;
|
||||
}
|
||||
</style>
|
||||
|
||||
<body>
|
||||
<article id="column">
|
||||
<h3>spanner1</h3>
|
||||
<h3>spanner2</h3>
|
||||
</article>
|
||||
</body>
|
||||
</html>
|
||||
|
|
@ -0,0 +1,44 @@
|
|||
<!DOCTYPE html>
|
||||
<html class="reftest-wait">
|
||||
<meta charset="utf-8">
|
||||
<title>CSS Multi-column Layout Test: Remove a tall block (spliting across the three columns) with spanner siblings</title>
|
||||
<link rel="author" title="Ting-Yu Lin" href="tlin@mozilla.com">
|
||||
<link rel="author" title="Mozilla" href="http://www.mozilla.org/">
|
||||
<link rel="help" href="https://drafts.csswg.org/css-multicol-1/#column-span">
|
||||
<link rel="match" href="multicol-span-all-dynamic-remove-005-ref.html">
|
||||
<meta name="assert" content="This test checks removing a non-'column-span' element should be rendered correctly.">
|
||||
|
||||
<script>
|
||||
function runTest() {
|
||||
document.body.offsetHeight;
|
||||
|
||||
document.getElementById("block").remove();
|
||||
|
||||
document.documentElement.removeAttribute("class");
|
||||
}
|
||||
</script>
|
||||
|
||||
<style>
|
||||
#column {
|
||||
column-count: 3;
|
||||
column-rule: 6px solid;
|
||||
width: 400px;
|
||||
outline: 1px solid black;
|
||||
}
|
||||
#block {
|
||||
height: 400px;
|
||||
}
|
||||
h3 {
|
||||
column-span: all;
|
||||
outline: 1px solid blue;
|
||||
}
|
||||
</style>
|
||||
|
||||
<body onload="runTest();">
|
||||
<article id="column">
|
||||
<h3>spanner1</h3>
|
||||
<div id="block">block</div>
|
||||
<h3>spanner2</h3>
|
||||
</article>
|
||||
</body>
|
||||
</html>
|
||||
|
|
@ -0,0 +1,44 @@
|
|||
<!DOCTYPE html>
|
||||
<html class="reftest-wait">
|
||||
<meta charset="utf-8">
|
||||
<title>CSS Multi-column Layout Test: Remove the parent of a column-spanner</title>
|
||||
<link rel="author" title="Ting-Yu Lin" href="tlin@mozilla.com">
|
||||
<link rel="author" title="Mozilla" href="http://www.mozilla.org/">
|
||||
<link rel="help" href="https://drafts.csswg.org/css-multicol-1/#column-span">
|
||||
<link rel="match" href="multicol-span-all-dynamic-remove-001-ref.html">
|
||||
<meta name="assert" content="This test checks removing the parent of a column-spanner should be rendered correctly.">
|
||||
|
||||
<script>
|
||||
function runTest() {
|
||||
document.body.offsetHeight;
|
||||
|
||||
document.getElementById("block").remove();
|
||||
|
||||
document.documentElement.removeAttribute("class");
|
||||
}
|
||||
</script>
|
||||
|
||||
<style>
|
||||
#column {
|
||||
column-count: 3;
|
||||
column-rule: 6px solid;
|
||||
width: 400px;
|
||||
outline: 1px solid black;
|
||||
}
|
||||
h3 {
|
||||
column-span: all;
|
||||
outline: 1px solid blue;
|
||||
}
|
||||
</style>
|
||||
|
||||
<body onload="runTest();">
|
||||
<article id="column">
|
||||
<div>block1</div>
|
||||
<div id="block">
|
||||
<h3>inner spanner</h3>
|
||||
<div>inner block</div>
|
||||
</div>
|
||||
<div>block2</div>
|
||||
</article>
|
||||
</body>
|
||||
</html>
|
||||
|
|
@ -0,0 +1,31 @@
|
|||
<!DOCTYPE html>
|
||||
<html>
|
||||
<meta charset="utf-8">
|
||||
<title>CSS Multi-column Layout Test Reference: Restyle column-span's parent that is a block</title>
|
||||
<link rel="author" title="Ting-Yu Lin" href="tlin@mozilla.com">
|
||||
<link rel="author" title="Mozilla" href="http://www.mozilla.org/">
|
||||
|
||||
<style>
|
||||
#column {
|
||||
column-count: 1;
|
||||
width: 400px;
|
||||
outline: 1px solid black;
|
||||
}
|
||||
h3 {
|
||||
column-span: all;
|
||||
}
|
||||
#div {
|
||||
background-color: yellow;
|
||||
}
|
||||
</style>
|
||||
|
||||
<body>
|
||||
<article id="column">
|
||||
<div id="div">
|
||||
<div>yellow block1</div>
|
||||
<h3>spanner (no background-color)</h3>
|
||||
<div>yellow block2</div>
|
||||
</div>
|
||||
</article>
|
||||
</body>
|
||||
</html>
|
||||
|
|
@ -0,0 +1,43 @@
|
|||
<!DOCTYPE html>
|
||||
<html class="reftest-wait">
|
||||
<meta charset="utf-8">
|
||||
<title>CSS Multi-column Layout Test: Restyle column-span's parent that is a block</title>
|
||||
<link rel="author" title="Ting-Yu Lin" href="tlin@mozilla.com">
|
||||
<link rel="author" title="Mozilla" href="http://www.mozilla.org/">
|
||||
<link rel="help" href="https://drafts.csswg.org/css-multicol-1/#column-span">
|
||||
<link rel="help" href="https://github.com/w3c/csswg-drafts/issues/1072">
|
||||
<link rel="match" href="multicol-span-all-restyle-001-ref.html">
|
||||
<meta name="assert" content="This test checks change the style of the spanner's parent should not affect the spanner.">
|
||||
|
||||
<script>
|
||||
function runTest() {
|
||||
document.body.offsetHeight; // flush layout
|
||||
|
||||
var div = document.getElementById("div");
|
||||
div.style.backgroundColor = "yellow";
|
||||
|
||||
document.documentElement.removeAttribute("class");
|
||||
}
|
||||
</script>
|
||||
|
||||
<style>
|
||||
#column {
|
||||
column-count: 1;
|
||||
width: 400px;
|
||||
outline: 1px solid black;
|
||||
}
|
||||
h3 {
|
||||
column-span: all;
|
||||
}
|
||||
</style>
|
||||
|
||||
<body onload="runTest();">
|
||||
<article id="column">
|
||||
<div id="div">
|
||||
<div>yellow block1</div>
|
||||
<h3>spanner (no background-color)</h3>
|
||||
<div>yellow block2</div>
|
||||
</div>
|
||||
</article>
|
||||
</body>
|
||||
</html>
|
||||
|
|
@ -0,0 +1,33 @@
|
|||
<!DOCTYPE html>
|
||||
<html>
|
||||
<meta charset="utf-8">
|
||||
<title>CSS Multi-column Layout Test Reference: Restyle column-span's parent that is an inline</title>
|
||||
<link rel="author" title="Ting-Yu Lin" href="tlin@mozilla.com">
|
||||
<link rel="author" title="Mozilla" href="http://www.mozilla.org/">
|
||||
|
||||
<style>
|
||||
html {
|
||||
overflow: hidden;
|
||||
}
|
||||
#column {
|
||||
column-count: 1;
|
||||
}
|
||||
#span {
|
||||
position: relative;
|
||||
left: 200px;
|
||||
}
|
||||
h3 {
|
||||
column-span: all;
|
||||
}
|
||||
</style>
|
||||
|
||||
<body>
|
||||
<article id="column">
|
||||
<span id="span">
|
||||
All text should be offset 200px, except the spanner
|
||||
<h3>Spanner</h3>
|
||||
<div>Some more text</div>
|
||||
</span>
|
||||
</article>
|
||||
</body>
|
||||
</html>
|
||||
|
|
@ -0,0 +1,49 @@
|
|||
<!DOCTYPE html>
|
||||
<html class="reftest-wait">
|
||||
<meta charset="utf-8">
|
||||
<title>CSS Multi-column Layout Test: Restyle column-span's parent that is an inline</title>
|
||||
<link rel="author" title="Ting-Yu Lin" href="tlin@mozilla.com">
|
||||
<link rel="author" title="Mozilla" href="http://www.mozilla.org/">
|
||||
<link rel="help" href="https://drafts.csswg.org/css-multicol-1/#column-span">
|
||||
<link rel="help" href="https://github.com/w3c/csswg-drafts/issues/1072">
|
||||
<link rel="match" href="multicol-span-all-restyle-002-ref.html">
|
||||
<meta name="assert" content="This test checks change the style of the spanner's parent should not affect the spanner.">
|
||||
|
||||
<script>
|
||||
function runTest() {
|
||||
document.body.offsetHeight; // flush layout
|
||||
|
||||
var span = document.getElementById("span");
|
||||
span.offsetWidth;
|
||||
span.style.left = "200px";
|
||||
|
||||
document.documentElement.removeAttribute("class");
|
||||
}
|
||||
</script>
|
||||
|
||||
<style>
|
||||
html {
|
||||
overflow: hidden;
|
||||
}
|
||||
#column {
|
||||
column-count: 1;
|
||||
}
|
||||
#span {
|
||||
position: relative;
|
||||
left: 100px;
|
||||
}
|
||||
h3 {
|
||||
column-span: all;
|
||||
}
|
||||
</style>
|
||||
|
||||
<body onload="runTest();">
|
||||
<article id="column">
|
||||
<span id="span">
|
||||
All text should be offset 200px, except the spanner
|
||||
<h3>Spanner</h3>
|
||||
<div>Some more text</div>
|
||||
</span>
|
||||
</article>
|
||||
</body>
|
||||
</html>
|
||||
|
|
@ -0,0 +1,32 @@
|
|||
<!DOCTYPE html>
|
||||
<html>
|
||||
<meta charset="utf-8">
|
||||
<title>CSS Multi-column Layout Test Reference: Restyle column-span's multi-column container</title>
|
||||
<link rel="author" title="Ting-Yu Lin" href="tlin@mozilla.com">
|
||||
<link rel="author" title="Mozilla" href="http://www.mozilla.org/">
|
||||
|
||||
<style>
|
||||
#column {
|
||||
column-count: 1;
|
||||
width: 400px;
|
||||
outline: 1px solid black;
|
||||
background-color: yellow;
|
||||
}
|
||||
h3 {
|
||||
column-span: all;
|
||||
}
|
||||
#div {
|
||||
background-color: yellow;
|
||||
}
|
||||
</style>
|
||||
|
||||
<body>
|
||||
<article id="column">
|
||||
<div>
|
||||
<div>block1</div>
|
||||
<h3>spanner</h3>
|
||||
<div>block2</div>
|
||||
</div>
|
||||
</article>
|
||||
</body>
|
||||
</html>
|
||||
|
|
@ -0,0 +1,43 @@
|
|||
<!DOCTYPE html>
|
||||
<html class="reftest-wait">
|
||||
<meta charset="utf-8">
|
||||
<title>CSS Multi-column Layout Test: Restyle column-span's multi-column container</title>
|
||||
<link rel="author" title="Ting-Yu Lin" href="tlin@mozilla.com">
|
||||
<link rel="author" title="Mozilla" href="http://www.mozilla.org/">
|
||||
<link rel="help" href="https://drafts.csswg.org/css-multicol-1/#column-span">
|
||||
<link rel="help" href="https://github.com/w3c/csswg-drafts/issues/1072">
|
||||
<link rel="match" href="multicol-span-all-restyle-003-ref.html">
|
||||
<meta name="assert" content="This test checks change the style of the spanner's multi-column container should not affect the spanner.">
|
||||
|
||||
<script>
|
||||
function runTest() {
|
||||
document.body.offsetHeight; // flush layout
|
||||
|
||||
var column = document.getElementById("column");
|
||||
column.style.backgroundColor = "yellow";
|
||||
|
||||
document.documentElement.removeAttribute("class");
|
||||
}
|
||||
</script>
|
||||
|
||||
<style>
|
||||
#column {
|
||||
column-count: 1;
|
||||
width: 400px;
|
||||
outline: 1px solid black;
|
||||
}
|
||||
h3 {
|
||||
column-span: all;
|
||||
}
|
||||
</style>
|
||||
|
||||
<body onload="runTest();">
|
||||
<article id="column">
|
||||
<div>
|
||||
<div>block1</div>
|
||||
<h3>spanner</h3>
|
||||
<div>block2</div>
|
||||
</div>
|
||||
</article>
|
||||
</body>
|
||||
</html>
|
||||
|
|
@ -0,0 +1,29 @@
|
|||
<!DOCTYPE html>
|
||||
<html>
|
||||
<meta charset="utf-8">
|
||||
<title>CSS Multi-column Layout Test Reference: Restyle the column-span itself</title>
|
||||
<link rel="author" title="Ting-Yu Lin" href="tlin@mozilla.com">
|
||||
<link rel="author" title="Mozilla" href="http://www.mozilla.org/">
|
||||
|
||||
<style>
|
||||
#column {
|
||||
column-count: 1;
|
||||
width: 400px;
|
||||
outline: 1px solid black;
|
||||
}
|
||||
h3 {
|
||||
column-span: all;
|
||||
background-color: yellow;
|
||||
}
|
||||
</style>
|
||||
|
||||
<body>
|
||||
<article id="column">
|
||||
<div>
|
||||
<div>block1</div>
|
||||
<h3>yellow spanner</h3>
|
||||
<div>block2</div>
|
||||
</div>
|
||||
</article>
|
||||
</body>
|
||||
</html>
|
||||
|
|
@ -0,0 +1,43 @@
|
|||
<!DOCTYPE html>
|
||||
<html class="reftest-wait">
|
||||
<meta charset="utf-8">
|
||||
<title>CSS Multi-column Layout Test: Restyle the column-span itself</title>
|
||||
<link rel="author" title="Ting-Yu Lin" href="tlin@mozilla.com">
|
||||
<link rel="author" title="Mozilla" href="http://www.mozilla.org/">
|
||||
<link rel="help" href="https://drafts.csswg.org/css-multicol-1/#column-span">
|
||||
<link rel="help" href="https://github.com/w3c/csswg-drafts/issues/1072">
|
||||
<link rel="match" href="multicol-span-all-restyle-004-ref.html">
|
||||
<meta name="assert" content="This test checks change the style of the spanner itself.">
|
||||
|
||||
<script>
|
||||
function runTest() {
|
||||
document.body.offsetHeight; // flush layout
|
||||
|
||||
var spanner = document.getElementById("spanner");
|
||||
spanner.style.backgroundColor = "yellow";
|
||||
|
||||
document.documentElement.removeAttribute("class");
|
||||
}
|
||||
</script>
|
||||
|
||||
<style>
|
||||
#column {
|
||||
column-count: 1;
|
||||
width: 400px;
|
||||
outline: 1px solid black;
|
||||
}
|
||||
h3 {
|
||||
column-span: all;
|
||||
}
|
||||
</style>
|
||||
|
||||
<body onload="runTest();">
|
||||
<article id="column">
|
||||
<div>
|
||||
<div>block1</div>
|
||||
<h3 id="spanner">yellow spanner</h3>
|
||||
<div>block2</div>
|
||||
</div>
|
||||
</article>
|
||||
</body>
|
||||
</html>
|
||||
|
|
@ -25,14 +25,13 @@ test(function() {
|
|||
CSS.registerProperty({name: '--registered-1-d', syntax: '<length>', initialValue: '4px', inherits: false});
|
||||
|
||||
computedStyle = getComputedStyle(test1);
|
||||
assert_equals(computedStyle.getPropertyValue('--registered-1-a'), '1px');
|
||||
assert_equals(computedStyle.getPropertyValue('--registered-1-b'), '2px');
|
||||
|
||||
assert_equals(computedStyle.getPropertyValue('--registered-1-c'), '2px');
|
||||
assert_equals(computedStyle.getPropertyValue('--registered-1-d'), '2px');
|
||||
assert_equals(computedStyle.getPropertyValue('--unregistered-1-a'), '1px');
|
||||
assert_equals(computedStyle.left, '1px');
|
||||
assert_equals(computedStyle.top, '2px');
|
||||
assert_equals(computedStyle.getPropertyValue('--registered-1-a'), '');
|
||||
assert_equals(computedStyle.getPropertyValue('--registered-1-b'), '');
|
||||
assert_equals(computedStyle.getPropertyValue('--registered-1-c'), '30px');
|
||||
assert_equals(computedStyle.getPropertyValue('--registered-1-d'), '4px');
|
||||
assert_equals(computedStyle.getPropertyValue('--unregistered-1-a'), '');
|
||||
assert_equals(computedStyle.left, '50px');
|
||||
assert_equals(computedStyle.top, '60px');
|
||||
}, "A var() cycle between two registered properties is handled correctly.");
|
||||
</script>
|
||||
|
||||
|
|
@ -63,18 +62,18 @@ test(function() {
|
|||
CSS.registerProperty({name: '--registered-2-e', syntax: '<length>', initialValue: '5px', inherits: false});
|
||||
|
||||
computedStyle = getComputedStyle(test2);
|
||||
assert_equals(computedStyle.getPropertyValue('--registered-2-a'), '1px');
|
||||
assert_equals(computedStyle.getPropertyValue('--registered-2-a'), '');
|
||||
assert_equals(computedStyle.getPropertyValue('--unregistered-2-a'), '');
|
||||
|
||||
assert_equals(computedStyle.getPropertyValue('--registered-2-b'), '1px');
|
||||
assert_equals(computedStyle.getPropertyValue('--registered-2-c'), '1px');
|
||||
assert_equals(computedStyle.getPropertyValue('--registered-2-b'), '30px');
|
||||
assert_equals(computedStyle.getPropertyValue('--registered-2-c'), '3px');
|
||||
assert_equals(computedStyle.getPropertyValue('--registered-2-d'), '40px');
|
||||
assert_equals(computedStyle.getPropertyValue('--registered-2-e'), '5px');
|
||||
assert_equals(computedStyle.getPropertyValue('--unregistered-2-b'), '1px');
|
||||
assert_equals(computedStyle.getPropertyValue('--unregistered-2-c'), '1px');
|
||||
assert_equals(computedStyle.getPropertyValue('--unregistered-2-b'), '50px');
|
||||
assert_equals(computedStyle.getPropertyValue('--unregistered-2-c'), '');
|
||||
assert_equals(computedStyle.getPropertyValue('--unregistered-2-d'), '60px');
|
||||
assert_equals(computedStyle.getPropertyValue('--unregistered-2-e'), '');
|
||||
assert_equals(computedStyle.left, '1px');
|
||||
assert_equals(computedStyle.left, '70px');
|
||||
assert_equals(computedStyle.top, '80px');
|
||||
}, "A var() cycle between a registered properties and an unregistered property is handled correctly.");
|
||||
</script>
|
||||
|
|
|
|||
|
|
@ -0,0 +1,104 @@
|
|||
<!DOCTYPE html>
|
||||
<link rel="help" href="https://drafts.csswg.org/css-scroll-snap-1" />
|
||||
<script src="/resources/testharness.js"></script>
|
||||
<script src="/resources/testharnessreport.js"></script>
|
||||
<style>
|
||||
div {
|
||||
position: absolute;
|
||||
}
|
||||
:root {
|
||||
overflow: scroll;
|
||||
scroll-snap-type: both mandatory;
|
||||
}
|
||||
.scroller {
|
||||
overflow: scroll;
|
||||
scroll-snap-type: both mandatory;
|
||||
padding: 0px;
|
||||
}
|
||||
#outer {
|
||||
left: 1000px;
|
||||
top: 1000px;
|
||||
width: 600px;
|
||||
height: 600px;
|
||||
}
|
||||
#out-snap-1 {
|
||||
scroll-snap-align: start;
|
||||
left: 1200px;
|
||||
top: 1200px;
|
||||
width: 10px;
|
||||
height: 10px;
|
||||
}
|
||||
#out-snap-2 {
|
||||
scroll-snap-align: start;
|
||||
left: 1100px;
|
||||
top: 1100px;
|
||||
width: 10px;
|
||||
height: 10px;
|
||||
}
|
||||
#inner {
|
||||
left: 1000px;
|
||||
top: 1000px;
|
||||
width: 400px;
|
||||
height: 400px;
|
||||
}
|
||||
.space {
|
||||
left: 0px;
|
||||
top: 0px;
|
||||
width: 3000px;
|
||||
height: 3000px;
|
||||
}
|
||||
#target {
|
||||
scroll-snap-align: end;
|
||||
left: 800px;
|
||||
top: 800px;
|
||||
width: 200px;
|
||||
height: 200px;
|
||||
}
|
||||
</style>
|
||||
|
||||
<div class="space"></div>
|
||||
<div id="out-snap-1"></div>
|
||||
<div id="out-snap-2"></div>
|
||||
<div class="scroller" id="outer">
|
||||
<div class="space"></div>
|
||||
<div class="scroller" id="inner">
|
||||
<div class="space"></div>
|
||||
<div id="target"></div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<script>
|
||||
var outer = document.getElementById("outer");
|
||||
var inner = document.getElementById("inner");
|
||||
var target = document.getElementById("target");
|
||||
|
||||
test(() => {
|
||||
assert_equals(window.scrollX, 0);
|
||||
assert_equals(window.scrollY, 0);
|
||||
assert_equals(outer.scrollLeft, 0);
|
||||
assert_equals(outer.scrollTop, 0);
|
||||
assert_equals(inner.scrollLeft, 0);
|
||||
assert_equals(inner.scrollTop, 0);
|
||||
|
||||
target.scrollIntoView({inline: "start", block: "start"});
|
||||
// Although the scrollIntoView specified "start" as the alignment, the target
|
||||
// has "end" as its snap-alignment. So the inner scroller finishes with "end"
|
||||
// alignment
|
||||
assert_equals(inner.scrollLeft, 1000 - inner.clientWidth, "ScrollIntoView lands on the target's snap position regardless of the specified alignment.");
|
||||
assert_equals(inner.scrollTop, 1000 - inner.clientHeight, "ScrollIntoView lands on the target's snap position regardless of the specified alignment.");
|
||||
|
||||
// Since there is no snap points defined in the outer scroller, the outer
|
||||
// scroller finishes with "start" alignment, as specified in scrollIntoView.
|
||||
// Note that the "start" alignment aligns the target's top-left corner
|
||||
//(inner.left + inner.clientWidth - target.width, inner.top + inner.clientHeight - target.height)
|
||||
// with the outer scroller's top-left corner.
|
||||
assert_equals(outer.scrollLeft, 800 + inner.clientWidth, "ScrollIntoView ends with the specified alignment if no snap position is specified.");
|
||||
assert_equals(outer.scrollTop, 800 + inner.clientHeight, "ScrollIntoView ends with the specified alignment if no snap position is specified.");
|
||||
|
||||
// Although the scrollIntoView specified "start" as the alignment, the window
|
||||
// has two other elements with snap points. So the window finishes with the
|
||||
// closest snap point.
|
||||
assert_equals(window.scrollX, 1100, "ScrollIntoView lands on the snap position closest to the specified alignment.");
|
||||
assert_equals(window.scrollY, 1100, "ScrollIntoView lands on the snap position closest to the specified alignment.");
|
||||
}, "All the scrollers affected by scrollIntoView should land on a snap position if one exists. Otherwise, land according to the specified alignment");
|
||||
</script>
|
||||
|
|
@ -1,14 +1,14 @@
|
|||
<!DOCTYPE html>
|
||||
<meta charset="utf-8">
|
||||
<title>CSS Text Test: overflow-wrap: break-word and intrinsic sizing</title>
|
||||
<title>CSS Text Test: overflow-wrap: anywhere and intrinsic sizing</title>
|
||||
<link rel="author" title="Florian Rivoal" href="http://florian.rivoal.net/">
|
||||
<link rel="help" href="https://drafts.csswg.org/css-text-3/#overflow-wrap-property">
|
||||
<meta name="flags" content="">
|
||||
<link rel="match" href="reference/overflow-wrap-min-content-size-001-ref.html">
|
||||
<meta name="assert" content="Soft wrap opportunities introduced by overflow-wrap:break-word **are** considered when calculating min-content intrinsic sizes.">
|
||||
<meta name="assert" content="Soft wrap opportunities introduced by overflow-wrap:anywhere **are** considered when calculating min-content intrinsic sizes.">
|
||||
<style>
|
||||
table {
|
||||
overflow-wrap: break-word;
|
||||
overflow-wrap: anywhere;
|
||||
max-width: 0;
|
||||
border: 0;
|
||||
border-collapse: collapse;
|
||||
|
|
|
|||
|
|
@ -1,16 +1,16 @@
|
|||
<!DOCTYPE html>
|
||||
<meta charset="utf-8">
|
||||
<title>CSS Text Test: overflow-wrap: break-word and intrinsic sizing</title>
|
||||
<title>CSS Text Test: overflow-wrap: anywhere and intrinsic sizing</title>
|
||||
<link rel="author" title="Xidorn Quan" href="https://www.upsuper.org/">
|
||||
<link rel="author" title="Mozilla" href="https://www.mozilla.org/">
|
||||
<link rel="help" href="https://drafts.csswg.org/css-text-3/#overflow-wrap-property">
|
||||
<meta name="flags" content="">
|
||||
<link rel="match" href="reference/overflow-wrap-min-content-size-002-ref.html">
|
||||
<meta name="assert" content="overflow-wrap:break-word doesn't break grapheme cluster and min-content intrinsic size should take that into account.">
|
||||
<meta name="assert" content="overflow-wrap:anywhere doesn't break grapheme cluster and min-content intrinsic size should take that into account.">
|
||||
<style>
|
||||
#wrapper {
|
||||
width: 0px;
|
||||
overflow-wrap: break-word;
|
||||
overflow-wrap: anywhere;
|
||||
}
|
||||
#test {
|
||||
float: left;
|
||||
|
|
|
|||
|
|
@ -1,17 +1,17 @@
|
|||
<!DOCTYPE html>
|
||||
<meta charset="utf-8">
|
||||
<title>CSS Text Test: overflow-wrap: break-word and intrinsic sizing</title>
|
||||
<title>CSS Text Test: overflow-wrap: anywhere and intrinsic sizing</title>
|
||||
<link rel="author" title="Xidorn Quan" href="https://www.upsuper.org/">
|
||||
<link rel="author" title="Mozilla" href="https://www.mozilla.org/">
|
||||
<link rel="help" href="https://drafts.csswg.org/css-text-3/#overflow-wrap-property">
|
||||
<meta name="flags" content="ahem">
|
||||
<link rel="match" href="reference/overflow-wrap-min-content-size-003-ref.html">
|
||||
<meta name="assert" content="overflow-wrap:break-word breaks at edge of inline elements.">
|
||||
<meta name="assert" content="overflow-wrap:anywhere breaks at edge of inline elements.">
|
||||
<style>
|
||||
#wrapper {
|
||||
width: 0px;
|
||||
font: 16px / 1 Ahem;
|
||||
overflow-wrap: break-word;
|
||||
overflow-wrap: anywhere;
|
||||
color: green;
|
||||
}
|
||||
#test {
|
||||
|
|
|
|||
|
|
@ -1,6 +1,6 @@
|
|||
<!DOCTYPE html>
|
||||
<meta charset="utf-8">
|
||||
<title>CSS Text level 3 Test: preserved white space at the end of and white-space:pre-wrap does not change based on word-break:break-all</title>
|
||||
<title>CSS Text level 3 Test: preserved white space at the end of the line and white-space:pre-wrap does not change based on word-break:break-all</title>
|
||||
<link rel="author" title="Florian Rivoal" href="http://florian.rivoal.net/">
|
||||
<link rel="help" href="https://drafts.csswg.org/css-text-3/#white-space-phase-2">
|
||||
<link rel="match" href="reference/pre-wrap-001-ref.html">
|
||||
|
|
|
|||
|
|
@ -0,0 +1,16 @@
|
|||
<!DOCTYPE html>
|
||||
<meta charset="utf-8">
|
||||
<title>CSS Test reference</title>
|
||||
<link rel="author" title="Florian Rivoal" href="https://florian.rivoal.net/">
|
||||
<style>
|
||||
div {
|
||||
white-space: pre;
|
||||
font-family: monospace;
|
||||
}
|
||||
</style>
|
||||
|
||||
<p>Test passes if the 4 letters bellow are vertically aligned.
|
||||
<div> P</div>
|
||||
<div> A</div>
|
||||
<div> S</div>
|
||||
<div> S</div>
|
||||
|
|
@ -0,0 +1,16 @@
|
|||
<!DOCTYPE html>
|
||||
<meta charset="utf-8">
|
||||
<title>CSS test reference</title>
|
||||
<link rel="author" title="Florian Rivoal" href="http://florian.rivoal.net/">
|
||||
<style>
|
||||
div {
|
||||
white-space: pre;
|
||||
font-family: monospace;
|
||||
tab-size: 8; /* the initial value, but since we're measuring against it, we might as well be sure */
|
||||
}
|
||||
</style>
|
||||
<p>Test passes if the 4 letters bellow are vertically aligned.
|
||||
<div> P</div>
|
||||
<div> A</div>
|
||||
<div> S</div>
|
||||
<div> S</div>
|
||||
|
|
@ -0,0 +1,25 @@
|
|||
<!DOCTYPE html>
|
||||
<meta charset="utf-8">
|
||||
<title>CSS Text level 3 Test: the nearest tab stop is more than 0.5 ch away</title>
|
||||
<link rel="author" title="Florian Rivoal" href="https://florian.rivoal.net/">
|
||||
<link rel="help" href="https://drafts.csswg.org/css-text-3/#white-space-phase-2">
|
||||
<link rel="help" href="https://drafts.csswg.org/css-text-3/#tab-size-property">
|
||||
<link rel="match" href="reference/tab-stop-threshold-001-ref.html">
|
||||
<meta name="assert" content="A preserved tab pushes to the nearest tap stop as long as we're not closer to it than 0.5ch.">
|
||||
<style>
|
||||
div {
|
||||
white-space: pre;
|
||||
font-family: monospace;
|
||||
tab-size: 8; /* the initial value, but since we're measuring against it, we might as well be sure */
|
||||
}
|
||||
span { display: inline-block; }
|
||||
#s1 { width: 6ch; }
|
||||
#s2 { width: 7ch; }
|
||||
#s3 { width: 7.3ch; }
|
||||
</style>
|
||||
|
||||
<p>Test passes if the 4 letters bellow are vertically aligned.
|
||||
<div><span id=s1></span>	P</div>
|
||||
<div><span id=s2></span>	A</div>
|
||||
<div><span id=s3></span>	S</div>
|
||||
<div> S</div>
|
||||
|
|
@ -0,0 +1,25 @@
|
|||
<!DOCTYPE html>
|
||||
<meta charset="utf-8">
|
||||
<title>CSS Text level 3 Test: the nearest tab stop is less than 0.5 ch away</title>
|
||||
<link rel="author" title="Florian Rivoal" href="http://florian.rivoal.net/">
|
||||
<link rel="help" href="https://drafts.csswg.org/css-text-3/#white-space-phase-2">
|
||||
<link rel="help" href="https://drafts.csswg.org/css-text-3/#tab-size-property">
|
||||
<link rel="match" href="reference/tab-stop-threshold-002-ref.html">
|
||||
<meta name="assert" content="A preserved tab pushes to the tab stop after the nearest one as long as we're closer to the nearest one than 0.5ch.">
|
||||
<style>
|
||||
div {
|
||||
white-space: pre;
|
||||
font-family: monospace;
|
||||
tab-size: 8; /* the initial value, but since we're measuring against it, we might as well be sure */
|
||||
}
|
||||
span { display: inline-block; }
|
||||
#s1 { width: 7.6ch; }
|
||||
#s2 { width: 7.8ch; }
|
||||
#s3 { width: 7.9ch; }
|
||||
</style>
|
||||
|
||||
<p>Test passes if the 4 letters bellow are vertically aligned.
|
||||
<div><span id=s1></span>	P</div>
|
||||
<div><span id=s2></span>	A</div>
|
||||
<div><span id=s3></span>	S</div>
|
||||
<div> S</div>
|
||||
|
|
@ -19,14 +19,17 @@ test_valid_value("rotate", "0deg");
|
|||
test_valid_value("rotate", "100 200 300 400grad");
|
||||
test_valid_value("rotate", "400grad 100 200 300", "100 200 300 400grad");
|
||||
|
||||
test_valid_value("rotate", "x 400grad", "1 0 0 400grad");
|
||||
test_valid_value("rotate", "400grad x", "1 0 0 400grad");
|
||||
test_valid_value("rotate", "x 400grad");
|
||||
test_valid_value("rotate", "400grad x", "x 400grad");
|
||||
test_valid_value("rotate", "1 0 0 400grad", "x 400grad");
|
||||
|
||||
test_valid_value("rotate", "y 400grad", "0 1 0 400grad");
|
||||
test_valid_value("rotate", "400grad y", "0 1 0 400grad");
|
||||
test_valid_value("rotate", "y 400grad");
|
||||
test_valid_value("rotate", "400grad y", "y 400grad");
|
||||
test_valid_value("rotate", "0 1 0 400grad", "y 400grad");
|
||||
|
||||
test_valid_value("rotate", "z 400grad", "0 0 1 400grad");
|
||||
test_valid_value("rotate", "400grad z", "0 0 1 400grad");
|
||||
test_valid_value("rotate", "z 400grad");
|
||||
test_valid_value("rotate", "400grad z", "z 400grad");
|
||||
test_valid_value("rotate", "0 0 1 400grad", "z 400grad");
|
||||
</script>
|
||||
</body>
|
||||
</html>
|
||||
|
|
|
|||
|
|
@ -17,9 +17,12 @@ test_valid_value("translate", "none");
|
|||
test_valid_value("translate", "0px");
|
||||
test_valid_value("translate", "100%");
|
||||
|
||||
test_valid_value("translate", "100px 0px", "100px");
|
||||
test_valid_value("translate", "100px 0%", "100px");
|
||||
test_valid_value("translate", "100px 200%");
|
||||
test_valid_value("translate", "100% 200px");
|
||||
|
||||
test_valid_value("translate", "100px 200px 0px");
|
||||
test_valid_value("translate", "100px 200px 300px");
|
||||
test_valid_value("translate", "100% 200% 300px");
|
||||
|
||||
|
|
|
|||
|
|
@ -31,7 +31,7 @@
|
|||
|
||||
test(function(){
|
||||
target.style = 'translate: calc(30px + 20%) calc(-200px + 100%);';
|
||||
assert_equals(getComputedStyle(target).translate, 'calc(30px + 20%) calc(-200px + 100%)');
|
||||
assert_equals(getComputedStyle(target).translate, 'calc(20% + 30px) calc(100% - 200px)');
|
||||
}, 'translate supports calc');
|
||||
|
||||
test(function(){
|
||||
|
|
|
|||
|
|
@ -0,0 +1,42 @@
|
|||
<!DOCTYPE html>
|
||||
<meta charset="utf-8">
|
||||
<title>backdrop-filter: Basic operation of filter with background color</title>
|
||||
<link rel="author" title="Mason Freed" href="mailto:masonfreed@chromium.org">
|
||||
|
||||
|
||||
|
||||
<div>
|
||||
<p>Expected: A green box and an overlapping blue box, with a purple<br>
|
||||
overlapping region.</p>
|
||||
</div>
|
||||
<div class="colorbox"></div>
|
||||
<div class="box2outside"></div>
|
||||
<div class="box2inside"></div>
|
||||
|
||||
<style>
|
||||
.colorbox {
|
||||
position: absolute;
|
||||
background: green;
|
||||
width: 100px;
|
||||
height: 100px;
|
||||
left: 10px;
|
||||
top: 100px;
|
||||
}
|
||||
.box2outside {
|
||||
background: #000080;
|
||||
position: absolute;
|
||||
width: 100px;
|
||||
height: 100px;
|
||||
left: 60px;
|
||||
top: 150px;
|
||||
}
|
||||
.box2inside {
|
||||
background: #8040ff;
|
||||
position: absolute;
|
||||
width: 50px;
|
||||
height: 50px;
|
||||
left: 60px;
|
||||
top: 150px;
|
||||
}
|
||||
</style>
|
||||
|
||||
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