Auto merge of #29958 - servo:wpt_update_02-07-2023, r=servo-wpt-sync

Sync WPT with upstream (02-07-2023)

Automated downstream sync of changes from upstream as of 02-07-2023
[no-wpt-sync]
r? @servo-wpt-sync
This commit is contained in:
bors-servo 2023-07-02 04:11:45 +02:00 committed by GitHub
commit 4365d9a646
No known key found for this signature in database
GPG key ID: 4AEE18F83AFDEB23
282 changed files with 8988 additions and 1285 deletions

File diff suppressed because it is too large Load diff

View file

@ -1,2 +0,0 @@
[border-image-002.html]
expected: FAIL

View file

@ -1,2 +0,0 @@
[border-image-003.html]
expected: FAIL

View file

@ -1,2 +0,0 @@
[border-image-004.html]
expected: FAIL

View file

@ -0,0 +1,2 @@
[opacity-animation-ending-correctly-001.html]
expected: TIMEOUT

View file

@ -1600,3 +1600,54 @@
[e.style['color'\] = "color-mix(in hwb specified hue, hwb(320deg 30% 40%), hwb(20deg 30% 40%))" should set the property value]
expected: FAIL
[e.style['color'\] = "color-mix(in srgb, 70% red, 50% blue)" should set the property value]
expected: FAIL
[e.style['color'\] = "color-mix(in hsl, red 50%, blue)" should set the property value]
expected: FAIL
[e.style['color'\] = "color-mix(in hsl, red, blue 50%)" should set the property value]
expected: FAIL
[e.style['color'\] = "color-mix(in hsl, 50% hsl(120deg 10% 20%), hsl(30deg 30% 40%))" should set the property value]
expected: FAIL
[e.style['color'\] = "color-mix(in hsl, hsl(120deg 10% 20%), 50% hsl(30deg 30% 40%))" should set the property value]
expected: FAIL
[e.style['color'\] = "color-mix(in hwb, 50% hwb(120deg 10% 20%), hwb(30deg 30% 40%))" should set the property value]
expected: FAIL
[e.style['color'\] = "color-mix(in hwb, hwb(120deg 10% 20%), 50% hwb(30deg 30% 40%))" should set the property value]
expected: FAIL
[e.style['color'\] = "color-mix(in srgb, 50% color(srgb .1 .2 .3), color(srgb .5 .6 .7))" should set the property value]
expected: FAIL
[e.style['color'\] = "color-mix(in srgb, color(srgb .1 .2 .3), 50% color(srgb .5 .6 .7))" should set the property value]
expected: FAIL
[e.style['color'\] = "color-mix(in srgb-linear, 50% color(srgb-linear .1 .2 .3), color(srgb-linear .5 .6 .7))" should set the property value]
expected: FAIL
[e.style['color'\] = "color-mix(in srgb-linear, color(srgb-linear .1 .2 .3), 50% color(srgb-linear .5 .6 .7))" should set the property value]
expected: FAIL
[e.style['color'\] = "color-mix(in xyz, 50% color(xyz .1 .2 .3), color(xyz .5 .6 .7))" should set the property value]
expected: FAIL
[e.style['color'\] = "color-mix(in xyz, color(xyz .1 .2 .3), 50% color(xyz .5 .6 .7))" should set the property value]
expected: FAIL
[e.style['color'\] = "color-mix(in xyz-d50, 50% color(xyz-d50 .1 .2 .3), color(xyz-d50 .5 .6 .7))" should set the property value]
expected: FAIL
[e.style['color'\] = "color-mix(in xyz-d50, color(xyz-d50 .1 .2 .3), 50% color(xyz-d50 .5 .6 .7))" should set the property value]
expected: FAIL
[e.style['color'\] = "color-mix(in xyz-d65, 50% color(xyz-d65 .1 .2 .3), color(xyz-d65 .5 .6 .7))" should set the property value]
expected: FAIL
[e.style['color'\] = "color-mix(in xyz-d65, color(xyz-d65 .1 .2 .3), 50% color(xyz-d65 .5 .6 .7))" should set the property value]
expected: FAIL

View file

@ -43,3 +43,9 @@
[Check that src: url(foo.ttf) format(unknown), url(bar.ttf) tech(broken) is invalid]
expected: FAIL
[Check that src: url(foo.ttf) tech(color-COLRv0) otherfunc(othervalue), url(foo.ttf) is valid]
expected: FAIL
[Check that src: url(foo.ttf) tech(color-COLRv0) otherfunc(othervalue), junk is invalid]
expected: FAIL

View file

