mirror of
https://github.com/servo/servo.git
synced 2025-08-03 12:40:06 +01:00
Update web-platform-tests to revision ac12b3e9488edb436f063b11213e954ae62d5a5e
This commit is contained in:
WPT Sync Bot
parent
65370f17c9
commit
b56a3b8e69
111 changed files with 3122 additions and 68 deletions
|
|
@ -14,6 +14,9 @@
|
||||||
[Revoke blob URL after creating Request, will fetch]
|
[Revoke blob URL after creating Request, will fetch]
|
||||||
expected: FAIL
|
expected: FAIL
|
||||||
|
|
||||||
|
[Revoke blob URL after calling fetch, fetch should succeed]
|
||||||
|
expected: FAIL
|
||||||
|
|
||||||
|
|
||||||
[url-with-fetch.any.html]
|
[url-with-fetch.any.html]
|
||||||
[Untitled]
|
[Untitled]
|
||||||
|
|
@ -34,6 +37,3 @@
|
||||||
[Revoke blob URL after creating Request, will fetch]
|
[Revoke blob URL after creating Request, will fetch]
|
||||||
expected: FAIL
|
expected: FAIL
|
||||||
|
|
||||||
[Revoke blob URL after calling fetch, fetch should succeed]
|
|
||||||
expected: FAIL
|
|
||||||
|
|
||||||
|
|
|
||||||
File diff suppressed because it is too large
Load diff
|
|
@ -2,3 +2,6 @@
|
||||||
[Make sure that we're sized by the right ancestor]
|
[Make sure that we're sized by the right ancestor]
|
||||||
expected: FAIL
|
expected: FAIL
|
||||||
|
|
||||||
|
[position:absolute should be sized by the right ancestor]
|
||||||
|
expected: FAIL
|
||||||
|
|
||||||
|
|
|
||||||
|
|
@ -125,9 +125,6 @@
|
||||||
[Matching font-style: 'oblique 0deg' should prefer 'oblique 0deg' over 'oblique 5deg']
|
[Matching font-style: 'oblique 0deg' should prefer 'oblique 0deg' over 'oblique 5deg']
|
||||||
expected: FAIL
|
expected: FAIL
|
||||||
|
|
||||||
[Matching font-style: 'oblique 0deg' should prefer 'oblique 5deg' over 'oblique 15deg 20deg']
|
|
||||||
expected: FAIL
|
|
||||||
|
|
||||||
[Matching font-style: 'oblique 0deg' should prefer 'oblique 30deg 60deg' over 'oblique 40deg 50deg']
|
[Matching font-style: 'oblique 0deg' should prefer 'oblique 30deg 60deg' over 'oblique 40deg 50deg']
|
||||||
expected: FAIL
|
expected: FAIL
|
||||||
|
|
||||||
|
|
|
||||||
|
|
@ -6,6 +6,3 @@
|
||||||
[Instant scrolling while doing history navigation.]
|
[Instant scrolling while doing history navigation.]
|
||||||
expected: FAIL
|
expected: FAIL
|
||||||
|
|
||||||
[Smooth scrolling while doing history navigation.]
|
|
||||||
expected: FAIL
|
|
||||||
|
|
||||||
|
|
|
||||||
|
|
@ -0,0 +1,7 @@
|
||||||
|
[HTMLMapElement.html]
|
||||||
|
[name on HTMLMapElement must enqueue an attributeChanged reaction when adding name content attribute]
|
||||||
|
expected: FAIL
|
||||||
|
|
||||||
|
[name on HTMLMapElement must enqueue an attributeChanged reaction when replacing an existing attribute]
|
||||||
|
expected: FAIL
|
||||||
|
|
||||||
|
|
@ -0,0 +1,25 @@
|
||||||
|
[HTMLModElement.html]
|
||||||
|
[dateTime on del use HTMLModElement must enqueue an attributeChanged reaction when replacing an existing attribute]
|
||||||
|
expected: FAIL
|
||||||
|
|
||||||
|
[cite on ins use HTMLModElement must enqueue an attributeChanged reaction when replacing an existing attribute]
|
||||||
|
expected: FAIL
|
||||||
|
|
||||||
|
[dateTime on ins use HTMLModElement must enqueue an attributeChanged reaction when replacing an existing attribute]
|
||||||
|
expected: FAIL
|
||||||
|
|
||||||
|
[cite on del use HTMLModElement must enqueue an attributeChanged reaction when adding cite content attribute]
|
||||||
|
expected: FAIL
|
||||||
|
|
||||||
|
[cite on ins use HTMLModElement must enqueue an attributeChanged reaction when adding cite content attribute]
|
||||||
|
expected: FAIL
|
||||||
|
|
||||||
|
[dateTime on del use HTMLModElement must enqueue an attributeChanged reaction when adding datetime content attribute]
|
||||||
|
expected: FAIL
|
||||||
|
|
||||||
|
[dateTime on ins use HTMLModElement must enqueue an attributeChanged reaction when adding datetime content attribute]
|
||||||
|
expected: FAIL
|
||||||
|
|
||||||
|
[cite on del use HTMLModElement must enqueue an attributeChanged reaction when replacing an existing attribute]
|
||||||
|
expected: FAIL
|
||||||
|
|
||||||
|
|
@ -0,0 +1,19 @@
|
||||||
|
[HTMLOListElement.html]
|
||||||
|
[type on HTMLOListElement must enqueue an attributeChanged reaction when replacing an existing attribute]
|
||||||
|
expected: FAIL
|
||||||
|
|
||||||
|
[start on HTMLOListElement must enqueue an attributeChanged reaction when adding start content attribute]
|
||||||
|
expected: FAIL
|
||||||
|
|
||||||
|
[type on HTMLOListElement must enqueue an attributeChanged reaction when adding type content attribute]
|
||||||
|
expected: FAIL
|
||||||
|
|
||||||
|
[reversed on HTMLOListElement must enqueue an attributeChanged reaction when replacing an existing attribute]
|
||||||
|
expected: FAIL
|
||||||
|
|
||||||
|
[reversed on HTMLOListElement must enqueue an attributeChanged reaction when adding reversed content attribute]
|
||||||
|
expected: FAIL
|
||||||
|
|
||||||
|
[start on HTMLOListElement must enqueue an attributeChanged reaction when replacing an existing attribute]
|
||||||
|
expected: FAIL
|
||||||
|
|
||||||
|
|
@ -0,0 +1,13 @@
|
||||||
|
[HTMLQuoteElement.html]
|
||||||
|
[cite on q use HTMLQuoteElement must enqueue an attributeChanged reaction when adding cite content attribute]
|
||||||
|
expected: FAIL
|
||||||
|
|
||||||
|
[cite on q use HTMLQuoteElement must enqueue an attributeChanged reaction when replacing an existing attribute]
|
||||||
|
expected: FAIL
|
||||||
|
|
||||||
|
[cite on blockquote use HTMLQuoteElement must enqueue an attributeChanged reaction when replacing an existing attribute]
|
||||||
|
expected: FAIL
|
||||||
|
|
||||||
|
[cite on blockquote use HTMLQuoteElement must enqueue an attributeChanged reaction when adding cite content attribute]
|
||||||
|
expected: FAIL
|
||||||
|
|
||||||
|
|
@ -0,0 +1,4 @@
|
||||||
|
[HTMLSlotElement.html]
|
||||||
|
[Custom Elements: CEReactions on HTMLSlotElement interface]
|
||||||
|
expected: FAIL
|
||||||
|
|
||||||
|
|
@ -312,6 +312,3 @@
|
||||||
[<iframe>: separate response Content-Type: text/plain */*;charset=gbk]
|
[<iframe>: separate response Content-Type: text/plain */*;charset=gbk]
|
||||||
expected: FAIL
|
expected: FAIL
|
||||||
|
|
||||||
[<iframe>: separate response Content-Type: text/html;" \\" text/plain]
|
|
||||||
expected: FAIL
|
|
||||||
|
|
||||||
|
|
|
||||||
|
|
@ -1,5 +0,0 @@
|
||||||
[javascript-url-abort-return-value-undefined.tentative.html]
|
|
||||||
expected: TIMEOUT
|
|
||||||
[Not aborting fetch for javascript:undefined navigation]
|
|
||||||
expected: TIMEOUT
|
|
||||||
|
|
||||||
|
|
@ -1,4 +0,0 @@
|
||||||
[traverse_the_history_5.html]
|
|
||||||
[Multiple history traversals, last would be aborted]
|
|
||||||
expected: FAIL
|
|
||||||
|
|
||||||
|
|
@ -1,10 +0,0 @@
|
||||||
[non-active-document.html]
|
|
||||||
[DOMParser]
|
|
||||||
expected: FAIL
|
|
||||||
|
|
||||||
[createHTMLDocument]
|
|
||||||
expected: FAIL
|
|
||||||
|
|
||||||
[<template>]
|
|
||||||
expected: FAIL
|
|
||||||
|
|
||||||
|
|
@ -18,3 +18,6 @@
|
||||||
[.selectedOptions should return the same object after selection changes - [SameObject\]]
|
[.selectedOptions should return the same object after selection changes - [SameObject\]]
|
||||||
expected: FAIL
|
expected: FAIL
|
||||||
|
|
||||||
|
[.selectedOptions should return `HTMLCollection` instance]
|
||||||
|
expected: FAIL
|
||||||
|
|
||||||
|
|
|
||||||
|
|
@ -12,3 +12,6 @@
|
||||||
[Verifies the resolution of entry.startTime is at least 5 microseconds.]
|
[Verifies the resolution of entry.startTime is at least 5 microseconds.]
|
||||||
expected: TIMEOUT
|
expected: TIMEOUT
|
||||||
|
|
||||||
|
[Verifies the resolution of performance.now() is at least 5 microseconds.]
|
||||||
|
expected: FAIL
|
||||||
|
|
||||||
|
|
|
||||||
|
|
@ -0,0 +1,4 @@
|
||||||
|
[SharedWorker-MessageEvent-source.any.sharedworker.html]
|
||||||
|
[SharedWorker-MessageEvent-source]
|
||||||
|
expected: FAIL
|
||||||
|
|
||||||
22
tests/wpt/metadata/workers/SharedWorker-constructor.html.ini
Normal file
22
tests/wpt/metadata/workers/SharedWorker-constructor.html.ini
Normal file
|
|
@ -0,0 +1,22 @@
|
||||||
|
[SharedWorker-constructor.html]
|
||||||
|
[Test toString exception propagated correctly.]
|
||||||
|
expected: FAIL
|
||||||
|
|
||||||
|
[Test SharedWorker creation without arguments results in exception.]
|
||||||
|
expected: FAIL
|
||||||
|
|
||||||
|
[Test SharedWorker constructor with null name does not result in an exception.]
|
||||||
|
expected: FAIL
|
||||||
|
|
||||||
|
[Test SharedWorker constructor with undefined name does not result in an exception.]
|
||||||
|
expected: FAIL
|
||||||
|
|
||||||
|
[Test SharedWorker constructor suceeds.]
|
||||||
|
expected: FAIL
|
||||||
|
|
||||||
|
[Test SharedWorker constructor without a name does not result in an exception.]
|
||||||
|
expected: FAIL
|
||||||
|
|
||||||
|
[Test recursive worker creation results in exception.]
|
||||||
|
expected: FAIL
|
||||||
|
|
||||||
|
|
@ -0,0 +1,4 @@
|
||||||
|
[SharedWorker-exception-propagation.html]
|
||||||
|
[Uncaught error in shared worker should not propagate to window]
|
||||||
|
expected: FAIL
|
||||||
|
|
||||||
|
|
@ -0,0 +1,4 @@
|
||||||
|
[SharedWorker-exception.html]
|
||||||
|
[This test checks whether exceptions in SharedWorkers are logged to the parent document. An exception should be logged to the error console.]
|
||||||
|
expected: FAIL
|
||||||
|
|
||||||
|
|
@ -0,0 +1,4 @@
|
||||||
|
[SharedWorker-replace-EventHandler.any.sharedworker.html]
|
||||||
|
[SharedWorker-replace-EventHandler]
|
||||||
|
expected: FAIL
|
||||||
|
|
||||||
|
|
@ -0,0 +1,7 @@
|
||||||
|
[SharedWorker-script-error.html]
|
||||||
|
[Test script error unhandled.]
|
||||||
|
expected: FAIL
|
||||||
|
|
||||||
|
[Test script error handled.]
|
||||||
|
expected: FAIL
|
||||||
|
|
||||||
4
tests/wpt/metadata/workers/SharedWorker-simple.html.ini
Normal file
4
tests/wpt/metadata/workers/SharedWorker-simple.html.ini
Normal file
|
|
@ -0,0 +1,4 @@
|
||||||
|
[SharedWorker-simple.html]
|
||||||
|
[Test simple shared worker construction case.]
|
||||||
|
expected: FAIL
|
||||||
|
|
||||||
11
tests/wpt/metadata/workers/Worker-base64.any.js.ini
Normal file
11
tests/wpt/metadata/workers/Worker-base64.any.js.ini
Normal file
|
|
@ -0,0 +1,11 @@
|
||||||
|
[Worker-base64.any.worker.html]
|
||||||
|
|
||||||
|
[Worker-base64.any.serviceworker.html]
|
||||||
|
[Worker-base64]
|
||||||
|
expected: FAIL
|
||||||
|
|
||||||
|
|
||||||
|
[Worker-base64.any.sharedworker.html]
|
||||||
|
[Worker-base64]
|
||||||
|
expected: FAIL
|
||||||
|
|
||||||
|
|
@ -0,0 +1,14 @@
|
||||||
|
[Worker-constructor-proto.any.sharedworker.html]
|
||||||
|
[Worker-constructor-proto]
|
||||||
|
expected: FAIL
|
||||||
|
|
||||||
|
|
||||||
|
[Worker-constructor-proto.any.worker.html]
|
||||||
|
[Tests that setting the proto of a built in constructor is not reset.]
|
||||||
|
expected: FAIL
|
||||||
|
|
||||||
|
|
||||||
|
[Worker-constructor-proto.any.serviceworker.html]
|
||||||
|
[Worker-constructor-proto]
|
||||||
|
expected: FAIL
|
||||||
|
|
||||||
9
tests/wpt/metadata/workers/Worker-location.any.js.ini
Normal file
9
tests/wpt/metadata/workers/Worker-location.any.js.ini
Normal file
|
|
@ -0,0 +1,9 @@
|
||||||
|
[Worker-location.any.sharedworker.html]
|
||||||
|
[Worker-location]
|
||||||
|
expected: FAIL
|
||||||
|
|
||||||
|
|
||||||
|
[Worker-location.any.worker.html]
|
||||||
|
[Test WorkerLocation properties.]
|
||||||
|
expected: FAIL
|
||||||
|
|
||||||
|
|
@ -0,0 +1,11 @@
|
||||||
|
[Worker-replace-global-constructor.any.serviceworker.html]
|
||||||
|
[Worker-replace-global-constructor]
|
||||||
|
expected: FAIL
|
||||||
|
|
||||||
|
|
||||||
|
[Worker-replace-global-constructor.any.sharedworker.html]
|
||||||
|
[Worker-replace-global-constructor]
|
||||||
|
expected: FAIL
|
||||||
|
|
||||||
|
|
||||||
|
[Worker-replace-global-constructor.any.worker.html]
|
||||||
11
tests/wpt/metadata/workers/Worker-replace-self.any.js.ini
Normal file
11
tests/wpt/metadata/workers/Worker-replace-self.any.js.ini
Normal file
|
|
@ -0,0 +1,11 @@
|
||||||
|
[Worker-replace-self.any.sharedworker.html]
|
||||||
|
[Worker-replace-self]
|
||||||
|
expected: FAIL
|
||||||
|
|
||||||
|
|
||||||
|
[Worker-replace-self.any.worker.html]
|
||||||
|
|
||||||
|
[Worker-replace-self.any.serviceworker.html]
|
||||||
|
[Worker-replace-self]
|
||||||
|
expected: FAIL
|
||||||
|
|
||||||
|
|
@ -0,0 +1,4 @@
|
||||||
|
[Worker-termination-with-port-messages.html]
|
||||||
|
[This test terminates a worker when there are many undelivered MessagePort messages still waiting to be dispatched into the Worker Context. This causes termination of JS execution and test should not try to dispatch the remaining messages. Test succeeds if it does not hang or crash (if worker thread is running in the separate process, that process could hang or crash).]
|
||||||
|
expected: FAIL
|
||||||
|
|
||||||
14
tests/wpt/metadata/workers/WorkerNavigator.any.js.ini
Normal file
14
tests/wpt/metadata/workers/WorkerNavigator.any.js.ini
Normal file
|
|
@ -0,0 +1,14 @@
|
||||||
|
[WorkerNavigator.any.worker.html]
|
||||||
|
[Testing Navigator properties on workers.]
|
||||||
|
expected: FAIL
|
||||||
|
|
||||||
|
|
||||||
|
[WorkerNavigator.any.sharedworker.html]
|
||||||
|
[WorkerNavigator]
|
||||||
|
expected: FAIL
|
||||||
|
|
||||||
|
|
||||||
|
[WorkerNavigator.any.serviceworker.html]
|
||||||
|
[WorkerNavigator]
|
||||||
|
expected: FAIL
|
||||||
|
|
||||||
|
|
@ -151,7 +151,6 @@ jobs:
|
||||||
displayName: 'Publish results'
|
displayName: 'Publish results'
|
||||||
inputs:
|
inputs:
|
||||||
artifactName: 'results'
|
artifactName: 'results'
|
||||||
condition: succeededOrFailed()
|
|
||||||
|
|
||||||
# The InvokeRESTAPI task can only run in a server job.
|
# The InvokeRESTAPI task can only run in a server job.
|
||||||
- job: all_post
|
- job: all_post
|
||||||
|
|
|
||||||
|
|
@ -3,12 +3,14 @@
|
||||||
<link rel="help" href="https://www.w3.org/TR/CSS22/visudet.html#containing-block-details">
|
<link rel="help" href="https://www.w3.org/TR/CSS22/visudet.html#containing-block-details">
|
||||||
<link rel="help" href="https://www.w3.org/TR/CSS22/visuren.html#anonymous-block-level">
|
<link rel="help" href="https://www.w3.org/TR/CSS22/visuren.html#anonymous-block-level">
|
||||||
<style>
|
<style>
|
||||||
|
body { margin: 0px;}
|
||||||
.rel { position:relative; }
|
.rel { position:relative; }
|
||||||
.inline-block { display:inline-block; width:100px; height:1px; }
|
.inline-block { display:inline-block; width:100px; height:1px; }
|
||||||
.inline-block.large { width:200px; }
|
.inline-block.large { width:200px; }
|
||||||
#target { position:absolute; width:100%; height:100px; background:green; }
|
#target { position:absolute; width:100%; height:100px; background:green; }
|
||||||
|
#target-fixed { position:fixed; width:100%; height:100px; background:yellow; }
|
||||||
</style>
|
</style>
|
||||||
<p>There should be a green square below.</p>
|
<p>There should be a green square, and a yellow rectangle below.</p>
|
||||||
<div style="height:200px;">
|
<div style="height:200px;">
|
||||||
<span class="rel" id="notContainingBlockOfTarget">
|
<span class="rel" id="notContainingBlockOfTarget">
|
||||||
<div class="large inline-block"></div>
|
<div class="large inline-block"></div>
|
||||||
|
|
@ -17,6 +19,7 @@
|
||||||
<div class="inline-block"></div>
|
<div class="inline-block"></div>
|
||||||
<span>
|
<span>
|
||||||
<div>
|
<div>
|
||||||
|
<div id="target-fixed"></div>
|
||||||
<div id="target"></div>
|
<div id="target"></div>
|
||||||
</div>
|
</div>
|
||||||
</span>
|
</span>
|
||||||
|
|
@ -28,6 +31,11 @@
|
||||||
<script src="/resources/testharnessreport.js"></script>
|
<script src="/resources/testharnessreport.js"></script>
|
||||||
<script>
|
<script>
|
||||||
test(()=> {
|
test(()=> {
|
||||||
assert_equals(document.getElementById("target").offsetWidth, 100);
|
assert_equals(document.getElementById("target").offsetWidth,
|
||||||
}, "Make sure that we're sized by the right ancestor");
|
document.querySelector("#containingBlockOfTarget").offsetWidth);
|
||||||
|
}, "position:absolute should be sized by the right ancestor");
|
||||||
|
test(()=> {
|
||||||
|
assert_equals(document.getElementById("target-fixed").offsetWidth,
|
||||||
|
document.body.offsetWidth);
|
||||||
|
}, "position:fixed should be sized by the right ancestor");
|
||||||
</script>
|
</script>
|
||||||
|
|
|
||||||
|
|
@ -14,10 +14,15 @@ idl_test(
|
||||||
idl_array => {
|
idl_array => {
|
||||||
idl_array.add_objects({
|
idl_array.add_objects({
|
||||||
Document: ['document'],
|
Document: ['document'],
|
||||||
FontFace: ['new FontFace("family", "src")'],
|
FontFace: ['fontFace'],
|
||||||
FontFaceSetLoadEvent: ['new FontFaceSetLoadEvent("type")'],
|
FontFaceSetLoadEvent: ['fontFaceSetLoadEvent'],
|
||||||
FontFaceSet: ['document.fonts'],
|
FontFaceSet: ['document.fonts'],
|
||||||
});
|
});
|
||||||
|
self.fontFace = new FontFace("family", "src");
|
||||||
|
// The `fontFace.loaded` promise will be rejected, so handle that to
|
||||||
|
// avoid an unhandled promise rejection manifesting as a harness error.
|
||||||
|
self.fontFace.loaded.catch(() => {});
|
||||||
|
self.fontFaceSetLoadEvent = new FontFaceSetLoadEvent("type");
|
||||||
}
|
}
|
||||||
);
|
);
|
||||||
</script>
|
</script>
|
||||||
|
|
|
||||||
|
|
@ -0,0 +1,71 @@
|
||||||
|
<!DOCTYPE html>
|
||||||
|
<html><head>
|
||||||
|
<meta charset="utf-8">
|
||||||
|
<title>CSS Grid Layout Reference: Grid aligned descendants with static position</title>
|
||||||
|
<link rel="author" title="Mats Palmgren" href="mailto:mats@mozilla.com">
|
||||||
|
<style>
|
||||||
|
.grid {
|
||||||
|
position: relative;
|
||||||
|
display: grid;
|
||||||
|
grid: 40px / 40px;
|
||||||
|
border: 2px solid;
|
||||||
|
border-top-width: 5px;
|
||||||
|
border-left-width: 3px;
|
||||||
|
width: 20px;
|
||||||
|
padding: 2px 4px 6px 1px;
|
||||||
|
}
|
||||||
|
.absolute {
|
||||||
|
position: absolute;
|
||||||
|
grid-column: 1 / 2;
|
||||||
|
}
|
||||||
|
.content {
|
||||||
|
float: left;
|
||||||
|
width: 20px;
|
||||||
|
height: 40px;
|
||||||
|
background: green;
|
||||||
|
}
|
||||||
|
.content:nth-child(2) {
|
||||||
|
background: grey;
|
||||||
|
}
|
||||||
|
|
||||||
|
</style></head>
|
||||||
|
<body>
|
||||||
|
There should be no red:
|
||||||
|
|
||||||
|
<div class="grid">
|
||||||
|
<div class="absolute" style="margin-top:2px">
|
||||||
|
<div class="content"></div>
|
||||||
|
<div class="content"></div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div class="grid" style="grid-template-columns: 43px">
|
||||||
|
<div class="absolute" style="margin-top:2px; margin-left:3px">
|
||||||
|
<div class="content"></div>
|
||||||
|
<div class="content"></div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div class="grid" style="grid-template-columns: 43px">
|
||||||
|
<div class="absolute" style="margin-top:2px; border-left:2px solid black; padding-left:1px">
|
||||||
|
<div class="content"></div>
|
||||||
|
<div class="content"></div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div class="grid" style="padding-bottom: 14px">
|
||||||
|
<div class="absolute" style="margin-top:10px">
|
||||||
|
<div class="content"></div>
|
||||||
|
<div class="content"></div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div class="grid" style="grid-template-columns: 43px; padding-left:8px">
|
||||||
|
<div class="absolute" style="margin-top:2px; margin-left:3px">
|
||||||
|
<div class="content"></div>
|
||||||
|
<div class="content"></div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
</body>
|
||||||
|
</html>
|
||||||
|
|
@ -0,0 +1,90 @@
|
||||||
|
<!DOCTYPE html>
|
||||||
|
<html><head>
|
||||||
|
<meta charset="utf-8">
|
||||||
|
<title>CSS Grid Layout Test: Grid aligned descendants with static position</title>
|
||||||
|
<link rel="author" title="Mats Palmgren" href="mailto:mats@mozilla.com">
|
||||||
|
<link rel="help" href="https://drafts.csswg.org/css-grid-1/#abspos" title="Absolute Positioning">
|
||||||
|
<link rel="help" href="https://drafts.csswg.org/css-align-3/#staticpos-rect" title="Appendix A: Static Position Terminology">
|
||||||
|
<link rel="match" href="descendant-static-position-001-ref.html">
|
||||||
|
<meta name="assert" content="This test checks that the position and size of the abs.pos. descendant is correct.">
|
||||||
|
<style>
|
||||||
|
.grid {
|
||||||
|
position: relative;
|
||||||
|
display: grid;
|
||||||
|
grid: 40px / 40px;
|
||||||
|
border: 2px solid;
|
||||||
|
border-top-width: 5px;
|
||||||
|
border-left-width: 3px;
|
||||||
|
width: 20px;
|
||||||
|
padding: 2px 4px 6px 1px;
|
||||||
|
}
|
||||||
|
.grid > div {
|
||||||
|
background: red;
|
||||||
|
background-clip: content-box;
|
||||||
|
}
|
||||||
|
.absolute {
|
||||||
|
position: absolute;
|
||||||
|
background: red;
|
||||||
|
grid-column: 1 / 2;
|
||||||
|
}
|
||||||
|
.content {
|
||||||
|
float: left;
|
||||||
|
width: 20px;
|
||||||
|
height: 40px;
|
||||||
|
background: green;
|
||||||
|
}
|
||||||
|
.content:nth-child(2) {
|
||||||
|
background: grey;
|
||||||
|
}
|
||||||
|
|
||||||
|
</style></head>
|
||||||
|
<body>
|
||||||
|
There should be no red:
|
||||||
|
|
||||||
|
<div class="grid">
|
||||||
|
<div>
|
||||||
|
<div class="absolute">
|
||||||
|
<div class="content"></div>
|
||||||
|
<div class="content"></div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div class="grid" style="grid-template-columns: 43px">
|
||||||
|
<div style="padding-left:3px">
|
||||||
|
<div class="absolute">
|
||||||
|
<div class="content"></div>
|
||||||
|
<div class="content"></div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div class="grid" style="grid-template-columns: 43px">
|
||||||
|
<div style="border-left:2px solid black; padding-left:1px">
|
||||||
|
<div class="absolute">
|
||||||
|
<div class="content"></div>
|
||||||
|
<div class="content"></div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div class="grid" style="padding-top:10px">
|
||||||
|
<div>
|
||||||
|
<div class="absolute">
|
||||||
|
<div class="content"></div>
|
||||||
|
<div class="content"></div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div class="grid" style="grid-template-columns: 10px 33px; padding-left:8px">
|
||||||
|
<div style="padding-left:3px">
|
||||||
|
<div class="absolute" style="grid-column: 2 / 3">
|
||||||
|
<div class="content"></div>
|
||||||
|
<div class="content"></div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
</body>
|
||||||
|
</html>
|
||||||
|
|
@ -0,0 +1,80 @@
|
||||||
|
<!DOCTYPE html>
|
||||||
|
<html><head>
|
||||||
|
<meta charset="utf-8">
|
||||||
|
<title>CSS Grid Layout Reference: Grid aligned descendants with static position (direction: rtl)</title>
|
||||||
|
<link rel="author" title="Mats Palmgren" href="mailto:mats@mozilla.com">
|
||||||
|
<style>
|
||||||
|
.grid {
|
||||||
|
position: relative;
|
||||||
|
display: grid;
|
||||||
|
grid: 40px / 40px;
|
||||||
|
border: 2px solid;
|
||||||
|
border-top-width: 5px;
|
||||||
|
border-left-width: 3px;
|
||||||
|
width: 20px;
|
||||||
|
padding: 2px 4px 6px 1px;
|
||||||
|
direction: rtl;
|
||||||
|
margin-left: 40px;
|
||||||
|
}
|
||||||
|
.absolute {
|
||||||
|
position: absolute;
|
||||||
|
grid-column: 1 / 2;
|
||||||
|
}
|
||||||
|
.content {
|
||||||
|
float: right;
|
||||||
|
width: 20px;
|
||||||
|
height: 40px;
|
||||||
|
background: green;
|
||||||
|
}
|
||||||
|
.content:nth-child(2) {
|
||||||
|
background: grey;
|
||||||
|
}
|
||||||
|
|
||||||
|
</style></head>
|
||||||
|
<body>
|
||||||
|
There should be no red:
|
||||||
|
|
||||||
|
<div class="grid">
|
||||||
|
<div class="absolute" style="margin-top:2px">
|
||||||
|
<div class="content"></div>
|
||||||
|
<div class="content"></div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div class="grid" style="grid-template-columns: 43px">
|
||||||
|
<div class="absolute" style="margin-top:2px; margin-left:3px">
|
||||||
|
<div class="content"></div>
|
||||||
|
<div class="content"></div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div class="grid" style="grid-template-columns: 43px">
|
||||||
|
<div class="absolute" style="margin-top:2px; border-left:2px solid black; padding-left:1px">
|
||||||
|
<div class="content"></div>
|
||||||
|
<div class="content"></div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div class="grid" style="padding-bottom: 14px">
|
||||||
|
<div class="absolute" style="margin-top:10px">
|
||||||
|
<div class="content"></div>
|
||||||
|
<div class="content"></div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div class="grid" style="grid-template-columns: 43px; padding-right:8px">
|
||||||
|
<div class="absolute" style="margin-top:2px; margin-left:3px">
|
||||||
|
<div class="content"></div>
|
||||||
|
<div class="content"></div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div class="grid" style="grid-template-columns: 43px; padding-right:8px; padding-left:10px">
|
||||||
|
<div class="absolute" style="margin-top:2px;">
|
||||||
|
<div class="content"></div>
|
||||||
|
<div class="content"></div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
</body>
|
||||||
|
</html>
|
||||||
|
|
@ -0,0 +1,101 @@
|
||||||
|
<!DOCTYPE html>
|
||||||
|
<html><head>
|
||||||
|
<meta charset="utf-8">
|
||||||
|
<title>CSS Grid Layout Test: Grid aligned descendants with static position (direction: rtl)</title>
|
||||||
|
<link rel="author" title="Mats Palmgren" href="mailto:mats@mozilla.com">
|
||||||
|
<link rel="help" href="https://drafts.csswg.org/css-grid-1/#abspos" title="Absolute Positioning">
|
||||||
|
<link rel="help" href="https://drafts.csswg.org/css-align-3/#staticpos-rect" title="Appendix A: Static Position Terminology">
|
||||||
|
<link rel="match" href="descendant-static-position-002-ref.html">
|
||||||
|
<meta name="assert" content="This test checks that the position and size of the abs.pos. descendant is correct.">
|
||||||
|
<style>
|
||||||
|
.grid {
|
||||||
|
position: relative;
|
||||||
|
display: grid;
|
||||||
|
grid: 40px / 40px;
|
||||||
|
border: 2px solid;
|
||||||
|
border-top-width: 5px;
|
||||||
|
border-left-width: 3px;
|
||||||
|
width: 20px;
|
||||||
|
padding: 2px 4px 6px 1px;
|
||||||
|
direction: rtl;
|
||||||
|
margin-left: 40px;
|
||||||
|
}
|
||||||
|
.grid > div {
|
||||||
|
background: red;
|
||||||
|
background-clip: content-box;
|
||||||
|
}
|
||||||
|
.absolute {
|
||||||
|
position: absolute;
|
||||||
|
background: red;
|
||||||
|
grid-column: 1 / 2;
|
||||||
|
}
|
||||||
|
.content {
|
||||||
|
float: right;
|
||||||
|
width: 20px;
|
||||||
|
height: 40px;
|
||||||
|
background: green;
|
||||||
|
}
|
||||||
|
.content:nth-child(2) {
|
||||||
|
background: grey;
|
||||||
|
}
|
||||||
|
|
||||||
|
</style></head>
|
||||||
|
<body>
|
||||||
|
There should be no red:
|
||||||
|
|
||||||
|
<div class="grid">
|
||||||
|
<div>
|
||||||
|
<div class="absolute">
|
||||||
|
<div class="content"></div>
|
||||||
|
<div class="content"></div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div class="grid" style="grid-template-columns: 43px">
|
||||||
|
<div style="padding-left:3px">
|
||||||
|
<div class="absolute">
|
||||||
|
<div class="content"></div>
|
||||||
|
<div class="content"></div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div class="grid" style="grid-template-columns: 43px">
|
||||||
|
<div style="border-left:2px solid black; padding-left:1px">
|
||||||
|
<div class="absolute">
|
||||||
|
<div class="content"></div>
|
||||||
|
<div class="content"></div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div class="grid" style="padding-top:10px">
|
||||||
|
<div>
|
||||||
|
<div class="absolute">
|
||||||
|
<div class="content"></div>
|
||||||
|
<div class="content"></div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div class="grid" style="grid-template-columns: 10px 33px; padding-right:8px">
|
||||||
|
<div style="padding-left:3px">
|
||||||
|
<div class="absolute" style="grid-column: 2 / 3">
|
||||||
|
<div class="content"></div>
|
||||||
|
<div class="content"></div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div class="grid" style="grid-template-columns: 10px 33px; padding-right:8px; padding-left:10px">
|
||||||
|
<div style="padding-left:3px">
|
||||||
|
<div class="absolute" style="grid-column: 2 / 3">
|
||||||
|
<div class="content"></div>
|
||||||
|
<div class="content"></div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
</body>
|
||||||
|
</html>
|
||||||
|
|
@ -0,0 +1,72 @@
|
||||||
|
<!DOCTYPE html>
|
||||||
|
<html><head>
|
||||||
|
<meta charset="utf-8">
|
||||||
|
<title>CSS Grid Layout Reference: Grid aligned descendants with static position</title>
|
||||||
|
<link rel="author" title="Mats Palmgren" href="mailto:mats@mozilla.com">
|
||||||
|
<style>
|
||||||
|
.grid {
|
||||||
|
position: relative;
|
||||||
|
display: grid;
|
||||||
|
grid: 40px / 40px;
|
||||||
|
border: 2px solid;
|
||||||
|
border-top-width: 5px;
|
||||||
|
border-left-width: 3px;
|
||||||
|
width: 100px;
|
||||||
|
justify-content: end;
|
||||||
|
padding: 2px 4px 6px 1px;
|
||||||
|
}
|
||||||
|
.absolute {
|
||||||
|
position: absolute;
|
||||||
|
grid-column: 1 / 2;
|
||||||
|
}
|
||||||
|
.content {
|
||||||
|
float: left;
|
||||||
|
width: 20px;
|
||||||
|
height: 40px;
|
||||||
|
background: green;
|
||||||
|
}
|
||||||
|
.content:nth-child(2) {
|
||||||
|
background: grey;
|
||||||
|
}
|
||||||
|
|
||||||
|
</style></head>
|
||||||
|
<body>
|
||||||
|
There should be no red:
|
||||||
|
|
||||||
|
<div class="grid">
|
||||||
|
<div class="absolute" style="margin-top:2px">
|
||||||
|
<div class="content"></div>
|
||||||
|
<div class="content"></div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div class="grid" style="grid-template-columns: 43px">
|
||||||
|
<div class="absolute" style="margin-top:2px; margin-left:3px">
|
||||||
|
<div class="content"></div>
|
||||||
|
<div class="content"></div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div class="grid" style="grid-template-columns: 43px">
|
||||||
|
<div class="absolute" style="margin-top:2px; border-left:2px solid black; padding-left:1px">
|
||||||
|
<div class="content"></div>
|
||||||
|
<div class="content"></div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div class="grid" style="padding-bottom: 14px">
|
||||||
|
<div class="absolute" style="margin-top:10px">
|
||||||
|
<div class="content"></div>
|
||||||
|
<div class="content"></div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div class="grid" style="grid-template-columns: 43px; padding-left:8px">
|
||||||
|
<div class="absolute" style="margin-top:2px; margin-left:3px">
|
||||||
|
<div class="content"></div>
|
||||||
|
<div class="content"></div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
</body>
|
||||||
|
</html>
|
||||||
|
|
@ -0,0 +1,91 @@
|
||||||
|
<!DOCTYPE html>
|
||||||
|
<html><head>
|
||||||
|
<meta charset="utf-8">
|
||||||
|
<title>CSS Grid Layout Test: Grid aligned descendants with static position</title>
|
||||||
|
<link rel="author" title="Mats Palmgren" href="mailto:mats@mozilla.com">
|
||||||
|
<link rel="help" href="https://drafts.csswg.org/css-grid-1/#abspos" title="Absolute Positioning">
|
||||||
|
<link rel="help" href="https://drafts.csswg.org/css-align-3/#staticpos-rect" title="Appendix A: Static Position Terminology">
|
||||||
|
<link rel="match" href="descendant-static-position-003-ref.html">
|
||||||
|
<meta name="assert" content="This test checks that the position and size of the abs.pos. descendant is correct.">
|
||||||
|
<style>
|
||||||
|
.grid {
|
||||||
|
position: relative;
|
||||||
|
display: grid;
|
||||||
|
grid: 40px / 40px;
|
||||||
|
border: 2px solid;
|
||||||
|
border-top-width: 5px;
|
||||||
|
border-left-width: 3px;
|
||||||
|
width: 100px;
|
||||||
|
justify-content: end;
|
||||||
|
padding: 2px 4px 6px 1px;
|
||||||
|
}
|
||||||
|
.grid > div {
|
||||||
|
background: red;
|
||||||
|
background-clip: content-box;
|
||||||
|
}
|
||||||
|
.absolute {
|
||||||
|
position: absolute;
|
||||||
|
background: red;
|
||||||
|
grid-column: 1 / 2;
|
||||||
|
}
|
||||||
|
.content {
|
||||||
|
float: left;
|
||||||
|
width: 20px;
|
||||||
|
height: 40px;
|
||||||
|
background: green;
|
||||||
|
}
|
||||||
|
.content:nth-child(2) {
|
||||||
|
background: grey;
|
||||||
|
}
|
||||||
|
|
||||||
|
</style></head>
|
||||||
|
<body>
|
||||||
|
There should be no red:
|
||||||
|
|
||||||
|
<div class="grid">
|
||||||
|
<div>
|
||||||
|
<div class="absolute">
|
||||||
|
<div class="content"></div>
|
||||||
|
<div class="content"></div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div class="grid" style="grid-template-columns: 43px">
|
||||||
|
<div style="padding-left:3px">
|
||||||
|
<div class="absolute">
|
||||||
|
<div class="content"></div>
|
||||||
|
<div class="content"></div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div class="grid" style="grid-template-columns: 43px">
|
||||||
|
<div style="border-left:2px solid black; padding-left:1px">
|
||||||
|
<div class="absolute">
|
||||||
|
<div class="content"></div>
|
||||||
|
<div class="content"></div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div class="grid" style="padding-top:10px">
|
||||||
|
<div>
|
||||||
|
<div class="absolute">
|
||||||
|
<div class="content"></div>
|
||||||
|
<div class="content"></div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div class="grid" style="grid-template-columns: 10px 33px; padding-left:8px">
|
||||||
|
<div style="padding-left:3px">
|
||||||
|
<div class="absolute" style="grid-column: 2 / 3">
|
||||||
|
<div class="content"></div>
|
||||||
|
<div class="content"></div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
</body>
|
||||||
|
</html>
|
||||||
|
|
@ -0,0 +1,81 @@
|
||||||
|
<!DOCTYPE html>
|
||||||
|
<html><head>
|
||||||
|
<meta charset="utf-8">
|
||||||
|
<title>CSS Grid Layout Reference: Grid aligned descendants with static position (direction: rtl)</title>
|
||||||
|
<link rel="author" title="Mats Palmgren" href="mailto:mats@mozilla.com">
|
||||||
|
<style>
|
||||||
|
.grid {
|
||||||
|
position: relative;
|
||||||
|
display: grid;
|
||||||
|
grid: 40px / 40px;
|
||||||
|
border: 2px solid;
|
||||||
|
border-top-width: 5px;
|
||||||
|
border-left-width: 3px;
|
||||||
|
width: 100px;
|
||||||
|
justify-content: center;
|
||||||
|
padding: 2px 4px 6px 1px;
|
||||||
|
direction: rtl;
|
||||||
|
margin-left: 40px;
|
||||||
|
}
|
||||||
|
.absolute {
|
||||||
|
position: absolute;
|
||||||
|
grid-column: 1 / 2;
|
||||||
|
}
|
||||||
|
.content {
|
||||||
|
float: right;
|
||||||
|
width: 20px;
|
||||||
|
height: 40px;
|
||||||
|
background: green;
|
||||||
|
}
|
||||||
|
.content:nth-child(2) {
|
||||||
|
background: grey;
|
||||||
|
}
|
||||||
|
|
||||||
|
</style></head>
|
||||||
|
<body>
|
||||||
|
There should be no red:
|
||||||
|
|
||||||
|
<div class="grid">
|
||||||
|
<div class="absolute" style="margin-top:2px">
|
||||||
|
<div class="content"></div>
|
||||||
|
<div class="content"></div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div class="grid" style="grid-template-columns: 43px">
|
||||||
|
<div class="absolute" style="margin-top:2px; margin-left:3px">
|
||||||
|
<div class="content"></div>
|
||||||
|
<div class="content"></div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div class="grid" style="grid-template-columns: 43px">
|
||||||
|
<div class="absolute" style="margin-top:2px; border-left:2px solid black; padding-left:1px">
|
||||||
|
<div class="content"></div>
|
||||||
|
<div class="content"></div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div class="grid" style="padding-bottom: 14px">
|
||||||
|
<div class="absolute" style="margin-top:10px">
|
||||||
|
<div class="content"></div>
|
||||||
|
<div class="content"></div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div class="grid" style="grid-template-columns: 43px; padding-right:8px">
|
||||||
|
<div class="absolute" style="margin-top:2px; margin-left:3px">
|
||||||
|
<div class="content"></div>
|
||||||
|
<div class="content"></div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div class="grid" style="grid-template-columns: 43px; padding-right:8px; padding-left:10px">
|
||||||
|
<div class="absolute" style="margin-top:2px;">
|
||||||
|
<div class="content"></div>
|
||||||
|
<div class="content"></div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
</body>
|
||||||
|
</html>
|
||||||
|
|
@ -0,0 +1,102 @@
|
||||||
|
<!DOCTYPE html>
|
||||||
|
<html><head>
|
||||||
|
<meta charset="utf-8">
|
||||||
|
<title>CSS Grid Layout Test: Grid aligned descendants with static position (direction: rtl)</title>
|
||||||
|
<link rel="author" title="Mats Palmgren" href="mailto:mats@mozilla.com">
|
||||||
|
<link rel="help" href="https://drafts.csswg.org/css-grid-1/#abspos" title="Absolute Positioning">
|
||||||
|
<link rel="help" href="https://drafts.csswg.org/css-align-3/#staticpos-rect" title="Appendix A: Static Position Terminology">
|
||||||
|
<link rel="match" href="descendant-static-position-004-ref.html">
|
||||||
|
<meta name="assert" content="This test checks that the position and size of the abs.pos. descendant is correct.">
|
||||||
|
<style>
|
||||||
|
.grid {
|
||||||
|
position: relative;
|
||||||
|
display: grid;
|
||||||
|
grid: 40px / 40px;
|
||||||
|
border: 2px solid;
|
||||||
|
border-top-width: 5px;
|
||||||
|
border-left-width: 3px;
|
||||||
|
width: 100px;
|
||||||
|
justify-content: center;
|
||||||
|
padding: 2px 4px 6px 1px;
|
||||||
|
direction: rtl;
|
||||||
|
margin-left: 40px;
|
||||||
|
}
|
||||||
|
.grid > div {
|
||||||
|
background: red;
|
||||||
|
background-clip: content-box;
|
||||||
|
}
|
||||||
|
.absolute {
|
||||||
|
position: absolute;
|
||||||
|
background: red;
|
||||||
|
grid-column: 1 / 2;
|
||||||
|
}
|
||||||
|
.content {
|
||||||
|
float: right;
|
||||||
|
width: 20px;
|
||||||
|
height: 40px;
|
||||||
|
background: green;
|
||||||
|
}
|
||||||
|
.content:nth-child(2) {
|
||||||
|
background: grey;
|
||||||
|
}
|
||||||
|
|
||||||
|
</style></head>
|
||||||
|
<body>
|
||||||
|
There should be no red:
|
||||||
|
|
||||||
|
<div class="grid">
|
||||||
|
<div>
|
||||||
|
<div class="absolute">
|
||||||
|
<div class="content"></div>
|
||||||
|
<div class="content"></div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div class="grid" style="grid-template-columns: 43px">
|
||||||
|
<div style="padding-left:3px">
|
||||||
|
<div class="absolute">
|
||||||
|
<div class="content"></div>
|
||||||
|
<div class="content"></div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div class="grid" style="grid-template-columns: 43px">
|
||||||
|
<div style="border-left:2px solid black; padding-left:1px">
|
||||||
|
<div class="absolute">
|
||||||
|
<div class="content"></div>
|
||||||
|
<div class="content"></div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div class="grid" style="padding-top:10px">
|
||||||
|
<div>
|
||||||
|
<div class="absolute">
|
||||||
|
<div class="content"></div>
|
||||||
|
<div class="content"></div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div class="grid" style="grid-template-columns: 10px 33px; padding-right:8px">
|
||||||
|
<div style="padding-left:3px">
|
||||||
|
<div class="absolute" style="grid-column: 2 / 3">
|
||||||
|
<div class="content"></div>
|
||||||
|
<div class="content"></div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div class="grid" style="grid-template-columns: 10px 33px; padding-right:8px; padding-left:10px">
|
||||||
|
<div style="padding-left:3px">
|
||||||
|
<div class="absolute" style="grid-column: 2 / 3">
|
||||||
|
<div class="content"></div>
|
||||||
|
<div class="content"></div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
</body>
|
||||||
|
</html>
|
||||||
|
|
@ -0,0 +1,28 @@
|
||||||
|
<!DOCTYPE html>
|
||||||
|
<style>
|
||||||
|
div {
|
||||||
|
font-size: 0; /* so I can leave spaces between the child divs */
|
||||||
|
height: 20px;
|
||||||
|
}
|
||||||
|
div > div {
|
||||||
|
display: inline-block;
|
||||||
|
}
|
||||||
|
div > div:first-child {
|
||||||
|
background: blue;
|
||||||
|
}
|
||||||
|
div > div:nth-child(2) {
|
||||||
|
background: lime;
|
||||||
|
}
|
||||||
|
</style>
|
||||||
|
|
||||||
|
<div>
|
||||||
|
<div style="width:3.6px;"></div>
|
||||||
|
<div style="width:3.6px;"></div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<br><br>
|
||||||
|
|
||||||
|
<div>
|
||||||
|
<div style="width:3.3px;"></div>
|
||||||
|
<div style="width:3.3px;"></div>
|
||||||
|
</div>
|
||||||
|
|
@ -0,0 +1,35 @@
|
||||||
|
<!DOCTYPE html>
|
||||||
|
<link rel="author" title="David Grogan" href="dgrogan@chromium.org">
|
||||||
|
<link rel="help" href="https://www.w3.org/TR/CSS21/cascade.html#value-stages">
|
||||||
|
<link rel="match" href="subpixel-table-cell-width-001-ref.html">
|
||||||
|
<meta name="flags" content="" />
|
||||||
|
<meta name="assert" content="When a cell has a specified fractional fixed width and a block has the same specified fractional width, their actual widths should match." />
|
||||||
|
|
||||||
|
<style>
|
||||||
|
.table {
|
||||||
|
display: table;
|
||||||
|
height: 20px;
|
||||||
|
background: red;
|
||||||
|
}
|
||||||
|
.cell {
|
||||||
|
display: table-cell;
|
||||||
|
}
|
||||||
|
div > div:first-child {
|
||||||
|
background: blue;
|
||||||
|
}
|
||||||
|
div > div:nth-child(2) {
|
||||||
|
background: lime;
|
||||||
|
}
|
||||||
|
</style>
|
||||||
|
|
||||||
|
<div class=table>
|
||||||
|
<div class=cell style="width:3.6px;"></div>
|
||||||
|
<div class=cell style="width:3.6px;"></div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<br><br>
|
||||||
|
|
||||||
|
<div class=table>
|
||||||
|
<div class=cell style="width:3.3px;"></div>
|
||||||
|
<div class=cell style="width:3.3px;"></div>
|
||||||
|
</div>
|
||||||
|
|
@ -0,0 +1,36 @@
|
||||||
|
<!DOCTYPE html>
|
||||||
|
<link rel="author" title="David Grogan" href="dgrogan@chromium.org">
|
||||||
|
<link rel="help" href="https://www.w3.org/TR/CSS21/cascade.html#value-stages">
|
||||||
|
<link rel="match" href="subpixel-table-cell-width-001-ref.html">
|
||||||
|
<meta name="flags" content="" />
|
||||||
|
<meta name="assert" content="When a cell has a specified percent width that results in a fractional used width, the cell's actual width should match that of a block whose specified fixed width is the cell's used width" />
|
||||||
|
|
||||||
|
<style>
|
||||||
|
.table {
|
||||||
|
display: table;
|
||||||
|
height: 20px;
|
||||||
|
background: red;
|
||||||
|
}
|
||||||
|
.cell {
|
||||||
|
display: table-cell;
|
||||||
|
}
|
||||||
|
div > div:first-child {
|
||||||
|
background: blue;
|
||||||
|
}
|
||||||
|
div > div:nth-child(2) {
|
||||||
|
background: lime;
|
||||||
|
}
|
||||||
|
</style>
|
||||||
|
|
||||||
|
|
||||||
|
<div class=table style="width:7.2px;">
|
||||||
|
<div class=cell style="width:50%;"></div>
|
||||||
|
<div class=cell style="width:50%;"></div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<br><br>
|
||||||
|
|
||||||
|
<div class=table style="width:6.6px;">
|
||||||
|
<div class=cell style="width:50%;"></div>
|
||||||
|
<div class=cell style="width:50%;"></div>
|
||||||
|
</div>
|
||||||
|
|
@ -0,0 +1,18 @@
|
||||||
|
<!DOCTYPE html>
|
||||||
|
<style>
|
||||||
|
.parent div {
|
||||||
|
background: #aaa;
|
||||||
|
width: 100%;
|
||||||
|
height: 100px;
|
||||||
|
}
|
||||||
|
</style>
|
||||||
|
|
||||||
|
There should be two grey ~squares with no red showing.
|
||||||
|
|
||||||
|
<div class="parent" style="width:100.2px">
|
||||||
|
<div></div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div class="parent" style="width:100.8px">
|
||||||
|
<div></div>
|
||||||
|
</div>
|
||||||
|
|
@ -0,0 +1,28 @@
|
||||||
|
<!DOCTYPE html>
|
||||||
|
<link rel="author" title="David Grogan" href="mailto:dgrogan@chromium.org">
|
||||||
|
<link rel="help" href="https://www.w3.org/TR/CSS22/syndata.html#value-def-percentage">
|
||||||
|
<link rel="match" href="subpixel-table-width-001-ref.html">
|
||||||
|
<meta name="flags" content="" />
|
||||||
|
<meta name="assert" content="A table with width:100% has same actual width as its parent's actual width." />
|
||||||
|
|
||||||
|
<style>
|
||||||
|
.parent {
|
||||||
|
background: red;
|
||||||
|
}
|
||||||
|
|
||||||
|
.parent table {
|
||||||
|
background: #aaa;
|
||||||
|
width: 100%;
|
||||||
|
height: 100px;
|
||||||
|
}
|
||||||
|
</style>
|
||||||
|
|
||||||
|
There should be two grey ~squares with no red showing.
|
||||||
|
|
||||||
|
<div class="parent" style="width:100.2px">
|
||||||
|
<table></table>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div class="parent" style="width:100.8px">
|
||||||
|
<table></table>
|
||||||
|
</div>
|
||||||
|
|
@ -5,7 +5,7 @@
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
<div style="opacity: 0.9999;">
|
<div>
|
||||||
<div class="circle outside"></div>
|
<div class="circle outside"></div>
|
||||||
<div class="circle inside"></div>
|
<div class="circle inside"></div>
|
||||||
</div>
|
</div>
|
||||||
|
|
@ -24,16 +24,13 @@ div {
|
||||||
top: 30px;
|
top: 30px;
|
||||||
left: 30px;
|
left: 30px;
|
||||||
border-radius: 50px;
|
border-radius: 50px;
|
||||||
background: yellow;
|
background: #ffff0060;
|
||||||
will-change: transform;
|
|
||||||
}
|
}
|
||||||
.inside {
|
.inside {
|
||||||
background: #ffd94d;
|
background: #ffaf9f;
|
||||||
clip-path: inset(0px 30px 30px 0px);
|
clip-path: inset(0px 30px 30px 0px);
|
||||||
will-change: transform;
|
|
||||||
}
|
}
|
||||||
.outside {
|
.outside {
|
||||||
background: #ffff4d;
|
background: #ffff9f;
|
||||||
will-change: transform;
|
|
||||||
}
|
}
|
||||||
</style>
|
</style>
|
||||||
|
|
|
||||||
|
|
@ -24,11 +24,9 @@ div {
|
||||||
top: 30px;
|
top: 30px;
|
||||||
left: 30px;
|
left: 30px;
|
||||||
border-radius: 50px;
|
border-radius: 50px;
|
||||||
background: yellow;
|
background: #ffff0060;
|
||||||
will-change: transform;
|
|
||||||
}
|
}
|
||||||
.filter {
|
.filter {
|
||||||
opacity: 0.7;
|
|
||||||
backdrop-filter: invert(1);
|
backdrop-filter: invert(1);
|
||||||
}
|
}
|
||||||
</style>
|
</style>
|
||||||
|
|
|
||||||
|
|
@ -0,0 +1,16 @@
|
||||||
|
<!DOCTYPE html>
|
||||||
|
<title>Custom Elements: CEReactions on HTMLCanvasElement interface</title>
|
||||||
|
<link rel="author" title="Intel" href="http://www.intel.com">
|
||||||
|
<meta name="assert" content="width, height of HTMLCanvasElement interface must have CEReactions">
|
||||||
|
<meta name="help" content="https://html.spec.whatwg.org/#the-canvas-element">
|
||||||
|
<script src="/resources/testharness.js"></script>
|
||||||
|
<script src="/resources/testharnessreport.js"></script>
|
||||||
|
<script src="../resources/custom-elements-helpers.js"></script>
|
||||||
|
<script src="./resources/reactions.js"></script>
|
||||||
|
|
||||||
|
<script>
|
||||||
|
|
||||||
|
testReflectAttribute('width', 'width', '15', '20', 'width on HTMLCanvasElement', 'canvas', HTMLCanvasElement);
|
||||||
|
testReflectAttribute('height', 'height', '23', '45', 'height on HTMLCanvasElement', 'canvas', HTMLCanvasElement);
|
||||||
|
|
||||||
|
</script>
|
||||||
|
|
@ -0,0 +1,15 @@
|
||||||
|
<!DOCTYPE html>
|
||||||
|
<title>Custom Elements: CEReactions on HTMLDataElement interface</title>
|
||||||
|
<link rel="author" title="Intel" href="http://www.intel.com">
|
||||||
|
<meta name="assert" content="value of HTMLDataElement interface must have CEReactions">
|
||||||
|
<meta name="help" content="https://html.spec.whatwg.org/#the-data-element">
|
||||||
|
<script src="/resources/testharness.js"></script>
|
||||||
|
<script src="/resources/testharnessreport.js"></script>
|
||||||
|
<script src="../resources/custom-elements-helpers.js"></script>
|
||||||
|
<script src="./resources/reactions.js"></script>
|
||||||
|
|
||||||
|
<script>
|
||||||
|
|
||||||
|
testReflectAttribute('value', 'value', '1234', '2345', 'name on HTMLDataElement', 'data', HTMLDataElement);
|
||||||
|
|
||||||
|
</script>
|
||||||
|
|
@ -0,0 +1,15 @@
|
||||||
|
<!DOCTYPE html>
|
||||||
|
<title>Custom Elements: CEReactions on HTMLDetailsElement interface</title>
|
||||||
|
<link rel="author" title="Intel" href="http://www.intel.com">
|
||||||
|
<meta name="assert" content="open of HTMLDetailsElement interface must have CEReactions">
|
||||||
|
<meta name="help" content="https://html.spec.whatwg.org/#the-details-element">
|
||||||
|
<script src="/resources/testharness.js"></script>
|
||||||
|
<script src="/resources/testharnessreport.js"></script>
|
||||||
|
<script src="../resources/custom-elements-helpers.js"></script>
|
||||||
|
<script src="./resources/reactions.js"></script>
|
||||||
|
|
||||||
|
<script>
|
||||||
|
|
||||||
|
testReflectBooleanAttribute('open', 'open', 'open on HTMLDetailsElement', 'details', HTMLDetailsElement);
|
||||||
|
|
||||||
|
</script>
|
||||||
|
|
@ -0,0 +1,17 @@
|
||||||
|
<!DOCTYPE html>
|
||||||
|
<title>Custom Elements: CEReactions on HTMLMapElement interface</title>
|
||||||
|
<link rel="author" title="Intel" href="http://www.intel.com">
|
||||||
|
<meta name="assert" content="name of HTMLMapElement interface must have CEReactions">
|
||||||
|
<meta name="help" content="https://html.spec.whatwg.org/#the-map-element">
|
||||||
|
<script src="/resources/testharness.js"></script>
|
||||||
|
<script src="/resources/testharnessreport.js"></script>
|
||||||
|
<script src="../resources/custom-elements-helpers.js"></script>
|
||||||
|
<script src="./resources/reactions.js"></script>
|
||||||
|
|
||||||
|
<img usemap="#yellow" src="/images/yellow.png" alt="yellow pic">
|
||||||
|
<img usemap="#green" src="/images/green.png" alt="green pic">
|
||||||
|
<script>
|
||||||
|
|
||||||
|
testReflectAttribute('name', 'name', 'yellow', 'green', 'name on HTMLMapElement', 'map', HTMLMapElement);
|
||||||
|
|
||||||
|
</script>
|
||||||
|
|
@ -0,0 +1,18 @@
|
||||||
|
<!DOCTYPE html>
|
||||||
|
<title>Custom Elements: CEReactions on HTMLModElement interface</title>
|
||||||
|
<link rel="author" title="Intel" href="http://www.intel.com">
|
||||||
|
<meta name="assert" content="cite, dateTime of HTMLModElement interface must have CEReactions">
|
||||||
|
<meta name="help" content="https://html.spec.whatwg.org/#attributes-common-to-ins-and-del-elements">
|
||||||
|
<script src="/resources/testharness.js"></script>
|
||||||
|
<script src="/resources/testharnessreport.js"></script>
|
||||||
|
<script src="../resources/custom-elements-helpers.js"></script>
|
||||||
|
<script src="./resources/reactions.js"></script>
|
||||||
|
|
||||||
|
<script>
|
||||||
|
|
||||||
|
testReflectAttribute('cite', 'cite', '../resources/custom-elements-helpers.js', './resources/reactions.js', 'cite on ins use HTMLModElement', 'ins', HTMLModElement);
|
||||||
|
testReflectAttribute('dateTime', 'datetime', '2018-12-19 00:00Z', '2018-12-20 00:00Z', 'dateTime on ins use HTMLModElement', 'ins', HTMLModElement);
|
||||||
|
testReflectAttribute('cite', 'cite', '../resources/custom-elements-helpers.js', './resources/reactions.js', 'cite on del use HTMLModElement', 'del', HTMLModElement);
|
||||||
|
testReflectAttribute('dateTime', 'datetime', '2018-10-11T01:25-07:00', '2018-10-12T01:25-07:00', 'dateTime on del use HTMLModElement', 'del', HTMLModElement);
|
||||||
|
|
||||||
|
</script>
|
||||||
|
|
@ -0,0 +1,17 @@
|
||||||
|
<!DOCTYPE html>
|
||||||
|
<title>Custom Elements: CEReactions on HTMLOListElement interface</title>
|
||||||
|
<link rel="author" title="Intel" href="http://www.intel.com">
|
||||||
|
<meta name="assert" content="reversed, start, type of HTMLOListElement interface must have CEReactions">
|
||||||
|
<meta name="help" content="https://html.spec.whatwg.org/#the-ol-element">
|
||||||
|
<script src="/resources/testharness.js"></script>
|
||||||
|
<script src="/resources/testharnessreport.js"></script>
|
||||||
|
<script src="../resources/custom-elements-helpers.js"></script>
|
||||||
|
<script src="./resources/reactions.js"></script>
|
||||||
|
|
||||||
|
<script>
|
||||||
|
|
||||||
|
testReflectBooleanAttribute('reversed', 'reversed', 'reversed on HTMLOListElement', 'ol', HTMLOListElement);
|
||||||
|
testReflectAttribute('start', 'start', '2', '5', 'start on HTMLOListElement', 'ol', HTMLOListElement);
|
||||||
|
testReflectAttribute('type', 'type', '1', 'a', 'type on HTMLOListElement', 'ol', HTMLOListElement);
|
||||||
|
|
||||||
|
</script>
|
||||||
|
|
@ -0,0 +1,16 @@
|
||||||
|
<!DOCTYPE html>
|
||||||
|
<title>Custom Elements: CEReactions on HTMLQuoteElement interface</title>
|
||||||
|
<link rel="author" title="Intel" href="http://www.intel.com">
|
||||||
|
<meta name="assert" content="cite of HTMLQuoteElement interface must have CEReactions">
|
||||||
|
<meta name="help" content="https://html.spec.whatwg.org/#the-blockquote-element">
|
||||||
|
<script src="/resources/testharness.js"></script>
|
||||||
|
<script src="/resources/testharnessreport.js"></script>
|
||||||
|
<script src="../resources/custom-elements-helpers.js"></script>
|
||||||
|
<script src="./resources/reactions.js"></script>
|
||||||
|
|
||||||
|
<script>
|
||||||
|
|
||||||
|
testReflectAttribute('cite', 'cite', '../resources/custom-elements-helpers.js', './resources/reactions.js', 'cite on blockquote use HTMLQuoteElement', 'blockquote', HTMLQuoteElement);
|
||||||
|
testReflectAttribute('cite', 'cite', '../resources/custom-elements-helpers.js', './resources/reactions.js', 'cite on q use HTMLQuoteElement', 'q', HTMLQuoteElement);
|
||||||
|
|
||||||
|
</script>
|
||||||
|
|
@ -0,0 +1,15 @@
|
||||||
|
<!DOCTYPE html>
|
||||||
|
<title>Custom Elements: CEReactions on HTMLSlotElement interface</title>
|
||||||
|
<link rel="author" title="Intel" href="http://www.intel.com">
|
||||||
|
<meta name="assert" content="name of HTMLSlotElement interface must have CEReactions">
|
||||||
|
<meta name="help" content="https://html.spec.whatwg.org/#the-slot-element">
|
||||||
|
<script src="/resources/testharness.js"></script>
|
||||||
|
<script src="/resources/testharnessreport.js"></script>
|
||||||
|
<script src="../resources/custom-elements-helpers.js"></script>
|
||||||
|
<script src="./resources/reactions.js"></script>
|
||||||
|
|
||||||
|
<script>
|
||||||
|
|
||||||
|
testReflectAttribute('name', 'name', 'slot1', 'slot2', 'name on HTMLSlotElement', 'slot', HTMLSlotElement);
|
||||||
|
|
||||||
|
</script>
|
||||||
|
|
@ -0,0 +1,15 @@
|
||||||
|
<!DOCTYPE html>
|
||||||
|
<title>Custom Elements: CEReactions on HTMLTimeElement interface</title>
|
||||||
|
<link rel="author" title="Intel" href="http://www.intel.com">
|
||||||
|
<meta name="assert" content="name of HTMLTimeElement interface must have CEReactions">
|
||||||
|
<meta name="help" content="https://html.spec.whatwg.org/#the-time-element">
|
||||||
|
<script src="/resources/testharness.js"></script>
|
||||||
|
<script src="/resources/testharnessreport.js"></script>
|
||||||
|
<script src="../resources/custom-elements-helpers.js"></script>
|
||||||
|
<script src="./resources/reactions.js"></script>
|
||||||
|
|
||||||
|
<script>
|
||||||
|
|
||||||
|
testReflectAttribute('dateTime', 'datetime', '2018-12-10', '2018-12-12', 'dateTime on HTMLTimeElement', 'time', HTMLTimeElement);
|
||||||
|
|
||||||
|
</script>
|
||||||
|
|
@ -164,8 +164,8 @@ function testReflectAttribute(jsAttributeName, contentAttributeName, validValue1
|
||||||
testReflectAttributeWithContentValues(jsAttributeName, contentAttributeName, validValue1, validValue1, validValue2, validValue2, name, elementName, interfaceName);
|
testReflectAttributeWithContentValues(jsAttributeName, contentAttributeName, validValue1, validValue1, validValue2, validValue2, name, elementName, interfaceName);
|
||||||
}
|
}
|
||||||
|
|
||||||
function testReflectBooleanAttribute(jsAttributeName, contentAttributeName, name) {
|
function testReflectBooleanAttribute(jsAttributeName, contentAttributeName, name, elementName, interfaceName) {
|
||||||
testReflectAttributeWithContentValues(jsAttributeName, contentAttributeName, true, '', false, null, name);
|
testReflectAttributeWithContentValues(jsAttributeName, contentAttributeName, true, '', false, null, name, elementName, interfaceName);
|
||||||
}
|
}
|
||||||
|
|
||||||
function testAttributeAdder(testFunction, name) {
|
function testAttributeAdder(testFunction, name) {
|
||||||
|
|
|
||||||
|
|
@ -0,0 +1,34 @@
|
||||||
|
<!DOCTYPE html>
|
||||||
|
<html>
|
||||||
|
<meta charset=utf-8 />
|
||||||
|
<title>Element Timing: buffer elements before onload</title>
|
||||||
|
<script src=/resources/testharness.js></script>
|
||||||
|
<script src=/resources/testharnessreport.js></script>
|
||||||
|
<script src="resources/element-timing-helpers.js"></script>
|
||||||
|
<body>
|
||||||
|
<img src=resources/slow-image.py?name=square20.png&sleep=500>
|
||||||
|
<script>
|
||||||
|
/*
|
||||||
|
In this test, a slow image is added to the frame to delay onload. The entry
|
||||||
|
for the other image should be available before onload, and thus delivered to
|
||||||
|
the performance timeline.
|
||||||
|
*/
|
||||||
|
async_test(function(t) {
|
||||||
|
beforeRender = performance.now();
|
||||||
|
const img = document.createElement('img');
|
||||||
|
img.src = 'resources/square20.jpg';
|
||||||
|
img.setAttribute('elementtiming', 'my_image');
|
||||||
|
document.body.appendChild(img);
|
||||||
|
window.onload = t.step_func_done( () => {
|
||||||
|
const entries = performance.getEntriesByName('my_image');
|
||||||
|
assert_equals(entries.length, 1);
|
||||||
|
assert_greater_than_equal(performance.getEntriesByType('element').length, 1);
|
||||||
|
assert_equals(performance.getEntries().filter(e => e.name === 'my_image').length, 1);
|
||||||
|
const entry = entries[0];
|
||||||
|
checkElement(entry, 'my_image', beforeRender);
|
||||||
|
});
|
||||||
|
}, "Element Timing: image loads before onload.");
|
||||||
|
|
||||||
|
</script>
|
||||||
|
</body>
|
||||||
|
</html>
|
||||||
|
|
@ -0,0 +1,33 @@
|
||||||
|
<!DOCTYPE HTML>
|
||||||
|
<meta charset=utf-8>
|
||||||
|
<title>Element Timing: do NOT observe cross-origin images</title>
|
||||||
|
<body>
|
||||||
|
<script src="/resources/testharness.js"></script>
|
||||||
|
<script src="/resources/testharnessreport.js"></script>
|
||||||
|
<script src="resources/element-timing-helpers.js"></script>
|
||||||
|
<script>
|
||||||
|
async_test((t) => {
|
||||||
|
const observer = new PerformanceObserver(
|
||||||
|
t.step_func_done((entryList) => {
|
||||||
|
assert_unreached("We should not observe a cross origin element.");
|
||||||
|
})
|
||||||
|
);
|
||||||
|
observer.observe({entryTypes: ['element']});
|
||||||
|
// We add the image during onload to be sure that the observer is registered
|
||||||
|
// in time for it to observe the element timing.
|
||||||
|
// TODO(npm): change observer to use buffered flag.
|
||||||
|
window.onload = () => {
|
||||||
|
// Add a cross origin image resource.
|
||||||
|
const img = document.createElement('img');
|
||||||
|
img.src =
|
||||||
|
'http://localhost:8000/resources/square100.png';
|
||||||
|
document.body.appendChild(img);
|
||||||
|
};
|
||||||
|
t.step_timeout( () => {
|
||||||
|
// After some wait, assume observer did not receive the entry, so the test passes.
|
||||||
|
t.done();
|
||||||
|
}, 100);
|
||||||
|
}, 'Cross-origin image element is NOT observable.');
|
||||||
|
</script>
|
||||||
|
|
||||||
|
</body>
|
||||||
|
|
@ -0,0 +1,33 @@
|
||||||
|
<!DOCTYPE HTML>
|
||||||
|
<meta charset=utf-8>
|
||||||
|
<title>Element Timing: do NOT observe elements from cross-origin iframes</title>
|
||||||
|
<body>
|
||||||
|
<script src="/resources/testharness.js"></script>
|
||||||
|
<script src="/resources/testharnessreport.js"></script>
|
||||||
|
<script src="resources/element-timing-helpers.js"></script>
|
||||||
|
<script>
|
||||||
|
async_test((t) => {
|
||||||
|
const observer = new PerformanceObserver(
|
||||||
|
t.step_func_done((entryList) => {
|
||||||
|
assert_unreached("We should not observe a cross origin element.");
|
||||||
|
})
|
||||||
|
);
|
||||||
|
observer.observe({entryTypes: ['element']});
|
||||||
|
// We add the iframe during onload to be sure that the observer is registered
|
||||||
|
// in time for it to observe the element timing.
|
||||||
|
// TODO(npm): change observer to use buffered flag.
|
||||||
|
window.onload = () => {
|
||||||
|
// Add a cross origin iframe with an image.
|
||||||
|
const iframe = document.createElement('iframe');
|
||||||
|
iframe.src =
|
||||||
|
'http://localhost:8000/performance-timing/element-resources/iframe-with-square.html';
|
||||||
|
document.body.appendChild(iframe);
|
||||||
|
};
|
||||||
|
t.step_timeout( () => {
|
||||||
|
// After some wait, assume observer did not receive the entry, so the test passes.
|
||||||
|
t.done();
|
||||||
|
}, 300);
|
||||||
|
}, 'Element from cross origin iframe is NOT observable.');
|
||||||
|
</script>
|
||||||
|
|
||||||
|
</body>
|
||||||
|
|
@ -0,0 +1,43 @@
|
||||||
|
<!DOCTYPE HTML>
|
||||||
|
<meta charset=utf-8>
|
||||||
|
<title>Element Timing: intersectionRect when image overflows</title>
|
||||||
|
<body>
|
||||||
|
<style>
|
||||||
|
body {
|
||||||
|
margin: 200px 100px;
|
||||||
|
}
|
||||||
|
</style>
|
||||||
|
<script src="/resources/testharness.js"></script>
|
||||||
|
<script src="/resources/testharnessreport.js"></script>
|
||||||
|
<script src="resources/element-timing-helpers.js"></script>
|
||||||
|
<script>
|
||||||
|
let beforeRender;
|
||||||
|
async_test(function (t) {
|
||||||
|
const observer = new PerformanceObserver(
|
||||||
|
t.step_func_done(function(entryList) {
|
||||||
|
assert_equals(entryList.getEntries().length, 1);
|
||||||
|
const entry = entryList.getEntries()[0];
|
||||||
|
checkElement(entry, 'not_fully_visible', beforeRender);
|
||||||
|
// Image will not be fully visible. It should start from the top left part
|
||||||
|
// of the document, excluding the margin, and then overflow.
|
||||||
|
checkRect(entry,
|
||||||
|
[100, document.documentElement.clientWidth, 200, document.documentElement.clientHeight]);
|
||||||
|
})
|
||||||
|
);
|
||||||
|
observer.observe({entryTypes: ['element']});
|
||||||
|
// We add the image during onload to be sure that the observer is registered
|
||||||
|
// in time for it to observe the element timing.
|
||||||
|
window.onload = () => {
|
||||||
|
// Add an image setting width and height equal to viewport.
|
||||||
|
const img = document.createElement('img');
|
||||||
|
img.src = 'resources/square20.png';
|
||||||
|
img.setAttribute('elementtiming', 'not_fully_visible');
|
||||||
|
img.width = document.documentElement.clientWidth;
|
||||||
|
img.height = document.documentElement.clientHeight;
|
||||||
|
document.body.appendChild(img);
|
||||||
|
beforeRender = performance.now();
|
||||||
|
};
|
||||||
|
}, 'The intersectionRect of an img element overflowing is computed correctly');
|
||||||
|
</script>
|
||||||
|
|
||||||
|
</body>
|
||||||
|
|
@ -0,0 +1,39 @@
|
||||||
|
<!DOCTYPE HTML>
|
||||||
|
<meta charset=utf-8>
|
||||||
|
<title>Element Timing: observe elements from same-origin iframes</title>
|
||||||
|
<body>
|
||||||
|
<style>
|
||||||
|
body {
|
||||||
|
margin: 0;
|
||||||
|
}
|
||||||
|
</style>
|
||||||
|
<script src="/resources/testharness.js"></script>
|
||||||
|
<script src="/resources/testharnessreport.js"></script>
|
||||||
|
<script src="resources/element-timing-helpers.js"></script>
|
||||||
|
<script>
|
||||||
|
let beforeRender;
|
||||||
|
async_test((t) => {
|
||||||
|
const observer = new PerformanceObserver(
|
||||||
|
t.step_func_done((entryList) => {
|
||||||
|
assert_equals(entryList.getEntries().length, 1);
|
||||||
|
const entry = entryList.getEntries()[0];
|
||||||
|
checkElement(entry, 'my_image', beforeRender);
|
||||||
|
// Assume viewport has size at least 100, so the element is fully visible.
|
||||||
|
checkRect(entry, [0, 100, 0, 100]);
|
||||||
|
})
|
||||||
|
);
|
||||||
|
observer.observe({entryTypes: ['element']});
|
||||||
|
// We add the iframe during onload to be sure that the observer is registered
|
||||||
|
// in time for it to observe the element timing.
|
||||||
|
// TODO(npm): change observer to use buffered flag.
|
||||||
|
window.onload = () => {
|
||||||
|
// Add iframe with an image of width and height equal to 100.
|
||||||
|
const iframe = document.createElement('iframe');
|
||||||
|
iframe.src = 'resources/iframe-with-square.html';
|
||||||
|
document.body.appendChild(iframe);
|
||||||
|
beforeRender = performance.now();
|
||||||
|
};
|
||||||
|
}, 'Element from same-origin iframe is observable.');
|
||||||
|
</script>
|
||||||
|
|
||||||
|
</body>
|
||||||
|
|
@ -0,0 +1,39 @@
|
||||||
|
<!DOCTYPE HTML>
|
||||||
|
<meta charset=utf-8>
|
||||||
|
<title>Element Timing: observe elements with elementtiming attribute</title>
|
||||||
|
<body>
|
||||||
|
<style>
|
||||||
|
body {
|
||||||
|
margin: 0;
|
||||||
|
}
|
||||||
|
</style>
|
||||||
|
<script src="/resources/testharness.js"></script>
|
||||||
|
<script src="/resources/testharnessreport.js"></script>
|
||||||
|
<script src="resources/element-timing-helpers.js"></script>
|
||||||
|
<script>
|
||||||
|
let beforeRender;
|
||||||
|
async_test(function (t) {
|
||||||
|
const observer = new PerformanceObserver(
|
||||||
|
t.step_func_done(function(entryList) {
|
||||||
|
assert_equals(entryList.getEntries().length, 1);
|
||||||
|
const entry = entryList.getEntries()[0];
|
||||||
|
checkElement(entry, 'my_image', beforeRender);
|
||||||
|
// Assume viewport has size at least 100, so the element is fully visible.
|
||||||
|
checkRect(entry, [0, 100, 0, 100]);
|
||||||
|
})
|
||||||
|
);
|
||||||
|
observer.observe({entryTypes: ['element']});
|
||||||
|
// We add the image during onload to be sure that the observer is registered
|
||||||
|
// in time for it to observe the element timing.
|
||||||
|
window.onload = () => {
|
||||||
|
// Add image of width and height equal to 100.
|
||||||
|
const img = document.createElement('img');
|
||||||
|
img.src = 'resources/square100.png';
|
||||||
|
img.setAttribute('elementtiming', 'my_image');
|
||||||
|
document.body.appendChild(img);
|
||||||
|
beforeRender = performance.now();
|
||||||
|
};
|
||||||
|
}, 'Element with elementtiming attribute is observable.');
|
||||||
|
</script>
|
||||||
|
|
||||||
|
</body>
|
||||||
|
|
@ -0,0 +1,41 @@
|
||||||
|
<!DOCTYPE HTML>
|
||||||
|
<meta charset=utf-8>
|
||||||
|
<title>Element Timing: observe large elements</title>
|
||||||
|
<body>
|
||||||
|
<style>
|
||||||
|
body {
|
||||||
|
margin: 0;
|
||||||
|
}
|
||||||
|
</style>
|
||||||
|
<script src="/resources/testharness.js"></script>
|
||||||
|
<script src="/resources/testharnessreport.js"></script>
|
||||||
|
<script src="resources/element-timing-helpers.js"></script>
|
||||||
|
<script>
|
||||||
|
let beforeRender;
|
||||||
|
async_test(function (t) {
|
||||||
|
const observer = new PerformanceObserver(
|
||||||
|
t.step_func_done(function(entryList) {
|
||||||
|
assert_equals(entryList.getEntries().length, 1);
|
||||||
|
const entry = entryList.getEntries()[0];
|
||||||
|
checkElement(entry, 'img', beforeRender)
|
||||||
|
// Assume viewport hasn't changed, so the element occupies all of it.
|
||||||
|
checkRect(entry,
|
||||||
|
[0, document.documentElement.clientWidth, 0, document.documentElement.clientHeight]);
|
||||||
|
})
|
||||||
|
);
|
||||||
|
observer.observe({entryTypes: ['element']});
|
||||||
|
// We add the image during onload to be sure that the observer is registered
|
||||||
|
// in time for it to observe the element timing.
|
||||||
|
window.onload = () => {
|
||||||
|
// Add an image setting width and height equal to viewport.
|
||||||
|
const img = document.createElement('img');
|
||||||
|
img.src = 'resources/square20.jpg';
|
||||||
|
img.width = document.documentElement.clientWidth;
|
||||||
|
img.height = document.documentElement.clientHeight;
|
||||||
|
document.body.appendChild(img);
|
||||||
|
beforeRender = performance.now();
|
||||||
|
};
|
||||||
|
}, 'Large img element is observable.');
|
||||||
|
</script>
|
||||||
|
|
||||||
|
</body>
|
||||||
|
|
@ -0,0 +1,110 @@
|
||||||
|
<!DOCTYPE HTML>
|
||||||
|
<meta charset=utf-8>
|
||||||
|
<title>Element Timing: multiple images</title>
|
||||||
|
<body>
|
||||||
|
<style>
|
||||||
|
body {
|
||||||
|
margin: 0;
|
||||||
|
}
|
||||||
|
#img1 {
|
||||||
|
display: block;
|
||||||
|
margin-left: auto;
|
||||||
|
margin-right: auto;
|
||||||
|
}
|
||||||
|
#img2 {
|
||||||
|
margin-top:150px;
|
||||||
|
margin-left:50px;
|
||||||
|
}
|
||||||
|
</style>
|
||||||
|
<script src="/resources/testharness.js"></script>
|
||||||
|
<script src="/resources/testharnessreport.js"></script>
|
||||||
|
<script src="resources/element-timing-helpers.js"></script>
|
||||||
|
<script>
|
||||||
|
let beforeRender, image1Observed=0, image2Observed=0, image3Observed=0;
|
||||||
|
async_test(function (t) {
|
||||||
|
const observer = new PerformanceObserver(
|
||||||
|
t.step_func(function(entryList) {
|
||||||
|
entryList.getEntries().forEach( entry => {
|
||||||
|
if (entry.name === 'image1') {
|
||||||
|
if (image1Observed) {
|
||||||
|
assert_unreached("Observer received image1 more than once");
|
||||||
|
t.done();
|
||||||
|
}
|
||||||
|
image1Observed = 1;
|
||||||
|
checkElement(entry, 'image1', beforeRender);
|
||||||
|
// This image is horizontally centered.
|
||||||
|
// Using abs and comparing to 1 because the viewport sizes could be odd.
|
||||||
|
// If a size is odd, then image cannot be in the pure center, but left
|
||||||
|
// and right should still be very close to their estimated coordinates.
|
||||||
|
assert_less_than_equal(Math.abs(entry.intersectionRect.left -
|
||||||
|
(document.documentElement.clientWidth / 2 - 50)), 1,
|
||||||
|
'left of rect for image1');
|
||||||
|
assert_less_than_equal(Math.abs(entry.intersectionRect.right -
|
||||||
|
(document.documentElement.clientWidth / 2 + 50)), 1,
|
||||||
|
'right of rect for image1');
|
||||||
|
assert_equals(entry.intersectionRect.top, 0, 'top of rect for image1');
|
||||||
|
assert_equals(entry.intersectionRect.bottom,
|
||||||
|
100, 'bottom of rect for image1');
|
||||||
|
}
|
||||||
|
else if (entry.name === 'image2') {
|
||||||
|
if (image2Observed) {
|
||||||
|
assert_unreached("Observer received image2 more than once");
|
||||||
|
t.done();
|
||||||
|
}
|
||||||
|
image2Observed = 1;
|
||||||
|
checkElement(entry, 'image2', beforeRender);
|
||||||
|
// This image should be below image 1, and should respect the margin.
|
||||||
|
checkRect(entry, [50, 250, 250, 450], "of image2");
|
||||||
|
}
|
||||||
|
else if (entry.name === 'image3') {
|
||||||
|
if (image3Observed) {
|
||||||
|
assert_unreached("Observer received image3 more than once");
|
||||||
|
t.done();
|
||||||
|
}
|
||||||
|
image3Observed = 1;
|
||||||
|
checkElement(entry, 'image3', beforeRender);
|
||||||
|
// This image is just to the right of image2.
|
||||||
|
checkRect(entry, [250, 450, 250, 450], "of image3");
|
||||||
|
}
|
||||||
|
else {
|
||||||
|
assert_unreached("Received an unexpected name.");
|
||||||
|
t.done();
|
||||||
|
}
|
||||||
|
if (image1Observed && image2Observed && image3Observed) {
|
||||||
|
t.done();
|
||||||
|
}
|
||||||
|
});
|
||||||
|
})
|
||||||
|
);
|
||||||
|
observer.observe({entryTypes: ['element']});
|
||||||
|
function addImage(number, source, width=0) {
|
||||||
|
const img = document.createElement('img');
|
||||||
|
img.src = source;
|
||||||
|
img.id = 'img' + number;
|
||||||
|
img.setAttribute('elementtiming', 'image' + number);
|
||||||
|
if (width !== 0)
|
||||||
|
img.width = width;
|
||||||
|
document.body.appendChild(img);
|
||||||
|
}
|
||||||
|
// Add the images during onload to be sure that the observer is registered in
|
||||||
|
// time to observe the element timing.
|
||||||
|
window.onload = () => {
|
||||||
|
addImage(1, 'resources/square100.png');
|
||||||
|
// Use requestAnimationFrame and a timeout to ensure that the images are
|
||||||
|
// processed in the order we want.
|
||||||
|
requestAnimationFrame( () => {
|
||||||
|
t.step_timeout( () => {
|
||||||
|
// Set the size equal to that of image3 to make positioning easier.
|
||||||
|
addImage(2, 'resources/square20.png', 200);
|
||||||
|
requestAnimationFrame( () => {
|
||||||
|
t.step_timeout( () => {
|
||||||
|
addImage(3, 'resources/circle.svg');
|
||||||
|
}, 0);
|
||||||
|
});
|
||||||
|
}, 0);
|
||||||
|
});
|
||||||
|
beforeRender = performance.now();
|
||||||
|
};
|
||||||
|
}, 'PerformanceObserver can observe multiple image elements.');
|
||||||
|
</script>
|
||||||
|
</body>
|
||||||
|
|
@ -0,0 +1,35 @@
|
||||||
|
<!DOCTYPE html>
|
||||||
|
<html>
|
||||||
|
<meta charset=utf-8 />
|
||||||
|
<title>Element Timing: buffer elements before onload</title>
|
||||||
|
<script src=/resources/testharness.js></script>
|
||||||
|
<script src=/resources/testharnessreport.js></script>
|
||||||
|
<script src="resources/element-timing-helpers.js"></script>
|
||||||
|
<body>
|
||||||
|
<script>
|
||||||
|
let beforeRender;
|
||||||
|
// Number of characters to be read on the initial read, before sleeping.
|
||||||
|
// Should be sufficient to do at least a first scan.
|
||||||
|
let numInitial = 75;
|
||||||
|
let sleep = 500;
|
||||||
|
async_test(function(t) {
|
||||||
|
const observer = new PerformanceObserver(
|
||||||
|
t.step_func_done(function(entryList) {
|
||||||
|
assert_equals(entryList.getEntries().length, 1);
|
||||||
|
const entry = entryList.getEntries()[0];
|
||||||
|
// Since the image is only fully loaded after the sleep, the render timestamp
|
||||||
|
// must be greater than |beforeRender| + |sleep|.
|
||||||
|
checkElement(entry, 'my_image', beforeRender + sleep);
|
||||||
|
})
|
||||||
|
);
|
||||||
|
observer.observe({entryTypes: ['element']});
|
||||||
|
|
||||||
|
const img = document.createElement('img');
|
||||||
|
img.src = 'resources/progressive-image.py?name=square20.jpg&numInitial='
|
||||||
|
+ numInitial + '&sleep=' + sleep;
|
||||||
|
img.setAttribute('elementtiming', 'my_image');
|
||||||
|
document.body.appendChild(img);
|
||||||
|
beforeRender = performance.now();
|
||||||
|
t.step_timeout(() => {assert_true(0);}, 2000);
|
||||||
|
}, "Element Timing: image render timestamp occurs after it is fully loaded.");
|
||||||
|
</script>
|
||||||
|
|
@ -0,0 +1,6 @@
|
||||||
|
<?xml version="1.0"?>
|
||||||
|
<!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.0//EN"
|
||||||
|
"http://www.w3.org/TR/2001/REC-SVG-20010904/DTD/svg10.dtd">
|
||||||
|
<svg xmlns="http://www.w3.org/2000/svg" width="200" height="200">
|
||||||
|
<circle cx="50%" cy="50%" r="80" style="fill:blue;" />
|
||||||
|
</svg>
|
||||||
|
After Width: | Height: | Size: 275 B |
|
|
@ -0,0 +1,21 @@
|
||||||
|
// Checks that this is an ElementTiming entry with name |expectedName|. It also
|
||||||
|
// does a very basic check on |startTime|: after |beforeRender| and before now().
|
||||||
|
function checkElement(entry, expectedName, beforeRender) {
|
||||||
|
assert_equals(entry.entryType, 'element');
|
||||||
|
assert_equals(entry.name, expectedName);
|
||||||
|
assert_equals(entry.duration, 0);
|
||||||
|
assert_greater_than_equal(entry.startTime, beforeRender);
|
||||||
|
assert_greater_than_equal(performance.now(), entry.startTime);
|
||||||
|
}
|
||||||
|
|
||||||
|
// Checks that the rect matches the desired values [left right top bottom]
|
||||||
|
function checkRect(entry, expected, description="") {
|
||||||
|
assert_equals(entry.intersectionRect.left, expected[0],
|
||||||
|
'left of rect ' + description);
|
||||||
|
assert_equals(entry.intersectionRect.right, expected[1],
|
||||||
|
'right of rect ' + description);
|
||||||
|
assert_equals(entry.intersectionRect.top, expected[2],
|
||||||
|
'top of rect ' + description);
|
||||||
|
assert_equals(entry.intersectionRect.bottom, expected[3],
|
||||||
|
'bottom of rect ' + description);
|
||||||
|
}
|
||||||
|
|
@ -0,0 +1,10 @@
|
||||||
|
<!DOCTYPE HTML>
|
||||||
|
<meta charset=utf-8>
|
||||||
|
<body>
|
||||||
|
<style>
|
||||||
|
body {
|
||||||
|
margin: 0;
|
||||||
|
}
|
||||||
|
</style>
|
||||||
|
<img src='square100.png' elementtiming="my_image">
|
||||||
|
</body>
|
||||||
|
|
@ -0,0 +1,26 @@
|
||||||
|
import os.path
|
||||||
|
import time
|
||||||
|
|
||||||
|
def main(request, response):
|
||||||
|
name = request.GET.first("name")
|
||||||
|
sleepTime = float(request.GET.first("sleep")) / 1E3
|
||||||
|
numInitial = int(request.GET.first("numInitial"))
|
||||||
|
|
||||||
|
path = os.path.join(os.path.dirname(__file__), name)
|
||||||
|
body = open(path, "rb").read()
|
||||||
|
|
||||||
|
response.headers.set("Content-Type", "image")
|
||||||
|
response.headers.set("Content-Length", len(body))
|
||||||
|
response.headers.set("Cache-control", "no-cache, must-revalidate")
|
||||||
|
response.write_status_headers()
|
||||||
|
|
||||||
|
# Read from the beginning, |numInitial| bytes.
|
||||||
|
first = body[:numInitial]
|
||||||
|
response.writer.write_content(first)
|
||||||
|
response.writer.flush()
|
||||||
|
|
||||||
|
time.sleep(sleepTime)
|
||||||
|
|
||||||
|
# Read the remainder after having slept.
|
||||||
|
second = body[numInitial:]
|
||||||
|
response.writer.write_content(second)
|
||||||
|
|
@ -0,0 +1,17 @@
|
||||||
|
import os.path
|
||||||
|
import time
|
||||||
|
|
||||||
|
def main(request, response):
|
||||||
|
name = request.GET.first("name")
|
||||||
|
sleepTime = float(request.GET.first("sleep")) / 1E3
|
||||||
|
|
||||||
|
time.sleep(sleepTime)
|
||||||
|
|
||||||
|
path = os.path.join(os.path.dirname(__file__), name)
|
||||||
|
body = open(path, "rb").read()
|
||||||
|
|
||||||
|
response.headers.set("Content-Type", "image")
|
||||||
|
response.headers.set("Content-Length", len(body))
|
||||||
|
response.headers.set("Cache-control", "no-cache, must-revalidate")
|
||||||
|
|
||||||
|
response.content = body;
|
||||||
Binary file not shown.
|
After Width: | Height: | Size: 13 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 529 B |
Binary file not shown.
|
After Width: | Height: | Size: 150 B |
|
|
@ -0,0 +1,17 @@
|
||||||
|
<!DOCTYPE html>
|
||||||
|
<head>
|
||||||
|
<title>PerformanceObserver.supportedEntryTypes contains "element"</title>
|
||||||
|
</head>
|
||||||
|
<body>
|
||||||
|
<script src="/resources/testharness.js"></script>
|
||||||
|
<script src="/resources/testharnessreport.js"></script>
|
||||||
|
<script>
|
||||||
|
test(() => {
|
||||||
|
if (typeof PerformanceObserver.supportedEntryTypes === "undefined")
|
||||||
|
assert_unreached("supportedEntryTypes is not supported.");
|
||||||
|
assert_greater_than(PerformanceObserver.supportedEntryTypes.indexOf("element"), -1,
|
||||||
|
"There should be an entry 'element' in PerformanceObserver.supportedEntryTypes");
|
||||||
|
}, "supportedEntryTypes contains 'element'.");
|
||||||
|
</script>
|
||||||
|
</body>
|
||||||
|
</html>
|
||||||
|
|
@ -0,0 +1,60 @@
|
||||||
|
<!DOCTYPE html>
|
||||||
|
<script src=/resources/testharness.js></script>
|
||||||
|
<script src=/resources/testharnessreport.js></script>
|
||||||
|
<script src=/fetch/sec-metadata/resources/helper.js></script>
|
||||||
|
<body>
|
||||||
|
<script>
|
||||||
|
async_test(t => {
|
||||||
|
let i = document.createElement('iframe');
|
||||||
|
i.src = "http://{{host}}:{{ports[http][0]}}/fetch/sec-metadata/resources/post-to-owner.py";
|
||||||
|
window.addEventListener('message', t.step_func(e => {
|
||||||
|
if (e.source != i.contentWindow)
|
||||||
|
return;
|
||||||
|
|
||||||
|
assert_header_equals(e.data, {
|
||||||
|
"dest": "",
|
||||||
|
"site": "",
|
||||||
|
"user": ""
|
||||||
|
});
|
||||||
|
t.done();
|
||||||
|
}));
|
||||||
|
|
||||||
|
document.body.appendChild(i);
|
||||||
|
}, "Non-secure same-origin iframe => No headers");
|
||||||
|
|
||||||
|
async_test(t => {
|
||||||
|
let i = document.createElement('iframe');
|
||||||
|
i.src = "http://{{hosts[][www]}}:{{ports[http][0]}}/fetch/sec-metadata/resources/post-to-owner.py";
|
||||||
|
window.addEventListener('message', t.step_func(e => {
|
||||||
|
if (e.source != i.contentWindow)
|
||||||
|
return;
|
||||||
|
|
||||||
|
assert_header_equals(e.data, {
|
||||||
|
"dest": "",
|
||||||
|
"site": "",
|
||||||
|
"user": ""
|
||||||
|
});
|
||||||
|
t.done();
|
||||||
|
}));
|
||||||
|
|
||||||
|
document.body.appendChild(i);
|
||||||
|
}, "Non-secure same-site iframe => No headers");
|
||||||
|
|
||||||
|
async_test(t => {
|
||||||
|
let i = document.createElement('iframe');
|
||||||
|
i.src = "http://{{hosts[alt][www]}}:{{ports[http][0]}}/fetch/sec-metadata/resources/post-to-owner.py";
|
||||||
|
window.addEventListener('message', t.step_func(e => {
|
||||||
|
if (e.source != i.contentWindow)
|
||||||
|
return;
|
||||||
|
|
||||||
|
assert_header_equals(e.data, {
|
||||||
|
"dest": "",
|
||||||
|
"site": "",
|
||||||
|
"user": ""
|
||||||
|
});
|
||||||
|
t.done();
|
||||||
|
}));
|
||||||
|
|
||||||
|
document.body.appendChild(i);
|
||||||
|
}, "Non-secure cross-site iframe => No headers.");
|
||||||
|
</script>
|
||||||
|
|
@ -0,0 +1,46 @@
|
||||||
|
<!DOCTYPE html>
|
||||||
|
<script src=/resources/testharness.js></script>
|
||||||
|
<script src=/resources/testharnessreport.js></script>
|
||||||
|
<script src=/fetch/sec-metadata/resources/helper.js></script>
|
||||||
|
|
||||||
|
<!-- Same-origin script -->
|
||||||
|
<script src="http://{{host}}:{{ports[http][0]}}/fetch/sec-metadata/resources/echo-as-script.py"></script>
|
||||||
|
<script>
|
||||||
|
test(t => {
|
||||||
|
t.add_cleanup(_ => { header = null; });
|
||||||
|
|
||||||
|
assert_header_equals(header, {
|
||||||
|
"dest": "",
|
||||||
|
"site": "",
|
||||||
|
"user": ""
|
||||||
|
});
|
||||||
|
}, "Non-secure same-origin script => No headers");
|
||||||
|
</script>
|
||||||
|
|
||||||
|
<!-- Same-site script -->
|
||||||
|
<script src="http://{{hosts[][www]}}:{{ports[http][0]}}/fetch/sec-metadata/resources/echo-as-script.py"></script>
|
||||||
|
<script>
|
||||||
|
test(t => {
|
||||||
|
t.add_cleanup(_ => { header = null; });
|
||||||
|
|
||||||
|
assert_header_equals(header, {
|
||||||
|
"dest": "",
|
||||||
|
"site": "",
|
||||||
|
"user": ""
|
||||||
|
});
|
||||||
|
}, "Non-secure same-site script => No headers");
|
||||||
|
</script>
|
||||||
|
|
||||||
|
<!-- Cross-site script -->
|
||||||
|
<script src="http://{{hosts[alt][www]}}:{{ports[http][0]}}/fetch/sec-metadata/resources/echo-as-script.py"></script>
|
||||||
|
<script>
|
||||||
|
test(t => {
|
||||||
|
t.add_cleanup(_ => { header = null; });
|
||||||
|
|
||||||
|
assert_header_equals(header, {
|
||||||
|
"dest": "",
|
||||||
|
"site": "",
|
||||||
|
"user": ""
|
||||||
|
});
|
||||||
|
}, "Non-secure cross-site script => No headers");
|
||||||
|
</script>
|
||||||
|
|
@ -34,6 +34,12 @@
|
||||||
<option selected>Three</option>
|
<option selected>Three</option>
|
||||||
</select>
|
</select>
|
||||||
|
|
||||||
|
<select id="select-named-selected">
|
||||||
|
<option>One</option>
|
||||||
|
<option>Two</option>
|
||||||
|
<option id="named-option" selected>Three</option>
|
||||||
|
</select>
|
||||||
|
|
||||||
<select id="invalid-select">
|
<select id="invalid-select">
|
||||||
<option selected>One</option>
|
<option selected>One</option>
|
||||||
<option selected>Two</option>
|
<option selected>Two</option>
|
||||||
|
|
@ -103,6 +109,13 @@ test(() => {
|
||||||
}, ".selectedOptions without the 'multiple' attribute but " +
|
}, ".selectedOptions without the 'multiple' attribute but " +
|
||||||
"more than one selected option should return the last one");
|
"more than one selected option should return the last one");
|
||||||
|
|
||||||
|
test(() => {
|
||||||
|
const select = document.getElementById("select-named-selected");
|
||||||
|
|
||||||
|
assert_equals(select.selectedOptions.constructor, HTMLCollection);
|
||||||
|
assert_equals(select.selectedOptions.namedItem("named-option"), select.children[2]);
|
||||||
|
}, ".selectedOptions should return `HTMLCollection` instance");
|
||||||
|
|
||||||
test(() => {
|
test(() => {
|
||||||
const select = document.getElementById("select-same-object");
|
const select = document.getElementById("select-same-object");
|
||||||
const selectAgain = document.getElementById("select-same-object");
|
const selectAgain = document.getElementById("select-same-object");
|
||||||
|
|
|
||||||
20
tests/wpt/web-platform-tests/images/fyi-logo/fyi_color.svg
Normal file
20
tests/wpt/web-platform-tests/images/fyi-logo/fyi_color.svg
Normal file
|
|
@ -0,0 +1,20 @@
|
||||||
|
<?xml version="1.0" encoding="utf-8"?>
|
||||||
|
<!-- Generator: Adobe Illustrator 22.1.0, SVG Export Plug-In . SVG Version: 6.00 Build 0) -->
|
||||||
|
<svg version="1.1" id="Layer_1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px" y="0px"
|
||||||
|
viewBox="0 0 440 440" style="enable-background:new 0 0 440 440;" xml:space="preserve">
|
||||||
|
<style type="text/css">
|
||||||
|
.st0{fill:#7ED2EE;}
|
||||||
|
.st1{fill:#003C57;}
|
||||||
|
</style>
|
||||||
|
<g>
|
||||||
|
<rect x="61.2" y="255.3" class="st0" width="30.4" height="28.3"/>
|
||||||
|
<path class="st1" d="M159.3,103.8c-28.5,0-51.7,23.2-51.7,51.7V284H138v-60.5h28.6v-30.4H138v-37.5c0-11.8,9.6-21.4,21.4-21.4
|
||||||
|
c11.5,0,20.8,9.1,21.3,20.4h30.4C210.6,126.5,187.6,103.8,159.3,103.8z"/>
|
||||||
|
<rect x="302" y="126.3" class="st1" width="30.4" height="28.3"/>
|
||||||
|
<polygon class="st1" points="302.1,176.1 301.9,284 332.3,284 332.4,176.1"/>
|
||||||
|
<path class="st1" d="M284.1,208.4l0-15.5l0-1l0-15.8h-30.4l-0.1,33.8c-0.8,11.1-10.1,19.9-21.3,19.9c-11.8,0-21.4-9.6-21.4-21.4
|
||||||
|
v-32.3h-30.4v32.3c0,28.5,23.2,51.7,51.7,51.7c6.9,0,13.6-1.3,19.9-4l1.3-0.6l0,23.1h0.2v5.8c0,11.8-9.6,21.4-21.4,21.4
|
||||||
|
c-11.5,0-20.8-9.1-21.3-20.4h-30.4c0.5,28.1,23.5,50.8,51.7,50.8c28.5,0,51.7-23.2,51.7-51.7v-3.8H284l0.1-69.9
|
||||||
|
C284.1,209.9,284.1,209.1,284.1,208.4z"/>
|
||||||
|
</g>
|
||||||
|
</svg>
|
||||||
|
After Width: | Height: | Size: 1.2 KiB |
|
|
@ -0,0 +1,26 @@
|
||||||
|
<?xml version="1.0" encoding="utf-8"?>
|
||||||
|
<!-- Generator: Adobe Illustrator 22.1.0, SVG Export Plug-In . SVG Version: 6.00 Build 0) -->
|
||||||
|
<svg version="1.1" id="Layer_1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px" y="0px"
|
||||||
|
viewBox="0 0 440.7 440" style="enable-background:new 0 0 440.7 440;" xml:space="preserve">
|
||||||
|
<style type="text/css">
|
||||||
|
.st0{fill:#003C57;}
|
||||||
|
.st1{fill:#7ED2EE;}
|
||||||
|
.st2{fill:#FFFFFF;}
|
||||||
|
</style>
|
||||||
|
<g>
|
||||||
|
<g>
|
||||||
|
<rect x="0" class="st0" width="440" height="440"/>
|
||||||
|
</g>
|
||||||
|
<g>
|
||||||
|
<rect x="61.2" y="255.3" class="st1" width="30.4" height="28.3"/>
|
||||||
|
<path class="st2" d="M159.3,103.8c-28.5,0-51.7,23.2-51.7,51.7V284H138v-60.5h28.6v-30.4H138v-37.5c0-11.8,9.6-21.4,21.4-21.4
|
||||||
|
c11.5,0,20.8,9.1,21.3,20.4h30.4C210.6,126.5,187.6,103.8,159.3,103.8z"/>
|
||||||
|
<rect x="302" y="126.3" class="st2" width="30.4" height="28.3"/>
|
||||||
|
<polygon class="st2" points="302.1,176.1 301.9,284 332.3,284 332.4,176.1"/>
|
||||||
|
<path class="st2" d="M284.1,208.4l0-15.5l0-1l0-15.8h-30.4l-0.1,33.8c-0.8,11.1-10.1,19.9-21.3,19.9c-11.8,0-21.4-9.6-21.4-21.4
|
||||||
|
v-32.3h-30.4v32.3c0,28.5,23.2,51.7,51.7,51.7c6.9,0,13.6-1.3,19.9-4l1.3-0.6l0,23.1h0.2v5.8c0,11.8-9.6,21.4-21.4,21.4
|
||||||
|
c-11.5,0-20.8-9.1-21.3-20.4h-30.4c0.5,28.1,23.5,50.8,51.7,50.8c28.5,0,51.7-23.2,51.7-51.7v-3.8H284l0.1-69.9
|
||||||
|
C284.1,209.9,284.1,209.1,284.1,208.4z"/>
|
||||||
|
</g>
|
||||||
|
</g>
|
||||||
|
</svg>
|
||||||
|
After Width: | Height: | Size: 1.4 KiB |
|
|
@ -0,0 +1,18 @@
|
||||||
|
<?xml version="1.0" encoding="utf-8"?>
|
||||||
|
<!-- Generator: Adobe Illustrator 22.1.0, SVG Export Plug-In . SVG Version: 6.00 Build 0) -->
|
||||||
|
<svg version="1.1" id="Layer_1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px" y="0px"
|
||||||
|
viewBox="0 0 440 440" style="enable-background:new 0 0 440 440;" xml:space="preserve">
|
||||||
|
<g>
|
||||||
|
<g>
|
||||||
|
<rect x="61.2" y="255.3" width="30.4" height="28.3"/>
|
||||||
|
<path d="M159.3,103.8c-28.5,0-51.7,23.2-51.7,51.7V284H138v-60.5h28.6v-30.4H138v-37.5c0-11.8,9.6-21.4,21.4-21.4
|
||||||
|
c11.5,0,20.8,9.1,21.3,20.4h30.4C210.6,126.5,187.6,103.8,159.3,103.8z"/>
|
||||||
|
<rect x="302" y="126.3" width="30.4" height="28.3"/>
|
||||||
|
<polygon points="302.1,176.1 301.9,284 332.3,284 332.4,176.1 "/>
|
||||||
|
<path d="M284.1,208.4l0-15.5l0-1l0-15.8h-30.4l-0.1,33.8c-0.8,11.1-10.1,19.9-21.3,19.9c-11.8,0-21.4-9.6-21.4-21.4v-32.3h-30.4
|
||||||
|
v32.3c0,28.5,23.2,51.7,51.7,51.7c6.9,0,13.6-1.3,19.9-4l1.3-0.6l0,23.1h0.2v5.8c0,11.8-9.6,21.4-21.4,21.4
|
||||||
|
c-11.5,0-20.8-9.1-21.3-20.4h-30.4c0.5,28.1,23.5,50.8,51.7,50.8c28.5,0,51.7-23.2,51.7-51.7v-3.8H284l0.1-69.9
|
||||||
|
C284.1,209.9,284.1,209.1,284.1,208.4z"/>
|
||||||
|
</g>
|
||||||
|
</g>
|
||||||
|
</svg>
|
||||||
|
After Width: | Height: | Size: 1.1 KiB |
|
|
@ -0,0 +1,24 @@
|
||||||
|
<?xml version="1.0" encoding="utf-8"?>
|
||||||
|
<!-- Generator: Adobe Illustrator 22.1.0, SVG Export Plug-In . SVG Version: 6.00 Build 0) -->
|
||||||
|
<svg version="1.1" id="Layer_1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px" y="0px"
|
||||||
|
viewBox="0 0 440.7 440" style="enable-background:new 0 0 440.7 440;" xml:space="preserve">
|
||||||
|
<style type="text/css">
|
||||||
|
.st0{fill:#FFFFFF;}
|
||||||
|
</style>
|
||||||
|
<g>
|
||||||
|
<g>
|
||||||
|
<rect x="0.3" width="440" height="440"/>
|
||||||
|
</g>
|
||||||
|
<g>
|
||||||
|
<rect x="61.5" y="255.3" class="st0" width="30.4" height="28.3"/>
|
||||||
|
<path class="st0" d="M159.7,103.8c-28.5,0-51.7,23.2-51.7,51.7V284h30.4v-60.5h28.6v-30.4h-28.6v-37.5c0-11.8,9.6-21.4,21.4-21.4
|
||||||
|
c11.5,0,20.8,9.1,21.3,20.4h30.4C210.9,126.5,187.9,103.8,159.7,103.8z"/>
|
||||||
|
<rect x="302.3" y="126.3" class="st0" width="30.4" height="28.3"/>
|
||||||
|
<polygon class="st0" points="302.4,176.1 302.2,284 332.6,284 332.8,176.1 "/>
|
||||||
|
<path class="st0" d="M284.5,208.4l0-15.5l0-1l0-15.8h-30.4l-0.1,33.8c-0.8,11.1-10.1,19.9-21.3,19.9c-11.8,0-21.4-9.6-21.4-21.4
|
||||||
|
v-32.3H181v32.3c0,28.5,23.2,51.7,51.7,51.7c6.9,0,13.6-1.3,19.9-4l1.3-0.6l0,23.1h0.2v5.8c0,11.8-9.6,21.4-21.4,21.4
|
||||||
|
c-11.5,0-20.8-9.1-21.3-20.4H181c0.5,28.1,23.5,50.8,51.7,50.8c28.5,0,51.7-23.2,51.7-51.7v-3.8h-0.2l0.1-69.9
|
||||||
|
C284.4,209.9,284.5,209.1,284.5,208.4z"/>
|
||||||
|
</g>
|
||||||
|
</g>
|
||||||
|
</svg>
|
||||||
|
After Width: | Height: | Size: 1.3 KiB |
|
|
@ -9,3 +9,9 @@ interface ProximitySensor : Sensor {
|
||||||
readonly attribute double? max;
|
readonly attribute double? max;
|
||||||
readonly attribute boolean? near;
|
readonly attribute boolean? near;
|
||||||
};
|
};
|
||||||
|
|
||||||
|
dictionary ProximityReadingValues {
|
||||||
|
required double? distance;
|
||||||
|
required double? max;
|
||||||
|
required boolean? near;
|
||||||
|
};
|
||||||
|
|
|
||||||
|
|
@ -801,3 +801,5 @@ CSS-COLLIDING-REF-NAME: css/vendor-imports/mozilla/mozilla-central-reftests/cont
|
||||||
# Signed Exchange files have hard-coded URLs in the certUrl field
|
# Signed Exchange files have hard-coded URLs in the certUrl field
|
||||||
WEB-PLATFORM.TEST:signed-exchange/resources/*.sxg
|
WEB-PLATFORM.TEST:signed-exchange/resources/*.sxg
|
||||||
WEB-PLATFORM.TEST:signed-exchange/resources/generate-test-sxgs.sh
|
WEB-PLATFORM.TEST:signed-exchange/resources/generate-test-sxgs.sh
|
||||||
|
|
||||||
|
WEB-PLATFORM.TEST: workers/Worker-location.any.js
|
||||||
|
|
@ -287,7 +287,19 @@ promise_test(t => {
|
||||||
assert_equals(typeof ability.smooth, "boolean");
|
assert_equals(typeof ability.smooth, "boolean");
|
||||||
assert_equals(typeof ability.powerEfficient, "boolean");
|
assert_equals(typeof ability.powerEfficient, "boolean");
|
||||||
});
|
});
|
||||||
}, "Test that encodingInfo returns a valid MediaCapabilitiesInfo objects");
|
}, "Test that encodingInfo returns a valid MediaCapabilitiesInfo objects for record type");
|
||||||
|
|
||||||
|
promise_test(t => {
|
||||||
|
return navigator.mediaCapabilities.encodingInfo({
|
||||||
|
type: 'transmission',
|
||||||
|
video: minimalVideoConfiguration,
|
||||||
|
audio: minimalAudioConfiguration,
|
||||||
|
}).then(ability => {
|
||||||
|
assert_equals(typeof ability.supported, "boolean");
|
||||||
|
assert_equals(typeof ability.smooth, "boolean");
|
||||||
|
assert_equals(typeof ability.powerEfficient, "boolean");
|
||||||
|
});
|
||||||
|
}, "Test that encodingInfo returns a valid MediaCapabilitiesInfo objects for transmission type");
|
||||||
|
|
||||||
async_test(t => {
|
async_test(t => {
|
||||||
var validTypes = [ 'record', 'transmission' ];
|
var validTypes = [ 'record', 'transmission' ];
|
||||||
|
|
|
||||||
|
|
@ -27,7 +27,7 @@
|
||||||
function end_of_interaction() {
|
function end_of_interaction() {
|
||||||
test(function () {
|
test(function () {
|
||||||
assert_equals(event_log.join(", "),
|
assert_equals(event_log.join(", "),
|
||||||
"mousedown@target1, mouseup@target1");
|
"click@target0, mousedown@target1, mouseup@target1, click@target1");
|
||||||
}, "Event log");
|
}, "Event log");
|
||||||
|
|
||||||
test_pointerEvent.done(); // complete test
|
test_pointerEvent.done(); // complete test
|
||||||
|
|
@ -38,7 +38,7 @@
|
||||||
|
|
||||||
var target_list = ["target0", "target1"];
|
var target_list = ["target0", "target1"];
|
||||||
var pointer_event_list = ["pointerdown"];
|
var pointer_event_list = ["pointerdown"];
|
||||||
var mouse_event_list = ["mousedown", "mouseup"];
|
var mouse_event_list = ["mousedown", "mouseup", "click"];
|
||||||
|
|
||||||
target_list.forEach(function(targetId) {
|
target_list.forEach(function(targetId) {
|
||||||
var target = document.getElementById(targetId);
|
var target = document.getElementById(targetId);
|
||||||
|
|
@ -95,7 +95,7 @@
|
||||||
<body onload="run()">
|
<body onload="run()">
|
||||||
<h1>Pointer Event: Suppress compatibility mouse events on click</h1>
|
<h1>Pointer Event: Suppress compatibility mouse events on click</h1>
|
||||||
<h4>
|
<h4>
|
||||||
When a pointerdown is canceled, a click/tap shouldn't fire any compatibility mouse events.
|
When a pointerdown is canceled, a click/tap shouldn't fire any compatibility mouse events except click event.
|
||||||
</h4>
|
</h4>
|
||||||
<ol>
|
<ol>
|
||||||
<li> Click or tap on Target0.</li>
|
<li> Click or tap on Target0.</li>
|
||||||
|
|
|
||||||
|
|
@ -417,7 +417,7 @@ class MarionetteCoverageProtocolPart(CoverageProtocolPart):
|
||||||
return
|
return
|
||||||
|
|
||||||
script = """
|
script = """
|
||||||
ChromeUtils.import("chrome://marionette/content/PerTestCoverageUtils.jsm");
|
const {PerTestCoverageUtils} = ChromeUtils.import("resource://reftest/PerTestCoverageUtils.jsm");
|
||||||
return PerTestCoverageUtils.enabled;
|
return PerTestCoverageUtils.enabled;
|
||||||
"""
|
"""
|
||||||
with self.marionette.using_context(self.marionette.CONTEXT_CHROME):
|
with self.marionette.using_context(self.marionette.CONTEXT_CHROME):
|
||||||
|
|
@ -427,7 +427,7 @@ class MarionetteCoverageProtocolPart(CoverageProtocolPart):
|
||||||
script = """
|
script = """
|
||||||
var callback = arguments[arguments.length - 1];
|
var callback = arguments[arguments.length - 1];
|
||||||
|
|
||||||
ChromeUtils.import("chrome://marionette/content/PerTestCoverageUtils.jsm");
|
const {PerTestCoverageUtils} = ChromeUtils.import("resource://reftest/PerTestCoverageUtils.jsm");
|
||||||
PerTestCoverageUtils.beforeTest().then(callback, callback);
|
PerTestCoverageUtils.beforeTest().then(callback, callback);
|
||||||
"""
|
"""
|
||||||
with self.marionette.using_context(self.marionette.CONTEXT_CHROME):
|
with self.marionette.using_context(self.marionette.CONTEXT_CHROME):
|
||||||
|
|
@ -447,7 +447,7 @@ class MarionetteCoverageProtocolPart(CoverageProtocolPart):
|
||||||
script = """
|
script = """
|
||||||
var callback = arguments[arguments.length - 1];
|
var callback = arguments[arguments.length - 1];
|
||||||
|
|
||||||
ChromeUtils.import("chrome://marionette/content/PerTestCoverageUtils.jsm");
|
const {PerTestCoverageUtils} = ChromeUtils.import("resource://reftest/PerTestCoverageUtils.jsm");
|
||||||
PerTestCoverageUtils.afterTest().then(callback, callback);
|
PerTestCoverageUtils.afterTest().then(callback, callback);
|
||||||
"""
|
"""
|
||||||
with self.marionette.using_context(self.marionette.CONTEXT_CHROME):
|
with self.marionette.using_context(self.marionette.CONTEXT_CHROME):
|
||||||
|
|
|
||||||
|
|
@ -0,0 +1,6 @@
|
||||||
|
// META: global=!default,sharedworker
|
||||||
|
const t = async_test("Make sure that MessageEvent.source is properly set in connect event.");
|
||||||
|
onconnect = t.step_func_done((event) => {
|
||||||
|
assert_equals(event.__proto__, MessageEvent.prototype);
|
||||||
|
assert_equals(event.source, event.ports[0]);
|
||||||
|
});
|
||||||
|
|
@ -0,0 +1,60 @@
|
||||||
|
<!DOCTYPE html>
|
||||||
|
<title>Test SharedWorker constructor functionality.</title>
|
||||||
|
<script src="/resources/testharness.js"></script>
|
||||||
|
<script src="/resources/testharnessreport.js"></script>
|
||||||
|
<script>
|
||||||
|
|
||||||
|
test(() => {
|
||||||
|
assert_throws(new Error(),
|
||||||
|
function() {
|
||||||
|
new SharedWorker({toString:function(){throw new Error()}}, "name") },
|
||||||
|
"toString exception not propagagted");
|
||||||
|
}, "Test toString exception propagated correctly.");
|
||||||
|
|
||||||
|
test(() => {
|
||||||
|
assert_throws(new RangeError(),
|
||||||
|
function() {
|
||||||
|
var foo = {toString:function(){new Worker(foo)}}
|
||||||
|
new SharedWorker(foo, name); },
|
||||||
|
"Trying to create workers recursively did not result in an exception.");
|
||||||
|
}, "Test recursive worker creation results in exception.");
|
||||||
|
|
||||||
|
test(() => {
|
||||||
|
assert_throws(new TypeError(),
|
||||||
|
function() { new SharedWorker(); },
|
||||||
|
"Invoking SharedWorker constructor without arguments did not result in an exception.");
|
||||||
|
}, "Test SharedWorker creation without arguments results in exception.");
|
||||||
|
|
||||||
|
test(() => {
|
||||||
|
try {
|
||||||
|
var worker = new SharedWorker("support/SharedWorker-common.js");
|
||||||
|
} catch (ex) {
|
||||||
|
assert_unreached("Constructor failed when no name is passed: (" + ex + ")");
|
||||||
|
}
|
||||||
|
}, "Test SharedWorker constructor without a name does not result in an exception.");
|
||||||
|
|
||||||
|
test(() => {
|
||||||
|
try {
|
||||||
|
var worker = new SharedWorker("support/SharedWorker-common.js", null);
|
||||||
|
} catch (ex) {
|
||||||
|
assert_unreached("Constructor failed when null name is passed: (" + ex + ")");
|
||||||
|
}
|
||||||
|
}, "Test SharedWorker constructor with null name does not result in an exception.");
|
||||||
|
|
||||||
|
test(() => {
|
||||||
|
try {
|
||||||
|
var worker = new SharedWorker("support/SharedWorker-common.js", undefined);
|
||||||
|
} catch (ex) {
|
||||||
|
assert_unreached("Constructor failed when undefined name is passed: (" + ex + ")");
|
||||||
|
}
|
||||||
|
}, "Test SharedWorker constructor with undefined name does not result in an exception.");
|
||||||
|
|
||||||
|
test(() => {
|
||||||
|
try {
|
||||||
|
var worker = new SharedWorker("support/SharedWorker-common.js", "name");
|
||||||
|
} catch (ex) {
|
||||||
|
assert_unreached("Invoking SharedWorker constructor resulted in an exception: (" + ex + ")");
|
||||||
|
}
|
||||||
|
}, "Test SharedWorker constructor suceeds.");
|
||||||
|
|
||||||
|
</script>
|
||||||
|
|
@ -0,0 +1,33 @@
|
||||||
|
<!DOCTYPE html>
|
||||||
|
<title>Uncaught error in shared worker should not propagate to window</title>
|
||||||
|
<link rel="help" href="https://html.spec.whatwg.org/multipage/workers.html#runtime-script-errors-2">
|
||||||
|
<script src="/resources/testharness.js"></script>
|
||||||
|
<script src="/resources/testharnessreport.js"></script>
|
||||||
|
<script src="support/SharedWorker-create-common.js"></script>
|
||||||
|
<script>
|
||||||
|
// Suppress the default handling of the error event so that a failure
|
||||||
|
// manifests as a failed test and not a harness error.
|
||||||
|
setup({ allow_uncaught_exception: true });
|
||||||
|
|
||||||
|
async_test(function(t) {
|
||||||
|
addEventListener("error", t.unreached_func("error event fired"));
|
||||||
|
var worker = createWorker();
|
||||||
|
worker.postMessage("throw");
|
||||||
|
worker.postMessage("ping");
|
||||||
|
var pongs = 0;
|
||||||
|
worker.onmessage = function(evt) {
|
||||||
|
// Wait for response from ping - that's how we know we have thrown the exception.
|
||||||
|
if (evt.data == "PASS: Received ping message") {
|
||||||
|
pongs++;
|
||||||
|
if (pongs == 1) {
|
||||||
|
// Send another "ping" message and wait for the response before
|
||||||
|
// ending the test, so that any error propagation that is now
|
||||||
|
// in flight will have finished.
|
||||||
|
worker.postMessage("ping");
|
||||||
|
} else {
|
||||||
|
t.done();
|
||||||
|
}
|
||||||
|
}
|
||||||
|
};
|
||||||
|
});
|
||||||
|
</script>
|
||||||
|
|
@ -0,0 +1,22 @@
|
||||||
|
<!DOCTYPE html>
|
||||||
|
<title>This test checks whether exceptions in SharedWorkers are logged to the parent document. An exception should be logged to the error console.</title>
|
||||||
|
<script src="/resources/testharness.js"></script>
|
||||||
|
<script src="/resources/testharnessreport.js"></script>
|
||||||
|
<script src="support/SharedWorker-create-common.js"></script>
|
||||||
|
<script>
|
||||||
|
// Ignore any error event fired on window in this test. This is tested
|
||||||
|
// separately in SharedWorker-exception-propagation.html.
|
||||||
|
setup({ allow_uncaught_exception: true });
|
||||||
|
|
||||||
|
async_test(function(t) {
|
||||||
|
var worker = createWorker();
|
||||||
|
worker.postMessage("throw");
|
||||||
|
worker.postMessage("ping");
|
||||||
|
worker.onmessage = function(evt) {
|
||||||
|
// Wait for response from ping - that's how we know we have thrown the exception.
|
||||||
|
if (evt.data == "PASS: Received ping message") {
|
||||||
|
t.done();
|
||||||
|
}
|
||||||
|
};
|
||||||
|
});
|
||||||
|
</script>
|
||||||
|
|
@ -0,0 +1,15 @@
|
||||||
|
// META: global=!default,sharedworker
|
||||||
|
// https://crbug.com/239669
|
||||||
|
const t = async_test("Tests that repeatedly setting 'onerror' within a shared worker doesnt crash.");
|
||||||
|
onconnect = t.step_func_done((event) => {
|
||||||
|
function update() {
|
||||||
|
onerror = undefined;
|
||||||
|
}
|
||||||
|
try {
|
||||||
|
for (var i = 0; i < 8; ++i) {
|
||||||
|
update();
|
||||||
|
}
|
||||||
|
} catch (ex) {
|
||||||
|
assert_unreached("FAIL: unexpected exception (" + ex + ") received while updating onerror event handler.");
|
||||||
|
}
|
||||||
|
});
|
||||||
|
|
@ -0,0 +1,37 @@
|
||||||
|
<!DOCTYPE html>
|
||||||
|
<title>Test SharedWorker script error handling functionality.</title>
|
||||||
|
<script src="/resources/testharness.js"></script>
|
||||||
|
<script src="/resources/testharnessreport.js"></script>
|
||||||
|
<script>
|
||||||
|
promise_test(t => {
|
||||||
|
let worker;
|
||||||
|
|
||||||
|
return new Promise((resolve) => {
|
||||||
|
worker = new SharedWorker("support/SharedWorker-script-error.js");
|
||||||
|
// Shared workers should only invoke onerror for loading errors.
|
||||||
|
worker.onerror = function(evt) {
|
||||||
|
assert_unreached("FAIL: onerror invoked for a script error.");
|
||||||
|
};
|
||||||
|
worker.port.postMessage("unhandledError");
|
||||||
|
worker.port.onmessage = resolve;
|
||||||
|
}).then(e => {
|
||||||
|
assert_equals(e.data, "SUCCESS: unhandled error generated");
|
||||||
|
});
|
||||||
|
}, 'Test script error unhandled.')
|
||||||
|
|
||||||
|
promise_test(t => {
|
||||||
|
let worker;
|
||||||
|
|
||||||
|
return new Promise((resolve) => {
|
||||||
|
worker = new SharedWorker("support/SharedWorker-script-error.js");
|
||||||
|
// Shared workers should only invoke onerror for loading errors.
|
||||||
|
worker.onerror = function(evt) {
|
||||||
|
assert_unreached("FAIL: onerror invoked for a script error.");
|
||||||
|
};
|
||||||
|
worker.port.postMessage("handledError");
|
||||||
|
worker.port.onmessage = resolve;
|
||||||
|
}).then(e => {
|
||||||
|
assert_equals(e.data, "SUCCESS: error handled via onerror");
|
||||||
|
});
|
||||||
|
}, 'Test script error handled.')
|
||||||
|
</script>
|
||||||
|
|
@ -0,0 +1,17 @@
|
||||||
|
<!DOCTYPE html>
|
||||||
|
<title>Test simple shared worker construction case.</title>
|
||||||
|
<script src="/resources/testharness.js"></script>
|
||||||
|
<script src="/resources/testharnessreport.js"></script>
|
||||||
|
<script>
|
||||||
|
promise_test(t => {
|
||||||
|
let worker;
|
||||||
|
|
||||||
|
return new Promise(resolve => {
|
||||||
|
worker = new SharedWorker('support/SharedWorker-common.js', 'name');
|
||||||
|
worker.port.postMessage("ping");
|
||||||
|
worker.port.onmessage = resolve;
|
||||||
|
}).then(e => {
|
||||||
|
assert_equals(e.data, "PASS: Received ping message");
|
||||||
|
});
|
||||||
|
});
|
||||||
|
</script>
|
||||||
|
|
@ -0,0 +1,5 @@
|
||||||
|
// META: global=!default,worker
|
||||||
|
test(() => {
|
||||||
|
assert_true(typeof atob === 'function');
|
||||||
|
assert_true(typeof btoa === 'function');
|
||||||
|
}, 'Tests that atob() / btoa() functions are exposed to workers');
|
||||||
12
tests/wpt/web-platform-tests/workers/Worker-call.worker.js
Normal file
12
tests/wpt/web-platform-tests/workers/Worker-call.worker.js
Normal file
|
|
@ -0,0 +1,12 @@
|
||||||
|
importScripts("/resources/testharness.js");
|
||||||
|
test(() => {
|
||||||
|
try {
|
||||||
|
postMessage("SUCCESS: postMessage() called directly");
|
||||||
|
postMessage.call(null, "SUCCESS: postMessage() invoked via postMessage.call()");
|
||||||
|
var saved = postMessage;
|
||||||
|
saved("SUCCESS: postMessage() called via intermediate variable");
|
||||||
|
} catch (ex) {
|
||||||
|
assert_unreached("FAIL: unexpected exception (" + ex + ") received while calling functions from the worker context.");
|
||||||
|
}
|
||||||
|
}, 'Test calling functions from WorkerContext.');
|
||||||
|
done();
|
||||||
|
|
@ -0,0 +1,7 @@
|
||||||
|
//META: global=!default, worker
|
||||||
|
test(() => {
|
||||||
|
proto = new Number(42)
|
||||||
|
assert_equals(String(Object.getPrototypeOf(WorkerLocation)), "function () { [native code] }");
|
||||||
|
WorkerLocation.__proto__ = proto;
|
||||||
|
assert_object_equals(Object.getPrototypeOf(WorkerLocation), Object(42));
|
||||||
|
}, 'Tests that setting the proto of a built in constructor is not reset.');
|
||||||
14
tests/wpt/web-platform-tests/workers/Worker-location.any.js
Normal file
14
tests/wpt/web-platform-tests/workers/Worker-location.any.js
Normal file
|
|
@ -0,0 +1,14 @@
|
||||||
|
// META: global=!default, dedicatedworker, sharedworker
|
||||||
|
test(() => {
|
||||||
|
assert_equals(String(WorkerLocation), "function WorkerLocation() { [native code] }");
|
||||||
|
assert_true(location instanceof Object);
|
||||||
|
assert_equals(location.href, "http://web-platform.test:8001/workers/Worker-location.any.worker.js")
|
||||||
|
assert_equals(location.origin, "http://web-platform.test:8001");
|
||||||
|
assert_equals(location.protocol, "http:");
|
||||||
|
assert_equals(location.host, "web-platform.test:8001");
|
||||||
|
assert_equals(location.hostname, "web-platform.test");
|
||||||
|
assert_equals(location.port, "8001");
|
||||||
|
assert_equals(location.pathname, "/workers/Worker-location.any.worker.js");
|
||||||
|
assert_equals(location.search, "");
|
||||||
|
assert_equals(location.hash, "");
|
||||||
|
}, 'Test WorkerLocation properties.');
|
||||||
|
|
@ -0,0 +1,9 @@
|
||||||
|
// META: global=!default,worker
|
||||||
|
test(() => {
|
||||||
|
try {
|
||||||
|
self.MessageEvent = 'PASS';
|
||||||
|
assert_equals(self.MessageEvent, 'PASS');
|
||||||
|
} catch (ex) {
|
||||||
|
assert_unreached("FAIL: unexpected exception (" + ex + ") received while replacing global constructor MessageEvent.");
|
||||||
|
}
|
||||||
|
}, 'Test replacing global constructors in a worker context.');
|
||||||
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