Mirrors/servo
1
0
Fork 0
mirror of https://github.com/servo/servo.git synced 2025-06-06 16:45:39 +00:00
Code Issues Projects Releases Packages Wiki Activity

Sync WPT with upstream (11-05-2025) (#36954)

Browse source 
Automated downstream sync of changes from upstream as of 11-05-2025
[no-wpt-sync]

Signed-off-by: WPT Sync Bot <ghbot+wpt-sync@servo.org>
This commit is contained in:
Servo WPT Sync 2025-05-11 03:41:53 +02:00 • committed by GitHub
parent 924fd06f14
commit 6cd44061d7
No known key found for this signature in database
GPG key ID: B5690EEEBB952194
238 changed files with 9392 additions and 2177 deletions
Download patch file Download diff file Expand all files Collapse all files

1130
tests/wpt/meta/MANIFEST.json vendored
View file

File diff suppressed because it is too large Load diff

8
tests/wpt/meta/WebCryptoAPI/idlharness.https.any.js.ini vendored
View file

@ -1,8 +0,0 @@
[idlharness.https.any.html]
[idl_test setup]
expected: FAIL
[idlharness.https.any.worker.html]
[idl_test setup]
expected: FAIL

2
tests/wpt/meta/css/css-gaps/flex/flex-gap-decorations-022.html.ini vendored Normal file
View file

@ -0,0 +1,2 @@
[flex-gap-decorations-022.html]
expected: FAIL

2
tests/wpt/meta/css/css-gaps/grid/grid-gap-decorations-029.html.ini vendored Normal file
View file

@ -0,0 +1,2 @@
[grid-gap-decorations-029.html]
expected: FAIL

2
tests/wpt/meta/css/css-gaps/grid/grid-gap-decorations-030.html.ini vendored Normal file
View file

@ -0,0 +1,2 @@
[grid-gap-decorations-030.html]
expected: FAIL

2
tests/wpt/meta/css/css-gaps/grid/grid-gap-decorations-031.html.ini vendored Normal file
View file

@ -0,0 +1,2 @@
[grid-gap-decorations-031.html]
expected: FAIL

2
tests/wpt/meta/css/css-gaps/grid/grid-gap-decorations-032.html.ini vendored Normal file
View file

@ -0,0 +1,2 @@
[grid-gap-decorations-032.html]
expected: FAIL

2
tests/wpt/meta/css/css-gaps/grid/grid-gap-decorations-033.html.ini vendored Normal file
View file

@ -0,0 +1,2 @@
[grid-gap-decorations-033.html]
expected: FAIL

2
tests/wpt/meta/css/css-gaps/grid/grid-gap-decorations-38.html.ini vendored Normal file
View file

@ -0,0 +1,2 @@
[grid-gap-decorations-38.html]
expected: FAIL

2
tests/wpt/meta/css/css-gaps/multicol/multicol-gap-decorations-017.html.ini vendored Normal file
View file

@ -0,0 +1,2 @@
[multicol-gap-decorations-017.html]
expected: FAIL

9
tests/wpt/meta/css/css-gaps/parsing/gap-decorations-col-rule-width.html.ini vendored Normal file
View file

@ -0,0 +1,9 @@
[gap-decorations-col-rule-width.html]
[`column-rule-width` should be `0px` when `column-rule-style` is `none` with single value]
expected: FAIL
[`column-rule-width` should be as specified regardless of `column-rule-style` with multiple values]
expected: FAIL
[`column-rule-width` should be as specified regardless of `column-rule-style` with multiple (repeat) values]
expected: FAIL

2
tests/wpt/meta/css/css-images/linear-gradient-body-sibling-index.html.ini vendored Normal file
View file

@ -0,0 +1,2 @@
[linear-gradient-body-sibling-index.html]
expected: FAIL

2
tests/wpt/meta/css/css-images/linear-gradient-sibling-index.html.ini vendored Normal file
View file

@ -0,0 +1,2 @@
[linear-gradient-sibling-index.html]
expected: FAIL

19
tests/wpt/meta/css/css-mixins/dashed-function-cycles.tentative.html.ini → tests/wpt/meta/css/css-mixins/dashed-function-cycles.html.ini vendored
View file

@ -1,4 +1,4 @@
[dashed-function-cycles.tentative.html]
[dashed-function-cycles.html]
[Local with self-cycle]
expected: FAIL
@ -11,7 +11,10 @@
[Local shadowing cyclic property --x]
expected: FAIL
[Local shadowing cyclic outer local --x ]
[Local shadowing cyclic outer local --x]
expected: FAIL
[Argument shadowing cyclic outer local --x]
expected: FAIL
[Arguments shadowing cyclic properties]
@ -53,6 +56,9 @@
[Cycle through local, other function]
expected: FAIL
[Cycle through local, other function, fallback in function]
expected: FAIL
[Cycle through various variables and other functions]
expected: FAIL
@ -62,15 +68,6 @@
[Cyclic defaults]
expected: FAIL
[Local shadowing cyclic outer local --x]
expected: FAIL
[Argument shadowing cyclic outer local --x]
expected: FAIL
[Cycle through local, other function, fallback in function]
expected: FAIL
[Cyclic outer --b shadows custom property]
expected: FAIL

12
tests/wpt/meta/css/css-values/tree-counting/sibling-function-descriptors.tentative.html.ini vendored
View file

@ -10,3 +10,15 @@
[sibling-count() should not be allowed in @font-face descriptors]
expected: FAIL
[sibling-index() should not be allowed in @font-palette-values descriptors]
expected: FAIL
[sibling-count() should not be allowed in @font-palette-values descriptors]
expected: FAIL
[sibling-index() should not be allowed in @counter-style descriptors]
expected: FAIL
[sibling-count() should not be allowed in @counter-style descriptors]
expected: FAIL

6
tests/wpt/meta/css/css-values/tree-counting/sibling-index-keyframe-length-value-dynamic.html.ini vendored Normal file
View file

@ -0,0 +1,6 @@
[sibling-index-keyframe-length-value-dynamic.html]
[Initially, the sibling-index() is 2 for #target]
expected: FAIL
[Removing a preceding sibling of #target reduces the sibling-index()]
expected: FAIL

6
tests/wpt/meta/css/css-values/tree-counting/sibling-index-keyframe-value-dynamic.html.ini vendored Normal file
View file

@ -0,0 +1,6 @@
[sibling-index-keyframe-value-dynamic.html]
[Initially, the sibling-index() is 3 for #target]
expected: FAIL
[Removing a preceding sibling of #target reduces the sibling-index()]
expected: FAIL

15
tests/wpt/meta/css/cssom-view/scrollIntoView-container.html.ini vendored Normal file
View file

@ -0,0 +1,15 @@
[scrollIntoView-container.html]
[scrollIntoView() defaults to scrolling ancestors]
expected: FAIL
[scrollIntoView({container: 'all'}) scrolls ancestors]
expected: FAIL
[scrollIntoView({container: 'nearest'}) only scrolls nearest scroll container]
expected: FAIL
[scrollIntoView({container: 'nearest'}) doesn't stop at itself]
expected: FAIL
[scrollIntoView({container: 'nearest'}) doesn't propagate to outer frames]
expected: FAIL

2
tests/wpt/meta/css/filter-effects/backdrop-filter-scale-transform.html.ini vendored Normal file
View file

@ -0,0 +1,2 @@
[backdrop-filter-scale-transform.html]
expected: FAIL

6
tests/wpt/meta/css/geometry/DOMMatrix-001.html.ini vendored Normal file
View file

@ -0,0 +1,6 @@
[DOMMatrix-001.html]
[new DOMMatrix("scale(sign(1em))")]
expected: FAIL
[new DOMMatrixReadOnly("scale(sign(1em))")]
expected: FAIL

12
tests/wpt/meta/dom/events/webkit-transition-end-event.html.ini vendored
View file

@ -1,27 +1,15 @@
[webkit-transition-end-event.html]
[dispatchEvent of an transitionend event does not trigger a prefixed event handler or listener]
expected: FAIL
[onwebkittransitionend event handler should trigger for an animation]
expected: FAIL
[onwebkittransitionend event handler should not trigger if an unprefixed listener also exists]
expected: FAIL
[event types for prefixed and unprefixed transitionend event handlers should be named appropriately]
expected: FAIL
[event types for prefixed and unprefixed transitionend event listeners should be named appropriately]
expected: FAIL
[ontransitionend and onwebkittransitionend are not aliases]
expected: FAIL
[webkitTransitionEnd event listener should trigger for an animation]
expected: FAIL
[dispatchEvent of a webkitTransitionEnd event does trigger a prefixed event handler or listener]
expected: FAIL
[onwebkittransitionend event handler should not trigger if an unprefixed event handler also exists]
expected: FAIL

3
tests/wpt/meta/fetch/http-cache/pragma-no-cache-with-cache-control.html.ini vendored Normal file
View file

@ -0,0 +1,3 @@
[pragma-no-cache-with-cache-control.html]
[Response with Cache-Control: max-age=2592000, public and Pragma: no-cache should be cached]
expected: FAIL

3
tests/wpt/meta/fetch/metadata/generated/css-font-face.https.sub.tentative.html.ini vendored
View file

@ -52,3 +52,6 @@
[sec-fetch-storage-access - Cross-site]
expected: FAIL
[sec-fetch-user]
expected: FAIL

3
tests/wpt/meta/html/browsers/browsing-the-web/navigating-across-documents/initial-empty-document/iframe-nosrc.html.ini vendored
View file

@ -2,8 +2,5 @@
[window.open]
expected: FAIL
[form submission]
expected: FAIL
[link click]
expected: FAIL

3
tests/wpt/meta/html/browsers/browsing-the-web/navigating-across-documents/initial-empty-document/iframe-src-aboutblank-navigate-immediately.html.ini vendored
View file

@ -1,6 +1,3 @@
[iframe-src-aboutblank-navigate-immediately.html]
[Navigating to a different document with window.open]
expected: FAIL
[Navigating to a different document with form submission]
expected: FAIL

3
tests/wpt/meta/html/browsers/browsing-the-web/navigating-across-documents/replace-before-load/a-click.html.ini vendored Normal file
View file

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

3
tests/wpt/meta/html/browsers/browsing-the-web/scroll-to-fragid/scroll-to-top.html.ini vendored
View file

@ -1,3 +0,0 @@
[scroll-to-top.html]
[Fragment Navigation: When fragid is TOP scroll to the top of the document]
expected: FAIL

2
tests/wpt/meta/html/browsers/history/the-history-interface/traverse_the_history_3.html.ini → tests/wpt/meta/html/browsers/history/the-history-interface/traverse_the_history_5.html.ini vendored
View file

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

7
tests/wpt/meta/html/browsers/windows/auxiliary-browsing-contexts/named-lookup-noopener.html.ini vendored Normal file
View file

@ -0,0 +1,7 @@
[named-lookup-noopener.html]
expected: TIMEOUT
[Two noopener window.open() calls create separate windows]
expected: TIMEOUT
[Two rel=noopener <a href> clicks create separate windows]
expected: NOTRUN

2
tests/wpt/meta/html/canvas/element/manual/imagebitmap/createImageBitmap-invalid-args.html.ini vendored
View file

@ -1,5 +1,5 @@
[createImageBitmap-invalid-args.html]
expected: TIMEOUT
expected: ERROR
[createImageBitmap with a vector HTMLImageElement source and sw set to 0]
expected: FAIL

2
tests/wpt/meta/html/canvas/element/manual/imagebitmap/createImageBitmap-transfer.html.ini vendored
View file

@ -1,5 +1,5 @@
[createImageBitmap-transfer.html]
expected: TIMEOUT
expected: ERROR
[Transfer ImageBitmap created from a vector HTMLImageElement]
expected: FAIL

2
tests/wpt/meta/html/canvas/element/manual/text/canvas.2d.disconnected.html.ini vendored Normal file
View file

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

3
tests/wpt/meta/html/semantics/embedded-content/the-iframe-element/iframe_sandbox_popups_escaping-3.html.ini vendored
View file

@ -1,3 +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: FAIL
expected: TIMEOUT

3
tests/wpt/meta/html/semantics/embedded-content/the-iframe-element/iframe_sandbox_popups_nonescaping-1.html.ini vendored
View file

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

3
tests/wpt/meta/html/semantics/embedded-content/the-iframe-element/iframe_sandbox_popups_nonescaping-3.html.ini vendored
View file

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

4
tests/wpt/meta/html/semantics/forms/form-submission-0/reparent-form-during-planned-navigation-task.html.ini vendored
View file

@ -1,4 +0,0 @@
[reparent-form-during-planned-navigation-task.html]
expected: TIMEOUT
[reparent-form-during-planned-navigation-task]
expected: TIMEOUT

3
tests/wpt/meta/html/semantics/forms/form-submission-0/text-plain.window.js.ini vendored
View file

@ -181,3 +181,6 @@
[text/plain: non-ASCII in filename (formdata event)]
expected: FAIL
[text/plain: 0x00 in name (normal form)]
expected: FAIL

3
tests/wpt/meta/html/semantics/scripting-1/the-script-element/module/dynamic-import/blob-url.any.js.ini vendored
View file

@ -5,9 +5,6 @@
[Different blob URLs pointing to the same blob resolve to different modules]
expected: FAIL
[Revoking a blob URL immediately after calling import will not fail]
expected: FAIL
[blob-url.any.worker-module.html]
expected: TIMEOUT

2
tests/wpt/meta/html/semantics/the-button-element/interest-target/interesttarget-outline-appearance.tentative.html.ini vendored
View file

@ -1,2 +0,0 @@
[interesttarget-outline-appearance.tentative.html]
expected: FAIL

9
tests/wpt/meta/streams/writable-streams/crashtests/garbage-collection.any.js.ini vendored Normal file
View file

@ -0,0 +1,9 @@
[garbage-collection.any.html]
[garbage-collection.any.sharedworker.html]
expected: ERROR
[garbage-collection.any.serviceworker.html]
expected: ERROR
[garbage-collection.any.worker.html]

9
tests/wpt/meta/subresource-integrity/tentative/integrity-policy/parsing.https.html.ini vendored Normal file
View file

@ -0,0 +1,9 @@
[parsing.https.html?type=enforce]
[Ensure that test is working with a valid destination]
expected: FAIL
[Ensure that test is working with a valid destination and source]
expected: FAIL
[parsing.https.html?type=report]

15
tests/wpt/meta/subresource-integrity/tentative/integrity-policy/script.https.html.ini vendored Normal file
View file

@ -0,0 +1,15 @@
[script.https.html]
[Ensure that a script without integrity did not run]
expected: FAIL
[Ensure that a script with unknown integrity algorithm did not run]
expected: FAIL
[Ensure that a script without integrity algorithm runs and gets reported in report-only mode]
expected: FAIL
[Ensure that a no-cors script gets blocked]
expected: FAIL
[Ensure that ReportingObserver gets called without endpoints]
expected: FAIL

12
tests/wpt/meta/webaudio/the-audio-api/the-audiobuffersourcenode-interface/sub-sample-buffer-stitching.html.ini vendored
View file

@ -784,3 +784,15 @@
[X SNR (42.96525288004425 dB) is not greater than or equal to 65.737. Got 42.96525288004425.]
expected: FAIL
[X Stitched sine-wave buffers at sample rate 43800 does not equal [0,0.06264832615852356,0.12505052983760834,0.18696144223213196,0.24813786149024963,0.308339387178421,0.36732959747314453,0.4248766601085663,0.480754554271698,0.5347436666488647,0.5866320133209229,0.6362156271934509,0.6832997798919678,0.7276994585990906,0.7692402601242065,0.8077589869499207...\] with an element-wise tolerance of {"absoluteThreshold":0.0038986,"relativeThreshold":0}.\n\tIndex\tActual\t\t\tExpected\t\tAbsError\t\tRelError\t\tTest threshold\n\t[14650\]\t-2.7243524527875707e-5\t8.6956524848937988e-1\t8.6959249201390776e-1\t1.0000313300520867e+0\t3.8985999999999999e-3\n\t[14651\]\t3.0547976493835449e-1\t8.9879405498504639e-1\t5.9331429004669189e-1\t6.6012262403823208e-1\t3.8985999999999999e-3\n\tMax AbsError of 8.6959249201390776e-1 at index of 14650.\n\tMax RelError of 1.0000313300520867e+0 at index of 14650.\n]
expected: FAIL
[X SNR (42.96506816850161 dB) is not greater than or equal to 65.737. Got 42.96506816850161.]
expected: FAIL
[X Stitched sine-wave buffers at sample rate 43800 does not equal [0,0.06264832615852356,0.12505052983760834,0.18696144223213196,0.24813786149024963,0.308339387178421,0.36732959747314453,0.4248766601085663,0.480754554271698,0.5347436666488647,0.5866320133209229,0.6362156271934509,0.6832997798919678,0.7276994585990906,0.7692402601242065,0.8077589869499207...\] with an element-wise tolerance of {"absoluteThreshold":0.0038986,"relativeThreshold":0}.\n\tIndex\tActual\t\t\tExpected\t\tAbsError\t\tRelError\t\tTest threshold\n\t[14650\]\t-1.7532469034194946e+0\t8.6956524848937988e-1\t2.6228121519088745e+0\t3.0162338668262767e+0\t3.8985999999999999e-3\n\t[14651\]\t3.0547976493835449e-1\t8.9879405498504639e-1\t5.9331429004669189e-1\t6.6012262403823208e-1\t3.8985999999999999e-3\n\tMax AbsError of 2.6228121519088745e+0 at index of 14650.\n\tMax RelError of 3.0162338668262767e+0 at index of 14650.\n]
expected: FAIL
[X SNR (34.8385032008375 dB) is not greater than or equal to 65.737. Got 34.8385032008375.]
expected: FAIL

2
tests/wpt/meta/webxr/render_state_update.https.html.ini vendored Normal file
View file

@ -0,0 +1,2 @@
[render_state_update.https.html]
expected: ERROR

3
tests/wpt/meta/workers/WorkerGlobalScope-close.html.ini vendored Normal file
View file

@ -0,0 +1,3 @@
[WorkerGlobalScope-close.html]
[Test sending a message after closing.]
expected: FAIL

8
tests/wpt/meta/xhr/formdata/append.any.js.ini vendored Normal file
View file

@ -0,0 +1,8 @@
[append.any.worker.html]
[testFormDataAppendEmptyBlob]
expected: FAIL
[append.any.html]
[testFormDataAppendEmptyBlob]
expected: FAIL

124
tests/wpt/tests/IndexedDB/idbcursor-request-source.any.js vendored
View file

@ -6,21 +6,111 @@
'use strict';
[cursor => cursor.update(0), cursor => cursor.delete()].forEach(
func => indexeddb_test(
(t, db) => {
db.createObjectStore('store', {autoIncrement: true});
},
(t, db) => {
const tx = db.transaction('store', 'readwrite');
const store = tx.objectStore('store');
store.put('value');
store.openCursor().onsuccess = t.step_func(e => {
const cursor = e.target.result;
assert_equals(
func(cursor).source, cursor,
`${func}.source should be the cursor itself`);
// Setup each test by populating an object store with an index for the cursor to
// iterate and manipulate.
function initializeDatabase(db) {
const store = db.createObjectStore('store', {autoIncrement: true});
store.createIndex('index', /*keypath=*/ 'value');
store.put({value: 'z'});
store.put({value: 'y'});
store.put({value: 'x'});
store.put({value: 'w'});
}
function isIndex(cursorSourceType) {
return cursorSourceType === 'IDBIndex';
}
// Return the object store or index, depending on the test's `cursorSourceType`.
function getCursorSource(transaction, cursorSourceType) {
let cursorSource = transaction.objectStore('store');
if (isIndex(cursorSourceType)) {
cursorSource = cursorSource.index('index');
}
return cursorSource;
}
// Verify the request source after calling delete() or update() on the cursor.
function cursor_request_source_test(
cursorSourceType, createRequestFunctionName, createRequestFunctionArgs) {
indexeddb_test(
(t, db) => initializeDatabase(db),
(t, db) => {
const tx = db.transaction('store', 'readwrite');
const cursorSource = getCursorSource(tx, cursorSourceType);
// Open the cursor.
const openCursorRequest = cursorSource.openCursor();
openCursorRequest.onerror =
t.unreached_func('The cursor must not fail to open.');
openCursorRequest.onsuccess = t.step_func(e => {
// Use the cursor to create a new request.
const cursor = e.target.result;
const request =
cursor[createRequestFunctionName](...createRequestFunctionArgs);
assert_equals(
request.source, cursor,
`The request's source must be the cursor itself.`);
t.done();
});
},
`The source of the request from ${cursorSourceType}::${
createRequestFunctionName}() is the cursor itself`);
}
// Verify the request source after calling openCursor() or openKeyCursor() and
// then using the cursor to iterate.
function open_cursor_request_source_test(
cursorSourceType, openCursorFunctionName) {
indexeddb_test(
(t, db) => initializeDatabase(db),
(t, db) => {
const tx = db.transaction('store', 'readonly');
const cursorSource = getCursorSource(tx, cursorSourceType);
// Open the cursor.
const openCursorRequest = cursorSource[openCursorFunctionName]();
openCursorRequest.onerror =
t.unreached_func('The cursor must not fail to open or iterate.');
assert_equals(
openCursorRequest.source, cursorSource,
'The request source must be the opener of the cursor.');
// Verify the cursor's `request.source` after iterating with
// `advance()`, `continue()`, and `continuePrimaryKey()`.
let iterationCount = 0;
openCursorRequest.onsuccess = t.step_func(e => {
assert_equals(
openCursorRequest.source, cursorSource,
'The request source must be the opener of the cursor after iterating.');
const cursor = e.target.result;
++iterationCount;
if (iterationCount == 1) {
cursor.advance(1);
} else if (iterationCount == 2) {
cursor.continue();
} else if (iterationCount == 3 && isIndex(cursorSourceType)) {
cursor.continuePrimaryKey('z', 0);
} else {
t.done();
});
},
`The source of the request from ${func} is the cursor itself`));
}
});
},
`${cursorSourceType}::${
openCursorFunctionName}'s request source must be the ${
cursorSourceType} instance that opened the cursor`);
}
open_cursor_request_source_test('IDBObjectStore', 'openCursor');
open_cursor_request_source_test('IDBObjectStore', 'openKeyCursor');
open_cursor_request_source_test('IDBIndex', 'openCursor');
open_cursor_request_source_test('IDBIndex', 'openKeyCursor');
cursor_request_source_test('IDBObjectStore', 'update', /*args=*/[0]);
cursor_request_source_test('IDBObjectStore', 'delete', /*args=*/[]);
cursor_request_source_test('IDBIndex', 'update', /*args=*/[0]);
cursor_request_source_test('IDBIndex', 'delete', /*args=*/[]);

2
tests/wpt/tests/WebCryptoAPI/idlharness.https.any.js vendored
View file

@ -5,7 +5,7 @@
// https://w3c.github.io/webcrypto/Overview.html
idl_test(
['WebCryptoAPI'],
['webcrypto'],
['html', 'dom'],
idl_array => {
idl_array.add_objects({

4
tests/wpt/tests/ai/translator/resources/util.js vendored Normal file
View file

@ -0,0 +1,4 @@
async function createTranslator(options) {
await test_driver.bless();
return await Translator.create(options);
}

3
tests/wpt/tests/ai/translator/translator-bad-input.tentative.https.window.js → tests/wpt/tests/ai/translator/translator-bad-input.https.window.js vendored
View file

@ -8,8 +8,7 @@
'use strict';
promise_test(async t => {
await promise_rejects_js(
t, TypeError, Translator.create(/*empty options*/));
await promise_rejects_js(t, TypeError, Translator.create(/*empty options*/));
}, 'Translator.create rejects with TypeError if no options are passed.');
promise_test(async t => {

11
tests/wpt/tests/ai/translator/translator-translate.tentative.https.window.js → tests/wpt/tests/ai/translator/translator.optional.https.window.js vendored
View file

@ -1,21 +1,16 @@
// META: title=Translate from English to Japanese
// META: title=Translator Translate
// META: global=window
// META: timeout=long
// META: script=../resources/util.js
// META: script=../resources/language_codes.js
// META: script=/resources/testdriver.js
// META: script=resources/util.js
//
// Setting `timeout=long` as this test may require downloading the translation
// library and the language models.
'use strict';
async function createTranslator(options) {
return await test_driver.bless('Create translator', async () => {
return await Translator.create(options);
});
}
promise_test(async t => {
const languagePair = {sourceLanguage: 'en', targetLanguage: 'ja'};
@ -141,7 +136,7 @@ promise_test(async t => {
for (let i = 0; i < translatableStrings.length; i++) {
assert_not_equals(translatedTranslatableString[i], translatableStrings[i]);
}
}, 'Translator.translate() echos non-translatable content');
}, 'Translator.translate() echoes non-translatable content');
promise_test(async t => {
const translator =

3
tests/wpt/tests/badging/WEB_FEATURES.yml vendored Normal file
View file

@ -0,0 +1,3 @@
features:
- name: badging
files: "**"

3
tests/wpt/tests/clear-site-data/WEB_FEATURES.yml vendored Normal file
View file

@ -0,0 +1,3 @@
features:
- name: clear-site-data
files: "**"

7
tests/wpt/tests/compat/webkit-box-ignores-flex-wrap.tentative.html vendored Normal file
View file

@ -0,0 +1,7 @@
<!DOCTYPE html>
<link rel="help" href="https://compat.spec.whatwg.org/#valdef-flex--webkit-box">
<link rel="match" href="green-ref.html">
<div style="display: -webkit-box; flex-wrap: wrap; width: 50px;">
<div style="width: 50px; height: 100px; background: green;"></div>
<div style="width: 50px; height: 100px; background: green;"></div>
</div>

17
tests/wpt/tests/cookie-store/cookieListItem_attributes.https.any.js vendored
View file

@ -207,3 +207,20 @@ promise_test(async testCase => {
const cookie = await cookieStore.get('cookie-name');
assert_equals(cookie.secure, true);
}, 'CookieListItem - secure defaults to true');
promise_test(async testCase => {
await cookieStore.delete('cookie-name');
testCase.add_cleanup(async () => {
await cookieStore.delete('cookie-name');
});
let encodedCookie = encodeURIComponent(JSON.stringify("cookie-name=1; max-age=99999999999999999999999999999; path=/"));
await fetch(`/cookies/resources/cookie.py?set=${encodedCookie}`);
assert_equals(document.cookie, "cookie-name=1", 'The cookie was set as expected.');
const cookie = await cookieStore.get('cookie-name');
assert_equals(cookie.name, 'cookie-name');
assert_equals(cookie.value, '1');
assert_approx_equals(cookie.expires, kFourHundredDaysFromNow, kOneDay);
}, "Test max-age attribute over the 400 days");

30
tests/wpt/tests/cookie-store/httponly_cookies.https.window.js vendored
View file

@ -67,3 +67,33 @@ cookie_test(async t => {
'cookie1=value1; cookie2=value2; cookie3=value3',
'httpOnly is not an option for CookieStore.set()');
}, 'HttpOnly cookies can not be set by CookieStore');
cookie_test(async t => {
await setCookieStringHttp('HTTPONLY-cookie=value; path=/; httponly');
assert_equals(
await getCookieString(),
undefined,
'HttpOnly cookie we wrote using HTTP in cookie jar' +
' is invisible to script');
assert_equals(
await getCookieStringHttp(),
'HTTPONLY-cookie=value',
'HttpOnly cookie we wrote using HTTP in HTTP cookie jar');
try {
await cookieStore.set('HTTPONLY-cookie', 'dummy');
} catch(e) {}
assert_equals(
await getCookieString(),
undefined,
'HttpOnly cookie is not overwritten');
try {
await cookieStore.delete('HTTPONLY-cookie');
} catch(e) {}
assert_equals(await getCookieString(), undefined, 'HttpOnly cookie is not overwritten');
assert_equals(await getCookieStringHttp(), 'HTTPONLY-cookie=value', 'HttpOnly cookie is not deleted');
}, 'HttpOnly cookies are not deleted/overwritten');

9
tests/wpt/tests/css/compositing/root-element-background-image-opaque-crash.html vendored Normal file
View file

@ -0,0 +1,9 @@
<!doctype html>
<style>
:root {
background-color: rgba(255, 255, 255, 0.98);
background-image: url(/images/computer.jpg); /* opaque */
background-position: top left;
background-repeat: repeat;
}
</style>

10
tests/wpt/tests/css/css-align/blocks/justify-items-anonymous.tentative.html vendored Normal file
View file

@ -0,0 +1,10 @@
<!DOCTYPE html>
<link rel="help" href="https://github.com/w3c/csswg-drafts/issues/11461">
<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="width: 100px; height: 100px; background: red;">
<div style="width: 200px; justify-items: right;">
<span style="display: inline-block; width: 100px; height: 100px; background: green;"></span>
<div></div> <!-- Forces an anonymous block around <span> in most browsers. -->
</div>
</div>

4
tests/wpt/tests/css/css-anchor-position/anchor-position-grid-001.html vendored
View file

@ -75,8 +75,8 @@
<div class="target target1-l" data-offset-x=100 data-expected-height=100></div>
<div class="target target1-r" data-offset-x=404 data-expected-height=100></div>
<div class="target target1-t" data-offset-y=0 data-expected-width=310></div>
<div class="target target1-b" data-offset-y=95 data-expected-width=310></div>
<div class="target target1-t" data-offset-y=-10 data-expected-width=310></div>
<div class="target target1-b" data-offset-y=85 data-expected-width=310></div>
</div>
</div>
</div>

8
tests/wpt/tests/css/css-anchor-position/anchor-position-multicol-002.html vendored
View file

@ -71,15 +71,15 @@
<!-- The containing block of querying elements is block-fragmented. -->
<div class="target target1"
data-offset-x=18 data-offset-y=65
data-offset-x=128 data-offset-y=-35
data-expected-width=160 data-expected-height=100></div>
<div class="target target1-rb"
data-offset-x=168 data-offset-y=155></div>
data-offset-x=278 data-offset-y=55></div>
<div class="target fixed target1"
data-offset-x=26 data-offset-y=70
data-offset-x=136 data-offset-y=-30
data-expected-width=160 data-expected-height=100></div>
<div class="target fixed target1-rb"
data-offset-x=176 data-offset-y=160></div>
data-offset-x=286 data-offset-y=60></div>
</div>
<!-- The containing block of querying elements is a multi-column. -->

8
tests/wpt/tests/css/css-anchor-position/anchor-position-multicol-004.html vendored
View file

@ -69,16 +69,16 @@
<div class="anchor1" style="width: 20px"></div>
<div class="target target1"
data-offset-x=18 data-offset-y=65
data-offset-x=128 data-offset-y=-35
data-expected-width=130 data-expected-height=100></div>
<div class="target target1-rb"
data-offset-x=138 data-offset-y=155></div>
data-offset-x=248 data-offset-y=55></div>
</div>
<div class="target target1"
data-offset-x=34 data-offset-y=225
data-offset-x=364 data-offset-y=-75
data-expected-width=130 data-expected-height=100></div>
<div class="target target1-rb"
data-offset-x=154 data-offset-y=315></div>
data-offset-x=484 data-offset-y=15></div>
</div>
</body>

4
tests/wpt/tests/css/css-anchor-position/anchor-position-multicol-nested-001.html vendored
View file

@ -68,8 +68,8 @@
data-expected-width=180 data-expected-height=100></div>
</div>
</div>
<div class="target"
data-offset-x=13 data-offset-y=97
<div class="target" style="background:hotpink;"
data-offset-x=173 data-offset-y=-3
data-expected-width=180 data-expected-height=100></div>
</div>
</div>

17
tests/wpt/tests/css/css-animations/crashtests/chrome-bug-415627003.html vendored Normal file
View file

@ -0,0 +1,17 @@
<!DOCTYPE html>
<link rel="help" href="https://crbug.com/415627003">
<style>
@keyframes --anim {
from {
text-size-adjust: calc(50% * sibling-index());
}
to {
text-size-adjust: calc(50%);
}
}
#target {
animation: --anim 2s;
}
</style>
<p>Pass if no crash</p>
<div id="target"></div>

6
tests/wpt/tests/css/css-break/root-margin-001-print-ref.html vendored Normal file
View file

@ -0,0 +1,6 @@
<!DOCTYPE html>
<link rel="author" title="Morten Stenshorne" href="mailto:mstensho@chromium.org">
<div style="height:1px;"></div>
<div style="break-before:page; margin-top:8px;"></div>
This text should be on the second page.
The first page should be blank.

10
tests/wpt/tests/css/css-break/root-margin-001-print.html vendored Normal file
View file

@ -0,0 +1,10 @@
<!DOCTYPE html>
<title>Root block-start margin taller than the page</title>
<link rel="author" title="Morten Stenshorne" href="mailto:mstensho@chromium.org">
<link rel="help" href="https://drafts.csswg.org/css-break/#break-margins">
<link rel="match" href="root-margin-001-print-ref.html">
<style>
html { margin-top: 10in; }
</style>
This text should be on the second page.
The first page should be blank.

11
tests/wpt/tests/css/css-break/table/border-spacing.html vendored
View file

@ -5,7 +5,7 @@
.cell > div { background:white; }
</style>
<p>No red should be seen below.</p>
<div id="multicol" style="columns:2; column-fill:auto; height:70px; width:200px; line-height:20px;">
<div id="multicol" style="columns:2; column-fill:auto; gap:0; height:70px; width:200px; line-height:20px;">
<div style="position:relative; display:table; border-spacing:10px;">
<div class="cell" style="display:table-cell; width:30px; background:red;">
<div id="child1">1<br></div>
@ -20,15 +20,20 @@
<script src="/resources/testharnessreport.js"></script>
<script>
test(() => {
assert_equals(document.getElementById("child1").offsetLeft, 10);
assert_equals(document.getElementById("child1").offsetTop, 10);
assert_equals(document.getElementById("child1").offsetHeight, 20);
assert_equals(document.getElementById("child2").offsetLeft, 10);
assert_equals(document.getElementById("child2").offsetTop, 30);
assert_equals(document.getElementById("child2").offsetHeight, 20);
assert_equals(document.getElementById("child3").offsetLeft, 10);
assert_equals(document.getElementById("child3").offsetTop, 50);
assert_equals(document.getElementById("child3").offsetHeight, 20);
assert_equals(document.getElementById("child4").offsetTop, 70);
assert_equals(document.getElementById("child4").offsetLeft, 110);
assert_equals(document.getElementById("child4").offsetTop, 0);
assert_equals(document.getElementById("child4").offsetHeight, 20);
assert_equals(document.getElementById("child5").offsetTop, 90);
assert_equals(document.getElementById("child5").offsetLeft, 110);
assert_equals(document.getElementById("child5").offsetTop, 20);
assert_equals(document.getElementById("child5").offsetHeight, 20);
}, "Table with border spacing");
</script>

68
tests/wpt/tests/css/css-break/table/table-parts-offsets-vertical-rl.tentative.html vendored
View file

@ -37,104 +37,104 @@
<script src="/resources/testharnessreport.js"></script>
<script>
test(() => {
assert_equals(table.offsetTop, 408, "offsetTop");
assert_equals(table.offsetLeft, 41, "offsetLeft");
assert_equals(table.offsetTop, 8, "offsetTop");
assert_equals(table.offsetLeft, 8, "offsetLeft");
assert_equals(table.offsetWidth, 177, "offsetWidth");
assert_equals(table.offsetHeight, 184, "offsetHeight");
}, "table");
test(() => {
assert_equals(colgroup.offsetTop, 418, "offsetTop");
assert_equals(colgroup.offsetLeft, 51, "offsetLeft");
assert_equals(colgroup.offsetTop, 18, "offsetTop");
assert_equals(colgroup.offsetLeft, 8, "offsetLeft");
assert_equals(colgroup.offsetWidth, 157, "offsetWidth");
assert_equals(colgroup.offsetHeight, 107, "offsetHeight");
}, "colgroup");
test(() => {
assert_equals(col.offsetTop, 418, "offsetTop");
assert_equals(col.offsetLeft, 51, "offsetLeft");
assert_equals(col.offsetTop, 18, "offsetTop");
assert_equals(col.offsetLeft, 8, "offsetLeft");
assert_equals(col.offsetWidth, 157, "offsetWidth");
assert_equals(col.offsetHeight, 50, "offsetHeight");
}, "col");
test(() => {
assert_equals(col2.offsetTop, 475, "offsetTop");
assert_equals(col2.offsetLeft, 51, "offsetLeft");
assert_equals(col2.offsetTop, 75, "offsetTop");
assert_equals(col2.offsetLeft, 8, "offsetLeft");
assert_equals(col2.offsetWidth, 157, "offsetWidth");
assert_equals(col2.offsetHeight, 50, "offsetHeight");
}, "col2");
test(() => {
assert_equals(colgroup2.offsetTop, 532, "offsetTop");
assert_equals(colgroup2.offsetLeft, 51, "offsetLeft");
assert_equals(colgroup2.offsetTop, 132, "offsetTop");
assert_equals(colgroup2.offsetLeft, 8, "offsetLeft");
assert_equals(colgroup2.offsetWidth, 157, "offsetWidth");
assert_equals(colgroup2.offsetHeight, 50, "offsetHeight");
}, "colgroup2");
test(() => {
assert_equals(col3.offsetTop, 532, "offsetTop");
assert_equals(col3.offsetLeft, 51, "offsetLeft");
assert_equals(col3.offsetTop, 132, "offsetTop");
assert_equals(col3.offsetLeft, 8, "offsetLeft");
assert_equals(col3.offsetWidth, 157, "offsetWidth");
assert_equals(col3.offsetHeight, 50, "offsetHeight");
}, "col3");
test(() => {
assert_equals(rowgroup.offsetTop, 418, "offsetTop");
assert_equals(rowgroup.offsetLeft, 51, "offsetLeft");
assert_equals(rowgroup.offsetTop, 18, "offsetTop");
assert_equals(rowgroup.offsetLeft, 8, "offsetLeft");
assert_equals(rowgroup.offsetWidth, 157, "offsetWidth");
assert_equals(rowgroup.offsetHeight, 164, "offsetHeight");
}, "rowgroup");
test(() => {
assert_equals(row.offsetTop, 218, "offsetTop");
assert_equals(row.offsetLeft, 38, "offsetLeft");
assert_equals(row.offsetTop, 18, "offsetTop");
assert_equals(row.offsetLeft, 8, "offsetLeft");
assert_equals(row.offsetWidth, 100, "offsetWidth");
assert_equals(row.offsetHeight, 164, "offsetHeight");
}, "row");
test(() => {
assert_equals(cell.offsetTop, 218, "offsetTop");
assert_equals(cell.offsetLeft, 38, "offsetLeft");
assert_equals(cell.offsetTop, 18, "offsetTop");
assert_equals(cell.offsetLeft, 8, "offsetLeft");
assert_equals(cell.offsetWidth, 100, "offsetWidth");
assert_equals(cell.offsetHeight, 50, "offsetHeight");
}, "cell");
test(() => {
assert_equals(content.offsetTop, 218, "offsetTop");
assert_equals(content.offsetLeft, 38, "offsetLeft");
assert_equals(content.offsetTop, 18, "offsetTop");
assert_equals(content.offsetLeft, 8, "offsetLeft");
assert_equals(content.offsetWidth, 100, "offsetWidth");
assert_equals(content.offsetHeight, 50, "offsetHeight");
}, "content");
test(() => {
assert_equals(cell2.offsetTop, 275, "offsetTop");
assert_equals(cell2.offsetLeft, 38, "offsetLeft");
assert_equals(cell2.offsetTop, 75, "offsetTop");
assert_equals(cell2.offsetLeft, 8, "offsetLeft");
assert_equals(cell2.offsetWidth, 100, "offsetWidth");
assert_equals(cell2.offsetHeight, 50, "offsetHeight");
}, "cell2");
test(() => {
assert_equals(content2.offsetTop, 275, "offsetTop");
assert_equals(content2.offsetLeft, 38, "offsetLeft");
assert_equals(content2.offsetTop, 75, "offsetTop");
assert_equals(content2.offsetLeft, 8, "offsetLeft");
assert_equals(content2.offsetWidth, 100, "offsetWidth");
assert_equals(content2.offsetHeight, 50, "offsetHeight");
}, "content2");
test(() => {
assert_equals(cell3.offsetTop, 332, "offsetTop");
assert_equals(cell3.offsetLeft, 38, "offsetLeft");
assert_equals(cell3.offsetTop, 132, "offsetTop");
assert_equals(cell3.offsetLeft, 8, "offsetLeft");
assert_equals(cell3.offsetWidth, 100, "offsetWidth");
assert_equals(cell3.offsetHeight, 50, "offsetHeight");
}, "cell3");
test(() => {
assert_equals(content3.offsetTop, 332, "offsetTop");
assert_equals(content3.offsetLeft, 38, "offsetLeft");
assert_equals(content3.offsetTop, 132, "offsetTop");
assert_equals(content3.offsetLeft, 8, "offsetLeft");
assert_equals(content3.offsetWidth, 100, "offsetWidth");
assert_equals(content3.offsetHeight, 50, "offsetHeight");
}, "content3");
test(() => {
assert_equals(row2.offsetTop, 418, "offsetTop");
assert_equals(row2.offsetLeft, 51, "offsetLeft");
assert_equals(row2.offsetTop, 218, "offsetTop");
assert_equals(row2.offsetLeft, 8, "offsetLeft");
assert_equals(row2.offsetWidth, 50, "offsetWidth");
assert_equals(row2.offsetHeight, 164, "offsetHeight");
}, "row2");
test(() => {
assert_equals(cell4.offsetTop, 418, "offsetTop");
assert_equals(cell4.offsetLeft, 51, "offsetLeft");
assert_equals(cell4.offsetTop, 218, "offsetTop");
assert_equals(cell4.offsetLeft, 8, "offsetLeft");
assert_equals(cell4.offsetWidth, 50, "offsetWidth");
assert_equals(cell4.offsetHeight, 50, "offsetHeight");
}, "cell4");
test(() => {
assert_equals(content4.offsetTop, 418, "offsetTop");
assert_equals(content4.offsetLeft, 51, "offsetLeft");
assert_equals(content4.offsetTop, 218, "offsetTop");
assert_equals(content4.offsetLeft, 8, "offsetLeft");
assert_equals(content4.offsetWidth, 50, "offsetWidth");
assert_equals(content4.offsetHeight, 50, "offsetHeight");
}, "content4");

16
tests/wpt/tests/css/css-cascade/inline-style-background.html vendored Normal file
View file

@ -0,0 +1,16 @@
<!DOCTYPE html>
<head>
<link rel="help" href="https://crbug.com/40934009">
<script src="/resources/testharness.js"></script>
<script src="/resources/testharnessreport.js"></script>
</head>
<body>
<div id="d" style="background:revert">Test passes if it does not crash.</div>
<script>
test(() => {
d.offsetTop;
d.style.background = "url(dummy.png)";
d.offsetLeft;
});
</script>
</body>

73
tests/wpt/tests/css/css-contain/contain-paint-stacking-context-001-ref.html vendored
View file

@ -1,62 +1,13 @@
<!DOCTYPE HTML>
<html>
<head>
<meta charset="utf-8">
<title>CSS Reftest Reference</title>
<link rel="author" title="Yusuf Sermet" href="mailto:ysermet@mozilla.com">
<style>
div {
position: relative;
width: 100px;
}
#div1,
#div3 {
background-color: #cfc;
}
#div1 {
z-index: 5;
}
#div2 {
z-index: 1;
background-color: #fdd;
height: 100px;
top: -20px;
}
#div2_1 {
background-color: #ffc;
z-index: 6;
top: -10px;
}
#div2_2 {
z-index: 3;
position: absolute;
top: -15px;
width: 40px;
height: 100px;
background-color: #ddf;
}
#div3 {
z-index: 2;
top: -50px;
}
</style>
</head>
<body>
<div id="div1">
<br/><br/>
</div>
<div id="div2">
<div id="div2_1">
<br/><br/>
</div>
<div id="div2_2">
</div>
</div>
<div id="div3">
<br/><br/>
</div>
</body>
</html>
<meta charset="utf-8">
<title>Paint Containment Stacking Context Reference</title>
<link rel="author" title="Psychpsyo" href="mailto:psychpsyo@gmail.com">
<style>
div {
width: 100px;
height: 100px;
background-color: green;
}
</style>
<div></div>
Test succeeds if there is no red.

96
tests/wpt/tests/css/css-contain/contain-paint-stacking-context-001a.html vendored
View file

@ -1,66 +1,32 @@
<!DOCTYPE HTML>
<html>
<head>
<meta charset="utf-8">
<title>CSS Test: 'contain: paint' with stacking contents. Z-index is defined only for siblings and children.</title>
<link rel="author" title="Yusuf Sermet" href="mailto:ysermet@mozilla.com">
<link rel="help" href="https://drafts.csswg.org/css2/visuren.html#x43">
<link rel="help" href="https://drafts.csswg.org/css-contain/#containment-paint">
<link rel="match" href="contain-paint-stacking-context-001-ref.html">
<style>
div {
position: relative;
width: 100px;
}
#div1,
#div3 {
background-color: #cfc;
}
#div1 {
z-index: 5;
}
#div2 {
contain: paint;
background-color: #fdd;
height: 100px;
top: -20px;
}
#div2_1 {
background-color: #ffc;
z-index: 6;
top: -10px;
}
#div2_2 {
z-index: 3;
position: absolute;
top: -15px;
width: 40px;
height: 100px;
background-color: #ddf;
}
#div3 {
z-index: 2;
top: -50px;
}
</style>
</head>
<body>
<div id="div1">
<br/><br/>
</div>
<div id="div2">
<div id="div2_1">
<br/><br/>
</div>
<div id="div2_2">
</div>
</div>
<div id="div3">
<br/><br/>
</div>
</body>
</html>
<title>'contain: paint' establishes stacking context.</title>
<link rel="author" title="Psychpsyo" href="mailto:psychpsyo@gmail.com">
<link rel="help" href="https://drafts.csswg.org/css2/visuren.html#x43">
<link rel="help" href="https://drafts.csswg.org/css-contain/#containment-paint">
<link rel="match" href="contain-paint-stacking-context-001-ref.html">
<style>
div {
width: 100px;
height: 100px;
}
#front {
background-color: green;
/* makes a stacking context and puts this on top */
position: absolute;
z-index: 10;
}
#back {
contain: paint;
}
#notOnTop {
background-color: red;
/* z-index is higher than on #front, but this should still be covered up because it is inside #back, which has 'contain: paint' */
position: absolute;
z-index: 1000;
}
</style>
<div id="front"></div>
<div id="back">
<div id="notOnTop"></div>
</div>
Test succeeds if there is no red.