@ -100,3 +100,9 @@
[Property background-image value '-webkit-image-set(url('http://web-platform.test/example.png') calc(37dpcm + 0.79532dpcm))']
expected: FAIL
[Property background-image value 'image-set(url('http://web-platform.test/example.png') calc(-1 * 1x))']
expected: FAIL
[Property background-image value '-webkit-image-set(url('http://web-platform.test/example.png') calc(-1 * 1x))']
expected: FAIL

View file

@ -0,0 +1,2 @@
[trailing-other-space-separators-break-spaces-005.html]
expected: FAIL

View file

@ -0,0 +1,21 @@
[idlharness-2.html]
[CSSTransition interface: existence and properties of interface object]
expected: FAIL
[CSSTransition interface object length]
expected: FAIL
[CSSTransition interface object name]
expected: FAIL
[CSSTransition interface: existence and properties of interface prototype object]
expected: FAIL
[CSSTransition interface: existence and properties of interface prototype object's "constructor" property]
expected: FAIL
[CSSTransition interface: existence and properties of interface prototype object's @@unscopables property]
expected: FAIL
[CSSTransition interface: attribute transitionProperty]
expected: FAIL

View file

@ -307,3 +307,9 @@
[Web Animations: property <left> from [0px\] to [calc(infinity * 1px)\] at (1.25) should be [NaNpx\]]
expected: FAIL
[CSS Animations: property <left> from [0px\] to [calc(infinity * 1px)\] at (0) should be [0px\]]
expected: FAIL
[Web Animations: property <left> from [0px\] to [calc(infinity * 1px)\] at (0) should be [0px\]]
expected: FAIL

View file

@ -0,0 +1,3 @@
[cap-invalidation.html]
[CSS Values and Units Test: cap invalidation]
expected: FAIL

View file

@ -52,3 +52,6 @@
['scale(calc(log(0)))' as a computed value should serialize as 'matrix(-infinity, 0, 0, -infinity, 0, 0)'.]
expected: FAIL
['calc(log(0))' as a computed value should serialize as '0'.]
expected: FAIL

View file

@ -0,0 +1,3 @@
[rcap-invalidation.html]
[CSS Values and Units Test: rcap invalidation]
expected: FAIL

View file

@ -67,3 +67,21 @@
['scale(calc(rem(1,0)))' as a computed value should serialize as 'matrix(NaN, 0, 0, NaN, 0, 0)'.]
expected: FAIL
['calc(round(1,0))' as a computed value should serialize as '0'.]
expected: FAIL
['scale(calc(round(1,0)))' as a computed value should serialize as 'matrix(0, 0, 0, 0, 0, 0)'.]
expected: FAIL
['calc(mod(1,0))' as a computed value should serialize as '0'.]
expected: FAIL
['scale(calc(mod(1,0)))' as a computed value should serialize as 'matrix(0, 0, 0, 0, 0, 0)'.]
expected: FAIL
['calc(rem(1,0))' as a computed value should serialize as '0'.]
expected: FAIL
['scale(calc(rem(1,0)))' as a computed value should serialize as 'matrix(0, 0, 0, 0, 0, 0)'.]
expected: FAIL

View file

@ -0,0 +1,12 @@
[getComputedStyle-insets-relpos-inline.html]
[OOF with left fixed right auto in relpos inline container]
expected: FAIL
[OOF with left auto right fixed in relpos inline container]
expected: FAIL
[OOF with left fixed right auto in relpos inline container with mixed directions]
expected: FAIL
[OOF with left auto right fixed in relpos inline container with mixed directions]
expected: FAIL

View file

@ -0,0 +1,3 @@
[is-pseudo-containing-sibling-relationship-in-has.html]
[Initially red]
expected: FAIL

View file

@ -0,0 +1,3 @@
[not-pseudo-containing-sibling-relationship-in-has.html]
[Initially red]
expected: FAIL

View file

@ -149,3 +149,6 @@
[border-image sec-fetch-site - HTTPS downgrade (header not sent)]
expected: FAIL
[background-image sec-fetch-user - Not sent to non-trustworthy same-site destination]
expected: TIMEOUT

View file

@ -0,0 +1,6 @@
[empty-iframe-load-event.html]
[Check execution order from nested timeout]
expected: FAIL
[Check execution order on load handler]
expected: FAIL

View file

@ -10,6 +10,3 @@
[load event does not fire on window.open('about:blank?foo')]
expected: FAIL
[load event does not fire on window.open('about:blank')]
expected: FAIL

View file

@ -4,7 +4,16 @@
expected: NOTRUN
[Navigating an opened window with an iframe via location.href to a javascript: URL must not fire beforeunload on the iframe: undefined completion]
expected: FAIL
expected: NOTRUN
[Navigating an opened window via location.href to a javascript: URL must not fire beforeunload: string completion]
expected: NOTRUN
[Navigating an opened window via location.href to a javascript: URL must not fire beforeunload: undefined completion]
expected: TIMEOUT
[Navigating an iframe via location.href to a javascript: URL must not fire beforeunload: string completion]
expected: NOTRUN
[Navigating an iframe via src="" to a javascript: URL after insertion must not fire beforeunload: string completion]
expected: NOTRUN

View file

@ -0,0 +1,3 @@
[a-click.html]
[aElement.click() before the load event must NOT replace]
expected: FAIL

View file

@ -1,4 +1,5 @@
[cross-origin-objects.html]
expected: TIMEOUT
[Basic sanity-checking (cross-origin)]
expected: FAIL

View file

@ -1,3 +0,0 @@
[creating_browsing_context_test_01.html]
[first argument: absolute url]
expected: FAIL

View file

@ -0,0 +1,3 @@
[2d.text.drawing.style.fontStretch.settings.html]
[Testing value setting of fontStretch in Canvas]
expected: FAIL

View file

@ -1,2 +1,2 @@
[canvas.2d.disconnected.html]
expected: FAIL
expected: TIMEOUT

View file

@ -0,0 +1,3 @@
[2d.text.drawing.style.fontStretch.settings.html]
[Testing value setting of fontStretch in Canvas]
expected: FAIL

View file

@ -0,0 +1,3 @@
[2d.text.drawing.style.fontStretch.settings.worker.html]
[Testing value setting of fontStretch in Canvas]
expected: FAIL

View file

@ -179,8 +179,5 @@
[multipart/form-data: Basic test (formdata event)]
expected: FAIL
[multipart/form-data: 0x00 in name (normal form)]
expected: FAIL
[multipart/form-data: \\r\\n in value (formdata event)]
expected: FAIL

View file

@ -137,9 +137,6 @@
[application/x-www-form-urlencoded: non-ASCII in filename (normal form)]
expected: FAIL
[application/x-www-form-urlencoded: non-ASCII in filename (formdata event)]
expected: FAIL
[application/x-www-form-urlencoded: characters not in encoding in name and value (normal form)]
expected: FAIL

View file

@ -11,3 +11,6 @@
[Check that rel=noopener with target=_parent does a normal load]
expected: FAIL
[Check that rel=noopener with target=_self does a normal load]
expected: FAIL

View file

@ -1,2 +0,0 @@
[async-script.html?reload]
expected: ERROR

View file

@ -0,0 +1,3 @@
[disabled.html]
[':disabled' should match elements that are appended to a disabled fieldset dynamically]
expected: FAIL

View file

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

View file

@ -1,9 +1,10 @@
[promise-job-entry-different-function-realm.html]
expected: TIMEOUT
[Fulfillment handler on fulfilled promise]
expected: FAIL
[Rejection handler on pending-then-rejected promise]
expected: FAIL
expected: TIMEOUT
[Thenable resolution]
expected: FAIL
@ -12,4 +13,4 @@
expected: FAIL
[Fulfillment handler on pending-then-fulfilled promise]
expected: FAIL
expected: TIMEOUT

View file

@ -1,6 +1,7 @@
[promise-rejection-events.html]
expected: TIMEOUT
[delayed handling: delaying handling rejected promise created from createImageBitmap will cause both events to fire]
expected: FAIL
expected: TIMEOUT
[unhandledrejection: from createImageBitmap which is UA triggered]
expected: FAIL

View file

@ -24,3 +24,5 @@
[The table cell width calculation quirk, basic]
expected: FAIL
[The table cell width calculation quirk, the quirk shouldn't apply for generated content]
expected: FAIL

View file

@ -94,10 +94,10 @@
expected: FAIL
[mime-type 16 : text/html;charset=\x0bgbk]
expected: FAIL
expected: TIMEOUT
[mime-type 17 : text/html;charset=\x0cgbk]
expected: TIMEOUT
expected: NOTRUN
[mime-type 18 : text/html;\x0bcharset=gbk]
expected: NOTRUN

View file

@ -1,5 +1,5 @@
[audiocontextoptions.html]
expected: CRASH
expected: TIMEOUT
[X context = new AudioContext({sampleRate: 1}) did not throw an exception.]
expected: FAIL

View file

@ -1,3 +1,6 @@
[Set.html]
[must throw when assigning to a numeric property on an object which implements a indexed property getter but not a setter in strict mode]
expected: FAIL
[must allow setting built-in property on a [LegacyOverrideBuiltIns\] object even if a named property shadows it]
expected: FAIL

View file

@ -1,5 +1,5 @@
[cross-partition.https.tentative.html]
expected: CRASH
expected: TIMEOUT
[BroadcastChannel messages aren't received from a cross-partition iframe]
expected: FAIL

View file

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

View file

@ -0,0 +1,14 @@
[mixed-content.https.any.worker.html]
[constructing an insecure WebSocket in a secure context should throw]
expected: FAIL
[mixed-content.https.any.sharedworker.html]
expected: ERROR
[mixed-content.https.any.serviceworker.html]
expected: ERROR
[mixed-content.https.any.html]
[constructing an insecure WebSocket in a secure context should throw]
expected: FAIL

View file

@ -1,4 +0,0 @@
[localstorage-about-blank-3P-iframe-opens-3P-window.partitioned.tentative.html]
expected: TIMEOUT
[StorageKey: test 3P about:blank window opened from a 3P iframe]
expected: TIMEOUT

View file

@ -1,2 +0,0 @@
[Worker-constructor.html]
expected: ERROR

View file

@ -1,5 +1,4 @@
[003.html]
type: testharness
expected: ERROR
[shared]
expected: FAIL

File diff suppressed because it is too large Load diff

View file

@ -0,0 +1,2 @@
[opacity-animation-ending-correctly-001.html]
expected: TIMEOUT

View file

@ -1600,3 +1600,54 @@
[e.style['color'\] = "color-mix(in hwb specified hue, hwb(320deg 30% 40%), hwb(20deg 30% 40%))" should set the property value]
expected: FAIL
[e.style['color'\] = "color-mix(in srgb, 70% red, 50% blue)" should set the property value]
expected: FAIL
[e.style['color'\] = "color-mix(in hsl, red 50%, blue)" should set the property value]
expected: FAIL
[e.style['color'\] = "color-mix(in hsl, red, blue 50%)" should set the property value]
expected: FAIL
[e.style['color'\] = "color-mix(in hsl, 50% hsl(120deg 10% 20%), hsl(30deg 30% 40%))" should set the property value]
expected: FAIL
[e.style['color'\] = "color-mix(in hsl, hsl(120deg 10% 20%), 50% hsl(30deg 30% 40%))" should set the property value]
expected: FAIL
[e.style['color'\] = "color-mix(in hwb, 50% hwb(120deg 10% 20%), hwb(30deg 30% 40%))" should set the property value]
expected: FAIL
[e.style['color'\] = "color-mix(in hwb, hwb(120deg 10% 20%), 50% hwb(30deg 30% 40%))" should set the property value]
expected: FAIL
[e.style['color'\] = "color-mix(in srgb, 50% color(srgb .1 .2 .3), color(srgb .5 .6 .7))" should set the property value]
expected: FAIL
[e.style['color'\] = "color-mix(in srgb, color(srgb .1 .2 .3), 50% color(srgb .5 .6 .7))" should set the property value]
expected: FAIL
[e.style['color'\] = "color-mix(in srgb-linear, 50% color(srgb-linear .1 .2 .3), color(srgb-linear .5 .6 .7))" should set the property value]
expected: FAIL
[e.style['color'\] = "color-mix(in srgb-linear, color(srgb-linear .1 .2 .3), 50% color(srgb-linear .5 .6 .7))" should set the property value]
expected: FAIL
[e.style['color'\] = "color-mix(in xyz, 50% color(xyz .1 .2 .3), color(xyz .5 .6 .7))" should set the property value]
expected: FAIL
[e.style['color'\] = "color-mix(in xyz, color(xyz .1 .2 .3), 50% color(xyz .5 .6 .7))" should set the property value]
expected: FAIL
[e.style['color'\] = "color-mix(in xyz-d50, 50% color(xyz-d50 .1 .2 .3), color(xyz-d50 .5 .6 .7))" should set the property value]
expected: FAIL
[e.style['color'\] = "color-mix(in xyz-d50, color(xyz-d50 .1 .2 .3), 50% color(xyz-d50 .5 .6 .7))" should set the property value]
expected: FAIL
[e.style['color'\] = "color-mix(in xyz-d65, 50% color(xyz-d65 .1 .2 .3), color(xyz-d65 .5 .6 .7))" should set the property value]
expected: FAIL
[e.style['color'\] = "color-mix(in xyz-d65, color(xyz-d65 .1 .2 .3), 50% color(xyz-d65 .5 .6 .7))" should set the property value]
expected: FAIL

View file

@ -0,0 +1,21 @@
[idlharness-2.html]
[CSSTransition interface: existence and properties of interface object]
expected: FAIL
[CSSTransition interface object length]
expected: FAIL
[CSSTransition interface object name]
expected: FAIL
[CSSTransition interface: existence and properties of interface prototype object]
expected: FAIL
[CSSTransition interface: existence and properties of interface prototype object's "constructor" property]
expected: FAIL
[CSSTransition interface: existence and properties of interface prototype object's @@unscopables property]
expected: FAIL
[CSSTransition interface: attribute transitionProperty]
expected: FAIL

View file

@ -0,0 +1,3 @@
[getComputedStyle-insets-grid.html]
[Position absolute getComputedStyle left (for display: grid)]
expected: FAIL

View file

@ -0,0 +1,3 @@
[stylesheet_media_queries.html]
[Media queries within stylesheets]
expected: FAIL

View file

@ -1,2 +0,0 @@
[dirty_viewport.html]
expected: FAIL

View file

@ -1,2 +0,0 @@
[pseudo_content_with_layers.html]
expected: FAIL

View file

@ -1,2 +0,0 @@
[resize_after_load.html]
expected: FAIL

View file

@ -0,0 +1,3 @@
[task_queue_throttling.any.html]
[Throttling the performance timeline task queue.]
expected: FAIL

View file

@ -0,0 +1,4 @@
spec: https://screen-share.github.io/captured-mouse-events/
suggested_reviewers:
- eladalon1983
- fred-wang

View file

@ -0,0 +1,37 @@
<!DOCTYPE html>
<body>
<script src="/resources/testharness.js"></script>
<script src="/resources/testharnessreport.js"></script>
<script>
// Here's the set-up for this test:
// Step 1 (first window) Open new window to verify that hints were set.
// Step 2 (second window) Alert first window of client hints present.
// Step 3 (first window) Asserts client hints were present.
// Step 4 (first window) Navigate other window to page that clears all data.
// Step 5 (second window) Navigate to a page that can check client hints still sent.
// Step 6 (second window) Alert first window of client hints present.
// Step 7 (first window) Asserts client hints were not present.
async_test(t => {
var new_window;
// Step 3
window.addEventListener("message", t.step_func(e => {
assert_equals(e.data, "HadDeviceMemory");
// Step 7
window.addEventListener("message", t.step_func(e => {
assert_equals(e.data, "MissingDeviceMemory");
new_window.close();
t.done();
}), {once: true});
// Step 4
new_window.location.href = "/client-hints/clear-site-data/resources/clear-site-data.py";
}), {once: true});
// Step 1
new_window = window.open("/client-hints/clear-site-data/resources/check-client-hints.py");
}, "Clear-Site-Data for * should remove all client hints.");
</script>
</body>
</html>

View file

@ -0,0 +1 @@
Accept-CH: Sec-CH-Device-Memory

View file

@ -0,0 +1,37 @@
<!DOCTYPE html>
<body>
<script src="/resources/testharness.js"></script>
<script src="/resources/testharnessreport.js"></script>
<script>
// Here's the set-up for this test:
// Step 1 (first window) Open new window to verify that hints were set.
// Step 2 (second window) Alert first window of client hints present.
// Step 3 (first window) Asserts client hints were present.
// Step 4 (first window) Navigate other window to page that clears cache data.
// Step 5 (second window) Navigate to a page that can check client hints still sent.
// Step 6 (second window) Alert first window of client hints present.
// Step 7 (first window) Asserts client hints were not present.
async_test(t => {
var new_window;
// Step 3
window.addEventListener("message", t.step_func(e => {
assert_equals(e.data, "HadDeviceMemory");
// Step 7
window.addEventListener("message", t.step_func(e => {
assert_equals(e.data, "MissingDeviceMemory");
new_window.close();
t.done();
}), {once: true});
// Step 4
new_window.location.href = "/client-hints/clear-site-data/resources/clear-site-data.py?target=cache";
}), {once: true});
// Step 1
new_window = window.open("/client-hints/clear-site-data/resources/check-client-hints.py");
}, "Clear-Site-Data for cache should remove all client hints.");
</script>
</body>
</html>

View file

@ -0,0 +1 @@
Accept-CH: Sec-CH-Device-Memory

View file

@ -0,0 +1,37 @@
<!DOCTYPE html>
<body>
<script src="/resources/testharness.js"></script>
<script src="/resources/testharnessreport.js"></script>
<script>
// Here's the set-up for this test:
// Step 1 (first window) Open new window to verify that hints were set.
// Step 2 (second window) Alert first window of client hints present.
// Step 3 (first window) Asserts client hints were present.
// Step 4 (first window) Navigate other window to page that clears cookies.
// Step 5 (second window) Navigate to a page that can check client hints still sent.
// Step 6 (second window) Alert first window of client hints present.
// Step 7 (first window) Asserts client hints were not present.
async_test(t => {
var new_window;
// Step 3
window.addEventListener("message", t.step_func(e => {
assert_equals(e.data, "HadDeviceMemory");
// Step 7
window.addEventListener("message", t.step_func(e => {
assert_equals(e.data, "MissingDeviceMemory");
new_window.close();
t.done();
}), {once: true});
// Step 4
new_window.location.href = "/client-hints/clear-site-data/resources/clear-site-data.py?target=cookies";
}), {once: true});
// Step 1
new_window = window.open("/client-hints/clear-site-data/resources/check-client-hints.py");
}, "Clear-Site-Data for cookies should remove all client hints.");
</script>
</body>
</html>

View file

@ -0,0 +1 @@
Accept-CH: Sec-CH-Device-Memory

View file

@ -0,0 +1,37 @@
<!DOCTYPE html>
<body>
<script src="/resources/testharness.js"></script>
<script src="/resources/testharnessreport.js"></script>
<script>
// Here's the set-up for this test:
// Step 1 (first window) Open new window to verify that hints were set.
// Step 2 (second window) Alert first window of client hints present.
// Step 3 (first window) Asserts client hints were present.
// Step 4 (first window) Navigate other window to page that clears storage data.
// Step 5 (second window) Navigate to a page that can check client hints still sent.
// Step 6 (second window) Alert first window of client hints present.
// Step 7 (first window) Asserts client hints were present.
async_test(t => {
var new_window;
// Step 3
window.addEventListener("message", t.step_func(e => {
assert_equals(e.data, "HadDeviceMemory");
// Step 7
window.addEventListener("message", t.step_func(e => {
assert_equals(e.data, "HadDeviceMemory");
new_window.close();
t.done();
}), {once: true});
// Step 4
new_window.location.href = "/client-hints/clear-site-data/resources/clear-site-data.py?target=storage";
}), {once: true});
// Step 1
new_window = window.open("/client-hints/clear-site-data/resources/check-client-hints.py");
}, "Clear-Site-Data for storage should not remove all client hints.");
</script>
</body>
</html>

View file

@ -0,0 +1 @@
Accept-CH: Sec-CH-Device-Memory

View file

@ -0,0 +1,14 @@
"""
Step 2/6 (/client-hints/clear-site-data/clear-site-data-{}.https.html)
"""
def main(request, response):
if b"sec-ch-device-memory" in request.headers:
result = u"HadDeviceMemory"
else:
result = u"MissingDeviceMemory"
content = u'''
<script>
window.opener.postMessage("%s" , "*");
</script>''' % (result)
headers = [(b"Content-Type", b"text/html")]
return 200, headers, content

View file

@ -0,0 +1,12 @@
"""
Step 5 (/client-hints/clear-site-data/clear-site-data-{}.https.html)
"""
def main(request, response):
content = u'''
<script>
window.onload = function() {
window.location.href = "/client-hints/clear-site-data/resources/check-client-hints.py";
};
</script>'''
headers = [(b"Content-Type", b"text/html"), (b"Clear-Site-Data", b'"%s"' % (request.GET.first(b"target", b"*")))]
return 200, headers, content

View file

@ -16,7 +16,7 @@ import {request_options_with_mediation_required,
fedcm_test(async t => {
navigator.credentials.get(request_options_with_mediation_required());
const title = await fedcm_get_title_promise();
const title = await fedcm_get_title_promise(t);
assert_true(title.toLowerCase().includes('sign in'));
}, "FedCM call defaults to 'signin' context.");
@ -28,13 +28,13 @@ fedcm_test(async t => {
fedcm_test(async t => {
navigator.credentials.get(request_options_with_context("manifest.py", "use"));
const title = await fedcm_get_title_promise();
const title = await fedcm_get_title_promise(t);
assert_true(title.toLowerCase().includes('use'));
}, "FedCM with 'use' context.");
fedcm_test(async t => {
navigator.credentials.get(request_options_with_context("manifest.py", "continue"));
const title = await fedcm_get_title_promise();
const title = await fedcm_get_title_promise(t);
assert_true(title.toLowerCase().includes('continue'));
}, "FedCM with 'continue' context.");
</script>

View file

@ -144,7 +144,7 @@ export function fedcm_get_title_promise(t) {
const title = await window.test_driver.get_fedcm_dialog_title();
resolve(title);
} catch (ex) {
t.step_timeout(100, helper);
t.step_timeout(helper, 100);
}
}
return new Promise(helper);

View file

@ -7,4 +7,4 @@
</head><body style="position:absolute; margin:0; bottom:0; height:30px; border:10px solid orange;">
</body></html>
</body></html>

View file

@ -0,0 +1,112 @@
<!DOCTYPE html>
<meta charset="utf-8">
<title>Tests getComputedStyle() resolving anchor() in fragmentation context</title>
<link rel="help" href="https://drafts4.csswg.org/css-anchor-position-1">
<link rel="help" href="https://drafts.csswg.org/cssom/#resolved-value">
<link rel="author" href="mailto:xiaochengh@chromium.org">
<link rel="stylesheet" href="/fonts/ahem.css">
<script src="/resources/testharness.js"></script>
<script src="/resources/testharnessreport.js"></script>
<style>
body {
margin: 0;
}
.cb {
position: relative;
background: lightgray;
}
.anchor {
anchor-name: --a;
background: orange;
}
.target {
position: absolute;
left: anchor(--a left);
right: anchor(--a right);
top: anchor(--a top);
bottom: anchor(--a bottom);
background: lime;
opacity: 0.5;
}
</style>
<!-- anchor is fragmented in second and third columns -->
<div class="multicol" id="test1">
<div class="cb">
<div class="spacer"></div>
<div class="anchor"></div>
<div class="target"></div>
</div>
</div>
<style>
#test1.multicol {
column-count: 3;
column-width: 100px;
column-gap: 10px;
width: 320px;
height: 100px;
}
#test1 .cb {
width: 100px;
height: 300px;
}
#test1 .spacer {
height: 175px;
}
#test1 .anchor {
margin-left: 25px;
width: 50px;
height: 50px;
}
</style>
<script>
test(() => {
const target = test1.querySelector('.target');
const style = getComputedStyle(target);
assert_equals(style.left, '25px');
assert_equals(style.right, '-85px');
assert_equals(style.top, '100px');
assert_equals(style.bottom, '100px');
}, 'getComputedStyle() with fragmented containing block in multicolumn layout');
</script>
<div id="test2" style="font: 20px/1 Ahem; width: 11em">
Lorem
<span class="cb">
ipsum <span class="anchor">dolor</span> sit
<span class="target"></span>
</span>
amet.<br>
Lorem
<span class="cb">
ipsum dolor <span class="anchor">sit</span>
<span class="target"></span>
</span>
amet.<br>
</div>
<script>
test(() => {
const targets = test2.querySelectorAll('.target');
const style1 = getComputedStyle(targets[0]);
assert_equals(style1.top, '20px');
assert_equals(style1.bottom, '0px');
assert_equals(style1.left, '-120px');
assert_equals(style1.right, '80px');
const style2 = getComputedStyle(targets[1]);
assert_equals(style2.top, '20px');
assert_equals(style2.bottom, '0px');
assert_equals(style2.left, '0px');
assert_equals(style2.right, '0px');
}, 'getComputedStyle() with fragmented containing block in inline layout');
</script>

View file

@ -0,0 +1,92 @@
<!DOCTYPE html>
<meta charset="utf-8">
<title>Tests that getComputedStyle() returns used position fallback style</title>
<link rel="help" href="https://drafts4.csswg.org/css-anchor-position-1">
<link rel="help" href="https://drafts.csswg.org/cssom/#resolved-value">
<link rel="author" href="mailto:xiaochengh@chromium.org">
<script src="/resources/testharness.js"></script>
<script src="/resources/testharnessreport.js"></script>
<style>
body {
margin: 0;
}
.cb {
position: relative;
width: 400px;
height: 400px;
background: lightgray;
}
.anchor {
position: absolute;
width: 100px;
height: 100px;
background: orange;
}
.target {
position: absolute;
width: 100px;
height: 100px;
background: lime;
position-fallback: --pf;
}
@position-fallback --pf {
@try {
top: anchor(top);
left: anchor(right);
}
@try {
top: anchor(top);
right: anchor(left);
}
}
#anchor1 {
top: 0;
left: 0;
anchor-name: --a1;
}
#target1 {
anchor-default: --a1;
}
#anchor2 {
top: 200px;
right: 0;
anchor-name: --a2;
}
#target2 {
anchor-default: --a2;
}
</style>
<div class="cb">
<div id="anchor1" class="anchor">anchor1</div>
<div id="anchor2" class="anchor">anchor2</div>
<div id="target1" class="target">target1</div>
<div id="target2" class="target">target2</div>
</div>
<script>
test(() => {
const style1 = getComputedStyle(target1);
assert_equals(style1.top, '0px');
assert_equals(style1.left, '100px');
assert_equals(style1.right, '200px');
}, 'getComputedStyle() should return and absolutize the first @try rule style for target1');
test(() => {
const style2 = getComputedStyle(target2);
assert_equals(style2.top, '200px');
assert_equals(style2.left, '200px');
assert_equals(style2.right, '100px');
}, 'getComputedStyle() should return and absolutize the second @try rule style for target2');
</script>

View file

@ -0,0 +1,55 @@
<!DOCTYPE html>
<title>Tests 'anchor-scroll' with anchor in fixed-positioned scroller</title>
<link rel="help" href="https://drafts.csswg.org/css-anchor-position-1/#scroll">
<link rel="author" href="mailto:xiaochengh@chromium.org">
<script src="/resources/testharness.js"></script>
<script src="/resources/testharnessreport.js"></script>
<script src="support/test-common.js"></script>
<style>
body {
margin: 0;
height: 200vh;
}
#scroller {
position: fixed;
width: 200px;
height: 200px;
overflow-y: scroll;
}
#anchor {
position: absolute;
width: 100px;
height: 100px;
top: 200px;
background: orange;
anchor-name: --a;
}
#target {
position: fixed;
width: 100px;
height: 100px;
bottom: anchor(--a top);
anchor-scroll: --a;
background: lime;
}
</style>
<div id=scroller>
<div id=anchor></div>
</div>
<div id=target></div>
<script>
promise_test(async () => {
await waitUntilNextAnimationFrame();
assert_equals(target.getBoundingClientRect().top, 100);
document.documentElement.scrollTop = 100;
await waitUntilNextAnimationFrame();
assert_equals(target.getBoundingClientRect().top, 100);
}, 'Target should not scroll with viewport when anchor is in fixed-positioned scroller');
</script>

