mirror of
https://github.com/servo/servo.git
synced 2025-08-06 06:00:15 +01:00
Update web-platform-tests to revision df2272857e29491bdb6c8ab77a8adec2f11757d2
This commit is contained in:
WPT Sync Bot
parent
57e751658b
commit
3a95d0503c
209 changed files with 6871 additions and 1411 deletions
|
|
@ -4,7 +4,7 @@
|
|||
expected: TIMEOUT
|
||||
|
||||
[Opening a blob URL in a new window immediately before revoking it works.]
|
||||
expected: TIMEOUT
|
||||
expected: FAIL
|
||||
|
||||
[Fetching a blob URL immediately before revoking it works in an iframe.]
|
||||
expected: FAIL
|
||||
|
|
|
|||
|
|
@ -1,4 +0,0 @@
|
|||
[hit-test-floats-004.html]
|
||||
[Miss float below something else]
|
||||
expected: FAIL
|
||||
|
||||
|
|
@ -0,0 +1,2 @@
|
|||
[backface-visibility-hidden-006.html]
|
||||
expected: FAIL
|
||||
|
|
@ -2,3 +2,6 @@
|
|||
[Hit test intersecting scaled box]
|
||||
expected: FAIL
|
||||
|
||||
[Hit test within unscaled box]
|
||||
expected: FAIL
|
||||
|
||||
|
|
|
|||
|
|
@ -8,12 +8,6 @@
|
|||
[throws if handleEvent is thruthy and not callable]
|
||||
expected: FAIL
|
||||
|
||||
[looks up handleEvent method on every event dispatch]
|
||||
expected: FAIL
|
||||
|
||||
[calls handleEvent method of event listener]
|
||||
expected: FAIL
|
||||
|
||||
[doesn't look up handleEvent method on callable event listeners]
|
||||
expected: FAIL
|
||||
|
||||
|
|
|
|||
|
|
@ -2,6 +2,3 @@
|
|||
[elementsFromPoint on the root document for points in iframe elements]
|
||||
expected: FAIL
|
||||
|
||||
[elementsFromPoint on inner documents]
|
||||
expected: FAIL
|
||||
|
||||
|
|
|
|||
|
|
@ -330,3 +330,9 @@
|
|||
[<iframe>: combined response Content-Type: text/html;x=" text/plain]
|
||||
expected: FAIL
|
||||
|
||||
[<iframe>: separate response Content-Type: text/html */*]
|
||||
expected: FAIL
|
||||
|
||||
[<iframe>: combined response Content-Type: text/html */*;charset=gbk]
|
||||
expected: FAIL
|
||||
|
||||
|
|
|
|||
|
|
@ -53,6 +53,6 @@
|
|||
[combined text/javascript ]
|
||||
expected: FAIL
|
||||
|
||||
[separate text/javascript error]
|
||||
[separate text/javascript x/x]
|
||||
expected: FAIL
|
||||
|
||||
|
|
|
|||
|
|
@ -11,9 +11,6 @@
|
|||
[X-Content-Type-Options%3A%20nosniff%2C%2C%40%23%24%23%25%25%26%5E%26%5E*()()11!]
|
||||
expected: FAIL
|
||||
|
||||
[X-Content-Type-Options%3A%20%22nosniFF%22]
|
||||
expected: FAIL
|
||||
|
||||
[Content-Type-Options%3A%20nosniff]
|
||||
[X-Content-Type-Options%3A%20%40%23%24%23%25%25%26%5E%26%5E*()()11!%2Cnosniff]
|
||||
expected: FAIL
|
||||
|
||||
|
|
|
|||
|
|
@ -1,4 +0,0 @@
|
|||
[traverse_the_history_1.html]
|
||||
[Multiple history traversals from the same task]
|
||||
expected: FAIL
|
||||
|
||||
|
|
@ -1,4 +0,0 @@
|
|||
[traverse_the_history_2.html]
|
||||
[Multiple history traversals, last would be aborted]
|
||||
expected: FAIL
|
||||
|
||||
|
|
@ -1,4 +1,4 @@
|
|||
[traverse_the_history_2.html]
|
||||
[traverse_the_history_4.html]
|
||||
[Multiple history traversals, last would be aborted]
|
||||
expected: FAIL
|
||||
|
||||
|
|
@ -1,4 +0,0 @@
|
|||
[traverse_the_history_5.html]
|
||||
[Multiple history traversals, last would be aborted]
|
||||
expected: FAIL
|
||||
|
||||
|
|
@ -1,5 +1,5 @@
|
|||
[iframe_sandbox_popups_escaping-2.html]
|
||||
expected: CRASH
|
||||
expected: TIMEOUT
|
||||
[Check that popups from a sandboxed iframe escape the sandbox if\n allow-popups-to-escape-sandbox is used]
|
||||
expected: TIMEOUT
|
||||
|
||||
|
|
|
|||
|
|
@ -1,5 +1,4 @@
|
|||
[iframe_sandbox_popups_escaping-3.html]
|
||||
expected: TIMEOUT
|
||||
[Check that popups from a sandboxed iframe escape the sandbox if\n allow-popups-to-escape-sandbox is used]
|
||||
expected: TIMEOUT
|
||||
expected: FAIL
|
||||
|
||||
|
|
|
|||
|
|
@ -1,4 +1,5 @@
|
|||
[iframe_sandbox_popups_nonescaping-1.html]
|
||||
expected: CRASH
|
||||
[Check that popups from a sandboxed iframe do not escape the sandbox]
|
||||
expected: FAIL
|
||||
|
||||
|
|
|
|||
|
|
@ -1,5 +1,5 @@
|
|||
[iframe_sandbox_popups_nonescaping-2.html]
|
||||
expected: TIMEOUT
|
||||
expected: CRASH
|
||||
[Check that popups from a sandboxed iframe do not escape the sandbox]
|
||||
expected: NOTRUN
|
||||
|
||||
|
|
|
|||
|
|
@ -1,4 +1,5 @@
|
|||
[iframe_sandbox_popups_nonescaping-3.html]
|
||||
expected: TIMEOUT
|
||||
[Check that popups from a sandboxed iframe do not escape the sandbox]
|
||||
expected: FAIL
|
||||
expected: NOTRUN
|
||||
|
||||
|
|
|
|||
|
|
@ -0,0 +1,4 @@
|
|||
[form-double-submit.html]
|
||||
[default submit action should supersede onclick submit()]
|
||||
expected: FAIL
|
||||
|
||||
|
|
@ -1,4 +0,0 @@
|
|||
[077.html]
|
||||
[ adding several types of scripts through the DOM and removing some of them confuses scheduler ]
|
||||
expected: FAIL
|
||||
|
||||
|
|
@ -1,4 +0,0 @@
|
|||
[load-event-after-location-set-during-write.window.html]
|
||||
[Setting location from document.write() call should not trigger load event until that load completes]
|
||||
expected: FAIL
|
||||
|
||||
|
|
@ -1,5 +1,5 @@
|
|||
[ignore-opens-during-unload.window.html]
|
||||
expected: CRASH
|
||||
expected: TIMEOUT
|
||||
[document.open should bail out when ignore-opens-during-unload is greater than 0 during visibilitychange event (open(parent) while unloading parent and child)]
|
||||
expected: TIMEOUT
|
||||
|
||||
|
|
|
|||
|
|
@ -0,0 +1,4 @@
|
|||
[processing-after-resume.https.html]
|
||||
[Test consistency of processing after resume()]
|
||||
expected: FAIL
|
||||
|
||||
|
|
@ -0,0 +1,17 @@
|
|||
[suspend-after-construct.html]
|
||||
expected: ERROR
|
||||
[Stop waiting]
|
||||
expected: NOTRUN
|
||||
|
||||
[State change counting]
|
||||
expected: TIMEOUT
|
||||
|
||||
[Iteration 2]
|
||||
expected: NOTRUN
|
||||
|
||||
[Iteration 3]
|
||||
expected: NOTRUN
|
||||
|
||||
[Iteration 1]
|
||||
expected: TIMEOUT
|
||||
|
||||
|
|
@ -1,5 +0,0 @@
|
|||
[017.html]
|
||||
expected: TIMEOUT
|
||||
[origin of the script that invoked the method, about:blank]
|
||||
expected: TIMEOUT
|
||||
|
||||
|
|
@ -1,2 +0,0 @@
|
|||
[Worker-constructor.html]
|
||||
expected: ERROR
|
||||
|
|
@ -7,7 +7,7 @@
|
|||
expected: FAIL
|
||||
|
||||
[Opening a blob URL in a new window immediately before revoking it works.]
|
||||
expected: TIMEOUT
|
||||
expected: FAIL
|
||||
|
||||
[Opening a blob URL in a noopener about:blank window immediately before revoking it works.]
|
||||
expected: TIMEOUT
|
||||
|
|
|
|||
File diff suppressed because it is too large
Load diff
|
|
@ -1,4 +0,0 @@
|
|||
[hit-test-floats-004.html]
|
||||
[Miss float below something else]
|
||||
expected: FAIL
|
||||
|
||||
|
|
@ -0,0 +1,2 @@
|
|||
[backface-visibility-hidden-006.html]
|
||||
expected: FAIL
|
||||
|
|
@ -2,3 +2,6 @@
|
|||
[Hit test intersecting scaled box]
|
||||
expected: FAIL
|
||||
|
||||
[Hit test within unscaled box]
|
||||
expected: FAIL
|
||||
|
||||
|
|
|
|||
|
|
@ -8,3 +8,6 @@
|
|||
[throws if handleEvent is thruthy and not callable]
|
||||
expected: FAIL
|
||||
|
||||
[doesn't look up handleEvent method on callable event listeners]
|
||||
expected: FAIL
|
||||
|
||||
|
|
|
|||
|
|
@ -2,6 +2,3 @@
|
|||
[elementsFromPoint on the root document for points in iframe elements]
|
||||
expected: FAIL
|
||||
|
||||
[elementsFromPoint on inner documents]
|
||||
expected: FAIL
|
||||
|
||||
|
|
|
|||
|
|
@ -330,3 +330,9 @@
|
|||
[<iframe>: combined response Content-Type: text/html;x=" text/plain]
|
||||
expected: FAIL
|
||||
|
||||
[<iframe>: separate response Content-Type: text/html */*]
|
||||
expected: FAIL
|
||||
|
||||
[<iframe>: combined response Content-Type: text/html */*;charset=gbk]
|
||||
expected: FAIL
|
||||
|
||||
|
|
|
|||
|
|
@ -53,6 +53,6 @@
|
|||
[combined text/javascript ]
|
||||
expected: FAIL
|
||||
|
||||
[separate text/javascript error]
|
||||
[separate text/javascript x/x]
|
||||
expected: FAIL
|
||||
|
||||
|
|
|
|||
|
|
@ -11,9 +11,6 @@
|
|||
[X-Content-Type-Options%3A%20nosniff%2C%2C%40%23%24%23%25%25%26%5E%26%5E*()()11!]
|
||||
expected: FAIL
|
||||
|
||||
[X-Content-Type-Options%3A%20%22nosniFF%22]
|
||||
expected: FAIL
|
||||
|
||||
[Content-Type-Options%3A%20nosniff]
|
||||
[X-Content-Type-Options%3A%20%40%23%24%23%25%25%26%5E%26%5E*()()11!%2Cnosniff]
|
||||
expected: FAIL
|
||||
|
||||
|
|
|
|||
|
|
@ -1,4 +0,0 @@
|
|||
[traverse_the_history_1.html]
|
||||
[Multiple history traversals from the same task]
|
||||
expected: FAIL
|
||||
|
||||
|
|
@ -1,4 +1,4 @@
|
|||
[traverse_the_history_5.html]
|
||||
[traverse_the_history_4.html]
|
||||
[Multiple history traversals, last would be aborted]
|
||||
expected: FAIL
|
||||
|
||||
|
|
@ -1,5 +1,5 @@
|
|||
[iframe_sandbox_popups_escaping-2.html]
|
||||
expected: CRASH
|
||||
expected: TIMEOUT
|
||||
[Check that popups from a sandboxed iframe escape the sandbox if\n allow-popups-to-escape-sandbox is used]
|
||||
expected: TIMEOUT
|
||||
|
||||
|
|
|
|||
|
|
@ -1,6 +1,5 @@
|
|||
[iframe_sandbox_popups_escaping-3.html]
|
||||
type: testharness
|
||||
expected: TIMEOUT
|
||||
[Check that popups from a sandboxed iframe escape the sandbox if\n allow-popups-to-escape-sandbox is used]
|
||||
expected: TIMEOUT
|
||||
expected: FAIL
|
||||
|
||||
|
|
|
|||
|
|
@ -1,5 +1,6 @@
|
|||
[iframe_sandbox_popups_nonescaping-1.html]
|
||||
type: testharness
|
||||
expected: CRASH
|
||||
[Check that popups from a sandboxed iframe do not escape the sandbox]
|
||||
expected: FAIL
|
||||
|
||||
|
|
|
|||
|
|
@ -1,6 +1,6 @@
|
|||
[iframe_sandbox_popups_nonescaping-2.html]
|
||||
type: testharness
|
||||
expected: TIMEOUT
|
||||
expected: CRASH
|
||||
[Check that popups from a sandboxed iframe do not escape the sandbox]
|
||||
expected: NOTRUN
|
||||
|
||||
|
|
|
|||
|
|
@ -1,5 +1,6 @@
|
|||
[iframe_sandbox_popups_nonescaping-3.html]
|
||||
type: testharness
|
||||
expected: TIMEOUT
|
||||
[Check that popups from a sandboxed iframe do not escape the sandbox]
|
||||
expected: FAIL
|
||||
expected: NOTRUN
|
||||
|
||||
|
|
|
|||
|
|
@ -0,0 +1,4 @@
|
|||
[form-double-submit.html]
|
||||
[default submit action should supersede onclick submit()]
|
||||
expected: FAIL
|
||||
|
||||
|
|
@ -1,4 +0,0 @@
|
|||
[077.html]
|
||||
[ adding several types of scripts through the DOM and removing some of them confuses scheduler ]
|
||||
expected: FAIL
|
||||
|
||||
|
|
@ -1,4 +0,0 @@
|
|||
[load-event-after-location-set-during-write.window.html]
|
||||
[Setting location from document.write() call should not trigger load event until that load completes]
|
||||
expected: FAIL
|
||||
|
||||
|
|
@ -1,5 +1,5 @@
|
|||
[ignore-opens-during-unload.window.html]
|
||||
expected: CRASH
|
||||
expected: TIMEOUT
|
||||
[ignore-opens-during-unload]
|
||||
expected: FAIL
|
||||
|
||||
|
|
|
|||
|
|
@ -0,0 +1,4 @@
|
|||
[processing-after-resume.https.html]
|
||||
[Test consistency of processing after resume()]
|
||||
expected: FAIL
|
||||
|
||||
|
|
@ -0,0 +1,17 @@
|
|||
[suspend-after-construct.html]
|
||||
expected: ERROR
|
||||
[Stop waiting]
|
||||
expected: NOTRUN
|
||||
|
||||
[State change counting]
|
||||
expected: TIMEOUT
|
||||
|
||||
[Iteration 2]
|
||||
expected: NOTRUN
|
||||
|
||||
[Iteration 3]
|
||||
expected: NOTRUN
|
||||
|
||||
[Iteration 1]
|
||||
expected: TIMEOUT
|
||||
|
||||
|
|
@ -1,5 +0,0 @@
|
|||
[017.html]
|
||||
expected: TIMEOUT
|
||||
[origin of the script that invoked the method, about:blank]
|
||||
expected: TIMEOUT
|
||||
|
||||
|
|
@ -1,2 +0,0 @@
|
|||
[Worker-constructor.html]
|
||||
expected: ERROR
|
||||
|
|
@ -1,4 +0,0 @@
|
|||
[promise.html]
|
||||
[Native promise from async callback can be resolved]
|
||||
expected: FAIL
|
||||
|
||||
|
|
@ -1,6 +1,3 @@
|
|||
[promise.html]
|
||||
type: testharness
|
||||
prefs: [dom.testbinding.enabled:true]
|
||||
[Native promise from async callback can be resolved]
|
||||
expected: FAIL
|
||||
|
||||
|
|
|
|||
|
|
@ -52,8 +52,8 @@ promise_test(async testCase => {
|
|||
promise_test(async testCase => {
|
||||
await cookieStore.delete('cookie-name');
|
||||
|
||||
await cookieStore.set('cookie-name', 'cookie-value',
|
||||
{ expires: kTenYearsFromNow });
|
||||
await cookieStore.set({ name: 'cookie-name', value: 'cookie-value',
|
||||
expires: kTenYearsFromNow });
|
||||
testCase.add_cleanup(async () => {
|
||||
await cookieStore.delete('cookie-name');
|
||||
});
|
||||
|
|
@ -73,27 +73,7 @@ promise_test(async testCase => {
|
|||
await cookieStore.delete('cookie-name');
|
||||
|
||||
await cookieStore.set({ name: 'cookie-name', value: 'cookie-value',
|
||||
expires: kTenYearsFromNow });
|
||||
testCase.add_cleanup(async () => {
|
||||
await cookieStore.delete('cookie-name');
|
||||
});
|
||||
const cookie = await cookieStore.get('cookie-name');
|
||||
assert_equals(cookie.name, 'cookie-name');
|
||||
assert_equals(cookie.value, 'cookie-value');
|
||||
assert_equals(cookie.domain, null);
|
||||
assert_equals(cookie.path, '/');
|
||||
assert_approx_equals(cookie.expires, kTenYearsFromNow, kOneDay);
|
||||
assert_equals(cookie.secure, true);
|
||||
assert_equals(cookie.sameSite, 'strict');
|
||||
assert_array_equals(Object.keys(cookie).sort(), kCookieListItemKeys);
|
||||
}, 'CookieListItem - cookieStore.set with name and value in options and ' +
|
||||
'expires set to a future timestamp');
|
||||
|
||||
promise_test(async testCase => {
|
||||
await cookieStore.delete('cookie-name');
|
||||
|
||||
await cookieStore.set('cookie-name', 'cookie-value',
|
||||
{ expires: new Date(kTenYearsFromNow) });
|
||||
expires: new Date(kTenYearsFromNow) });
|
||||
testCase.add_cleanup(async () => {
|
||||
await cookieStore.delete('cookie-name');
|
||||
});
|
||||
|
|
@ -107,31 +87,11 @@ promise_test(async testCase => {
|
|||
}, 'CookieListItem - cookieStore.set with expires set to a Date 10 ' +
|
||||
'years in the future');
|
||||
|
||||
promise_test(async testCase => {
|
||||
await cookieStore.delete('cookie-name');
|
||||
|
||||
await cookieStore.set({ name: 'cookie-name', value: 'cookie-value',
|
||||
expires: new Date(kTenYearsFromNow) });
|
||||
testCase.add_cleanup(async () => {
|
||||
await cookieStore.delete('cookie-name');
|
||||
});
|
||||
const cookie = await cookieStore.get('cookie-name');
|
||||
assert_equals(cookie.name, 'cookie-name');
|
||||
assert_equals(cookie.value, 'cookie-value');
|
||||
assert_equals(cookie.domain, null);
|
||||
assert_equals(cookie.path, '/');
|
||||
assert_approx_equals(cookie.expires, kTenYearsFromNow, kOneDay);
|
||||
assert_equals(cookie.secure, true);
|
||||
assert_equals(cookie.sameSite, 'strict');
|
||||
assert_array_equals(Object.keys(cookie).sort(), kCookieListItemKeys);
|
||||
}, 'CookieListItem - cookieStore.set with name and value in options and ' +
|
||||
'expires set to a future Date');
|
||||
|
||||
promise_test(async testCase => {
|
||||
await cookieStore.delete({ name: 'cookie-name', domain: kCurrentHostname });
|
||||
|
||||
await cookieStore.set('cookie-name', 'cookie-value',
|
||||
{ domain: kCurrentHostname });
|
||||
await cookieStore.set({ name: 'cookie-name', value: 'cookie-value',
|
||||
domain: kCurrentHostname });
|
||||
testCase.add_cleanup(async () => {
|
||||
await cookieStore.delete({ name: 'cookie-name', domain: kCurrentHostname });
|
||||
});
|
||||
|
|
@ -153,8 +113,8 @@ promise_test(async testCase => {
|
|||
currentPath.substr(0, currentPath.lastIndexOf('/') + 1);
|
||||
await cookieStore.delete({ name: 'cookie-name', path: currentDirectory });
|
||||
|
||||
await cookieStore.set('cookie-name', 'cookie-value',
|
||||
{ path: currentDirectory });
|
||||
await cookieStore.set({ name: 'cookie-name', value: 'cookie-value',
|
||||
path: currentDirectory });
|
||||
testCase.add_cleanup(async () => {
|
||||
await cookieStore.delete({ name: 'cookie-name', path: currentDirectory });
|
||||
});
|
||||
|
|
@ -175,8 +135,8 @@ promise_test(async testCase => {
|
|||
const currentDirectory = currentPath.substr(0, currentPath.lastIndexOf('/'));
|
||||
await cookieStore.delete({ name: 'cookie-name', path: currentDirectory });
|
||||
|
||||
await cookieStore.set('cookie-name', 'cookie-value',
|
||||
{ path: currentDirectory });
|
||||
await cookieStore.set({ name: 'cookie-name', value: 'cookie-value',
|
||||
path: currentDirectory });
|
||||
testCase.add_cleanup(async () => {
|
||||
await cookieStore.delete({ name: 'cookie-name', path: currentDirectory });
|
||||
});
|
||||
|
|
@ -211,23 +171,4 @@ promise_test(async testCase => {
|
|||
assert_array_equals(Object.keys(cookie).sort(), kCookieListItemKeys);
|
||||
}, `CookieListItem - cookieStore.set with sameSite set to ${sameSiteValue}`);
|
||||
|
||||
promise_test(async testCase => {
|
||||
await cookieStore.delete('cookie-name');
|
||||
|
||||
await cookieStore.set('cookie-name', 'cookie-value',
|
||||
{ sameSite: sameSiteValue });
|
||||
testCase.add_cleanup(async () => {
|
||||
await cookieStore.delete('cookie-name');
|
||||
});
|
||||
const cookie = await cookieStore.get('cookie-name');
|
||||
assert_equals(cookie.name, 'cookie-name');
|
||||
assert_equals(cookie.value, 'cookie-value');
|
||||
assert_equals(cookie.domain, null);
|
||||
assert_equals(cookie.path, '/');
|
||||
assert_equals(cookie.expires, null);
|
||||
assert_equals(cookie.secure, true);
|
||||
assert_equals(cookie.sameSite, sameSiteValue);
|
||||
assert_array_equals(Object.keys(cookie).sort(), kCookieListItemKeys);
|
||||
}, 'CookieListItem - cookieStore.set with positional name and value and ' +
|
||||
`sameSite set to ${sameSiteValue}`);
|
||||
});
|
||||
|
|
|
|||
|
|
@ -22,35 +22,25 @@ promise_test(async testCase => {
|
|||
assert_equals(cookie, null);
|
||||
}, 'cookieStore.delete with name in options');
|
||||
|
||||
promise_test(async testCase => {
|
||||
await cookieStore.set('cookie-name', 'cookie-value');
|
||||
testCase.add_cleanup(async () => {
|
||||
await cookieStore.delete('cookie-name');
|
||||
});
|
||||
|
||||
await cookieStore.delete('cookie-name', { name: 'wrong-cookie-name' });
|
||||
const cookie = await cookieStore.get('cookie-name');
|
||||
assert_equals(cookie, null);
|
||||
}, 'cookieStore.delete with name in both positional arguments and options');
|
||||
|
||||
promise_test(async testCase => {
|
||||
const currentUrl = new URL(self.location.href);
|
||||
const currentDomain = currentUrl.hostname;
|
||||
|
||||
await promise_rejects_js(testCase, TypeError, cookieStore.set(
|
||||
'cookie-name', 'cookie-value', { domain: `.${currentDomain}` }));
|
||||
{ name: 'cookie-name', value: 'cookie-value',
|
||||
domain: `.${currentDomain}` }));
|
||||
}, 'cookieStore.delete domain starts with "."');
|
||||
|
||||
promise_test(async testCase => {
|
||||
await promise_rejects_js(testCase, TypeError, cookieStore.set(
|
||||
'cookie-name', 'cookie-value', { domain: 'example.com' }));
|
||||
{ name: 'cookie-name', value: 'cookie-value', domain: 'example.com' }));
|
||||
}, 'cookieStore.delete with domain that is not equal current host');
|
||||
|
||||
promise_test(async testCase => {
|
||||
const currentUrl = new URL(self.location.href);
|
||||
const currentDomain = currentUrl.hostname;
|
||||
await cookieStore.set(
|
||||
'cookie-name', 'cookie-value', { domain: currentDomain });
|
||||
{ name: 'cookie-name', value: 'cookie-value', domain: currentDomain });
|
||||
testCase.add_cleanup(async () => {
|
||||
await cookieStore.delete({ name: 'cookie-name', domain: currentDomain });
|
||||
});
|
||||
|
|
@ -81,50 +71,13 @@ promise_test(async testCase => {
|
|||
}, 'cookieStore.delete with domain set to a non-domain-matching suffix of ' +
|
||||
'the current hostname');
|
||||
|
||||
promise_test(async testCase => {
|
||||
const currentUrl = new URL(self.location.href);
|
||||
const currentDomain = currentUrl.hostname;
|
||||
await cookieStore.set(
|
||||
'cookie-name', 'cookie-value', { domain: currentDomain });
|
||||
testCase.add_cleanup(async () => {
|
||||
await cookieStore.delete({ name: 'cookie-name', domain: currentDomain });
|
||||
});
|
||||
|
||||
await cookieStore.delete({ name: 'cookie-name', domain: currentDomain });
|
||||
const cookie = await cookieStore.get('cookie-name');
|
||||
assert_equals(cookie, null);
|
||||
}, 'cookieStore.delete with name in options and domain set to the current ' +
|
||||
'hostname');
|
||||
|
||||
promise_test(async testCase => {
|
||||
const currentUrl = new URL(self.location.href);
|
||||
const currentDomain = currentUrl.hostname;
|
||||
const subDomain = `sub.${currentDomain}`;
|
||||
|
||||
await promise_rejects_js(testCase, TypeError, cookieStore.delete(
|
||||
{ name: 'cookie-name', domain: subDomain }));
|
||||
}, 'cookieStore.delete with name in options and domain set to a subdomain of ' +
|
||||
'the current hostname');
|
||||
|
||||
promise_test(async testCase => {
|
||||
const currentUrl = new URL(self.location.href);
|
||||
const currentDomain = currentUrl.hostname;
|
||||
assert_not_equals(currentDomain[0] === '.',
|
||||
'this test assumes that the current hostname does not start with .');
|
||||
const domainSuffix = currentDomain.substr(1);
|
||||
|
||||
await promise_rejects_js(testCase, TypeError, cookieStore.delete(
|
||||
{ name: 'cookie-name', domain: domainSuffix }));
|
||||
}, 'cookieStore.delete with name in options and domain set to a ' +
|
||||
'non-domain-matching suffix of the current hostname');
|
||||
|
||||
promise_test(async testCase => {
|
||||
const currentUrl = new URL(self.location.href);
|
||||
const currentPath = currentUrl.pathname;
|
||||
const currentDirectory =
|
||||
currentPath.substr(0, currentPath.lastIndexOf('/') + 1);
|
||||
await cookieStore.set(
|
||||
'cookie-name', 'cookie-value', { path: currentDirectory });
|
||||
{ name: 'cookie-name', value: 'cookie-value', path: currentDirectory });
|
||||
testCase.add_cleanup(async () => {
|
||||
await cookieStore.delete({ name: 'cookie-name', path: currentDirectory });
|
||||
});
|
||||
|
|
@ -141,7 +94,7 @@ promise_test(async testCase => {
|
|||
currentPath.substr(0, currentPath.lastIndexOf('/') + 1);
|
||||
const subDirectory = currentDirectory + "subdir/";
|
||||
await cookieStore.set(
|
||||
'cookie-name', 'cookie-value', { path: currentDirectory });
|
||||
{ name: 'cookie-name', value: 'cookie-value', path: currentDirectory });
|
||||
testCase.add_cleanup(async () => {
|
||||
await cookieStore.delete({ name: 'cookie-name', path: currentDirectory });
|
||||
});
|
||||
|
|
@ -157,7 +110,9 @@ promise_test(async testCase => {
|
|||
const currentPath = currentUrl.pathname;
|
||||
const currentDirectory = currentPath.substr(0, currentPath.lastIndexOf('/'));
|
||||
await cookieStore.set(
|
||||
'cookie-name', 'cookie-value', { path: currentDirectory + '/' });
|
||||
{ name: 'cookie-name',
|
||||
value: 'cookie-value',
|
||||
path: currentDirectory + '/' });
|
||||
testCase.add_cleanup(async () => {
|
||||
await cookieStore.delete({ name: 'cookie-name', path: currentDirectory });
|
||||
});
|
||||
|
|
|
|||
|
|
@ -28,18 +28,6 @@ promise_test(async testCase => {
|
|||
assert_equals(cookie.value, 'cookie-value');
|
||||
}, 'cookieStore.set with name and value in options');
|
||||
|
||||
promise_test(async testCase => {
|
||||
await cookieStore.delete('cookie-name');
|
||||
|
||||
cookieStore.set('cookie-name', 'cookie-value', { name: 'wrong-cookie-name' });
|
||||
testCase.add_cleanup(async () => {
|
||||
await cookieStore.delete('cookie-name');
|
||||
});
|
||||
const cookie = await cookieStore.get('cookie-name');
|
||||
assert_equals(cookie.name, 'cookie-name');
|
||||
assert_equals(cookie.value, 'cookie-value');
|
||||
}, 'cookieStore.set with name in both positional arguments and options');
|
||||
|
||||
promise_test(async testCase => {
|
||||
await promise_rejects_js(testCase, TypeError,
|
||||
cookieStore.set('', 'suspicious-value=resembles-name-and-value'));
|
||||
|
|
@ -56,55 +44,15 @@ promise_test(async testCase => {
|
|||
assert_equals(cookie.value, 'suspicious-value=resembles-name-and-value');
|
||||
}, "cookieStore.set with normal name and an '=' in value");
|
||||
|
||||
promise_test(async testCase => {
|
||||
await cookieStore.delete('cookie-name');
|
||||
|
||||
cookieStore.set('cookie-name', 'cookie-value',
|
||||
{ value: 'wrong-cookie-value' });
|
||||
testCase.add_cleanup(async () => {
|
||||
await cookieStore.delete('cookie-name');
|
||||
});
|
||||
const cookie = await cookieStore.get('cookie-name');
|
||||
assert_equals(cookie.name, 'cookie-name');
|
||||
assert_equals(cookie.value, 'cookie-value');
|
||||
}, 'cookieStore.set with value in both positional arguments and options');
|
||||
|
||||
promise_test(async testCase => {
|
||||
const tenYears = 10 * 365 * 24 * 60 * 60 * 1000;
|
||||
const tenYearsFromNow = Date.now() + tenYears;
|
||||
await cookieStore.delete('cookie-name');
|
||||
|
||||
await cookieStore.set(
|
||||
'cookie-name', 'cookie-value', { expires: tenYearsFromNow });
|
||||
testCase.add_cleanup(async () => {
|
||||
await cookieStore.delete('cookie-name');
|
||||
});
|
||||
const cookie = await cookieStore.get('cookie-name');
|
||||
assert_equals(cookie.name, 'cookie-name');
|
||||
assert_equals(cookie.value, 'cookie-value');
|
||||
}, 'cookieStore.set with expires set to a future timestamp');
|
||||
|
||||
promise_test(async testCase => {
|
||||
const tenYears = 10 * 365 * 24 * 60 * 60 * 1000;
|
||||
const tenYearsAgo = Date.now() - tenYears;
|
||||
await cookieStore.delete('cookie-name');
|
||||
|
||||
await cookieStore.set(
|
||||
'cookie-name', 'cookie-value', { expires: tenYearsAgo });
|
||||
testCase.add_cleanup(async () => {
|
||||
await cookieStore.delete('cookie-name');
|
||||
});
|
||||
const cookie = await cookieStore.get('cookie-name');
|
||||
assert_equals(cookie, null);
|
||||
}, 'cookieStore.set with expires set to a past timestamp');
|
||||
|
||||
promise_test(async testCase => {
|
||||
const tenYears = 10 * 365 * 24 * 60 * 60 * 1000;
|
||||
const tenYearsFromNow = Date.now() + tenYears;
|
||||
await cookieStore.delete('cookie-name');
|
||||
|
||||
await cookieStore.set(
|
||||
'cookie-name', 'cookie-value', { expires: new Date(tenYearsFromNow) });
|
||||
{ name: 'cookie-name',
|
||||
value: 'cookie-value',
|
||||
expires: new Date(tenYearsFromNow) });
|
||||
testCase.add_cleanup(async () => {
|
||||
await cookieStore.delete('cookie-name');
|
||||
});
|
||||
|
|
@ -119,7 +67,9 @@ promise_test(async testCase => {
|
|||
await cookieStore.delete('cookie-name');
|
||||
|
||||
await cookieStore.set(
|
||||
'cookie-name', 'cookie-value', { expires: new Date(tenYearsAgo) });
|
||||
{ name :'cookie-name',
|
||||
value: 'cookie-value',
|
||||
expires: new Date(tenYearsAgo) });
|
||||
testCase.add_cleanup(async () => {
|
||||
await cookieStore.delete('cookie-name');
|
||||
});
|
||||
|
|
@ -140,7 +90,7 @@ promise_test(async testCase => {
|
|||
const cookie = await cookieStore.get('cookie-name');
|
||||
assert_equals(cookie.name, 'cookie-name');
|
||||
assert_equals(cookie.value, 'cookie-value');
|
||||
}, 'cookieStore.set with name and value in options and expires in the future');
|
||||
}, 'cookieStore.set with expires set to a future timestamp');
|
||||
|
||||
promise_test(async testCase => {
|
||||
const tenYears = 10 * 365 * 24 * 60 * 60 * 1000;
|
||||
|
|
@ -154,19 +104,21 @@ promise_test(async testCase => {
|
|||
});
|
||||
const cookie = await cookieStore.get('cookie-name');
|
||||
assert_equals(cookie, null);
|
||||
}, 'cookieStore.set with name and value in options and expires in the past');
|
||||
}, 'cookieStore.set with expires set to a past timestamp');
|
||||
|
||||
promise_test(async testCase => {
|
||||
const currentUrl = new URL(self.location.href);
|
||||
const currentDomain = currentUrl.hostname;
|
||||
|
||||
await promise_rejects_js(testCase, TypeError, cookieStore.set(
|
||||
'cookie-name', 'cookie-value', { domain: `.${currentDomain}` }));
|
||||
{ name: 'cookie-name',
|
||||
value: 'cookie-value',
|
||||
domain: `.${currentDomain}` }));
|
||||
}, 'cookieStore.set domain starts with "."');
|
||||
|
||||
promise_test(async testCase => {
|
||||
await promise_rejects_js(testCase, TypeError, cookieStore.set(
|
||||
'cookie-name', 'cookie-value', { domain: 'example.com' }));
|
||||
{ name: 'cookie-name', value: 'cookie-value', domain: 'example.com' }));
|
||||
}, 'cookieStore.set with domain that is not equal current host');
|
||||
|
||||
promise_test(async testCase => {
|
||||
|
|
@ -175,7 +127,7 @@ promise_test(async testCase => {
|
|||
await cookieStore.delete({ name: 'cookie-name', domain: currentDomain });
|
||||
|
||||
await cookieStore.set(
|
||||
'cookie-name', 'cookie-value', { domain: currentDomain });
|
||||
{ name: 'cookie-name', value: 'cookie-value', domain: currentDomain });
|
||||
testCase.add_cleanup(async () => {
|
||||
await cookieStore.delete({ name: 'cookie-name', domain: currentDomain });
|
||||
});
|
||||
|
|
@ -190,7 +142,7 @@ promise_test(async testCase => {
|
|||
const subDomain = `sub.${currentDomain}`;
|
||||
|
||||
await promise_rejects_js(testCase, TypeError, cookieStore.set(
|
||||
'cookie-name', 'cookie-value', { domain: subDomain }));
|
||||
{ name: 'cookie-name', value: 'cookie-value', domain: subDomain }));
|
||||
const cookie = await cookieStore.get('cookie-name');
|
||||
assert_equals(cookie, null);
|
||||
}, 'cookieStore.set with domain set to a subdomain of the current hostname');
|
||||
|
|
@ -203,7 +155,7 @@ promise_test(async testCase => {
|
|||
const domainSuffix = currentDomain.substr(1);
|
||||
|
||||
await promise_rejects_js(testCase, TypeError, cookieStore.set(
|
||||
'cookie-name', 'cookie-value', { domain: domainSuffix }));
|
||||
{ name: 'cookie-name', value: 'cookie-value', domain: domainSuffix }));
|
||||
const cookie = await cookieStore.get('cookie-name');
|
||||
assert_equals(cookie, null);
|
||||
}, 'cookieStore.set with domain set to a non-domain-matching suffix of the ' +
|
||||
|
|
@ -218,8 +170,8 @@ promise_test(async testCase => {
|
|||
testCase.add_cleanup(async () => {
|
||||
await cookieStore.delete('cookie-name');
|
||||
});
|
||||
await cookieStore.set('cookie-name', 'cookie-value2',
|
||||
{ domain: currentDomain });
|
||||
await cookieStore.set(
|
||||
{ name: 'cookie-name', value: 'cookie-value2', domain: currentDomain });
|
||||
testCase.add_cleanup(async () => {
|
||||
await cookieStore.delete({ name: 'cookie-name', domain: currentDomain });
|
||||
});
|
||||
|
|
@ -243,7 +195,7 @@ promise_test(async testCase => {
|
|||
await cookieStore.delete({ name: 'cookie-name', path: currentDirectory });
|
||||
|
||||
await cookieStore.set(
|
||||
'cookie-name', 'cookie-value', { path: currentDirectory });
|
||||
{ name: 'cookie-name', value: 'cookie-value', path: currentDirectory });
|
||||
testCase.add_cleanup(async () => {
|
||||
await cookieStore.delete({ name: 'cookie-name', path: currentDirectory });
|
||||
});
|
||||
|
|
@ -262,7 +214,7 @@ promise_test(async testCase => {
|
|||
await cookieStore.delete({ name: 'cookie-name', path: subDirectory });
|
||||
|
||||
await cookieStore.set(
|
||||
'cookie-name', 'cookie-value', { path: subDirectory });
|
||||
{ name: 'cookie-name', value: 'cookie-value', path: subDirectory });
|
||||
testCase.add_cleanup(async () => {
|
||||
await cookieStore.delete({ name: 'cookie-name', path: subDirectory });
|
||||
});
|
||||
|
|
@ -277,7 +229,8 @@ promise_test(async testCase => {
|
|||
testCase.add_cleanup(async () => {
|
||||
await cookieStore.delete('cookie-name');
|
||||
});
|
||||
await cookieStore.set('cookie-name', 'cookie-new-value', { path: '/' });
|
||||
await cookieStore.set(
|
||||
{ name: 'cookie-name', value: 'cookie-new-value', path: '/' });
|
||||
testCase.add_cleanup(async () => {
|
||||
await cookieStore.delete({ name: 'cookie-name', path: '/' });
|
||||
});
|
||||
|
|
@ -295,7 +248,7 @@ promise_test(async testCase => {
|
|||
await cookieStore.delete({ name: 'cookie-name', path: currentDirectory });
|
||||
|
||||
await cookieStore.set(
|
||||
'cookie-name', 'cookie-value', { path: currentDirectory });
|
||||
{ name: 'cookie-name', value: 'cookie-value', path: currentDirectory });
|
||||
testCase.add_cleanup(async () => {
|
||||
await cookieStore.delete({ name: 'cookie-name', path: currentDirectory });
|
||||
});
|
||||
|
|
@ -313,7 +266,7 @@ promise_test(async testCase => {
|
|||
const invalidPath = currentDirectory.substr(1);
|
||||
|
||||
await promise_rejects_js(testCase, TypeError, cookieStore.set(
|
||||
'cookie-name', 'cookie-value', { path: invalidPath }));
|
||||
{ name: 'cookie-name', value: 'cookie-value', path: invalidPath }));
|
||||
}, 'cookieStore.set with path that does not start with /');
|
||||
|
||||
promise_test(async testCase => {
|
||||
|
|
|
|||
|
|
@ -19,9 +19,8 @@
|
|||
// contexts, the set() should fail even if the expiration date makes
|
||||
// the operation a no-op.
|
||||
await cookieStore.set(
|
||||
`${prefix}cookie-name`, `secure-cookie-value`, {
|
||||
expires: Date.now() - (24 * 60 * 60 * 1000)
|
||||
});
|
||||
{ name: `${prefix}cookie-name`, value: `secure-cookie-value`,
|
||||
expires: Date.now() - (24 * 60 * 60 * 1000)});
|
||||
assert_equals(await cookieStore.get(`${prefix}cookie-name`), null);
|
||||
try { await cookieStore.delete(`${prefix}cookie-name`); } catch (e) {}
|
||||
}, `cookieStore.set of expired ${prefix} cookie name on secure origin`);
|
||||
|
|
@ -37,19 +36,18 @@ promise_test(async testCase => {
|
|||
const currentUrl = new URL(self.location.href);
|
||||
const currentDomain = currentUrl.hostname;
|
||||
await promise_rejects_js(testCase, TypeError,
|
||||
cookieStore.set('__Host-cookie-name', 'cookie-value', {
|
||||
domain: currentDomain
|
||||
}));
|
||||
cookieStore.set({ name: '__Host-cookie-name', value: 'cookie-value',
|
||||
domain: currentDomain }));
|
||||
}, 'cookieStore.set with __Host- prefix and a domain option');
|
||||
|
||||
promise_test(async testCase => {
|
||||
await cookieStore.set('__Host-cookie-name', 'cookie-value', { path: "/" });
|
||||
await cookieStore.set({ name: '__Host-cookie-name', value: 'cookie-value',
|
||||
path: "/" });
|
||||
|
||||
assert_equals(
|
||||
(await cookieStore.get(`__Host-cookie-name`)).value, "cookie-value");
|
||||
|
||||
await promise_rejects_js(testCase, TypeError,
|
||||
cookieStore.set('__Host-cookie-name', 'cookie-value', {
|
||||
path: "/path"
|
||||
}));
|
||||
cookieStore.set( { name: '__Host-cookie-name', value: 'cookie-value',
|
||||
path: "/path" }));
|
||||
}, 'cookieStore.set with __Host- prefix a path option');
|
||||
|
|
|
|||
|
|
@ -0,0 +1,14 @@
|
|||
<!DOCTYPE html>
|
||||
<link rel="author" title="Morten Stenshorne" href="mailto:mstensho@chromium.org">
|
||||
<link rel="help" href="https://www.w3.org/TR/css-break-3/#parallel-flows">
|
||||
<link rel="match" href="../reference/ref-filled-green-100px-square.xht">
|
||||
<p>Test passes if there is a filled green square and <strong>no red</strong>.</p>
|
||||
<div style="columns:2; column-fill:auto; column-gap:0; width:180px; height:100px; background:red;">
|
||||
<div style="height:30px; background:green;"></div>
|
||||
<div>
|
||||
<div style="float:left; width:10px; height:170px; background:green;"></div>
|
||||
<div style="height:30px; background:green;"></div>
|
||||
</div>
|
||||
<div style="height:40px; background:green;"></div>
|
||||
<div style="height:100px; background:white;"></div>
|
||||
</div>
|
||||
|
|
@ -0,0 +1,17 @@
|
|||
<!doctype HTML>
|
||||
<html>
|
||||
<meta charset="utf8">
|
||||
<title>CSS Content Visibility: container (reference)</title>
|
||||
<link rel="author" title="Vladimir Levin" href="mailto:vmpstr@chromium.org">
|
||||
<link rel="help" href="https://drafts.csswg.org/css-contain/#content-visibility">
|
||||
|
||||
<style>
|
||||
#container {
|
||||
width: 150px;
|
||||
height: 150px;
|
||||
background: lightblue;
|
||||
}
|
||||
</style>
|
||||
|
||||
<div id=container></div>
|
||||
|
||||
|
|
@ -0,0 +1,25 @@
|
|||
<!doctype HTML>
|
||||
<html>
|
||||
<meta charset="utf8">
|
||||
<title>CSS Content Visibility: container with child and text (reference)</title>
|
||||
<link rel="author" title="Vladimir Levin" href="mailto:vmpstr@chromium.org">
|
||||
<link rel="help" href="https://drafts.csswg.org/css-contain/#content-visibility">
|
||||
|
||||
<style>
|
||||
#container {
|
||||
width: 150px;
|
||||
height: 150px;
|
||||
background: lightblue;
|
||||
}
|
||||
#child {
|
||||
width: 50px;
|
||||
height: 50px;
|
||||
background: lightgreen;
|
||||
}
|
||||
</style>
|
||||
|
||||
<div id=container>
|
||||
Text.
|
||||
<div id=child></div>
|
||||
</div>
|
||||
|
||||
|
|
@ -0,0 +1,43 @@
|
|||
<!doctype HTML>
|
||||
<html>
|
||||
<meta charset="utf8">
|
||||
<title>CSS Content Visibility: container with child and text (reference)</title>
|
||||
<link rel="author" title="Vladimir Levin" href="mailto:vmpstr@chromium.org">
|
||||
<link rel="help" href="https://drafts.csswg.org/css-contain/#content-visibility">
|
||||
|
||||
<style>
|
||||
#container {
|
||||
width: 150px;
|
||||
height: 150px;
|
||||
background: lightblue;
|
||||
contain: layout;
|
||||
}
|
||||
#child {
|
||||
width: 50px;
|
||||
height: 50px;
|
||||
background: lightgreen;
|
||||
}
|
||||
.abspos { position: absolute; }
|
||||
.relpos { position: relative; }
|
||||
.fixedpos { position: fixed; }
|
||||
.start { top: 0; left: 0; }
|
||||
.mid { top: 10px; left: 10px; }
|
||||
.end { bottom: 0; right: 0; }
|
||||
.zindex { z-index: 1; }
|
||||
.small { width: 10px; height: 10px; background: blue; }
|
||||
.medium { width: 20px; height: 20px; background: green; }
|
||||
.large { width: 30px; height: 30px; background: pink; }
|
||||
</style>
|
||||
|
||||
<div id=container>
|
||||
Text.
|
||||
<div id=child></div>
|
||||
<span>inline child</span>
|
||||
<div class="abspos start small"></div>
|
||||
<div class="relpos mid medium"></div>
|
||||
<div class="fixedpos end large"></div>
|
||||
<div class=relpos>
|
||||
<div class="abspos mid small zindex"></div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
|
|
@ -0,0 +1,45 @@
|
|||
<!doctype HTML>
|
||||
<html>
|
||||
<meta charset="utf8">
|
||||
<title>CSS Content Visibility: hidden does not paint</title>
|
||||
<link rel="author" title="Vladimir Levin" href="mailto:vmpstr@chromium.org">
|
||||
<link rel="help" href="https://drafts.csswg.org/css-contain/#content-visibility">
|
||||
<link rel="match" href="container-ref.html">
|
||||
<meta name="assert" content="content-visibility subtrees are not painted">
|
||||
|
||||
<style>
|
||||
#container {
|
||||
content-visibility: hidden;
|
||||
width: 150px;
|
||||
height: 150px;
|
||||
background: lightblue;
|
||||
}
|
||||
#child {
|
||||
width: 50px;
|
||||
height: 50px;
|
||||
background: lightgreen;
|
||||
}
|
||||
.abspos { position: absolute; }
|
||||
.relpos { position: relative; }
|
||||
.fixedpos { position: fixed; }
|
||||
.start { top: 0; left: 0; }
|
||||
.mid { top: 10px; left: 10px; }
|
||||
.end { bottom: 0; right: 0; }
|
||||
.zindex { z-index: 1; }
|
||||
.small { width: 10px; height: 10px; background: blue; }
|
||||
.medium { width: 20px; height: 20px; background: green; }
|
||||
.large { width: 30px; height: 30px; background: pink; }
|
||||
</style>
|
||||
|
||||
<div id=container>
|
||||
Text.
|
||||
<div id=child></div>
|
||||
<span>inline child</span>
|
||||
<div class="abspos start small"></div>
|
||||
<div class="relpos mid medium"></div>
|
||||
<div class="fixedpos end large"></div>
|
||||
<div class=relpos>
|
||||
<div class="abspos mid small zindex"></div>
|
||||
</div>
|
||||
</div>
|
||||
</html>
|
||||
|
|
@ -0,0 +1,42 @@
|
|||
<!doctype HTML>
|
||||
<html class="reftest-wait">
|
||||
<meta charset="utf8">
|
||||
<title>CSS Content Visibility: hidden starts painting when removed</title>
|
||||
<link rel="author" title="Vladimir Levin" href="mailto:vmpstr@chromium.org">
|
||||
<link rel="help" href="https://drafts.csswg.org/css-contain/#content-visibility">
|
||||
<link rel="match" href="container-with-child-ref.html">
|
||||
<meta name="assert" content="content-visibility subtrees start painting when hidden is removed">
|
||||
|
||||
<script src="/common/reftest-wait.js"></script>
|
||||
|
||||
<style>
|
||||
#container {
|
||||
width: 150px;
|
||||
height: 150px;
|
||||
background: lightblue;
|
||||
}
|
||||
.hidden {
|
||||
content-visibility: hidden;
|
||||
}
|
||||
#child {
|
||||
width: 50px;
|
||||
height: 50px;
|
||||
background: lightgreen;
|
||||
}
|
||||
</style>
|
||||
|
||||
<div id=container class=hidden>
|
||||
Text.
|
||||
<div id=child></div>
|
||||
</div>
|
||||
|
||||
<script>
|
||||
function runTest() {
|
||||
const container = document.getElementById("container");
|
||||
container.classList.remove("hidden");
|
||||
requestAnimationFrame(takeScreenshot);
|
||||
}
|
||||
|
||||
window.onload = runTest;
|
||||
</script>
|
||||
</html>
|
||||
|
|
@ -0,0 +1,20 @@
|
|||
<!doctype HTML>
|
||||
<html>
|
||||
<meta charset="utf8">
|
||||
<title>CSS Content Visibility: hidden container is not breakable (reference)</title>
|
||||
<link rel="author" title="Vladimir Levin" href="mailto:vmpstr@chromium.org">
|
||||
<link rel="help" href="https://drafts.csswg.org/css-contain/#content-visibility">
|
||||
|
||||
<style>
|
||||
#parent {
|
||||
width: 100px;
|
||||
}
|
||||
#container {
|
||||
border-top: solid green 50px;
|
||||
border-bottom: solid green 50px;
|
||||
}
|
||||
</style>
|
||||
|
||||
<div id="parent">
|
||||
<div id="container"></div>
|
||||
</div>
|
||||
|
|
@ -0,0 +1,29 @@
|
|||
<!doctype HTML>
|
||||
<html>
|
||||
<meta charset="utf8">
|
||||
<title>CSS Content Visibility: hidden container is not breakable</title>
|
||||
<link rel="author" title="Vladimir Levin" href="mailto:vmpstr@chromium.org">
|
||||
<link rel="help" href="https://drafts.csswg.org/css-contain/#content-visibility">
|
||||
<link rel="match" href="content-visibility-003-ref.html">
|
||||
<meta name="assert" content="content-visibility container is not breakable">
|
||||
<script src="/common/reftest-wait.js"></script>
|
||||
<script src="resources/utils.js"></script>
|
||||
|
||||
<style>
|
||||
#container {
|
||||
border-top: solid green 50px;
|
||||
border-bottom: solid green 50px;
|
||||
content-visibility: hidden;
|
||||
}
|
||||
#parent {
|
||||
columns: 2;
|
||||
height: 0px;
|
||||
width: 200px;
|
||||
column-gap: 0;
|
||||
}
|
||||
</style>
|
||||
|
||||
<div id="parent">
|
||||
<div id="container">Text</div>
|
||||
</div>
|
||||
</html>
|
||||
|
|
@ -0,0 +1,9 @@
|
|||
<!doctype HTML>
|
||||
<html>
|
||||
<meta charset="utf8">
|
||||
<title>CSS Content Visibility: hidden container in an iframe (reference)</title>
|
||||
<link rel="author" title="Vladimir Levin" href="mailto:vmpstr@chromium.org">
|
||||
<link rel="help" href="https://drafts.csswg.org/css-contain/#content-visibility">
|
||||
|
||||
<iframe></iframe>
|
||||
</html>
|
||||
|
|
@ -0,0 +1,20 @@
|
|||
<!doctype HTML>
|
||||
<html>
|
||||
<meta charset="utf8">
|
||||
<title>CSS Content Visibility: hidden container in an iframe</title>
|
||||
<link rel="author" title="Vladimir Levin" href="mailto:vmpstr@chromium.org">
|
||||
<link rel="help" href="https://drafts.csswg.org/css-contain/#content-visibility">
|
||||
<link rel="match" href="content-visibility-004-ref.html">
|
||||
<meta name="assert" content="content-visibility makes iframe contents hidden">
|
||||
|
||||
<iframe id="frame" srcdoc='
|
||||
<style>
|
||||
#container {
|
||||
width: 100px;
|
||||
height: 100px;
|
||||
content-visibility: hidden;
|
||||
}
|
||||
</style>
|
||||
<div id="container">Lorem</div>
|
||||
'></iframe>
|
||||
</html>
|
||||
|
|
@ -0,0 +1,42 @@
|
|||
<!doctype HTML>
|
||||
<html class="reftest-wait">
|
||||
<meta charset="utf8">
|
||||
<title>CSS Content Visibility: hidden stops painting when added</title>
|
||||
<link rel="author" title="Vladimir Levin" href="mailto:vmpstr@chromium.org">
|
||||
<link rel="help" href="https://drafts.csswg.org/css-contain/#content-visibility">
|
||||
<link rel="match" href="container-ref.html">
|
||||
<meta name="assert" content="content-visibility subtrees stop painting when hidden is added">
|
||||
|
||||
<script src="/common/reftest-wait.js"></script>
|
||||
|
||||
<style>
|
||||
#container {
|
||||
width: 150px;
|
||||
height: 150px;
|
||||
background: lightblue;
|
||||
}
|
||||
.hidden {
|
||||
content-visibility: hidden;
|
||||
}
|
||||
#child {
|
||||
width: 50px;
|
||||
height: 50px;
|
||||
background: lightgreen;
|
||||
}
|
||||
</style>
|
||||
|
||||
<div id=container>
|
||||
Text.
|
||||
<div id=child></div>
|
||||
</div>
|
||||
|
||||
<script>
|
||||
function runTest() {
|
||||
const container = document.getElementById("container");
|
||||
container.classList.add("hidden");
|
||||
requestAnimationFrame(takeScreenshot);
|
||||
}
|
||||
|
||||
window.onload = runTest;
|
||||
</script>
|
||||
</html>
|
||||
|
|
@ -0,0 +1,43 @@
|
|||
<!doctype HTML>
|
||||
<html class="reftest-wait">
|
||||
<meta charset="utf8">
|
||||
<title>CSS Content Visibility: hidden stops painting when added (composited)</title>
|
||||
<link rel="author" title="Vladimir Levin" href="mailto:vmpstr@chromium.org">
|
||||
<link rel="help" href="https://drafts.csswg.org/css-contain/#content-visibility">
|
||||
<link rel="match" href="container-ref.html">
|
||||
<meta name="assert" content="content-visibility subtrees stop painting when hidden is added">
|
||||
|
||||
<script src="/common/reftest-wait.js"></script>
|
||||
|
||||
<style>
|
||||
#container {
|
||||
width: 150px;
|
||||
height: 150px;
|
||||
background: lightblue;
|
||||
will-change: transform;
|
||||
}
|
||||
.hidden {
|
||||
content-visibility: hidden;
|
||||
}
|
||||
#child {
|
||||
width: 50px;
|
||||
height: 50px;
|
||||
background: lightgreen;
|
||||
}
|
||||
</style>
|
||||
|
||||
<div id=container>
|
||||
Text.
|
||||
<div id=child></div>
|
||||
</div>
|
||||
|
||||
<script>
|
||||
function runTest() {
|
||||
const container = document.getElementById("container");
|
||||
container.classList.add("hidden");
|
||||
requestAnimationFrame(takeScreenshot);
|
||||
}
|
||||
|
||||
window.onload = runTest;
|
||||
</script>
|
||||
</html>
|
||||
|
|
@ -0,0 +1,43 @@
|
|||
<!doctype HTML>
|
||||
<html class="reftest-wait">
|
||||
<meta charset="utf8">
|
||||
<title>CSS Content Visibility: hidden stops painting when added (composited child)</title>
|
||||
<link rel="author" title="Vladimir Levin" href="mailto:vmpstr@chromium.org">
|
||||
<link rel="help" href="https://drafts.csswg.org/css-contain/#content-visibility">
|
||||
<link rel="match" href="container-ref.html">
|
||||
<meta name="assert" content="content-visibility subtrees stop painting when hidden is added">
|
||||
|
||||
<script src="/common/reftest-wait.js"></script>
|
||||
|
||||
<style>
|
||||
#container {
|
||||
width: 150px;
|
||||
height: 150px;
|
||||
background: lightblue;
|
||||
}
|
||||
.hidden {
|
||||
content-visibility: hidden;
|
||||
}
|
||||
#child {
|
||||
width: 50px;
|
||||
height: 50px;
|
||||
background: lightgreen;
|
||||
will-change: transform;
|
||||
}
|
||||
</style>
|
||||
|
||||
<div id=container>
|
||||
Text.
|
||||
<div id=child></div>
|
||||
</div>
|
||||
|
||||
<script>
|
||||
function runTest() {
|
||||
const container = document.getElementById("container");
|
||||
container.classList.add("hidden");
|
||||
requestAnimationFrame(takeScreenshot);
|
||||
}
|
||||
|
||||
window.onload = runTest;
|
||||
</script>
|
||||
</html>
|
||||
|
|
@ -0,0 +1,44 @@
|
|||
<!doctype HTML>
|
||||
<html class="reftest-wait">
|
||||
<meta charset="utf8">
|
||||
<title>CSS Content Visibility: hidden stops painting when added (composited with composited child)</title>
|
||||
<link rel="author" title="Vladimir Levin" href="mailto:vmpstr@chromium.org">
|
||||
<link rel="help" href="https://drafts.csswg.org/css-contain/#content-visibility">
|
||||
<link rel="match" href="container-ref.html">
|
||||
<meta name="assert" content="content-visibility subtrees stop painting when hidden is added">
|
||||
|
||||
<script src="/common/reftest-wait.js"></script>
|
||||
|
||||
<style>
|
||||
#container {
|
||||
width: 150px;
|
||||
height: 150px;
|
||||
background: lightblue;
|
||||
will-change: transform;
|
||||
}
|
||||
.hidden {
|
||||
content-visibility: hidden;
|
||||
}
|
||||
#child {
|
||||
width: 50px;
|
||||
height: 50px;
|
||||
background: lightgreen;
|
||||
will-change: transform;
|
||||
}
|
||||
</style>
|
||||
|
||||
<div id=container>
|
||||
Text.
|
||||
<div id=child></div>
|
||||
</div>
|
||||
|
||||
<script>
|
||||
function runTest() {
|
||||
const container = document.getElementById("container");
|
||||
container.classList.add("hidden");
|
||||
requestAnimationFrame(takeScreenshot);
|
||||
}
|
||||
|
||||
window.onload = runTest;
|
||||
</script>
|
||||
</html>
|
||||
|
|
@ -0,0 +1,47 @@
|
|||
<!doctype HTML>
|
||||
<html class="reftest-wait">
|
||||
<meta charset="utf8">
|
||||
<title>CSS Content Visibility: hidden stops painting when added (positioned)</title>
|
||||
<link rel="author" title="Vladimir Levin" href="mailto:vmpstr@chromium.org">
|
||||
<link rel="help" href="https://drafts.csswg.org/css-contain/#content-visibility">
|
||||
<link rel="match" href="positioned-container-ref.html">
|
||||
<meta name="assert" content="content-visibility subtrees stop painting when hidden is added">
|
||||
|
||||
<script src="/common/reftest-wait.js"></script>
|
||||
|
||||
<style>
|
||||
#container {
|
||||
width: 150px;
|
||||
height: 150px;
|
||||
background: lightblue;
|
||||
}
|
||||
.positioned {
|
||||
position: absolute;
|
||||
top: 0;
|
||||
left: 0;
|
||||
}
|
||||
.hidden {
|
||||
content-visibility: hidden;
|
||||
}
|
||||
#child {
|
||||
width: 50px;
|
||||
height: 50px;
|
||||
background: lightgreen;
|
||||
}
|
||||
</style>
|
||||
|
||||
<div id=container class=positioned>
|
||||
Text.
|
||||
<div id=child></div>
|
||||
</div>
|
||||
|
||||
<script>
|
||||
function runTest() {
|
||||
const container = document.getElementById("container");
|
||||
container.classList.add("hidden");
|
||||
requestAnimationFrame(takeScreenshot);
|
||||
}
|
||||
|
||||
window.onload = runTest;
|
||||
</script>
|
||||
</html>
|
||||
|
|
@ -0,0 +1,47 @@
|
|||
<!doctype HTML>
|
||||
<html class="reftest-wait">
|
||||
<meta charset="utf8">
|
||||
<title>CSS Content Visibility: hidden stops painting when added (positioned child)</title>
|
||||
<link rel="author" title="Vladimir Levin" href="mailto:vmpstr@chromium.org">
|
||||
<link rel="help" href="https://drafts.csswg.org/css-contain/#content-visibility">
|
||||
<link rel="match" href="container-ref.html">
|
||||
<meta name="assert" content="content-visibility subtrees stop painting when hidden is added">
|
||||
|
||||
<script src="/common/reftest-wait.js"></script>
|
||||
|
||||
<style>
|
||||
#container {
|
||||
width: 150px;
|
||||
height: 150px;
|
||||
background: lightblue;
|
||||
}
|
||||
.positioned {
|
||||
position: absolute;
|
||||
top: 0;
|
||||
left: 0;
|
||||
}
|
||||
.hidden {
|
||||
content-visibility: hidden;
|
||||
}
|
||||
#child {
|
||||
width: 50px;
|
||||
height: 50px;
|
||||
background: lightgreen;
|
||||
}
|
||||
</style>
|
||||
|
||||
<div id=container>
|
||||
Text.
|
||||
<div id=child class=positioned></div>
|
||||
</div>
|
||||
|
||||
<script>
|
||||
function runTest() {
|
||||
const container = document.getElementById("container");
|
||||
container.classList.add("hidden");
|
||||
requestAnimationFrame(takeScreenshot);
|
||||
}
|
||||
|
||||
window.onload = runTest;
|
||||
</script>
|
||||
</html>
|
||||
|
|
@ -0,0 +1,47 @@
|
|||
<!doctype HTML>
|
||||
<html class="reftest-wait">
|
||||
<meta charset="utf8">
|
||||
<title>CSS Content Visibility: hidden stops painting when added (positioned with a positioned child)</title>
|
||||
<link rel="author" title="Vladimir Levin" href="mailto:vmpstr@chromium.org">
|
||||
<link rel="help" href="https://drafts.csswg.org/css-contain/#content-visibility">
|
||||
<link rel="match" href="positioned-container-ref.html">
|
||||
<meta name="assert" content="content-visibility subtrees stop painting when hidden is added">
|
||||
|
||||
<script src="/common/reftest-wait.js"></script>
|
||||
|
||||
<style>
|
||||
#container {
|
||||
width: 150px;
|
||||
height: 150px;
|
||||
background: lightblue;
|
||||
}
|
||||
.positioned {
|
||||
position: absolute;
|
||||
top: 0;
|
||||
left: 0;
|
||||
}
|
||||
.hidden {
|
||||
content-visibility: hidden;
|
||||
}
|
||||
#child {
|
||||
width: 50px;
|
||||
height: 50px;
|
||||
background: lightgreen;
|
||||
}
|
||||
</style>
|
||||
|
||||
<div id=container class=positioned>
|
||||
Text.
|
||||
<div id=child class=positioned></div>
|
||||
</div>
|
||||
|
||||
<script>
|
||||
function runTest() {
|
||||
const container = document.getElementById("container");
|
||||
container.classList.add("hidden");
|
||||
requestAnimationFrame(takeScreenshot);
|
||||
}
|
||||
|
||||
window.onload = runTest;
|
||||
</script>
|
||||
</html>
|
||||
|
|
@ -0,0 +1,43 @@
|
|||
<!doctype HTML>
|
||||
<html class="reftest-wait">
|
||||
<meta charset="utf8">
|
||||
<title>CSS Content Visibility: hidden starts painting when removed (composited)</title>
|
||||
<link rel="author" title="Vladimir Levin" href="mailto:vmpstr@chromium.org">
|
||||
<link rel="help" href="https://drafts.csswg.org/css-contain/#content-visibility">
|
||||
<link rel="match" href="container-with-child-ref.html">
|
||||
<meta name="assert" content="content-visibility subtrees start painting when hidden is removed">
|
||||
|
||||
<script src="/common/reftest-wait.js"></script>
|
||||
|
||||
<style>
|
||||
#container {
|
||||
width: 150px;
|
||||
height: 150px;
|
||||
background: lightblue;
|
||||
will-change: transform;
|
||||
}
|
||||
.hidden {
|
||||
content-visibility: hidden;
|
||||
}
|
||||
#child {
|
||||
width: 50px;
|
||||
height: 50px;
|
||||
background: lightgreen;
|
||||
}
|
||||
</style>
|
||||
|
||||
<div id=container class=hidden>
|
||||
Text.
|
||||
<div id=child></div>
|
||||
</div>
|
||||
|
||||
<script>
|
||||
function runTest() {
|
||||
const container = document.getElementById("container");
|
||||
container.classList.remove("hidden");
|
||||
requestAnimationFrame(takeScreenshot);
|
||||
}
|
||||
|
||||
window.onload = runTest;
|
||||
</script>
|
||||
</html>
|
||||
|
|
@ -0,0 +1,43 @@
|
|||
<!doctype HTML>
|
||||
<html class="reftest-wait">
|
||||
<meta charset="utf8">
|
||||
<title>CSS Content Visibility: hidden starts painting when removed (composited child)</title>
|
||||
<link rel="author" title="Vladimir Levin" href="mailto:vmpstr@chromium.org">
|
||||
<link rel="help" href="https://drafts.csswg.org/css-contain/#content-visibility">
|
||||
<link rel="match" href="container-with-child-ref.html">
|
||||
<meta name="assert" content="content-visibility subtrees start painting when hidden is removed">
|
||||
|
||||
<script src="/common/reftest-wait.js"></script>
|
||||
|
||||
<style>
|
||||
#container {
|
||||
width: 150px;
|
||||
height: 150px;
|
||||
background: lightblue;
|
||||
}
|
||||
.hidden {
|
||||
content-visibility: hidden;
|
||||
}
|
||||
#child {
|
||||
width: 50px;
|
||||
height: 50px;
|
||||
background: lightgreen;
|
||||
will-change: transform;
|
||||
}
|
||||
</style>
|
||||
|
||||
<div id=container class=hidden>
|
||||
Text.
|
||||
<div id=child></div>
|
||||
</div>
|
||||
|
||||
<script>
|
||||
function runTest() {
|
||||
const container = document.getElementById("container");
|
||||
container.classList.remove("hidden");
|
||||
requestAnimationFrame(takeScreenshot);
|
||||
}
|
||||
|
||||
window.onload = runTest;
|
||||
</script>
|
||||
</html>
|
||||
|
|
@ -0,0 +1,44 @@
|
|||
<!doctype HTML>
|
||||
<html class="reftest-wait">
|
||||
<meta charset="utf8">
|
||||
<title>CSS Content Visibility: hidden starts painting when removed (composited with a composited child)</title>
|
||||
<link rel="author" title="Vladimir Levin" href="mailto:vmpstr@chromium.org">
|
||||
<link rel="help" href="https://drafts.csswg.org/css-contain/#content-visibility">
|
||||
<link rel="match" href="container-with-child-ref.html">
|
||||
<meta name="assert" content="content-visibility subtrees start painting when hidden is removed">
|
||||
|
||||
<script src="/common/reftest-wait.js"></script>
|
||||
|
||||
<style>
|
||||
#container {
|
||||
width: 150px;
|
||||
height: 150px;
|
||||
background: lightblue;
|
||||
will-change: transform;
|
||||
}
|
||||
.hidden {
|
||||
content-visibility: hidden;
|
||||
}
|
||||
#child {
|
||||
width: 50px;
|
||||
height: 50px;
|
||||
background: lightgreen;
|
||||
will-change: transform;
|
||||
}
|
||||
</style>
|
||||
|
||||
<div id=container class=hidden>
|
||||
Text.
|
||||
<div id=child></div>
|
||||
</div>
|
||||
|
||||
<script>
|
||||
function runTest() {
|
||||
const container = document.getElementById("container");
|
||||
container.classList.remove("hidden");
|
||||
requestAnimationFrame(takeScreenshot);
|
||||
}
|
||||
|
||||
window.onload = runTest;
|
||||
</script>
|
||||
</html>
|
||||
|
|
@ -0,0 +1,50 @@
|
|||
<!doctype HTML>
|
||||
<html>
|
||||
<meta charset="utf8">
|
||||
<title>Content Visibility: hit testing</title>
|
||||
<link rel="author" title="Vladimir Levin" href="mailto:vmpstr@chromium.org">
|
||||
<link rel="help" href="https://drafts.csswg.org/css-contain/#content-visibility">
|
||||
<meta name="assert" content="content-visibility hidden prevents hit-testing in the subtree">
|
||||
|
||||
<script src="/resources/testharness.js"></script>
|
||||
<script src="/resources/testharnessreport.js"></script>
|
||||
|
||||
<style>
|
||||
body {
|
||||
margin: 0;
|
||||
padding: 0;
|
||||
}
|
||||
#outer {
|
||||
width: 100px;
|
||||
height: 100px;
|
||||
background: lightblue;
|
||||
|
||||
content-visibility: hidden;
|
||||
}
|
||||
#inner {
|
||||
margin: 25px;
|
||||
width: 50px;
|
||||
height: 50px;
|
||||
background lightgreen;
|
||||
}
|
||||
</style>
|
||||
|
||||
<body id="body">
|
||||
<div id="outer"><div id="inner"></div></div>
|
||||
</body>
|
||||
|
||||
<script>
|
||||
async_test((t) => {
|
||||
const container = document.getElementById("outer");
|
||||
|
||||
let target = document.elementFromPoint(50, 50);
|
||||
t.step(() => assert_equals(target.id, "outer", "center hits outer"));
|
||||
target = document.elementFromPoint(10, 50);
|
||||
t.step(() => assert_equals(target.id, "outer", "edge hits outer"));
|
||||
target = document.elementFromPoint(100, 50);
|
||||
t.step(() => assert_equals(target.id, "body", "elsewhere hits body"));
|
||||
t.done();
|
||||
});
|
||||
|
||||
</script>
|
||||
</html>
|
||||
|
|
@ -0,0 +1,51 @@
|
|||
<!doctype HTML>
|
||||
<html>
|
||||
<meta charset="utf8">
|
||||
<title>Content Visibility: hit testing (composited)</title>
|
||||
<link rel="author" title="Vladimir Levin" href="mailto:vmpstr@chromium.org">
|
||||
<link rel="help" href="https://drafts.csswg.org/css-contain/#content-visibility">
|
||||
<meta name="assert" content="content-visibility hidden prevents hit-testing in the subtree">
|
||||
|
||||
<script src="/resources/testharness.js"></script>
|
||||
<script src="/resources/testharnessreport.js"></script>
|
||||
|
||||
<style>
|
||||
body {
|
||||
margin: 0;
|
||||
padding: 0;
|
||||
}
|
||||
#outer {
|
||||
width: 100px;
|
||||
height: 100px;
|
||||
background: lightblue;
|
||||
|
||||
content-visibility: hidden;
|
||||
will-change: transform;
|
||||
}
|
||||
#inner {
|
||||
margin: 25px;
|
||||
width: 50px;
|
||||
height: 50px;
|
||||
background lightgreen;
|
||||
}
|
||||
</style>
|
||||
|
||||
<body id="body">
|
||||
<div id="outer"><div id="inner"></div></div>
|
||||
</body>
|
||||
|
||||
<script>
|
||||
async_test((t) => {
|
||||
const container = document.getElementById("outer");
|
||||
|
||||
let target = document.elementFromPoint(50, 50);
|
||||
t.step(() => assert_equals(target.id, "outer", "center hits outer"));
|
||||
target = document.elementFromPoint(10, 50);
|
||||
t.step(() => assert_equals(target.id, "outer", "edge hits outer"));
|
||||
target = document.elementFromPoint(100, 50);
|
||||
t.step(() => assert_equals(target.id, "body", "elsewhere hits body"));
|
||||
t.done();
|
||||
});
|
||||
|
||||
</script>
|
||||
</html>
|
||||
|
|
@ -0,0 +1,51 @@
|
|||
<!doctype HTML>
|
||||
<html>
|
||||
<meta charset="utf8">
|
||||
<title>Content Visibility: hit testing (composited child)</title>
|
||||
<link rel="author" title="Vladimir Levin" href="mailto:vmpstr@chromium.org">
|
||||
<link rel="help" href="https://drafts.csswg.org/css-contain/#content-visibility">
|
||||
<meta name="assert" content="content-visibility hidden prevents hit-testing in the subtree">
|
||||
|
||||
<script src="/resources/testharness.js"></script>
|
||||
<script src="/resources/testharnessreport.js"></script>
|
||||
|
||||
<style>
|
||||
body {
|
||||
margin: 0;
|
||||
padding: 0;
|
||||
}
|
||||
#outer {
|
||||
width: 100px;
|
||||
height: 100px;
|
||||
background: lightblue;
|
||||
|
||||
content-visibility: hidden;
|
||||
}
|
||||
#inner {
|
||||
margin: 25px;
|
||||
width: 50px;
|
||||
height: 50px;
|
||||
background lightgreen;
|
||||
will-change: transform;
|
||||
}
|
||||
</style>
|
||||
|
||||
<body id="body">
|
||||
<div id="outer"><div id="inner"></div></div>
|
||||
</body>
|
||||
|
||||
<script>
|
||||
async_test((t) => {
|
||||
const container = document.getElementById("outer");
|
||||
|
||||
let target = document.elementFromPoint(50, 50);
|
||||
t.step(() => assert_equals(target.id, "outer", "center hits outer"));
|
||||
target = document.elementFromPoint(10, 50);
|
||||
t.step(() => assert_equals(target.id, "outer", "edge hits outer"));
|
||||
target = document.elementFromPoint(100, 50);
|
||||
t.step(() => assert_equals(target.id, "body", "elsewhere hits body"));
|
||||
t.done();
|
||||
});
|
||||
|
||||
</script>
|
||||
</html>
|
||||
|
|
@ -0,0 +1,52 @@
|
|||
<!doctype HTML>
|
||||
<html>
|
||||
<meta charset="utf8">
|
||||
<title>Content Visibility: hit testing (composited with a composited child)</title>
|
||||
<link rel="author" title="Vladimir Levin" href="mailto:vmpstr@chromium.org">
|
||||
<link rel="help" href="https://drafts.csswg.org/css-contain/#content-visibility">
|
||||
<meta name="assert" content="content-visibility hidden prevents hit-testing in the subtree">
|
||||
|
||||
<script src="/resources/testharness.js"></script>
|
||||
<script src="/resources/testharnessreport.js"></script>
|
||||
|
||||
<style>
|
||||
body {
|
||||
margin: 0;
|
||||
padding: 0;
|
||||
}
|
||||
#outer {
|
||||
width: 100px;
|
||||
height: 100px;
|
||||
background: lightblue;
|
||||
|
||||
content-visibility: hidden;
|
||||
will-change: transform;
|
||||
}
|
||||
#inner {
|
||||
margin: 25px;
|
||||
width: 50px;
|
||||
height: 50px;
|
||||
background lightgreen;
|
||||
will-change: transform;
|
||||
}
|
||||
</style>
|
||||
|
||||
<body id="body">
|
||||
<div id="outer"><div id="inner"></div></div>
|
||||
</body>
|
||||
|
||||
<script>
|
||||
async_test((t) => {
|
||||
const container = document.getElementById("outer");
|
||||
|
||||
let target = document.elementFromPoint(50, 50);
|
||||
t.step(() => assert_equals(target.id, "outer", "center hits outer"));
|
||||
target = document.elementFromPoint(10, 50);
|
||||
t.step(() => assert_equals(target.id, "outer", "edge hits outer"));
|
||||
target = document.elementFromPoint(100, 50);
|
||||
t.step(() => assert_equals(target.id, "body", "elsewhere hits body"));
|
||||
t.done();
|
||||
});
|
||||
|
||||
</script>
|
||||
</html>
|
||||
|
|
@ -0,0 +1,16 @@
|
|||
<!doctype HTML>
|
||||
<html>
|
||||
<meta charset="utf8">
|
||||
<title>Display Locking: iframe locking (reference)</title>
|
||||
<link rel="author" title="Vladimir Levin" href="mailto:vmpstr@chromium.org">
|
||||
<link rel="help" href="https://drafts.csswg.org/css-contain/#content-visibility">
|
||||
|
||||
<style>
|
||||
div {
|
||||
background: blue;
|
||||
}
|
||||
</style>
|
||||
|
||||
<div>lorem ipsum</div>
|
||||
<iframe id="frame" width=400 height=200 srcdoc=''></iframe>
|
||||
<div>consectetur adipiscing elit</div>
|
||||
|
|
@ -0,0 +1,36 @@
|
|||
<!doctype HTML>
|
||||
<html class="reftest-wait">
|
||||
<meta charset="utf8">
|
||||
<title>Content Visibility: cross-origin iframe locking</title>
|
||||
<link rel="author" title="Vladimir Levin" href="mailto:vmpstr@chromium.org">
|
||||
<link rel="help" href="https://drafts.csswg.org/css-contain/#content-visibility">
|
||||
<link rel="match" href="content-visibility-019-ref.html">
|
||||
<script src="/common/reftest-wait.js"></script>
|
||||
<script src="../resources/utils.js"></script>
|
||||
|
||||
<style>
|
||||
div {
|
||||
background: blue;
|
||||
}
|
||||
.hidden {
|
||||
content-visibility: hidden;
|
||||
}
|
||||
</style>
|
||||
|
||||
<div>lorem ipsum</div>
|
||||
<iframe id="frame" width=400 height=200 src='https://{{domains[www]}}:{{ports[https][0]}}/wpt_internal/display-lock/css-content-visibility/resources/frame.html'></iframe>
|
||||
<div>consectetur adipiscing elit</div>
|
||||
|
||||
<script>
|
||||
async function runTest() {
|
||||
document.getElementById("frame").classList.add("hidden");
|
||||
requestAnimationFrame(takeScreenshot);
|
||||
}
|
||||
|
||||
window.onload = () => {
|
||||
requestAnimationFrame(() => {
|
||||
requestAnimationFrame(runTest);
|
||||
});
|
||||
};
|
||||
</script>
|
||||
</html>
|
||||
|
|
@ -0,0 +1,16 @@
|
|||
<!doctype HTML>
|
||||
<html>
|
||||
<meta charset="utf8">
|
||||
<title>Content Visibility: hidden iframe (reference)</title>
|
||||
<link rel="author" title="Vladimir Levin" href="mailto:vmpstr@chromium.org">
|
||||
<link rel="help" href="https://drafts.csswg.org/css-contain/#content-visibility">
|
||||
|
||||
<style>
|
||||
div {
|
||||
background: blue;
|
||||
}
|
||||
</style>
|
||||
|
||||
<div>lorem ipsum</div>
|
||||
<iframe id="frame" width=400 height=200 srcdoc=''></iframe>
|
||||
<div>consectetur adipiscing elit</div>
|
||||
|
|
@ -0,0 +1,45 @@
|
|||
<!doctype HTML>
|
||||
<html class="reftest-wait">
|
||||
<meta charset="utf8">
|
||||
<title>Content Visibility: hidden iframe</title>
|
||||
<link rel="author" title="Vladimir Levin" href="mailto:vmpstr@chromium.org">
|
||||
<link rel="help" href="https://drafts.csswg.org/css-contain/#content-visibility">
|
||||
<link rel="match" href="content-visibility-020-ref.html">
|
||||
<meta name="assert" content="content-visibility hidden iframe does not paint">
|
||||
|
||||
<script src="/common/reftest-wait.js"></script>
|
||||
<script src="../resources/utils.js"></script>
|
||||
|
||||
<style>
|
||||
div {
|
||||
background: blue;
|
||||
}
|
||||
.hidden {
|
||||
content-visibility: hidden;
|
||||
}
|
||||
</style>
|
||||
|
||||
<div>lorem ipsum</div>
|
||||
<iframe id="frame" width=400 height=200 srcdoc='
|
||||
<style>
|
||||
div {
|
||||
background: lightgreen;
|
||||
}
|
||||
</style>
|
||||
<div>dolor sit amet</div>
|
||||
'></iframe>
|
||||
<div>consectetur adipiscing elit</div>
|
||||
|
||||
<script>
|
||||
async function runTest() {
|
||||
document.getElementById("frame").classList.add("hidden");
|
||||
requestAnimationFrame(takeScreenshot);
|
||||
}
|
||||
|
||||
window.onload = () => {
|
||||
requestAnimationFrame(() => {
|
||||
requestAnimationFrame(runTest);
|
||||
});
|
||||
};
|
||||
</script>
|
||||
</html>
|
||||
|
|
@ -0,0 +1,24 @@
|
|||
<!doctype HTML>
|
||||
<html>
|
||||
<meta charset="utf8">
|
||||
<title>Content Visibility: hidden image (reference)</title>
|
||||
<link rel="author" title="Vladimir Levin" href="mailto:vmpstr@chromium.org">
|
||||
<link rel="help" href="https://drafts.csswg.org/css-contain/#content-visibility">
|
||||
|
||||
<style>
|
||||
div {
|
||||
background: blue;
|
||||
}
|
||||
.myimg {
|
||||
display: inline-block;
|
||||
width: 400px;
|
||||
height: 200px;
|
||||
background: lightblue;
|
||||
border: 1px solid black;
|
||||
}
|
||||
</style>
|
||||
|
||||
<div>lorem ipsum</div>
|
||||
<div class="myimg"></div>
|
||||
<div class="myimg"></div>
|
||||
<div>consectetur adipiscing elit</div>
|
||||
|
|
@ -0,0 +1,45 @@
|
|||
<!doctype HTML>
|
||||
<html class="reftest-wait">
|
||||
<meta charset="utf8">
|
||||
<title>Content Visibility: hidden image</title>
|
||||
<link rel="author" title="Vladimir Levin" href="mailto:vmpstr@chromium.org">
|
||||
<link rel="help" href="https://drafts.csswg.org/css-contain/#content-visibility">
|
||||
<link rel="match" href="content-visibility-021-ref.html">
|
||||
<meta name="assert" content="content-visibility hidden img element does not paint replaced content">
|
||||
|
||||
<script src="/common/reftest-wait.js"></script>
|
||||
|
||||
<style>
|
||||
div {
|
||||
background: blue;
|
||||
}
|
||||
img {
|
||||
width: 400px;
|
||||
height: 200px;
|
||||
background: lightblue;
|
||||
border: 1px solid black;
|
||||
}
|
||||
.hidden {
|
||||
content-visibility: hidden;
|
||||
}
|
||||
</style>
|
||||
|
||||
<div>lorem ipsum</div>
|
||||
<img id="img1" src="resources/dice.png"></img>
|
||||
<img id="img2" src="resources/circles.svg"></img>
|
||||
<div>consectetur adipiscing elit</div>
|
||||
|
||||
<script>
|
||||
async function runTest() {
|
||||
document.getElementById("img1").classList.add("hidden");
|
||||
document.getElementById("img2").classList.add("hidden");
|
||||
requestAnimationFrame(takeScreenshot);
|
||||
}
|
||||
|
||||
window.onload = () => {
|
||||
requestAnimationFrame(() => {
|
||||
requestAnimationFrame(runTest);
|
||||
});
|
||||
};
|
||||
</script>
|
||||
</html>
|
||||
|
|
@ -0,0 +1,23 @@
|
|||
<!doctype HTML>
|
||||
<html>
|
||||
<meta charset="utf8">
|
||||
<title>Content Visibility: hidden svg (reference)</title>
|
||||
<link rel="author" title="Vladimir Levin" href="mailto:vmpstr@chromium.org">
|
||||
<link rel="help" href="https://drafts.csswg.org/css-contain/#content-visibility">
|
||||
|
||||
<style>
|
||||
div {
|
||||
background: blue;
|
||||
}
|
||||
.mysvg {
|
||||
display: inline-block;
|
||||
width: 400px;
|
||||
height: 300px;
|
||||
background: lightblue;
|
||||
border: 1px solid black;
|
||||
}
|
||||
</style>
|
||||
|
||||
<div>lorem ipsum</div>
|
||||
<div class="mysvg"></div>
|
||||
<div>consectetur adipiscing elit</div>
|
||||
|
|
@ -0,0 +1,52 @@
|
|||
<!doctype HTML>
|
||||
<html class="reftest-wait">
|
||||
<meta charset="utf8">
|
||||
<title>Content Visibility: hidden svg</title>
|
||||
<link rel="author" title="Vladimir Levin" href="mailto:vmpstr@chromium.org">
|
||||
<link rel="help" href="https://drafts.csswg.org/css-contain/#content-visibility">
|
||||
<link rel="match" href="content-visibility-022-ref.html">
|
||||
<meta name="assert" content="content-visibility hidden svg does not paint">
|
||||
|
||||
<script src="/common/reftest-wait.js"></script>
|
||||
|
||||
<style>
|
||||
div {
|
||||
background: blue;
|
||||
}
|
||||
svg {
|
||||
border: 1px solid black;
|
||||
background: lightblue;
|
||||
}
|
||||
.hidden {
|
||||
content-visibility: hidden;
|
||||
}
|
||||
</style>
|
||||
|
||||
<div>lorem ipsum</div>
|
||||
<svg xmlns="http://www.w3.org/2000/svg" width="400" height="300" viewBox="0 0 400 300" id="svg">
|
||||
<g stroke-width="10" transform="translate(-30)">
|
||||
<circle cx="80" cy="50" r="35" fill="#084" stroke="none"/>
|
||||
<circle cx="80" cy="50" r="20" fill="#080" stroke="#FF0"/>
|
||||
<circle cx="80" cy="120" r="35" fill="#004" stroke="none"/>
|
||||
<circle cx="80" cy="120" r="20" fill="#080" stroke="#FF0"/>
|
||||
<circle cx="80" cy="190" r="35" fill="#088" stroke="none"/>
|
||||
<circle cx="80" cy="190" r="20" fill="#080" stroke="#FF0"/>
|
||||
<circle cx="80" cy="260" r="35" fill="#008" stroke="none"/>
|
||||
<circle cx="80" cy="260" r="20" fill="#080" stroke="#FF0"/>
|
||||
</g>
|
||||
</svg>
|
||||
<div>consectetur adipiscing elit</div>
|
||||
|
||||
<script>
|
||||
async function runTest() {
|
||||
document.getElementById("svg").classList.add("hidden");
|
||||
requestAnimationFrame(takeScreenshot);
|
||||
}
|
||||
|
||||
window.onload = () => {
|
||||
requestAnimationFrame(() => {
|
||||
requestAnimationFrame(runTest);
|
||||
});
|
||||
};
|
||||
</script>
|
||||
</html>
|
||||
|
|
@ -0,0 +1,23 @@
|
|||
<!doctype HTML>
|
||||
<html>
|
||||
<meta charset="utf8">
|
||||
<title>Content Visibility: hidden iframe (reference)</title>
|
||||
<link rel="author" title="Vladimir Levin" href="mailto:vmpstr@chromium.org">
|
||||
<link rel="help" href="https://drafts.csswg.org/css-contain/#content-visibility">
|
||||
|
||||
<style>
|
||||
div {
|
||||
background: blue;
|
||||
}
|
||||
</style>
|
||||
|
||||
<div>lorem ipsum</div>
|
||||
<iframe width=400 height=200 srcdoc='
|
||||
<style>
|
||||
div {
|
||||
background: lightgreen;
|
||||
}
|
||||
</style>
|
||||
<div>dolor sit amet</div>
|
||||
'></iframe>
|
||||
<div>consectetur adipiscing elit</div>
|
||||
|
|
@ -0,0 +1,44 @@
|
|||
<!doctype HTML>
|
||||
<html class="reftest-wait">
|
||||
<meta charset="utf8">
|
||||
<title>Content Visibility: hidden iframe</title>
|
||||
<link rel="author" title="Vladimir Levin" href="mailto:vmpstr@chromium.org">
|
||||
<link rel="help" href="https://drafts.csswg.org/css-contain/#content-visibility">
|
||||
<link rel="match" href="content-visibility-023-ref.html">
|
||||
<meta name="assert" content="content-visibility hidden iframe paints when hidden is removed">
|
||||
|
||||
<script src="/common/reftest-wait.js"></script>
|
||||
|
||||
<style>
|
||||
div {
|
||||
background: blue;
|
||||
}
|
||||
.hidden {
|
||||
content-visibility: hidden;
|
||||
}
|
||||
</style>
|
||||
|
||||
<div>lorem ipsum</div>
|
||||
<iframe id="frame" class=hidden width=400 height=200 srcdoc='
|
||||
<style>
|
||||
div {
|
||||
background: lightgreen;
|
||||
}
|
||||
</style>
|
||||
<div>dolor sit amet</div>
|
||||
'></iframe>
|
||||
<div>consectetur adipiscing elit</div>
|
||||
|
||||
<script>
|
||||
async function runTest() {
|
||||
document.getElementById("frame").classList.remove("hidden");
|
||||
requestAnimationFrame(takeScreenshot);
|
||||
}
|
||||
|
||||
window.onload = () => {
|
||||
requestAnimationFrame(() => {
|
||||
requestAnimationFrame(runTest);
|
||||
});
|
||||
};
|
||||
</script>
|
||||
</html>
|
||||
|
|
@ -0,0 +1,23 @@
|
|||
<!doctype HTML>
|
||||
<html>
|
||||
<meta charset="utf8">
|
||||
<title>Content Visibility: hidden image (reference)</title>
|
||||
<link rel="author" title="Vladimir Levin" href="mailto:vmpstr@chromium.org">
|
||||
<link rel="help" href="https://drafts.csswg.org/css-contain/#content-visibility">
|
||||
|
||||
<style>
|
||||
div {
|
||||
background: blue;
|
||||
}
|
||||
img {
|
||||
width: 400px;
|
||||
height: 200px;
|
||||
background: lightblue;
|
||||
border: 1px solid black;
|
||||
}
|
||||
</style>
|
||||
|
||||
<div>lorem ipsum</div>
|
||||
<img src="resources/dice.png"></img>
|
||||
<img src="resources/circles.svg"></img>
|
||||
<div>consectetur adipiscing elit</div>
|
||||
|
|
@ -0,0 +1,45 @@
|
|||
<!doctype HTML>
|
||||
<html class="reftest-wait">
|
||||
<meta charset="utf8">
|
||||
<title>Content Visibility: hidden image</title>
|
||||
<link rel="author" title="Vladimir Levin" href="mailto:vmpstr@chromium.org">
|
||||
<link rel="help" href="https://drafts.csswg.org/css-contain/#content-visibility">
|
||||
<link rel="match" href="content-visibility-024-ref.html">
|
||||
<meta name="assert" content="content-visibility hidden img element paints when hidden is removed">
|
||||
|
||||
<script src="/common/reftest-wait.js"></script>
|
||||
|
||||
<style>
|
||||
div {
|
||||
background: blue;
|
||||
}
|
||||
img {
|
||||
width: 400px;
|
||||
height: 200px;
|
||||
background: lightblue;
|
||||
border: 1px solid black;
|
||||
}
|
||||
.hidden {
|
||||
content-visibility: hidden;
|
||||
}
|
||||
</style>
|
||||
|
||||
<div>lorem ipsum</div>
|
||||
<img id="img1" class=hidden src="resources/dice.png"></img>
|
||||
<img id="img2" class=hidden src="resources/circles.svg"></img>
|
||||
<div>consectetur adipiscing elit</div>
|
||||
|
||||
<script>
|
||||
async function runTest() {
|
||||
document.getElementById("img1").classList.remove("hidden");
|
||||
document.getElementById("img2").classList.remove("hidden");
|
||||
requestAnimationFrame(takeScreenshot);
|
||||
}
|
||||
|
||||
window.onload = () => {
|
||||
requestAnimationFrame(() => {
|
||||
requestAnimationFrame(runTest);
|
||||
});
|
||||
};
|
||||
</script>
|
||||
</html>
|
||||
|
|
@ -0,0 +1,31 @@
|
|||
<!doctype HTML>
|
||||
<html>
|
||||
<meta charset="utf8">
|
||||
<title>Content Visibility: hidden svg (reference)</title>
|
||||
<link rel="author" title="Vladimir Levin" href="mailto:vmpstr@chromium.org">
|
||||
<link rel="help" href="https://drafts.csswg.org/css-contain/#content-visibility">
|
||||
|
||||
<style>
|
||||
div {
|
||||
background: blue;
|
||||
}
|
||||
svg {
|
||||
border: 1px solid black;
|
||||
background: lightblue;
|
||||
}
|
||||
</style>
|
||||
|
||||
<div>lorem ipsum</div>
|
||||
<svg xmlns="http://www.w3.org/2000/svg" width="400" height="300" viewBox="0 0 400 300">
|
||||
<g stroke-width="10" transform="translate(-30)">
|
||||
<circle cx="80" cy="50" r="35" fill="#084" stroke="none"/>
|
||||
<circle cx="80" cy="50" r="20" fill="#080" stroke="#FF0"/>
|
||||
<circle cx="80" cy="120" r="35" fill="#004" stroke="none"/>
|
||||
<circle cx="80" cy="120" r="20" fill="#080" stroke="#FF0"/>
|
||||
<circle cx="80" cy="190" r="35" fill="#088" stroke="none"/>
|
||||
<circle cx="80" cy="190" r="20" fill="#080" stroke="#FF0"/>
|
||||
<circle cx="80" cy="260" r="35" fill="#008" stroke="none"/>
|
||||
<circle cx="80" cy="260" r="20" fill="#080" stroke="#FF0"/>
|
||||
</g>
|
||||
</svg>
|
||||
<div>consectetur adipiscing elit</div>
|
||||
|
|
@ -0,0 +1,52 @@
|
|||
<!doctype HTML>
|
||||
<html class="reftest-wait">
|
||||
<meta charset="utf8">
|
||||
<title>Content Visibility: hidden svg</title>
|
||||
<link rel="author" title="Vladimir Levin" href="mailto:vmpstr@chromium.org">
|
||||
<link rel="help" href="https://drafts.csswg.org/css-contain/#content-visibility">
|
||||
<link rel="match" href="content-visibility-025-ref.html">
|
||||
<meta name="assert" content="content-visibility hidden svg paints when hidden is removed">
|
||||
|
||||
<script src="/common/reftest-wait.js"></script>
|
||||
|
||||
<style>
|
||||
div {
|
||||
background: blue;
|
||||
}
|
||||
svg {
|
||||
border: 1px solid black;
|
||||
background: lightblue;
|
||||
}
|
||||
.hidden {
|
||||
content-visibility: hidden;
|
||||
}
|
||||
</style>
|
||||
|
||||
<div>lorem ipsum</div>
|
||||
<svg class=hidden xmlns="http://www.w3.org/2000/svg" width="400" height="300" viewBox="0 0 400 300" id="svg">
|
||||
<g stroke-width="10" transform="translate(-30)">
|
||||
<circle cx="80" cy="50" r="35" fill="#084" stroke="none"/>
|
||||
<circle cx="80" cy="50" r="20" fill="#080" stroke="#FF0"/>
|
||||
<circle cx="80" cy="120" r="35" fill="#004" stroke="none"/>
|
||||
<circle cx="80" cy="120" r="20" fill="#080" stroke="#FF0"/>
|
||||
<circle cx="80" cy="190" r="35" fill="#088" stroke="none"/>
|
||||
<circle cx="80" cy="190" r="20" fill="#080" stroke="#FF0"/>
|
||||
<circle cx="80" cy="260" r="35" fill="#008" stroke="none"/>
|
||||
<circle cx="80" cy="260" r="20" fill="#080" stroke="#FF0"/>
|
||||
</g>
|
||||
</svg>
|
||||
<div>consectetur adipiscing elit</div>
|
||||
|
||||
<script>
|
||||
async function runTest() {
|
||||
document.getElementById("svg").classList.remove("hidden");
|
||||
requestAnimationFrame(takeScreenshot);
|
||||
}
|
||||
|
||||
window.onload = () => {
|
||||
requestAnimationFrame(() => {
|
||||
requestAnimationFrame(runTest);
|
||||
});
|
||||
};
|
||||
</script>
|
||||
</html>
|
||||
|
|
@ -0,0 +1,87 @@
|
|||
<!doctype HTML>
|
||||
<html>
|
||||
<meta charset="utf8">
|
||||
<title>Content Visibility: containment added</title>
|
||||
<link rel="author" title="Rakina Zata Amni" href="mailto:rakina@chromium.org">
|
||||
<link rel="help" href="https://drafts.csswg.org/css-contain/#content-visibility">
|
||||
<meta name="assert" content="content-visibility visible does not add containment">
|
||||
<meta name="assert" content="content-visibility hidden adds containment">
|
||||
<meta name="assert" content="content-visibility auto adds containment">
|
||||
<meta name="assert" content="content-visibility auto visibility switches after rAF callbacks of the frame that produces the painted output">
|
||||
|
||||
<style>
|
||||
.auto {
|
||||
content-visibility: auto;
|
||||
}
|
||||
.hidden {
|
||||
content-visibility: hidden;
|
||||
}
|
||||
</style>
|
||||
<div id="container"></div>
|
||||
<div id="async_container"></div>
|
||||
|
||||
<script src="/resources/testharness.js"></script>
|
||||
<script src="/resources/testharnessreport.js"></script>
|
||||
|
||||
<script>
|
||||
function setUp(container) {
|
||||
container.style = "";
|
||||
container.classList = "";
|
||||
assert_equals(getComputedStyle(container).contain, "none");
|
||||
}
|
||||
|
||||
test(() => {
|
||||
setUp(container);
|
||||
container.classList.add("hidden");
|
||||
assert_equals(getComputedStyle(container).contain, "size layout style paint");
|
||||
}, "content-visibility: hidden adds contain: size layout style;");
|
||||
|
||||
async_test((t) => {
|
||||
setUp(async_container);
|
||||
async_container.classList.add("auto");
|
||||
t.step(() => assert_equals(getComputedStyle(async_container).contain, "size layout style paint"));
|
||||
// Considering this as frame 1:
|
||||
// At frame 2, the container has size-containment, and intersection
|
||||
// observations will be delivered at the end of that frame.
|
||||
// At frame 3, the container still has size-containment, because visiblility
|
||||
// switch happens after rAF-callbacks have run.
|
||||
// At frame 4, the container is no longer size-contained since it is visible.
|
||||
requestAnimationFrame(() => {
|
||||
// Frame 2 checks:
|
||||
t.step(() => assert_equals(getComputedStyle(async_container).contain, "size layout style paint"));
|
||||
|
||||
requestAnimationFrame(() => {
|
||||
// Frame 3 checks:
|
||||
t.step(() => assert_equals(getComputedStyle(async_container).contain, "size layout style paint"));
|
||||
|
||||
requestAnimationFrame(() => {
|
||||
// Frame 4 checks:
|
||||
t.step(() => assert_equals(getComputedStyle(async_container).contain, "layout style paint"));
|
||||
t.done();
|
||||
});
|
||||
});
|
||||
});
|
||||
}, "content-visibility: auto adds contain: size layout style paint;");
|
||||
|
||||
test(() => {
|
||||
setUp(container);
|
||||
container.classList.add("auto");
|
||||
container.style = "contain: style;";
|
||||
assert_equals(getComputedStyle(container).contain, "size layout style paint");
|
||||
container.style = "contain: style layout;";
|
||||
assert_equals(getComputedStyle(container).contain, "size layout style paint");
|
||||
container.style = "";
|
||||
assert_equals(getComputedStyle(container).contain, "size layout style paint");
|
||||
}, "content-visibility: auto adds contain: size layout style paint, can't be overridden");
|
||||
|
||||
test(() => {
|
||||
setUp(container);
|
||||
container.classList.add("auto");
|
||||
container.style = "contain: paint;";
|
||||
assert_equals(getComputedStyle(container).contain, "size layout style paint");
|
||||
container.style = "contain: strict;";
|
||||
assert_equals(getComputedStyle(container).contain, "size layout style paint");
|
||||
container.style = "contain: content;";
|
||||
assert_equals(getComputedStyle(container).contain, "size layout style paint");
|
||||
}, "content-visibility keeps all containment even when shorthands are specified");
|
||||
</script>
|
||||
|
|
@ -0,0 +1,17 @@
|
|||
<!doctype HTML>
|
||||
<html>
|
||||
<meta charset="utf8">
|
||||
<title>Content Visibility: auto in the viewport (reference).</title>
|
||||
<link rel="author" title="Vladimir Levin" href="mailto:vmpstr@chromium.org">
|
||||
<link rel="help" href="https://drafts.csswg.org/css-contain/#content-visibility">
|
||||
|
||||
<style>
|
||||
.border {
|
||||
border: 1px solid black;
|
||||
}
|
||||
</style>
|
||||
|
||||
<div class=border>
|
||||
Test passes if there is a border around this text.
|
||||
</div>
|
||||
</html>
|
||||
|
|
@ -0,0 +1,37 @@
|
|||
<!doctype HTML>
|
||||
<html class="reftest-wait">
|
||||
<meta charset="utf8">
|
||||
<title>Content Visibility: auto in the viewport.</title>
|
||||
<link rel="author" title="Vladimir Levin" href="mailto:vmpstr@chromium.org">
|
||||
<link rel="help" href="https://drafts.csswg.org/css-contain/#content-visibility">
|
||||
<link rel="match" href="content-visibility-027-ref.html">
|
||||
<meta name="assert" content="content-visibility auto element in the viewport paints">
|
||||
<meta name="assert" content="content-visibility auto element in the viewport does not have size containment">
|
||||
|
||||
<script src="/common/reftest-wait.js"></script>
|
||||
|
||||
<style>
|
||||
div {
|
||||
content-visibility: auto;
|
||||
border: 1px solid black;
|
||||
}
|
||||
</style>
|
||||
|
||||
<div class=locked>
|
||||
Test passes if there is a border around this text.
|
||||
</div>
|
||||
|
||||
<script>
|
||||
|
||||
window.onload = requestAnimationFrame(() => {
|
||||
requestAnimationFrame(() => {
|
||||
requestAnimationFrame(() => {
|
||||
takeScreenshot();
|
||||
});
|
||||
});
|
||||
});
|
||||
|
||||
</script>
|
||||
</html>
|
||||
|
||||
|
||||
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