96
tests/wpt/tests/css/css-contain/contain-paint-stacking-context-001b.html vendored
View file

@ -1,66 +1,32 @@
<!DOCTYPE HTML>
<html>
<head>
<meta charset="utf-8">
<title>CSS Test: 'will-change: contain' with stacking contents. Z-index is defined only for siblings and children.</title>
<link rel="author" title="Yusuf Sermet" href="mailto:ysermet@mozilla.com">
<link rel="help" href="https://drafts.csswg.org/css2/visuren.html#x43">
<link rel="help" href="https://drafts.csswg.org/css-contain/#containment-paint">
<link rel="match" href="contain-paint-stacking-context-001-ref.html">
<style>
div {
position: relative;
width: 100px;
}
#div1,
#div3 {
background-color: #cfc;
}
#div1 {
z-index: 5;
}
#div2 {
will-change: contain;
background-color: #fdd;
height: 100px;
top: -20px;
}
#div2_1 {
background-color: #ffc;
z-index: 6;
top: -10px;
}
#div2_2 {
z-index: 3;
position: absolute;
top: -15px;
width: 40px;
height: 100px;
background-color: #ddf;
}
#div3 {
z-index: 2;
top: -50px;
}
</style>
</head>
<body>
<div id="div1">
<br/><br/>
</div>
<div id="div2">
<div id="div2_1">
<br/><br/>
</div>
<div id="div2_2">
</div>
</div>
<div id="div3">
<br/><br/>
</div>
</body>
</html>
<title>'will-change: contain' establishes stacking context.</title>
<link rel="author" title="Psychpsyo" href="mailto:psychpsyo@gmail.com">
<link rel="help" href="https://drafts.csswg.org/css2/visuren.html#x43">
<link rel="help" href="https://drafts.csswg.org/css-contain/#containment-paint">
<link rel="match" href="contain-paint-stacking-context-001-ref.html">
<style>
div {
width: 100px;
height: 100px;
}
#front {
background-color: green;
/* makes a stacking context and puts this on top */
position: absolute;
z-index: 10;
}
#back {
will-change: contain;
}
#notOnTop {
background-color: red;
/* z-index is higher than on #front, but this should still be covered up because it is inside #back, which has 'will-change: contain' */
position: absolute;
z-index: 1000;
}
</style>
<div id="front"></div>
<div id="back">
<div id="notOnTop"></div>
</div>
Test succeeds if there is no red.