View file

@ -0,0 +1,40 @@
<!DOCTYPE html>
<title>Tests basics of the 'position-fallback' property</title>
<link rel="help" href="https://drafts.csswg.org/css-anchor-position-1/#propdef-position-fallback-bounds">
<link rel="author" href="mailto:xiaochengh@chromium.org">
<script src="/resources/testharness.js"></script>
<script src="/resources/testharnessreport.js"></script>
<script src="/css/support/parsing-testcommon.js"></script>
<script src="/css/support/computed-testcommon.js"></script>
<script src="/css/support/inheritance-testcommon.js"></script>
<script src="/css/support/interpolation-testcommon.js"></script>
<div id="container">
<div id="target"></div>
</div>
<script>
// position-fallback-bounds: normal | <dashed-ident>
test_valid_value('position-fallback-bounds', 'normal');
test_valid_value('position-fallback-bounds', '--foo');
test_invalid_value('position-fallback-bounds', 'foo-bar');
test_invalid_value('position-fallback-bounds', '--foo --bar')
test_invalid_value('position-fallback-bounds', '--foo, --bar')
test_invalid_value('position-fallback-bounds', '100px');
test_invalid_value('position-fallback-bounds', '100%');
// Computed value: as specified
test_computed_value('position-fallback-bounds', 'normal');
test_computed_value('position-fallback-bounds', '--foo');
// Initial: normal
// Inherited: no
assert_not_inherited('position-fallback-bounds', 'normal', '--foo');
// Animation type: discrete
test_no_interpolation({
property: 'position-fallback-bounds',
from: '--foo',
to: 'normal',
});
</script>