23
tests/wpt/tests/css/css-fonts/font-variant-emoji-005-ref.html vendored Normal file
View file

@ -0,0 +1,23 @@
<!DOCTYPE html>
<meta charset="UTF-8" />
<title>CSS Fonts reference</title>
<link rel="stylesheet" type="text/css" href="/fonts/ahem.css" />
<style>
body { background: white; }
p { font: 16px/3 serif; }
span { color: white; font: 25px Ahem; }
span span { color: initial; font-variant-emoji: emoji; }
</style>
<h4>Only lines 3 and 4 should show a keycap numeral:</h4>
<p>1. text: <span>X</span></p>
<p>2. unicode: <span>X</span></p>
<p>3. emoji: <span>X<span>3&#xfe0f;&#x20e3;</span>X</span></p>
<p>4. with VS16: <span>X<span>4&#xfe0f;&#x20e3;</span>X</span></p>
<p>5. emoji, with VS15: <span>X</span></p>

29
tests/wpt/tests/css/css-fonts/font-variant-emoji-005.html vendored Normal file
View file

@ -0,0 +1,29 @@
<!DOCTYPE html>
<meta charset="UTF-8" />
<title>CSS Fonts: font-variant-emoji web font test</title>
<link rel="help" href="https://www.w3.org/TR/css-fonts-4/#font-variant-emoji-prop" />
<link rel="help" href="https://www.unicode.org/reports/tr51/tr51-25.html#Emoji_Properties_and_Data_Files" />
<link rel="match" href="font-variant-emoji-005-ref.html"/>
<meta name="assert" content="Digit-keycap sequences render as emoji if required, in preference to using the named font"/>
<link rel="stylesheet" type="text/css" href="/fonts/ahem.css" />
<style>
body { background: white; }
p { font: 16px/3 serif; }
/* A color-emoji glyph in the span will be visible despite the white color;
* if color-emoji presentation is not used, the span will be invisible.
*/
span { color: white; font: 25px Ahem; }
</style>
<h4>Only lines 3 and 4 should show a keycap numeral:</h4>
<p>1. text: <span style="font-variant-emoji: text">X1&#x20e3;X</span></p>
<p>2. unicode: <span style="font-variant-emoji: unicode">X2&#x20e3;X</span></p>
<p>3. emoji: <span style="font-variant-emoji: emoji">X3&#x20e3;X</span></p>
<p>4. with VS16: <span style="font-variant-emoji: normal">X4&#xfe0f;&#x20e3;X</span></p>
<p>5. emoji, with VS15: <span style="font-variant-emoji: emoji">X5&#xfe0e;&#x20e3;X</span></p>