Binary file not shown.

After

Width:  |  Height:  |  Size: 588 B

Binary file not shown.

After

Width:  |  Height:  |  Size: 5.9 KiB

View file

@ -103,9 +103,85 @@ test_scope_invalidation(document.currentScript, () => {
assert_not_green(span);
inner_div.classList.remove('b');
assert_green(span);
}, 'Element becoming scope limit');
}, 'Parent element becoming scope limit');
</script>
<template>
<style>
@scope (.a) to (.b) {
span { background-color: green; }
}
</style>
<div class=a>
<div>
<span></span>
</div>
</div>
</template>
<script>
test_scope_invalidation(document.currentScript, () => {
let span = main.querySelector('.a > div > span');
assert_green(span);
span.classList.add('b');
assert_not_green(span);
span.classList.remove('b');
assert_green(span);
}, 'Subject element becoming scope limit');
</script>
<template>
<style>
@scope (.a) to (.b .c) {
span { background-color: green; }
}
</style>
<div class=a>
<div>
<div class=c>
<span></span>
</div>
</div>
</div>
</template>
<script>
test_scope_invalidation(document.currentScript, () => {
let intermediate_div = main.querySelector('.a > div');
let span = main.querySelector('span');
assert_green(span);
intermediate_div.classList.add('b');
assert_not_green(span);
intermediate_div.classList.remove('b');
assert_green(span);
}, 'Parent element affecting scope limit');
</script>
<template>
<style>
@scope (.a) to (.b ~ .c) {
span { background-color: green; }
}
</style>
<div class=a>
<div></div>
<div></div>
<div></div>
<div></div>
<div class=c>
<span></span>
</div>
</div>
</template>
<script>
test_scope_invalidation(document.currentScript, () => {
let sibling_div = main.querySelector('.a > div');
let span = main.querySelector('span');
assert_green(span);
sibling_div.classList.add('b');
assert_not_green(span);
sibling_div.classList.remove('b');
assert_green(span);
}, 'Sibling element affecting scope limit');
</script>
<template>
<style>