51
tests/wpt/tests/css/css-gaps/agnostic/gap-decorations-002-ref.html vendored Normal file
View file

@ -0,0 +1,51 @@
<!DOCTYPE html>
<link rel="help" href="https://drafts.csswg.org/css-gaps-1/">
<link rel="author" title="Javier Contreras" href="mailto:javiercon@microsoft.com">
<style>
body {
margin: 0px;
}
.container {
display: flex;
width: 120px;
height: 110px;
column-gap: 20px;
row-gap: 10px;
flex-wrap: wrap;
}
.item {
background: skyblue;
height: 50px;
width: 50px;
margin: 0;
}
.row-gap {
position: absolute;
top: 50px;
background: gold;
width: 120px;
height: 10px;
}
.column-gap {
position: absolute;
top: 0px;
left: 50px;
background: blue;
height: 110px;
width: 20px;
}
</style>
<div class="container">
<div class="item"></div>
<div class="item"></div>
<div class="item"></div>
<div class="item"></div>
</div>
<div class="row-gap"></div>
<div class="column-gap"></div>

46
tests/wpt/tests/css/css-gaps/flex/flex-gap-decorations-022.html vendored Normal file
View file

@ -0,0 +1,46 @@
<!DOCTYPE html>
<title>
CSS Gap Decorations: flex column gaps are painted with different sized gaps and row-rule-outset 0.
</title>
<link rel="help" href="https://drafts.csswg.org/css-gaps-1/">
<link rel="match" href="../agnostic/gap-decorations-002-ref.html">
<link rel="author" title="Javier Contreras" href="mailto:javiercon@microsoft.com">
<style>
body {
margin: 0px;
}
.flex-container {
height: 110px;
width: 120px;
display: flex;
column-gap: 20px;
row-gap: 10px;
column-rule-color: blue;
column-rule-style: solid;
column-rule-width: 20px;
row-rule-color: gold;
row-rule-style: solid;
row-rule-width: 10px;
row-rule-break: intersection;
row-rule-outset: 0;
flex-wrap: wrap;
}
.flex-item {
background: skyblue;
width: 50px;
}
</style>
<div class="flex-container">
<div class="flex-item"></div>
<div class="flex-item"></div>
<div class="flex-item"></div>
<div class="flex-item"></div>
</div>