View file

@ -17,14 +17,19 @@
<script>
// https://github.com/w3c/csswg-drafts/issues/7302: Specified values shouldn't resolve keyword colors or calc values
test_valid_value(`color`, `color-mix(in srgb, red, blue)`, `color-mix(in srgb, red, blue)`);
test_valid_value(`color`, `color-mix(in srgb, 70% red, 50% blue)`, `color-mix(in srgb, red 70%, blue)`);
test_valid_value(`color`, `color-mix(in hsl, red, blue)`, `color-mix(in hsl, red, blue)`);
test_valid_value(`color`, `color-mix(in hsl, red calc(20%), blue)`, `color-mix(in hsl, red calc(20%), blue)`);
test_valid_value(`color`, `color-mix(in hsl, red calc(var(--v)*1%), blue)`, `color-mix(in hsl, red calc(var(--v)*1%), blue)`);
test_valid_value(`color`, `color-mix(in hsl, currentcolor, blue)`, `color-mix(in hsl, currentcolor, blue)`);
test_valid_value(`color`, `color-mix(in hsl, red 60%, blue 40%)`, `color-mix(in hsl, red 60%, blue)`);
test_valid_value(`color`, `color-mix(in hsl, red 50%, blue)`, `color-mix(in hsl, red, blue)`);
test_valid_value(`color`, `color-mix(in hsl, red, blue 50%)`, `color-mix(in hsl, red, blue)`);
test_valid_value(`color`, `color-mix(in lch decreasing hue, red, hsl(120, 100%, 50%))`, `color-mix(in lch decreasing hue, red, rgb(0, 255, 0))`);
test_valid_value(`color`, `color-mix(in hsl, hsl(120deg 10% 20%), hsl(30deg 30% 40%))`, `color-mix(in hsl, rgb(46, 56, 46), rgb(133, 102, 71))`);
test_valid_value(`color`, `color-mix(in hsl, 50% hsl(120deg 10% 20%), hsl(30deg 30% 40%))`, `color-mix(in hsl, rgb(46, 56, 46), rgb(133, 102, 71))`);
test_valid_value(`color`, `color-mix(in hsl, hsl(120deg 10% 20%), 50% hsl(30deg 30% 40%))`, `color-mix(in hsl, rgb(46, 56, 46), rgb(133, 102, 71))`);
test_valid_value(`color`, `color-mix(in hsl, hsl(120deg 10% 20%) 25%, hsl(30deg 30% 40%))`, `color-mix(in hsl, rgb(46, 56, 46) 25%, rgb(133, 102, 71))`);
test_valid_value(`color`, `color-mix(in hsl, 25% hsl(120deg 10% 20%), hsl(30deg 30% 40%))`, `color-mix(in hsl, rgb(46, 56, 46) 25%, rgb(133, 102, 71))`);
test_valid_value(`color`, `color-mix(in hsl, hsl(120deg 10% 20%), 25% hsl(30deg 30% 40%))`, `color-mix(in hsl, rgb(46, 56, 46) 75%, rgb(133, 102, 71))`);
@ -103,6 +108,8 @@
test_valid_value(`color`, `color-mix(in hsl, oklch(0 0.399 336.3) 100%, rgb(0, 0, 0) 0%)`, `color-mix(in hsl, oklch(0 0.399 336.3) 100%, rgb(0, 0, 0))`);
test_valid_value(`color`, `color-mix(in hwb, hwb(120deg 10% 20%), hwb(30deg 30% 40%))`, `color-mix(in hwb, rgb(26, 204, 26), rgb(153, 115, 77))`);
test_valid_value(`color`, `color-mix(in hwb, 50% hwb(120deg 10% 20%), hwb(30deg 30% 40%))`, `color-mix(in hwb, rgb(26, 204, 26), rgb(153, 115, 77))`);
test_valid_value(`color`, `color-mix(in hwb, hwb(120deg 10% 20%), 50% hwb(30deg 30% 40%))`, `color-mix(in hwb, rgb(26, 204, 26), rgb(153, 115, 77))`);
test_valid_value(`color`, `color-mix(in hwb, hwb(120deg 10% 20%) 25%, hwb(30deg 30% 40%))`, `color-mix(in hwb, rgb(26, 204, 26) 25%, rgb(153, 115, 77))`);
test_valid_value(`color`, `color-mix(in hwb, 25% hwb(120deg 10% 20%), hwb(30deg 30% 40%))`, `color-mix(in hwb, rgb(26, 204, 26) 25%, rgb(153, 115, 77))`);
test_valid_value(`color`, `color-mix(in hwb, hwb(120deg 10% 20%), 25% hwb(30deg 30% 40%))`, `color-mix(in hwb, rgb(26, 204, 26) 75%, rgb(153, 115, 77))`);
@ -377,6 +384,8 @@
const resultColorSpace = colorSpace == "xyz" ? "xyz-d65" : colorSpace;
test_valid_value(`color`, `color-mix(in ${colorSpace}, color(${colorSpace} .1 .2 .3), color(${colorSpace} .5 .6 .7))`, `color-mix(in ${resultColorSpace}, color(${resultColorSpace} 0.1 0.2 0.3), color(${resultColorSpace} 0.5 0.6 0.7))`);
test_valid_value(`color`, `color-mix(in ${colorSpace}, 50% color(${colorSpace} .1 .2 .3), color(${colorSpace} .5 .6 .7))`, `color-mix(in ${resultColorSpace}, color(${resultColorSpace} 0.1 0.2 0.3), color(${resultColorSpace} 0.5 0.6 0.7))`);
test_valid_value(`color`, `color-mix(in ${colorSpace}, color(${colorSpace} .1 .2 .3), 50% color(${colorSpace} .5 .6 .7))`, `color-mix(in ${resultColorSpace}, color(${resultColorSpace} 0.1 0.2 0.3), color(${resultColorSpace} 0.5 0.6 0.7))`);
test_valid_value(`color`, `color-mix(in ${colorSpace}, color(${colorSpace} .1 .2 .3) 25%, color(${colorSpace} .5 .6 .7))`, `color-mix(in ${resultColorSpace}, color(${resultColorSpace} 0.1 0.2 0.3) 25%, color(${resultColorSpace} 0.5 0.6 0.7))`);
test_valid_value(`color`, `color-mix(in ${colorSpace}, color(${colorSpace} .1 .2 .3), color(${colorSpace} .5 .6 .7) 25%)`, `color-mix(in ${resultColorSpace}, color(${resultColorSpace} 0.1 0.2 0.3) 75%, color(${resultColorSpace} 0.5 0.6 0.7))`);
test_valid_value(`color`, `color-mix(in ${colorSpace}, color(${colorSpace} .1 .2 .3) 25%, color(${colorSpace} .5 .6 .7) 75%)`, `color-mix(in ${resultColorSpace}, color(${resultColorSpace} 0.1 0.2 0.3) 25%, color(${resultColorSpace} 0.5 0.6 0.7))`);