70
tests/wpt/tests/css/css-gaps/grid/grid-gap-decorations-029-ref.html vendored Normal file
View file

@ -0,0 +1,70 @@
<!DOCTYPE html>
<link rel="help" href="https://drafts.csswg.org/css-gaps-1">
<link rel="author" title="Sam Davis Omekara Jr." href="mailto:samomekarajr@microsoft.com">
<style>
body {
margin: 0px;
}
.grid-container {
display: grid;
grid-gap: 10px;
grid-template-columns: 100px 100px 100px;
grid-template-rows: 100px 100px 100px;
width: 120px;
height: 120px;
}
.item {
background: gray;
opacity: 0.5;
}
.row-gap {
position: absolute;
width: 320px;
height: 0px;
border-bottom: solid 5px red;
}
.row-gap1 {
top: 102.5px;
}
.row-gap2 {
top: 212.5px;
}
.col-gap {
position: absolute;
top: 0px;
width: 0px;
height: 320px;
border-left: solid 5px blue;
}
.col-gap1 {
left: 102.5px;
}
.col-gap2 {
left: 212.5px;
}
</style>
<div class="grid-container">
<div class="item"></div>
<div class="item"></div>
<div class="item"></div>
<div class="item"></div>
<div class="item"></div>
<div class="item"></div>
<div class="item"></div>
<div class="item"></div>
<div class="item"></div>
</div>
<div class="col-gap col-gap1"> </div>
<div class="col-gap col-gap2"> </div>
<div class="row-gap row-gap1"> </div>
<div class="row-gap row-gap2"> </div>

48
tests/wpt/tests/css/css-gaps/grid/grid-gap-decorations-029.html vendored Normal file
View file

@ -0,0 +1,48 @@
<!DOCTYPE html>
<title>
CSS Gap Decorations: Gaps are painted when items overflow container.
</title>
<link rel="help" href="https://drafts.csswg.org/css-gaps-1/">
<link rel="match" href="grid-gap-decorations-029-ref.html">
<link rel="author" title="Sam Davis Omekara Jr." href="mailto:samomekarajr@microsoft.com">
<style>
body {
margin: 0px;
}
.grid-container {
display: grid;
grid-gap: 10px;
grid-template-columns: 100px 100px 100px;
grid-template-rows: 100px 100px 100px;
width: 120px;
height: 120px;
column-rule-color: blue;
column-rule-style: solid;
column-rule-width: 5px;
row-rule-color: red;
row-rule-style: solid;
row-rule-width: 5px;
}
.item {
background: gray;
opacity: 0.5;
}
</style>
<body>
<div class="grid-container">
<div class="item"></div>
<div class="item"></div>
<div class="item"></div>
<div class="item"></div>
<div class="item"></div>
<div class="item"></div>
<div class="item"></div>
<div class="item"></div>
<div class="item"></div>
</div>
</body>

45
tests/wpt/tests/css/css-gaps/grid/grid-gap-decorations-030-ref.html vendored Normal file
View file

@ -0,0 +1,45 @@
<!DOCTYPE html>
<link rel="help" href="https://drafts.csswg.org/css-gaps-1">
<link rel="author" title="Sam Davis Omekara Jr." href="mailto:samomekarajr@microsoft.com">
<style>
body {
margin: 0px;
}
.grid-container {
display: grid;
grid-gap: 10px;
grid-template-columns: 100px 100px 100px;
width: 120px;
height: 120px;
}
.item {
background: gray;
opacity: 0.5;
}
.col-gap {
position: absolute;
top: 0px;
width: 0px;
height: 120px;
border-left: solid 5px blue;
}
.col-gap1 {
left: 102.5px;
}
.col-gap2 {
left: 212.5px;
}
</style>
<div class="grid-container">
<div class="item"></div>
<div class="item"></div>
<div class="item"></div>
</div>
<div class="col-gap col-gap1"> </div>
<div class="col-gap col-gap2"> </div>

37
tests/wpt/tests/css/css-gaps/grid/grid-gap-decorations-030.html vendored Normal file
View file

@ -0,0 +1,37 @@
<!DOCTYPE html>
<title>
CSS Gap Decorations: Gaps are painted when items overflow container - no row gaps.
</title>
<link rel="help" href="https://drafts.csswg.org/css-gaps-1/">
<link rel="match" href="grid-gap-decorations-030-ref.html">
<link rel="author" title="Sam Davis Omekara Jr." href="mailto:samomekarajr@microsoft.com">
<style>
body {
margin: 0px;
}
.grid-container {
display: grid;
grid-gap: 10px;
grid-template-columns: 100px 100px 100px;
width: 120px;
height: 120px;
column-rule-color: blue;
column-rule-style: solid;
column-rule-width: 5px;
}
.item {
background: gray;
opacity: 0.5;
}
</style>
<body>
<div class="grid-container">
<div class="item"></div>
<div class="item"></div>
<div class="item"></div>
</div>
</body>

45
tests/wpt/tests/css/css-gaps/grid/grid-gap-decorations-031-ref.html vendored Normal file
View file

@ -0,0 +1,45 @@
<!DOCTYPE html>
<link rel="help" href="https://drafts.csswg.org/css-gaps-1">
<link rel="author" title="Sam Davis Omekara Jr." href="mailto:samomekarajr@microsoft.com">
<style>
body {
margin: 0px;
}
.grid-container {
display: grid;
grid-gap: 10px;
grid-template-rows: 100px 100px 100px;
grid-auto-flow: column;
width: 120px;
height: 120px;
}
.item {
background: gray;
opacity: 0.5;
}
.row-gap {
position: absolute;
width: 120px;
height: 0px;
border-bottom: solid 5px red;
}
.row-gap1 {
top: 102.5px;
}
.row-gap2 {
top: 212.5px;
}
</style>
<div class="grid-container">
<div class="item"></div>
<div class="item"></div>
<div class="item"></div>
</div>
<div class="row-gap row-gap1"> </div>
<div class="row-gap row-gap2"> </div>

38
tests/wpt/tests/css/css-gaps/grid/grid-gap-decorations-031.html vendored Normal file
View file

@ -0,0 +1,38 @@
<!DOCTYPE html>
<title>
CSS Gap Decorations: Gaps are painted when items overflow container - no column gaps.
</title>
<link rel="help" href="https://drafts.csswg.org/css-gaps-1/">
<link rel="match" href="grid-gap-decorations-031-ref.html">
<link rel="author" title="Sam Davis Omekara Jr." href="mailto:samomekarajr@microsoft.com">
<style>
body {
margin: 0px;
}
.grid-container {
display: grid;
grid-gap: 10px;
grid-template-rows: 100px 100px 100px;
grid-auto-flow: column;
width: 120px;
height: 120px;
row-rule-color: red;
row-rule-style: solid;
row-rule-width: 5px;
}
.item {
background: gray;
opacity: 0.5;
}
</style>
<body>
<div class="grid-container">
<div class="item"></div>
<div class="item"></div>
<div class="item"></div>
</div>
</body>

71
tests/wpt/tests/css/css-gaps/grid/grid-gap-decorations-032-ref.html vendored Normal file
View file

@ -0,0 +1,71 @@
<!DOCTYPE html>
<link rel="help" href="https://drafts.csswg.org/css-gaps-1">
<link rel="author" title="Sam Davis Omekara Jr." href="mailto:samomekarajr@microsoft.com">
<style>
body {
margin: 0px;
overflow: hidden;
}
.grid-container {
display: grid;
grid-gap: 10px;
grid-template-columns: 100px 100px 100px;
grid-template-rows: repeat(6, 100px);
width: 120px;
height: 120px;
}
.row-gap {
position: absolute;
width: 320px;
height: 0px;
border-bottom: solid 5px red;
}
.row-gap1 {
top: 102.5px;
}
.row-gap2 {
top: 212.5px;
}
.row-gap3 {
top: 322.5px;
}
.row-gap4 {
top: 432.5px;
}
.row-gap5 {
top: 542.5px;
}
.col-gap {
position: absolute;
top: 0px;
width: 0px;
height: 650px;
border-left: solid 10px blue;
}
.col-gap1 {
left: 100px;
}
.col-gap2 {
left: 210px;
}
</style>
<div class="grid-container"></div>
<div class="col-gap col-gap1"> </div>
<div class="col-gap col-gap2"> </div>
<div class="row-gap row-gap1"> </div>
<div class="row-gap row-gap2"> </div>
<div class="row-gap row-gap3"> </div>
<div class="row-gap row-gap4"> </div>
<div class="row-gap row-gap5"> </div>

39
tests/wpt/tests/css/css-gaps/grid/grid-gap-decorations-032.html vendored Normal file
View file

@ -0,0 +1,39 @@
<!DOCTYPE html>
<title>
CSS Gap Decorations: Gaps are painted when rows are dynamically added and overflow container.
</title>
<link rel="help" href="https://drafts.csswg.org/css-gaps-1/">
<link rel="match" href="grid-gap-decorations-032-ref.html">
<link rel="author" title="Sam Davis Omekara Jr." href="mailto:samomekarajr@microsoft.com">
<style>
body {
margin: 0px;
overflow: hidden;
}
.grid-container {
display: grid;
grid-gap: 10px;
grid-template-columns: 100px 100px 100px;
grid-template-rows: 100px;
width: 120px;
height: 120px;
column-rule-color: blue;
column-rule-style: solid;
column-rule-width: 10px;
}
</style>
<body>
<div class="grid-container"></div>
<script>
const grid = document.querySelector('.grid-container');
grid.style.gridTemplateRows = 'repeat(6, 100px)';
grid.style.rowRuleColor = 'red';
grid.style.rowRuleStyle = 'solid';
grid.style.rowRuleWidth = '5px';
</script>
</body>

72
tests/wpt/tests/css/css-gaps/grid/grid-gap-decorations-033-ref.html vendored Normal file
View file

@ -0,0 +1,72 @@
<!DOCTYPE html>
<link rel="help" href="https://drafts.csswg.org/css-gaps-1">
<link rel="author" title="Sam Davis Omekara Jr." href="mailto:samomekarajr@microsoft.com">
<style>
body {
margin: 0px;
overflow: hidden;
}
.grid-container {
display: grid;
grid-gap: 10px;
grid-template-columns: repeat(3, 50px);
grid-template-rows: repeat(6, 50px);
width: 50px;
height: 50px;
}
.row-gap {
position: absolute;
width: 170px;
height: 0px;
border-bottom: solid 5px red;
}
.row-gap1 {
top: 52.5px;
}
.row-gap2 {
top: 112.5px;
}
.row-gap3 {
top: 172.5px;
}
.row-gap4 {
top: 232.5px;
}
.row-gap5 {
top: 195px;
border-bottom: solid 200px red; /*expand the last row gap's height*/
}
.col-gap {
position: absolute;
top: 0px;
width: 0px;
height: 350px;
border-left: solid 10px blue;
}
.col-gap1 {
left: 50px;
}
.col-gap2 {
left: 110px;
}
</style>
<div class="grid-container"></div>
<div class="col-gap col-gap1"> </div>
<div class="col-gap col-gap2"> </div>
<div class="row-gap row-gap1"> </div>
<div class="row-gap row-gap2"> </div>
<div class="row-gap row-gap3"> </div>
<div class="row-gap row-gap4"> </div>
<div class="row-gap row-gap5"> </div>

38
tests/wpt/tests/css/css-gaps/grid/grid-gap-decorations-033.html vendored Normal file
View file

@ -0,0 +1,38 @@
<!DOCTYPE html>
<title>
CSS Gap Decorations: Decorations are painted when rule thickness is greater than gap size.
</title>
<link rel="help" href="https://drafts.csswg.org/css-gaps-1/">
<link rel="match" href="grid-gap-decorations-033-ref.html">
<link rel="author" title="Sam Davis Omekara Jr." href="mailto:samomekarajr@microsoft.com">
<style>
body {
margin: 0px;
overflow: hidden;
}
.grid-container {
display: grid;
gap: 10px;
grid-template-columns: repeat(3, 50px);
grid-template-rows: repeat(6, 50px);
width: 50px;
height: 50px;
column-rule-color: blue;
column-rule-style: solid;
column-rule-width: 10px;
}
</style>
<body>
<div class="grid-container"></div>
<script>
const grid = document.querySelector('.grid-container');
grid.style.rowRuleColor = 'red';
grid.style.rowRuleStyle = 'solid';
grid.style.rowRuleWidth = 'repeat(4, 5px) 200px';
</script>
</body>

44
tests/wpt/tests/css/css-gaps/grid/grid-gap-decorations-38.html vendored Normal file
View file

@ -0,0 +1,44 @@
<!DOCTYPE html>
<title>
CSS Gap Decorations: grid column gaps are painted with different sized gaps and column-rule-outset 0.
</title>
<link rel="help" href="https://drafts.csswg.org/css-gaps-1/">
<link rel="match" href="../agnostic/gap-decorations-002-ref.html">
<link rel="author" title="Javier Contreras" href="mailto:javiercon@microsoft.com">
<style>
body {
margin: 0px;
}
.grid-container {
height: 110px;
width: 120px;
display: grid;
grid-template-columns: repeat(2, 1fr);
column-gap: 20px;
row-gap: 10px;
column-rule-color: blue;
column-rule-style: solid;
column-rule-width: 20px;
row-rule-color: gold;
row-rule-style: solid;
row-rule-width: 10px;
row-rule-break: intersection;
row-rule-outset: 0;
}
.grid-item {
background: skyblue;
}
</style>
<div class="grid-container">
<div class="grid-item"></div>
<div class="grid-item"></div>
<div class="grid-item"></div>
<div class="grid-item"></div>
</div>

49
tests/wpt/tests/css/css-gaps/multicol/multicol-gap-decorations-017-ref.html vendored Normal file
View file

@ -0,0 +1,49 @@
<!DOCTYPE html>
<link rel="help" href="https://drafts.csswg.org/css-gaps-1/">
<link rel="author" title="Javier Contreras" href="mailto:javiercon@microsoft.com">
<style>
body {
margin: 0px;
}
.container {
border: 2px solid rgb(96 139 168);
width: 210px;
height: 130px;
column-gap: 20px;
display: flex;
}
.items {
background: rgb(96 139 168 / 0.2);
height: 130px;
margin: 0px;
width: 56.666px;
}
.row-gap {
position: absolute;
height: 10px;
width: 210px;
background: gold;
left: 2px;
top: 62px;
}
.column-gap {
position: absolute;
height: 130px;
width: 20px;
background: blue;
top: 2px;
}
</style>
<div class="container">
<div class="items"></div>
<div class="items"></div>
<div class="items"></div>
</div>
<div class="row-gap"></div>
<div class="column-gap" style="left:58.666px;"></div>
<div class="column-gap" style="left:135.332px;"></div>

48
tests/wpt/tests/css/css-gaps/multicol/multicol-gap-decorations-017.html vendored Normal file
View file

@ -0,0 +1,48 @@
<!DOCTYPE html>
<title>
CSS Gap Decorations: Multicolumn gap decorations painted with column-wrap and with different sized gaps and row-rule-outset 0.
</title>
<link rel="help" href="https://drafts.csswg.org/css-gaps-1/">
<link rel="match" href="multicol-gap-decorations-017-ref.html">
<link rel="author" title="Javier Contreras" href="mailto:javiercon@microsoft.com">
<style>
body {
margin: 0px;
}
.container {
border: 2px solid rgb(96 139 168);
width: 210px;
height: 130px;
column-count: 3;
column-width: 56.666px;
column-height: 60px;
column-gap: 20px;
row-gap: 10px;
column-rule-width: 20px;
column-rule-style: solid;
column-rule-color: blue;
row-rule-width: 10px;
row-rule-style: solid;
row-rule-color: gold;
column-wrap: wrap;
row-rule-break: intersection;
row-rule-outset: 0;
}
p {
background: rgb(96 139 168 / 0.2);
height: 60px;
margin: 0px;
}
</style>
<div class="container">
<p></p>
<p></p>
<p></p>
<p></p>
<p></p>
<p></p>
</div>