View file

@ -155,6 +155,30 @@ test_template(document.currentScript.previousElementSibling, (t) => {
}, 'ch units respond to changes');
</script>
<template>
<style>
@import url("/fonts/ahem.css");
main { font-family: 'Ahem'; font-size: 10px; }
main.larger { font-size: 20px; }
@container (width <= 7cap) {
#test { color: green }
}
</style>
<div id="container">
<div>
<div id="test"></div>
</div>
</div>
</template>
<script>
test_template(document.currentScript.previousElementSibling, (t) => {
t.add_cleanup(() => main.classList.remove("larger"));
assert_equals(getComputedStyle(main.querySelector("#test")).color, red);
main.classList.add("larger");
assert_equals(getComputedStyle(main.querySelector("#test")).color, green);
}, 'cap units respond to changes');
</script>
<template>
<style>
:root { font-size: 10px; }
@ -278,3 +302,27 @@ test_template(document.currentScript.previousElementSibling, (t) => {
assert_equals(getComputedStyle(main.querySelector("#test")).color, green);
}, 'ric units respond to changes');
</script>
<template>
<style>
@import url("/fonts/ahem.css");
:root { font-family: 'Ahem'; font-size: 10px; }
:root.larger { font-size: 20px; }
@container (width <= 7rcap) {
#test { color: green }
}
</style>
<div id="container">
<div style="font-family: monospace;">
<div id="test"></div>
</div>
</div>
</template>
<script>
test_template(document.currentScript.previousElementSibling, (t) => {
t.add_cleanup(() => document.documentElement.classList.remove("larger"));
assert_equals(getComputedStyle(main.querySelector("#test")).color, red);
document.documentElement.classList.add("larger");
assert_equals(getComputedStyle(main.querySelector("#test")).color, green);
}, 'rcap units respond to changes');
</script>

View file

@ -5,7 +5,8 @@
<script src="/resources/testharnessreport.js"></script>
<script src="support/cq-testcommon.js"></script>
<style>
:root { font-size: 10px; line-height: 10px; }
@import url("/fonts/ahem.css");
:root { font-family: 'Ahem'; font-size: 10px; line-height: 10px; }
#em_container {
container-type: inline-size;
width: 100px;
@ -17,6 +18,11 @@
width: 10ex;
height: 50rex;
}
#cap_container {
container-type: inline-size;
font-size: 50px;
width: 10cap;
}
#ch_container {
container-type: inline-size;
font-size: 50px;
@ -38,10 +44,16 @@
@container (width: 10rem) {
#rem_test { color: green }
}
@container (width: 10cap) {
#cap_test { color: green }
}
@container (width: 50rcap) {
#rcap_test { color: green }
}
@container (width: 10ex) {
#ex_test { color: green }
}
@container (49rex <= width <= 100rex) {
@container (width: 50rex) {
#rex_test { color: green }
}
@container (width: 10ch) {
@ -67,6 +79,10 @@
<div id="em_test"></div>
<div id="rem_test"></div>
</div>
<div id="cap_container">
<div id="cap_test"></div>
<div id="rcap_test"></div>
</div>
<div id="ex_container">
<div id="ex_test"></div>
<div id="rex_test"></div>
@ -97,4 +113,6 @@
test(() => assert_equals(getComputedStyle(ric_test).color, green), "ric relative inline-size");
test(() => assert_equals(getComputedStyle(lh_test).color, green), "lh relative inline-size");
test(() => assert_equals(getComputedStyle(rlh_test).color, green), "rlh relative inline-size");
test(() => assert_equals(getComputedStyle(cap_test).color, green), "cap relative inline-size");
test(() => assert_equals(getComputedStyle(rcap_test).color, green), "rcap relative inline-size");
</script>

View file

@ -0,0 +1,43 @@
<!doctype html>
<title>Containers and inheritance</title>
<link rel="help" href="https://drafts.csswg.org/css-contain-3/#container-queries">
<script src="/resources/testharness.js"></script>
<script src="/resources/testharnessreport.js"></script>
<script src="support/cq-testcommon.js"></script>
<style>
#outer {
visibility: hidden;
}
#outer.visible {
visibility: visible;
}
#container {
container-type: inline-size;
}
#container.visible {
visibility: visible;
}
</style>
<div id=outer><div id=container><span id=inner>PASS</span></div></div>
<script>
setup(() => assert_implements_container_queries());
test((t) => {
assert_equals(getComputedStyle(inner).visibility, "hidden");
}, "Initial state");
test((t) => {
outer.classList.add("visible");
assert_equals(getComputedStyle(inner).visibility, "visible");
}, "Test that visibility inherits via container after mutation");
test((t) => {
outer.classList.remove("visible");
assert_equals(getComputedStyle(inner).visibility, "hidden");
}, "Return to initial state");
test((t) => {
container.classList.add("visible");
assert_equals(getComputedStyle(inner).visibility, "visible");
}, "Test that visibility inherits from container after mutation");
</script>