51
tests/wpt/tests/css/css-gaps/parsing/gap-decorations-col-rule-width.html vendored Normal file
View file

@ -0,0 +1,51 @@
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>CSS Gap Decorations: Ensure getComputedStyle for column-rule-width is as specified with multiple values</title>
<link rel="help" href="https://drafts.csswg.org/css-gaps-1/#column-row-rule-width">
<link rel="author" title="Sam Davis Omekara Jr." href="mailto:samomekarajr@microsoft.com">
<script src="/resources/testharness.js" type="text/javascript"></script>
<script src="/resources/testharnessreport.js" type="text/javascript"></script>
</head>
<body>
<div id="target1"></div>
<div id="target2"></div>
<div id="target3"></div>
<style>
#target1 {
column-rule-width: thin;
}
#target2 {
column-rule-width: 5px 10px 15px;
}
#target3 {
column-rule-width: repeat(auto, 5px);
}
</style>
<script>
test(function() {
const containerStyle = window.getComputedStyle(document.querySelector('#target1'));
const columnRuleWidth = containerStyle.getPropertyValue('column-rule-width');
assert_equals(columnRuleWidth, '0px');
}, "`column-rule-width` should be `0px` when `column-rule-style` is `none` with single value");
test(function() {
const containerStyle = window.getComputedStyle(document.querySelector('#target2'));
const columnRuleWidth = containerStyle.getPropertyValue('column-rule-width');
assert_equals(columnRuleWidth, '5px 10px 15px');
}, "`column-rule-width` should be as specified regardless of `column-rule-style` with multiple values");
test(function() {
const containerStyle = window.getComputedStyle(document.querySelector('#target3'));
const columnRuleWidth = containerStyle.getPropertyValue('column-rule-width');
assert_equals(columnRuleWidth, 'repeat(auto, 5px)');
}, "`column-rule-width` should be as specified regardless of `column-rule-style` with multiple (repeat) values");
</script>
</body>
</html>

11
tests/wpt/tests/css/css-images/linear-gradient-body-sibling-index-ref.html vendored Normal file
View file

@ -0,0 +1,11 @@
<!DOCTYPE html>
<title>CSS Test Reference</title>
<style>
body {
background-position: top left;
background-repeat: no-repeat;
background-size: 100px 100px;
background-image: linear-gradient(blue 40px, yellow);
}
</style>
<body>

15
tests/wpt/tests/css/css-images/linear-gradient-body-sibling-index.html vendored Normal file
View file

@ -0,0 +1,15 @@
<!DOCTYPE html>
<title>CSS Images Test: Linear gradient with sibling-index()</title>
<link rel="help" href="https://drafts.csswg.org/css-images/#linear-gradients">
<link rel="help" href="https://drafts.csswg.org/css-values-5/#tree-counting">
<link rel="match" href="linear-gradient-body-sibling-index-ref.html">
<link rel="assert" content"sibling-index() is 2 for body">
<style>
body {
background-position: top left;
background-repeat: no-repeat;
background-size: 100px 100px;
background-image: linear-gradient(blue calc(20px * sibling-index()), yellow);
}
</style>
<body>

7
tests/wpt/tests/css/css-images/linear-gradient-calc-em-units-ref.html vendored Normal file
View file

@ -0,0 +1,7 @@
<!DOCTYPE html>
<title>CSS Test Reference</title>
<style>
div { width: 100px; height: 100px; }
</style>
<div style="background: linear-gradient(blue 20px, yellow)"></div>
<div style="background: linear-gradient(blue 60px, yellow)"></div>

19
tests/wpt/tests/css/css-images/linear-gradient-calc-em-units.html vendored Normal file
View file

@ -0,0 +1,19 @@
<!DOCTYPE html>
<title>CSS Images Test: Linear gradient with em in calc()</title>
<link rel="help" href="https://drafts.csswg.org/css-images/#linear-gradients">
<link rel="match" href="linear-gradient-calc-em-units-ref.html">
<style>
div {
width: 100px;
height: 100px;
background: linear-gradient(blue calc(2em), yellow);
}
#em1 {
font-size: 10px;
}
#em2 {
font-size: 30px;
}
</style>
<div id="em1"></div>
<div id="em2"></div>

7
tests/wpt/tests/css/css-images/linear-gradient-sibling-index-ref.html vendored Normal file
View file

@ -0,0 +1,7 @@
<!DOCTYPE html>
<title>CSS Test Reference</title>
<style>
div { width: 100px; height: 100px; }
</style>
<div style="background: linear-gradient(blue 20px, yellow)"></div>
<div style="background: linear-gradient(blue 50px, yellow)"></div>

19
tests/wpt/tests/css/css-images/linear-gradient-sibling-index.html vendored Normal file
View file

@ -0,0 +1,19 @@
<!DOCTYPE html>
<title>CSS Images Test: Linear gradient with sibling-index()</title>
<link rel="help" href="https://drafts.csswg.org/css-images/#linear-gradients">
<link rel="help" href="https://drafts.csswg.org/css-values-5/#tree-counting">
<link rel="match" href="linear-gradient-sibling-index-ref.html">
<style>
.grad {
width: 100px;
height: 100px;
background: linear-gradient(blue calc(10px * sibling-index()), yellow);
}
</style>
<div>
<div></div>
<div class="grad"></div>
<div></div>
<div></div>
<div class="grad"></div>
</div>

4
tests/wpt/tests/css/css-mixins/dashed-function-cycles.tentative.html → tests/wpt/tests/css/css-mixins/dashed-function-cycles.html vendored
View file

@ -1,7 +1,7 @@
<!DOCTYPE html>
<title>Custom Functions: Handling cycles</title>
<link rel="help" href="https://drafts.csswg.org/css-mixins-1/#cycles">
<link rel="help" href="https://github.com/w3c/csswg-drafts/issues/11500">
<link rel="help" href="https://drafts.csswg.org/css-mixins-1/#evaluating-custom-functions">
<link rel="help" href="https://drafts.csswg.org/css-values-5/#cyclic-substitution-contexts">
<script src="/resources/testharness.js"></script>
<script src="/resources/testharnessreport.js"></script>
<script src="resources/utils.js"></script>

139
tests/wpt/tests/css/css-multicol/getclientrects-005.html vendored Normal file
View file

@ -0,0 +1,139 @@
<!DOCTYPE html>
<title>getClientRects on fragmented table-column and table-column-group</title>
<link rel="author" title="Morten Stenshorne" href="mailto:mstensho@chromium.org">
<link rel="help" href="https://drafts.csswg.org/cssom-view/#dom-element-getclientrects">
<link rel="help" href="https://drafts.csswg.org/css-multicol/">
<style>
body {
margin: 8px;
}
</style>
<div style="columns:6; gap:20px; inline-size:580px; column-rule:solid; column-fill:auto; block-size:100px; background:yellow;">
<div style="block-size:110px;"></div>
<div style="display:table; inline-size:100%; border-spacing:5px; border:2px solid; background:pink;">
<div style="display:table-caption; block-size:100px;"></div>
<div style="display:table-caption; caption-side:bottom; block-size:100px;"></div>
<div id="col1" style="display:table-column; inline-size:15px; background:blue;"></div>
<div id="col2" style="display:table-column; background:lime;"></div>
<div id="group" style="display:table-column-group;">
<div id="col3" style="display:table-column; inline-size:20px; background:hotpink;"></div>
<div id="col4" style="display:table-column; inline-size:10px; background:cyan;" id="col2"></div>
</div>
<div style="display:table-row-group;">
<div style="display:table-cell;">
<div style="block-size:5px;"></div>
</div>
</div>
<div style="display:table-row-group;">
<div style="display:table-cell;">
<div style="block-size:240px;"></div>
</div>
<div style="display:table-cell;"></div>
<div style="display:table-cell;"></div>
<div style="display:table-cell;"></div>
</div>
</div>
</div>
<script src="/resources/testharness.js"></script>
<script src="/resources/testharnessreport.js"></script>
<script>
test(()=> {
let rects = col1.getClientRects();
assert_equals(rects.length, 3);
assert_equals(rects[0].left, 215);
assert_equals(rects[0].top, 25);
assert_equals(rects[0].width, 15);
assert_equals(rects[0].height, 83);
assert_equals(rects[1].left, 315);
assert_equals(rects[1].top, 8);
assert_equals(rects[1].width, 15);
assert_equals(rects[1].height, 100);
assert_equals(rects[2].left, 415);
assert_equals(rects[2].top, 8);
assert_equals(rects[2].width, 15);
assert_equals(rects[2].height, 67);
}, "#col1");
test(()=> {
let rects = col2.getClientRects();
assert_equals(rects.length, 3);
assert_equals(rects[0].left, 235);
assert_equals(rects[0].top, 25);
assert_equals(rects[0].width, 10);
assert_equals(rects[0].height, 83);
assert_equals(rects[1].left, 335);
assert_equals(rects[1].top, 8);
assert_equals(rects[1].width, 10);
assert_equals(rects[1].height, 100);
assert_equals(rects[2].left, 435);
assert_equals(rects[2].top, 8);
assert_equals(rects[2].width, 10);
assert_equals(rects[2].height, 67);
}, "#col2");
test(()=> {
let rects = col3.getClientRects();
assert_equals(rects.length, 3);
assert_equals(rects[0].left, 250);
assert_equals(rects[0].top, 25);
assert_equals(rects[0].width, 20);
assert_equals(rects[0].height, 83);
assert_equals(rects[1].left, 350);
assert_equals(rects[1].top, 8);
assert_equals(rects[1].width, 20);
assert_equals(rects[1].height, 100);
assert_equals(rects[2].left, 450);
assert_equals(rects[2].top, 8);
assert_equals(rects[2].width, 20);
assert_equals(rects[2].height, 67);
}, "#col3");
test(()=> {
let rects = col4.getClientRects();
assert_equals(rects.length, 3);
assert_equals(rects[0].left, 275);
assert_equals(rects[0].top, 25);
assert_equals(rects[0].width, 10);
assert_equals(rects[0].height, 83);
assert_equals(rects[1].left, 375);
assert_equals(rects[1].top, 8);
assert_equals(rects[1].width, 10);
assert_equals(rects[1].height, 100);
assert_equals(rects[2].left, 475);
assert_equals(rects[2].top, 8);
assert_equals(rects[2].width, 10);
assert_equals(rects[2].height, 67);
}, "#col4");
test(()=> {
let rects = group.getClientRects();
assert_equals(rects.length, 3);
assert_equals(rects[0].left, 250);
assert_equals(rects[0].top, 25);
assert_equals(rects[0].width, 35);
assert_equals(rects[0].height, 83);
assert_equals(rects[1].left, 350);
assert_equals(rects[1].top, 8);
assert_equals(rects[1].width, 35);
assert_equals(rects[1].height, 100);
assert_equals(rects[2].left, 450);
assert_equals(rects[2].top, 8);
assert_equals(rects[2].width, 35);
assert_equals(rects[2].height, 67);
}, "#group");
</script>

139
tests/wpt/tests/css/css-multicol/getclientrects-006.html vendored Normal file
View file

@ -0,0 +1,139 @@
<!DOCTYPE html>
<title>getClientRects on fragmented table-column and table-column-group, vertical-rl</title>
<link rel="author" title="Morten Stenshorne" href="mailto:mstensho@chromium.org">
<link rel="help" href="https://drafts.csswg.org/cssom-view/#dom-element-getclientrects">
<link rel="help" href="https://drafts.csswg.org/css-multicol/">
<style>
body {
margin: 8px;
}
</style>
<div style="writing-mode:vertical-rl; columns:6; gap:20px; inline-size:580px; column-rule:solid; column-fill:auto; block-size:100px; background:yellow;">
<div style="block-size:110px;"></div>
<div style="display:table; inline-size:100%; border-spacing:5px; border:2px solid; background:pink;">
<div style="display:table-caption; block-size:100px;"></div>
<div style="display:table-caption; caption-side:bottom; block-size:100px;"></div>
<div id="col1" style="display:table-column; inline-size:15px; background:blue;"></div>
<div id="col2" style="display:table-column; background:lime;"></div>
<div id="group" style="display:table-column-group;">
<div id="col3" style="display:table-column; inline-size:20px; background:hotpink;"></div>
<div id="col4" style="display:table-column; inline-size:10px; background:cyan;" id="col2"></div>
</div>
<div style="display:table-row-group;">
<div style="display:table-cell;">
<div style="block-size:5px;"></div>
</div>
</div>
<div style="display:table-row-group;">
<div style="display:table-cell;">
<div style="block-size:240px;"></div>
</div>
<div style="display:table-cell;"></div>
<div style="display:table-cell;"></div>
<div style="display:table-cell;"></div>
</div>
</div>
</div>
<script src="/resources/testharness.js"></script>
<script src="/resources/testharnessreport.js"></script>
<script>
test(()=> {
let rects = col1.getClientRects();
assert_equals(rects.length, 3);
assert_equals(rects[0].left, 8);
assert_equals(rects[0].top, 215);
assert_equals(rects[0].width, 83);
assert_equals(rects[0].height, 15);
assert_equals(rects[1].left, 8);
assert_equals(rects[1].top, 315);
assert_equals(rects[1].width, 100);
assert_equals(rects[1].height, 15);
assert_equals(rects[2].left, 41);
assert_equals(rects[2].top, 415);
assert_equals(rects[2].width, 67);
assert_equals(rects[2].height, 15);
}, "#col1");
test(()=> {
let rects = col2.getClientRects();
assert_equals(rects.length, 3);
assert_equals(rects[0].left, 8);
assert_equals(rects[0].top, 235);
assert_equals(rects[0].width, 83);
assert_equals(rects[0].height, 10);
assert_equals(rects[1].left, 8);
assert_equals(rects[1].top, 335);
assert_equals(rects[1].width, 100);
assert_equals(rects[1].height, 10);
assert_equals(rects[2].left, 41);
assert_equals(rects[2].top, 435);
assert_equals(rects[2].width, 67);
assert_equals(rects[2].height, 10);
}, "#col2");
test(()=> {
let rects = col3.getClientRects();
assert_equals(rects.length, 3);
assert_equals(rects[0].left, 8);
assert_equals(rects[0].top, 250);
assert_equals(rects[0].width, 83);
assert_equals(rects[0].height, 20);
assert_equals(rects[1].left, 8);
assert_equals(rects[1].top, 350);
assert_equals(rects[1].width, 100);
assert_equals(rects[1].height, 20);
assert_equals(rects[2].left, 41);
assert_equals(rects[2].top, 450);
assert_equals(rects[2].width, 67);
assert_equals(rects[2].height, 20);
}, "#col3");
test(()=> {
let rects = col4.getClientRects();
assert_equals(rects.length, 3);
assert_equals(rects[0].left, 8);
assert_equals(rects[0].top, 275);
assert_equals(rects[0].width, 83);
assert_equals(rects[0].height, 10);
assert_equals(rects[1].left, 8);
assert_equals(rects[1].top, 375);
assert_equals(rects[1].width, 100);
assert_equals(rects[1].height, 10);
assert_equals(rects[2].left, 41);
assert_equals(rects[2].top, 475);
assert_equals(rects[2].width, 67);
assert_equals(rects[2].height, 10);
}, "#col4");
test(()=> {
let rects = group.getClientRects();
assert_equals(rects.length, 3);
assert_equals(rects[0].left, 8);
assert_equals(rects[0].top, 250);
assert_equals(rects[0].width, 83);
assert_equals(rects[0].height, 35);
assert_equals(rects[1].left, 8);
assert_equals(rects[1].top, 350);
assert_equals(rects[1].width, 100);
assert_equals(rects[1].height, 35);
assert_equals(rects[2].left, 41);
assert_equals(rects[2].top, 450);
assert_equals(rects[2].width, 67);
assert_equals(rects[2].height, 35);
}, "#group");
</script>

139
tests/wpt/tests/css/css-multicol/getclientrects-007.html vendored Normal file
View file

@ -0,0 +1,139 @@
<!DOCTYPE html>
<title>getClientRects on fragmented table-column and table-column-group, vertical-lr</title>
<link rel="author" title="Morten Stenshorne" href="mailto:mstensho@chromium.org">
<link rel="help" href="https://drafts.csswg.org/cssom-view/#dom-element-getclientrects">
<link rel="help" href="https://drafts.csswg.org/css-multicol/">
<style>
body {
margin: 8px;
}
</style>
<div style="float:left; writing-mode:vertical-lr; columns:6; gap:20px; inline-size:580px; column-rule:solid; column-fill:auto; block-size:100px; background:yellow;">
<div style="block-size:110px;"></div>
<div style="display:table; inline-size:100%; border-spacing:5px; border:2px solid; background:pink;">
<div style="display:table-caption; block-size:100px;"></div>
<div style="display:table-caption; caption-side:bottom; block-size:100px;"></div>
<div id="col1" style="display:table-column; inline-size:15px; background:blue;"></div>
<div id="col2" style="display:table-column; background:lime;"></div>
<div id="group" style="display:table-column-group;">
<div id="col3" style="display:table-column; inline-size:20px; background:hotpink;"></div>
<div id="col4" style="display:table-column; inline-size:10px; background:cyan;" id="col2"></div>
</div>
<div style="display:table-row-group;">
<div style="display:table-cell;">
<div style="block-size:5px;"></div>
</div>
</div>
<div style="display:table-row-group;">
<div style="display:table-cell;">
<div style="block-size:240px;"></div>
</div>
<div style="display:table-cell;"></div>
<div style="display:table-cell;"></div>
<div style="display:table-cell;"></div>
</div>
</div>
</div>
<script src="/resources/testharness.js"></script>
<script src="/resources/testharnessreport.js"></script>
<script>
test(()=> {
let rects = col1.getClientRects();
assert_equals(rects.length, 3);
assert_equals(rects[0].top, 215);
assert_equals(rects[0].left, 25);
assert_equals(rects[0].height, 15);
assert_equals(rects[0].width, 83);
assert_equals(rects[1].top, 315);
assert_equals(rects[1].left, 8);
assert_equals(rects[1].height, 15);
assert_equals(rects[1].width, 100);
assert_equals(rects[2].top, 415);
assert_equals(rects[2].left, 8);
assert_equals(rects[2].height, 15);
assert_equals(rects[2].width, 67);
}, "#col1");
test(()=> {
let rects = col2.getClientRects();
assert_equals(rects.length, 3);
assert_equals(rects[0].top, 235);
assert_equals(rects[0].left, 25);
assert_equals(rects[0].height, 10);
assert_equals(rects[0].width, 83);
assert_equals(rects[1].top, 335);
assert_equals(rects[1].left, 8);
assert_equals(rects[1].height, 10);
assert_equals(rects[1].width, 100);
assert_equals(rects[2].top, 435);
assert_equals(rects[2].left, 8);
assert_equals(rects[2].height, 10);
assert_equals(rects[2].width, 67);
}, "#col2");
test(()=> {
let rects = col3.getClientRects();
assert_equals(rects.length, 3);
assert_equals(rects[0].top, 250);
assert_equals(rects[0].left, 25);
assert_equals(rects[0].height, 20);
assert_equals(rects[0].width, 83);
assert_equals(rects[1].top, 350);
assert_equals(rects[1].left, 8);
assert_equals(rects[1].height, 20);
assert_equals(rects[1].width, 100);
assert_equals(rects[2].top, 450);
assert_equals(rects[2].left, 8);
assert_equals(rects[2].height, 20);
assert_equals(rects[2].width, 67);
}, "#col3");
test(()=> {
let rects = col4.getClientRects();
assert_equals(rects.length, 3);
assert_equals(rects[0].top, 275);
assert_equals(rects[0].left, 25);
assert_equals(rects[0].height, 10);
assert_equals(rects[0].width, 83);
assert_equals(rects[1].top, 375);
assert_equals(rects[1].left, 8);
assert_equals(rects[1].height, 10);
assert_equals(rects[1].width, 100);
assert_equals(rects[2].top, 475);
assert_equals(rects[2].left, 8);
assert_equals(rects[2].height, 10);
assert_equals(rects[2].width, 67);
}, "#col4");
test(()=> {
let rects = group.getClientRects();
assert_equals(rects.length, 3);
assert_equals(rects[0].top, 250);
assert_equals(rects[0].left, 25);
assert_equals(rects[0].height, 35);
assert_equals(rects[0].width, 83);
assert_equals(rects[1].top, 350);
assert_equals(rects[1].left, 8);
assert_equals(rects[1].height, 35);
assert_equals(rects[1].width, 100);
assert_equals(rects[2].top, 450);
assert_equals(rects[2].left, 8);
assert_equals(rects[2].height, 35);
assert_equals(rects[2].width, 67);
}, "#group");
</script>

67
tests/wpt/tests/css/css-multicol/getclientrects-008.html vendored Normal file
View file

@ -0,0 +1,67 @@
<!DOCTYPE html>
<title>getClientRects on monolithic elements and their container</title>
<link rel="author" title="Morten Stenshorne" href="mailto:mstensho@chromium.org">
<link rel="help" href="https://drafts.csswg.org/cssom-view/#dom-element-getclientrects">
<link rel="help" href="https://drafts.csswg.org/css-multicol/">
<style>
body {
margin: 8px;
}
</style>
<div style="columns:3; column-fill:auto; gap:10px; width:320px; height:100px; background:yellow;">
<div id="container" style="background:gray;">
<div id="monolith1" style="contain:size; width:50%; height:250px; background:cyan;"></div>
<div id="monolith2" style="contain:size; width:50%; height:50px; background:black;"></div>
<div id="monolith3" style="contain:size; width:50%; height:250px; background:hotpink;"></div>
</div>
</div>
<script src="/resources/testharness.js"></script>
<script src="/resources/testharnessreport.js"></script>
<script>
test(()=> {
let rects = monolith1.getClientRects();
assert_equals(rects.length, 1);
assert_equals(rects[0].left, 8);
assert_equals(rects[0].top, 8);
assert_equals(rects[0].width, 50);
assert_equals(rects[0].height, 250);
}, "#monolith1");
test(()=> {
let rects = monolith2.getClientRects();
assert_equals(rects.length, 1);
assert_equals(rects[0].left, 118);
assert_equals(rects[0].top, 8);
assert_equals(rects[0].width, 50);
assert_equals(rects[0].height, 50);
}, "#monolith2");
test(()=> {
let rects = monolith3.getClientRects();
assert_equals(rects.length, 1);
assert_equals(rects[0].left, 228);
assert_equals(rects[0].top, 8);
assert_equals(rects[0].width, 50);
assert_equals(rects[0].height, 250);
}, "#monolith3");
test(()=> {
let rects = container.getClientRects();
assert_equals(rects.length, 3);
assert_equals(rects[0].left, 8);
assert_equals(rects[0].top, 8);
assert_equals(rects[0].width, 100);
assert_equals(rects[0].height, 250);
assert_equals(rects[1].left, 118);
assert_equals(rects[1].top, 8);
assert_equals(rects[1].width, 100);
assert_equals(rects[1].height, 100);
assert_equals(rects[2].left, 228);
assert_equals(rects[2].top, 8);
assert_equals(rects[2].width, 100);
assert_equals(rects[2].height, 250);
}, "#container");
</script>

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