View file

@ -13,12 +13,15 @@ href="https://drafts.csswg.org/css-easing/#cubic-bezier-timing-functions">
<script>
'use strict';
// Precision of major rendering engines' layout systems.
const epsilon = 0.02;
function assert_style_left_at(animation, time, easingFunction) {
animation.currentTime = time;
var portion = time / animation.effect.getTiming()['duration'];
assert_approx_equals(pxToNum(getComputedStyle(animation.effect.target).left),
easingFunction(portion) * 100,
0.01,
epsilon,
'The left of the animation should be approximately ' +
easingFunction(portion) * 100 + ' at ' + time + 'ms');
}

View file

@ -27,7 +27,6 @@
background: cyan;
width: 40px;
height: 40px;
writing-mode: horizontal-tb;
}
#target > :nth-child(4) {
background: lime;

View file

@ -5,14 +5,14 @@
display: flex;
position: relative;
}
.target > div, td {
.target > div, .target td {
background: hotpink;
font-size: 20px;
line-height: 0;
}
table { border-spacing: 0; }
td { padding: 5px; min-width: 5px; min-height: 5px; }
caption {
.target table { border-spacing: 0; }
.target td { padding: 5px; min-width: 5px; min-height: 5px; }
.target caption {
margin: 10px;
background: lime;
block-size: 20px;

View file

@ -6,14 +6,14 @@
position: relative;
writing-mode: vertical-rl;
}
.target > div, td {
.target > div, .target td {
background: hotpink;
font-size: 20px;
line-height: 0;
}
table { border-spacing: 0; }
td { padding: 5px; min-width: 5px; min-height: 5px; }
caption {
.target table { border-spacing: 0; }
.target td { padding: 5px; min-width: 5px; min-height: 5px; }
.target caption {
margin: 10px;
background: lime;
block-size: 20px;

View file

@ -6,14 +6,14 @@
position: relative;
writing-mode: vertical-lr;
}
.target > div, td {
.target > div, .target td {
background: hotpink;
font-size: 20px;
line-height: 0;
}
table { border-spacing: 0; }
td { padding: 5px; min-width: 5px; min-height: 5px; }
caption {
.target table { border-spacing: 0; }
.target td { padding: 5px; min-width: 5px; min-height: 5px; }
.target caption {
margin: 10px;
background: lime;
block-size: 20px;

View file

@ -36,7 +36,7 @@ function runTestOnFormatSpecifiers(formats, expectFail) {
if (!expectFail) {
return fontFace.load();
} else {
return promise_rejects_dom(testDetails, "NetworkError", fontFace.load());
return promise_rejects_dom(testDetails, "SyntaxError", fontFace.load());
}
}, (expectFail ? "Do not load" : "Load") + " Ahem with format " + formats[i], {
"format": formats[i]

View file

@ -19,6 +19,7 @@
{ src: 'url(not a valid url/bar.ttf), url(foo.ttf)', valid: true },
{ src: 'url(foo.ttf) format(bad), url(foo.ttf)', valid: true },
{ src: 'url(foo.ttf) tech(unknown), url(foo.ttf)', valid: true },
{ src: 'url(foo.ttf) tech(color-COLRv0) otherfunc(othervalue), url(foo.ttf)', valid: true },
{ src: 'url(foo.ttf), url(something.ttf) format(broken)', valid: true },
{ src: '/* an empty component */, url(foo.ttf)', valid: true },
{ src: 'local(""), url(foo.ttf), unparseable-garbage, local("another font name")', valid: true },
@ -27,6 +28,7 @@
{ src: 'local("textfont") format(opentype), local("emoji") tech(color-COLRv0)', valid: false },
{ src: 'local(), /*empty*/, url(should be quoted.ttf), junk', valid: false },
{ src: 'url(foo.ttf) format(unknown), url(bar.ttf) tech(broken)', valid: false },
{ src: 'url(foo.ttf) tech(color-COLRv0) otherfunc(othervalue), junk', valid: false },
];
for (let t of tests) {

View file

@ -26,8 +26,8 @@ function testValidGridTemplate(valueGridTemplate, valueGridAreas, serializedGrid
}, `grid-template: ${valueGridTemplate} and "grid-template-areas: ${valueGridAreas};" should be valid.`);
}
testValidGridTemplate("none / 1px", "\"a\"");
testValidGridTemplate("none / none", "\"a\"", "none");
testValidGridTemplate("none / 1px", "\"a\"", "");
testValidGridTemplate("none / none", "\"a\"", "");
testValidGridTemplate("auto / 1px", "\"a a a\"", "\"a a a\" / 1px");
testValidGridTemplate("auto / auto", "\"a a a\"", "\"a a a\" / auto");
testValidGridTemplate("10px 20px 30px / 40px 50px 60px 70px",
@ -35,4 +35,4 @@ testValidGridTemplate("10px 20px 30px / 40px 50px 60px 70px",
"\"a . b .\" 10px \"c d . e\" 20px \"f g h .\" 30px / 40px 50px 60px 70px");
</script>
</body>
</html>
</html>

View file

@ -0,0 +1,121 @@
<!DOCTYPE HTML>
<html>
<link rel="author" title="Kurt Catti-Schmidt" href="mailto:kschmi@microsoft.com">
<link rel="help" href="https://drafts.csswg.org/css-grid-2/#resolved-track-list">
<head>
<style>
html,body {
color:black; background-color:white; font:10px/1 monospace; padding:0; margin:0;
}
.wrapper {
display: inline-block;
width: 100px;
border: 1px solid;
}
.grid {
display: grid;
grid-auto-rows: 8px;
background: grey;
}
.fill-0a { grid-template-columns: subgrid repeat(auto-fill, [y]) [z] }
.fill-0b { grid-template-columns: subgrid [x] repeat(auto-fill, [y]) [z] }
.fill-0c { grid-template-columns: subgrid [x] [y] repeat(auto-fill, [z]) }
.fill-0d { grid-template-columns: subgrid repeat(auto-fill, [x]) }
.fill-0e { grid-template-columns: subgrid [x] }
.grid > :nth-child(2n) { background: black; }
.grid > :nth-child(2n+1) { background: pink; }
</style>
</head>
<body>
<div class="wrapper"><div class="grid fill-0a">
<div style="grid-column:y 5"></div>
<div style="grid-column:y 4"></div>
<div style="grid-column:y 3"></div>
<div style="grid-column:y 2"></div>
<div style="grid-column:y 1"></div>
<div style="grid-column:y -1"></div>
<div style="grid-column:y -2"></div>
<div style="grid-column:y -3"></div>
<div style="grid-column:y -4"></div>
<div style="grid-column:y -5"></div>
</div></div>
<div class="wrapper"><div class="grid fill-0b">
<div style="grid-column:y 5"></div>
<div style="grid-column:y 4"></div>
<div style="grid-column:y 3"></div>
<div style="grid-column:y 2"></div>
<div style="grid-column:y 1"></div>
<div style="grid-column:y -1"></div>
<div style="grid-column:y -2"></div>
<div style="grid-column:y -3"></div>
<div style="grid-column:y -4"></div>
<div style="grid-column:y -5"></div>
</div></div>
<div class="wrapper"><div class="grid fill-0c">
<div style="grid-column:y 5"></div>
<div style="grid-column:y 4"></div>
<div style="grid-column:y 3"></div>
<div style="grid-column:y 2"></div>
<div style="grid-column:y 1"></div>
<div style="grid-column:y -1"></div>
<div style="grid-column:y -2"></div>
<div style="grid-column:y -3"></div>
<div style="grid-column:y -4"></div>
<div style="grid-column:y -5"></div>
</div></div>
<div class="wrapper"><div class="grid fill-0d">
<div style="grid-column:y 5"></div>
<div style="grid-column:y 4"></div>
<div style="grid-column:y 3"></div>
<div style="grid-column:y 2"></div>
<div style="grid-column:y 1"></div>
<div style="grid-column:y -1"></div>
<div style="grid-column:y -2"></div>
<div style="grid-column:y -3"></div>
<div style="grid-column:y -4"></div>
<div style="grid-column:y -5"></div>
</div></div>
<div class="wrapper"><div class="grid fill-0e">
<div style="grid-column:y 5"></div>
<div style="grid-column:y 4"></div>
<div style="grid-column:y 3"></div>
<div style="grid-column:y 2"></div>
<div style="grid-column:y 1"></div>
<div style="grid-column:y -1"></div>
<div style="grid-column:y -2"></div>
<div style="grid-column:y -3"></div>
<div style="grid-column:y -4"></div>
<div style="grid-column:y -5"></div>
</div></div>
<script>
const expectedResults = [
"none",
"none",
"none",
"none",
"none",
];
[...document.querySelectorAll('.grid')].forEach(function(grid, i) {
let actual = window.getComputedStyle(grid)['grid-template-columns'];
let expected = expectedResults[i];
if (actual != expected) {
let err = "Unexpected getComputedStyle value for grid " + i + " with className '" + grid.className + "':" +
" Actual: \"" + actual + "\", Expected: \"" + expected + "\"";
document.body.appendChild(document.createTextNode(err));
document.body.appendChild(document.createElement("br"));
}
});
</script>
</body>

View file

@ -38,7 +38,16 @@ function test_calculated_resolution_units() {
test_computed_value_variants(
'background-image',
"image-set(url('http://{{host}}/example.png') calc(37dpcm + 0.79532dpcm))",
'image-set(url("http://{{host}}/example.png") 1dppx)'
[
'image-set(url("http://{{host}}/example.png") 1dppx)',
'image-set(url("http://{{host}}/example.png") 1.000001dppx)'
]
);
test_computed_value_variants(
'background-image',
"image-set(url('http://{{host}}/example.png') calc(-1 * 1x))",
'image-set(url("http://{{host}}/example.png") 0dppx)'
);
}

View file

@ -0,0 +1,43 @@
<!DOCTYPE html>
<link rel="help" href="https://crbug.com/1457423">
<script src="/resources/testharness.js"></script>
<script src="/resources/testharnessreport.js"></script>
<style>body { margin: 0; }</style>
<div style="
column-count: 2;
column-gap: 14px;
writing-mode: vertical-rl;
inline-size: 200px;
block-size: 100px;
padding: 10px;">
<div style="block-size: 20px;"></div>
<div style="column-span: all; block-size: 20px;"></div>
<div id="child1" style="block-size: 70px; break-inside: avoid;"></div>
<div id="child2" style="block-size: 70px; break-inside: avoid;"></div>
</div>
<script>
const t = async_test('Hit-testing in vertical-rl writing-mode');
t.step(() => {
assert_equals(document.elementFromPoint(15, 20), child1);
assert_equals(document.elementFromPoint(15, 130), child2);
const PADDING = 10;
const e1 = new MouseEvent('click', {clientX:15, clientY:20, bubbles:true, cancelable:true});
document.onclick = t.step_func(e => {
assert_equals(e.target, child1);
assert_equals(e.offsetX, e.clientX - PADDING);
assert_equals(e.offsetY, e.clientY - PADDING);
});
child1.dispatchEvent(e1);
const e2 = new MouseEvent('click', {clientX:15, clientY:130, bubbles:true, cancelable:true});
document.onclick = t.step_func_done(e => {
const COLUMN_GAP = 14;
const COLUMN_INLINE_SIZE = (200 - COLUMN_GAP) / 2;
assert_equals(e.target, child2);
assert_equals(e.offsetX, e.clientX - PADDING);
assert_equals(e.offsetY, e.clientY - PADDING - COLUMN_INLINE_SIZE - COLUMN_GAP);
});
child2.dispatchEvent(e2);
});
</script>

View file

@ -125,22 +125,19 @@
}`, 'color is changed, new rule is ignored');
});
// We cannot insert anything starting with an tag, as that would cause
// the serialized rule not to parse back. Compounds starting with a tag
// that are _not_ the first compound in a complex selector are OK, though,
// as are complex selectors that are not the first in the list.
test(() => {
document.getElementById('ss').innerHTML = sampleSheetText;
let [ss] = document.styleSheets;
ss.cssRules[0].cssRules[0].selectorText = 'div.b .c &'; // Ignored.
ss.cssRules[0].cssRules[0].selectorText = 'div.b .c &'; // Allowed
ss.cssRules[0].cssRules[1].selectorText = '.c div.b &, div &'; // Allowed.
assert_throws_dom('SyntaxError', () => { ss.cssRules[0].insertRule('div & {}'); });
ss.cssRules[0].insertRule('div & {}'); // Allowed.
assert_equals(ss.cssRules[0].cssText,
`.a {
color: red;
& .b { color: green; }
div & { }
div.b .c & { color: green; }
.c div.b &, div & { color: blue; }
}`, 'one rule is kept unchanged, the other is changed');
}`, 'selectorText and insertRule');
});
// Rules that are dropped in forgiving parsing but that contain &,

View file

@ -28,7 +28,7 @@ div {
let [ss] = document.styleSheets;
assert_equals(ss.cssRules.length, 1);
// The @layer rule should be ignored.
// The @font-face rule should be ignored.
assert_equals(ss.cssRules[0].cssText,
`div {
@media screen {

View file

@ -75,7 +75,6 @@ assert_valid("<time>", "2s");
assert_valid("<time>", "calc(2s - 9ms)");
assert_valid("<resolution>", "10dpi");
assert_valid("<resolution>", "3dPpX");
assert_valid("<resolution>", "-5.3dpcm");
assert_valid("<transform-function>", "translateX(2px)");
assert_valid("<transform-function>|<integer>", "5");
assert_valid("<transform-function>|<integer>", "scale(2)");
@ -247,6 +246,11 @@ assert_invalid("<angle>", "0");
assert_invalid("<angle>", "10%");
assert_invalid("<time>", "2px");
assert_invalid("<resolution>", "10");
// "The allowed range of <resolution> values always excludes negative values"
// https://www.w3.org/TR/css-values-4/#resolution-value
assert_invalid("<resolution>", "-5.3dpcm");
assert_invalid("<transform-function>", "scale()");
assert_invalid("<transform-list>", "scale()");
assert_invalid("<transform-list>+", "translateX(2px) rotate(20deg)");

View file

@ -1,6 +1,7 @@
<!DOCTYPE html>
<link rel="help" href="https://drafts.csswg.org/css-scroll-snap-1/#scroll-snap-type" />
<title>Arrow key scroll snapping</title>
<meta name="viewport" content="width=device-width,initial-scale=1,minimum-scale=1">
<meta name="flags" content="should">
<meta name="assert"
content="Test passes if keyboard scrolling correctly snaps on a snap

View file

@ -0,0 +1,28 @@
<!doctype html>
<title>css-transitions-2 IDL tests</title>
<link rel="help" href="https://drafts.csswg.org/css-transitions-2/">
<script src="/resources/testharness.js"></script>
<script src="/resources/testharnessreport.js"></script>
<script src="/resources/WebIDLParser.js"></script>
<script src="/resources/idlharness.js"></script>
<!-- used to provide objects -->
<style>
@starting-style {
#id { color: green }
}
</style>
<script>
"use strict";
idl_test(
['css-transitions-2'],
['web-animations', 'cssom', 'html', 'dom'],
idl_array => {
idl_array.add_objects({
Animation: ['new Animation()'],
CSSStartingStyleRule: ['sheet.cssRules[0]'],
});
self.sheet = document.styleSheets[0];
}
);
</script>

View file

@ -68,7 +68,7 @@ test_interpolation({
target_names:['CSS Animations', 'Web Animations']
}, [
{at: -0.25, expect: `${-APPROX_INFINITY}px`},
{at: 0, expect: `${APPROX_INFINITY}px`},
{at: 0, expect: `0px`},
{at: 0.25, expect: `${APPROX_INFINITY}px`},
{at: 0.5, expect: `${APPROX_INFINITY}px`},
{at: 0.75, expect: `${APPROX_INFINITY}px`},

Some files were not shown because too many files have changed in this diff Show more