mirror of
https://github.com/servo/servo.git
synced 2025-08-28 16:48:22 +01:00
Update web-platform-tests to revision 2b7dace05fc1869398ee24f84fda4c0e4c0455ae
This commit is contained in:
parent
b23125d590
commit
6c901de216
844 changed files with 19802 additions and 3093 deletions
|
@ -5,6 +5,5 @@ suggested_reviewers:
|
|||
- foolip
|
||||
- jdm
|
||||
- jgraham
|
||||
- sideshowbarker
|
||||
- zcorpan
|
||||
- zqzhang
|
||||
|
|
|
@ -1,29 +0,0 @@
|
|||
<!DOCTYPE html>
|
||||
<html>
|
||||
<head>
|
||||
<meta charset="utf-8" />
|
||||
<title>inert does not match :disabled selector</title>
|
||||
<link rel="author" title="Alice Boxhall" href="aboxhall@chromium.org">
|
||||
<script src="/resources/testharness.js"></script>
|
||||
<script src="/resources/testharnessreport.js"></script>
|
||||
<style>
|
||||
button {
|
||||
color: green;
|
||||
}
|
||||
|
||||
button:disabled {
|
||||
color: red;
|
||||
}
|
||||
</style>
|
||||
</head>
|
||||
<body>
|
||||
<button inert>The test passes if this is in green.</button>
|
||||
<script>
|
||||
test(function() {
|
||||
button = document.querySelector('button');
|
||||
var color = document.defaultView.getComputedStyle(button).getPropertyValue('color');
|
||||
assert_equals(color, 'rgb(0, 128, 0)');
|
||||
}, 'Tests that inert elements do not match the :disabled selector.');
|
||||
</script>
|
||||
</body>
|
||||
</html>
|
|
@ -1,43 +0,0 @@
|
|||
<!DOCTYPE html>
|
||||
<html>
|
||||
<head>
|
||||
<meta charset="utf-8" />
|
||||
<title>inert inside ShadowRoot affects slotted content</title>
|
||||
<link rel="author" title="Alice Boxhall" href="aboxhall@chromium.org">
|
||||
<script src="/resources/testharness.js"></script>
|
||||
<script src="/resources/testharnessreport.js"></script>
|
||||
</head>
|
||||
<body>
|
||||
<div>Button 1 should be inert, and Button 2 should not be inert.</div>
|
||||
<div id="shadow-host">
|
||||
<button slot="slot-1" id="button-1">Button 1 (inert)</button>
|
||||
<button slot="slot-2" id="button-2">Button 2 (not inert)</button>
|
||||
</div>
|
||||
<script>
|
||||
const shadowHost = document.getElementById("shadow-host");
|
||||
const shadowRoot = shadowHost.attachShadow({ mode: "open" });
|
||||
const inertDiv = document.createElement("div");
|
||||
inertDiv.inert = true;
|
||||
shadowRoot.appendChild(inertDiv);
|
||||
const slot1 = document.createElement("slot");
|
||||
slot1.name = "slot-1";
|
||||
inertDiv.appendChild(slot1);
|
||||
const slot2 = document.createElement("slot");
|
||||
slot2.name = "slot-2";
|
||||
shadowRoot.appendChild(slot2);
|
||||
|
||||
function testCanFocus(selector, canFocus) {
|
||||
const element = document.querySelector(selector);
|
||||
let focusedElement = null;
|
||||
element.addEventListener("focus", function() { focusedElement = element; }, false);
|
||||
element.focus();
|
||||
assert_equals((focusedElement === element), canFocus);
|
||||
}
|
||||
|
||||
test(() => {
|
||||
testCanFocus("#button-1", false);
|
||||
testCanFocus("#button-2", true);
|
||||
}, "inert inside ShadowRoot affects slotted content");
|
||||
</script>
|
||||
</body>
|
||||
</html>
|
|
@ -1,55 +0,0 @@
|
|||
<!DOCTYPE html>
|
||||
<html>
|
||||
<head>
|
||||
<meta charset="utf-8" />
|
||||
<title>inert inlines</title>
|
||||
<link rel="author" title="Alice Boxhall" href="aboxhall@chromium.org">
|
||||
<script src="/resources/testharness.js"></script>
|
||||
<script src="/resources/testharnessreport.js"></script>
|
||||
<script src="/resources/testdriver.js"></script>
|
||||
<script src="/resources/testdriver-vendor.js"></script>
|
||||
</head>
|
||||
<body>
|
||||
<a inert id="a" href="javascript:void(0)">Click me</a>
|
||||
<button inert id="button">Click me</button>
|
||||
<div inert id="div" style="background-color: blue; width: 50px; height: 50px">Click me</div>
|
||||
<span inert id="span">Click me</span>
|
||||
<script>
|
||||
function eventFiredOnInertElement(e) {
|
||||
e.target.style.background = 'red';
|
||||
inertElementFiredOn = true;
|
||||
}
|
||||
|
||||
inertElements = ['a', 'button', 'div', 'span']
|
||||
inertElements.forEach(function(id) {
|
||||
element = document.getElementById(id);
|
||||
element.addEventListener('click', eventFiredOnInertElement);
|
||||
element.addEventListener('mousemove', eventFiredOnInertElement);
|
||||
});
|
||||
|
||||
document.addEventListener('click', function(e) {
|
||||
document.firedOn = true;
|
||||
});
|
||||
|
||||
promise_test(async () => {
|
||||
for (let id of inertElements) {
|
||||
var element = document.getElementById(id);
|
||||
inertElementFiredOn = false;
|
||||
document.firedOn = false;
|
||||
try {
|
||||
await test_driver.click(element);
|
||||
assert_false(inertElementFiredOn, 'no event should be fired on ' + id);
|
||||
assert_true(document.firedOn, 'event should be fired on document instead of ' + id);
|
||||
} catch (e) {
|
||||
// test driver detects inert elements as unclickable
|
||||
// and throws an error
|
||||
assert_false(inertElementFiredOn, 'no event should be fired on ' + id);
|
||||
}
|
||||
}
|
||||
}, 'Tests that inert inlines do not receive mouse events. ' +
|
||||
'To test manually, click on all the "Click me"s. The test ' +
|
||||
'fails if you see red.');
|
||||
|
||||
</script>
|
||||
</body>
|
||||
</html>
|
|
@ -1,53 +0,0 @@
|
|||
<!DOCTYPE html>
|
||||
<html>
|
||||
<head>
|
||||
<meta charset="utf-8" />
|
||||
<title>inert with label/for</title>
|
||||
<link rel="author" title="Alice Boxhall" href="aboxhall@chromium.org">
|
||||
<script src="/resources/testharness.js"></script>
|
||||
<script src="/resources/testharnessreport.js"></script>
|
||||
<script src="/resources/testdriver.js"></script>
|
||||
<script src="/resources/testdriver-vendor.js"></script>
|
||||
</head>
|
||||
<body>
|
||||
<label inert id="for-submit" for="submit">Label for Submit</label>
|
||||
<input id="text" type="text">
|
||||
<input id="submit" type="submit">
|
||||
|
||||
<label id="for-input-in-inert-subtree"
|
||||
for="input-in-inert-subtree">Label for input in inert subtree</label>
|
||||
<div inert>
|
||||
<input id="input-in-inert-subtree"></input>
|
||||
</div>
|
||||
|
||||
<script>
|
||||
test(() => {
|
||||
label = document.querySelector('#for-submit');
|
||||
label.focus();
|
||||
assert_equals(document.activeElement, document.querySelector('#submit'));
|
||||
}, 'Calling focus() on an inert label should still send focus to its target.');
|
||||
|
||||
promise_test(async () => {
|
||||
text = document.querySelector('#text');
|
||||
text.focus();
|
||||
label = document.querySelector('#for-submit');
|
||||
try {
|
||||
await test_driver.click(label);
|
||||
assert_equals(document.activeElement, document.body);
|
||||
} catch (e) {
|
||||
// test driver detects inert elements as unclickable
|
||||
// and throws an error
|
||||
}
|
||||
}, 'Clicking on an inert label should send focus to document.body.');
|
||||
|
||||
test(() => {
|
||||
text = document.querySelector('#text');
|
||||
text.focus();
|
||||
|
||||
label = document.querySelector('#for-input-in-inert-subtree');
|
||||
label.focus();
|
||||
assert_equals(document.activeElement, text);
|
||||
}, 'Calling focus() on a label for a control which is in an inert subtree ' +
|
||||
'should have no effect.');
|
||||
</script>
|
||||
</html>
|
|
@ -1,45 +0,0 @@
|
|||
<!DOCTYPE html>
|
||||
<html>
|
||||
<head>
|
||||
<meta charset="utf-8" />
|
||||
<title>inert nodes are uneditable</title>
|
||||
<link rel="author" title="Alice Boxhall" href="aboxhall@chromium.org">
|
||||
<script src="/resources/testharness.js"></script>
|
||||
<script src="/resources/testharnessreport.js"></script>
|
||||
</head>
|
||||
<body>
|
||||
<span inert id="not-editable" contenteditable>I'm not editable.</span>
|
||||
<span id="editable" contenteditable>I'm editable.</span>
|
||||
<script>
|
||||
var notEditable = document.querySelector('#not-editable');
|
||||
var editable = document.querySelector('#editable');
|
||||
|
||||
promise_test(async () => {
|
||||
notEditable.focus();
|
||||
var oldValue = notEditable.textContent;
|
||||
assert_equals(oldValue, "I'm not editable.");
|
||||
try {
|
||||
test_driver.keyDown('a');
|
||||
assert_equals(notEditable.textContent, oldValue);
|
||||
} catch (e) {
|
||||
// TODO(crbug.com/828858): Remove this check once bug is resolved.
|
||||
assert_true(false, "send_keys not implemented yet");
|
||||
}
|
||||
}, "Can't edit inert contenteditable");
|
||||
|
||||
test(() => {
|
||||
editable.focus();
|
||||
var oldValue = editable.textContent;
|
||||
assert_equals(oldValue, "I'm editable.");
|
||||
try {
|
||||
test_driver.keyDown('a');
|
||||
assert_not_equals(editable.textContent, oldValue);
|
||||
} catch (e) {
|
||||
// TODO(crbug.com/828858): Remove this check once bug is resolved.
|
||||
assert_true(false, "send_keys not implemented yet");
|
||||
}
|
||||
}, "Can edit non-inert contenteditable");
|
||||
|
||||
</script>
|
||||
</body>
|
||||
</html>
|
|
@ -1,79 +0,0 @@
|
|||
<!DOCTYPE html>
|
||||
<html>
|
||||
<head>
|
||||
<meta charset="utf-8" />
|
||||
<title>inert nodes are unfocusable</title>
|
||||
<link rel="author" title="Alice Boxhall" href="aboxhall@chromium.org">
|
||||
<script src="/resources/testharness.js"></script>
|
||||
<script src="/resources/testharnessreport.js"></script>
|
||||
</head>
|
||||
<body id="body" tabindex="1">
|
||||
<button id="focusable">Outside of inert container</button>
|
||||
<button inert id="inert">Inert button</button>
|
||||
<div inert id="container">
|
||||
<input id="text" type="text">
|
||||
<input id="datetime" type="datetime">
|
||||
<input id="color" type="color">
|
||||
<select id="select">
|
||||
<optgroup id="optgroup">
|
||||
<option id="option">Option</option>
|
||||
</optgroup>
|
||||
</select>
|
||||
<div id="contenteditable-div" contenteditable>I'm editable</div>
|
||||
<span id="tabindex-span" tabindex="0">I'm tabindexed.</div>
|
||||
<embed id="embed" type="application/x-blink-test-plugin" width=100 height=100></embed>
|
||||
<a id="anchor" href="">Link</a>
|
||||
</div>
|
||||
<script>
|
||||
function testFocus(element, expectFocus) {
|
||||
focusedElement = null;
|
||||
element.addEventListener('focus', function() { focusedElement = element; }, false);
|
||||
element.focus();
|
||||
theElement = element;
|
||||
assert_equals(focusedElement === theElement, expectFocus);
|
||||
}
|
||||
|
||||
function testTree(element, expectFocus, excludeCurrent) {
|
||||
if (element.nodeType == Node.ELEMENT_NODE && !excludeCurrent)
|
||||
testFocus(element, expectFocus);
|
||||
if (element.tagName === "SELECT")
|
||||
return;
|
||||
var childNodes = element.childNodes;
|
||||
for (var i = 0; i < childNodes.length; i++)
|
||||
testTree(childNodes[i], expectFocus);
|
||||
}
|
||||
|
||||
|
||||
test(function() {
|
||||
testFocus(document.getElementById('focusable'), true);
|
||||
}, "Button outside of inert container is focusable.");
|
||||
|
||||
test(function() {
|
||||
testFocus(document.getElementById('inert'), false);
|
||||
}, "Button with inert atribute is unfocusable.");
|
||||
|
||||
test(function() {
|
||||
testTree(document.getElementById('container'), false);
|
||||
}, "All focusable elements inside inert subtree are unfocusable");
|
||||
|
||||
test(function() {
|
||||
assert_false(document.getElementById("focusable").inert, "Inert not set explicitly is false")
|
||||
assert_true(document.getElementById("inert").inert, "Inert set explicitly is true");
|
||||
assert_true(document.getElementById("container").inert, "Inert set on container is true");
|
||||
}, "Can get inert via property");
|
||||
|
||||
test(function() {
|
||||
assert_false(document.getElementById("text").inert, "Elements inside of inert subtrees return false when getting inert");
|
||||
}, "Elements inside of inert subtrees return false when getting 'inert'");
|
||||
|
||||
test(function() {
|
||||
document.getElementById('focusable').inert = true;
|
||||
testFocus(document.getElementById('focusable'), false);
|
||||
document.getElementById('inert').inert = false;
|
||||
testFocus(document.getElementById('inert'), true);
|
||||
document.getElementById('container').inert = false;
|
||||
testTree(document.getElementById('container'), true, true);
|
||||
}, "Setting inert via property correctly modifies inert state");
|
||||
</script>
|
||||
</body>
|
||||
</html>
|
|
@ -1,20 +0,0 @@
|
|||
<!DOCTYPE html>
|
||||
<html>
|
||||
<head>
|
||||
<meta charset="utf-8" />
|
||||
<title>inert nodes are unselectable</title>
|
||||
<link rel="author" title="Alice Boxhall" href="aboxhall@chromium.org">
|
||||
<script src="/resources/testharness.js"></script>
|
||||
<script src="/resources/testharnessreport.js"></script>
|
||||
</head>
|
||||
<body>
|
||||
<div inert>Here is a text node you can't select.</div>
|
||||
<div>I'm selectable.</div>
|
||||
<script>
|
||||
test(function() {
|
||||
document.execCommand('SelectAll');
|
||||
assert_equals(window.getSelection().toString(), "I'm selectable.");
|
||||
}, "Inert nodes cannot be selected.");
|
||||
</script>
|
||||
</body>
|
||||
</html>
|
|
@ -1,16 +1,17 @@
|
|||
let state = "send-sw-failure"
|
||||
onconnect = initialE => {
|
||||
initialE.source.postMessage(state)
|
||||
initialE.source.onmessage = e => {
|
||||
let port = initialE.source;
|
||||
port.postMessage(state)
|
||||
port.onmessage = e => {
|
||||
if(state === "" && e.data === "send-window-failure") {
|
||||
e.postMessage(new SharedArrayBuffer())
|
||||
port.postMessage(new SharedArrayBuffer())
|
||||
} else {
|
||||
e.postMessage("failure")
|
||||
port.postMessage("failure")
|
||||
}
|
||||
}
|
||||
initialE.source.onmessageerror = e => {
|
||||
port.onmessageerror = e => {
|
||||
if(state === "send-sw-failure") {
|
||||
e.postMessage("send-sw-failure-success")
|
||||
port.postMessage("send-sw-failure-success")
|
||||
state = ""
|
||||
}
|
||||
}
|
||||
|
|
|
@ -0,0 +1,4 @@
|
|||
suggested_reviewers:
|
||||
- emilio
|
||||
- mstensho
|
||||
- zcorpan
|
|
@ -0,0 +1,14 @@
|
|||
<!doctype html>
|
||||
<title>fieldset, border-radius and hit testing</title>
|
||||
<script src=/resources/testharness.js></script>
|
||||
<script src=/resources/testharnessreport.js></script>
|
||||
<style>
|
||||
fieldset { width: 80px; height: 80px; border-radius: 100px; border: 10px solid; background: lime; }
|
||||
</style>
|
||||
<fieldset>
|
||||
</fieldset>
|
||||
<script>
|
||||
test(() => {
|
||||
assert_equals(document.elementFromPoint(20, 20), document.body);
|
||||
});
|
||||
</script>
|
|
@ -11,9 +11,13 @@
|
|||
border: none
|
||||
}
|
||||
#test-inline, #ref-inline { display: inline-flex }
|
||||
legend {
|
||||
float: left; /* Makes it not the "rendered legend" */
|
||||
padding: 0;
|
||||
}
|
||||
</style>
|
||||
<fieldset id=test>
|
||||
<div>1</div>
|
||||
<legend>1</legend>
|
||||
<div>2</div>
|
||||
<div>3</div>
|
||||
<div>4</div>
|
||||
|
@ -25,7 +29,7 @@
|
|||
</fieldset>
|
||||
<hr>
|
||||
<div id=ref>
|
||||
<div>1</div>
|
||||
<legend>1</legend>
|
||||
<div>2</div>
|
||||
<div>3</div>
|
||||
<div>4</div>
|
||||
|
@ -37,7 +41,7 @@
|
|||
</div>
|
||||
<hr>
|
||||
<fieldset id=test-inline>
|
||||
<div>1</div>
|
||||
<legend>1</legend>
|
||||
<div>2</div>
|
||||
<div>3</div>
|
||||
<div>4</div>
|
||||
|
@ -60,12 +64,21 @@
|
|||
</div>
|
||||
<script>
|
||||
test(() => {
|
||||
assert_equals(getComputedStyle(document.getElementById('test')).height,
|
||||
getComputedStyle(document.getElementById('ref')).height);
|
||||
const testElm = document.getElementById('test');
|
||||
const refElm = document.getElementById('ref');
|
||||
assert_equals(getComputedStyle(testElm).height,
|
||||
getComputedStyle(refElm).height, 'height');
|
||||
assert_equals(testElm.querySelector('legend').offsetTop,
|
||||
testElm.querySelector('div').offsetTop, 'offsetTop')
|
||||
}, "Flex");
|
||||
|
||||
test(() => {
|
||||
assert_equals(getComputedStyle(document.getElementById('test-inline')).height,
|
||||
getComputedStyle(document.getElementById('ref-inline')).height);
|
||||
const testElm = document.getElementById('test-inline');
|
||||
const refElm = document.getElementById('ref-inline');
|
||||
assert_equals(getComputedStyle(testElm).height,
|
||||
getComputedStyle(refElm).height, 'height');
|
||||
assert_equals(testElm.querySelector('legend').offsetTop,
|
||||
testElm.querySelector('div').offsetTop, 'offsetTop')
|
||||
|
||||
}, "Inline flex");
|
||||
</script>
|
|
@ -12,9 +12,13 @@
|
|||
border: none
|
||||
}
|
||||
#test-inline, #ref-inline { display: inline-grid }
|
||||
legend {
|
||||
float: left; /* Makes it not the "rendered legend" */
|
||||
padding: 0;
|
||||
}
|
||||
</style>
|
||||
<fieldset id=test>
|
||||
<div>1</div>
|
||||
<legend>1</legend>
|
||||
<div>2</div>
|
||||
<div>3</div>
|
||||
<div>4</div>
|
||||
|
@ -38,7 +42,7 @@
|
|||
</div>
|
||||
<hr>
|
||||
<fieldset id=test-inline>
|
||||
<div>1</div>
|
||||
<legend>1</legend>
|
||||
<div>2</div>
|
||||
<div>3</div>
|
||||
<div>4</div>
|
||||
|
@ -61,12 +65,21 @@
|
|||
</div>
|
||||
<script>
|
||||
test(() => {
|
||||
assert_equals(getComputedStyle(document.getElementById('test')).height,
|
||||
getComputedStyle(document.getElementById('ref')).height);
|
||||
const testElm = document.getElementById('test');
|
||||
const refElm = document.getElementById('ref');
|
||||
assert_equals(getComputedStyle(testElm).height,
|
||||
getComputedStyle(refElm).height, 'height');
|
||||
assert_equals(testElm.querySelector('legend').offsetTop,
|
||||
testElm.querySelector('div').offsetTop, 'offsetTop')
|
||||
}, "Grid");
|
||||
|
||||
test(() => {
|
||||
assert_equals(getComputedStyle(document.getElementById('test-inline')).height,
|
||||
getComputedStyle(document.getElementById('ref-inline')).height);
|
||||
const testElm = document.getElementById('test-inline');
|
||||
const refElm = document.getElementById('ref-inline');
|
||||
assert_equals(getComputedStyle(testElm).height,
|
||||
getComputedStyle(refElm).height, 'height');
|
||||
assert_equals(testElm.querySelector('legend').offsetTop,
|
||||
testElm.querySelector('div').offsetTop, 'offsetTop')
|
||||
|
||||
}, "Inline grid");
|
||||
</script>
|
|
@ -0,0 +1,9 @@
|
|||
<!doctype html>
|
||||
<title>Reference for fieldset and dipslay: list-item</title>
|
||||
<style>
|
||||
fieldset { margin: 0 40px; }
|
||||
</style>
|
||||
<p>There should be no bullet points below.</p>
|
||||
<fieldset>
|
||||
<legend>X</legend>
|
||||
</fieldset>
|
|
@ -0,0 +1,10 @@
|
|||
<!doctype html>
|
||||
<title>fieldset and dipslay: list-item</title>
|
||||
<link rel=match href=fieldset-list-item-ref.html>
|
||||
<style>
|
||||
fieldset { margin: 0 40px; display: list-item; }
|
||||
</style>
|
||||
<p>There should be no bullet points below.</p>
|
||||
<fieldset>
|
||||
<legend>X</legend>
|
||||
</fieldset>
|
|
@ -0,0 +1,25 @@
|
|||
<!DOCTYPE html>
|
||||
<title>Reference for fieldset vertical</title>
|
||||
<link rel=stylesheet href=resources/fieldset-vertical.css>
|
||||
<p>vertical-lr
|
||||
<div style="writing-mode: vertical-lr">
|
||||
<div class=fieldset><div class="legend top">foo bar</div>normal</div>
|
||||
<div class="fieldset rtl"><div class="legend bottom">foo bar</div>dir=rtl</div>
|
||||
<div class="fieldset rtl"><div class="legend top">foo bar</div>dir=rtl align=left</div>
|
||||
<div class="fieldset rtl"><div class="legend center">foo bar</div>dir=rtl align=center</div>
|
||||
<div class="fieldset rtl"><div class="legend bottom">foo bar</div>dir=rtl align=right</div>
|
||||
<div class=fieldset><div class="legend top">foo bar</div>align=left</div>
|
||||
<div class=fieldset><div class="legend center">foo bar</div>align=center</div>
|
||||
<div class=fieldset><div class="legend bottom">foo bar</div>align=right</div>
|
||||
</div>
|
||||
<hr>
|
||||
<p>vertical-rl
|
||||
<div style="writing-mode: vertical-rl">
|
||||
<div class=fieldset><div class="legend top">foo bar</div>normal</div>
|
||||
<div class="fieldset rtl"><div class="legend bottom">foo bar</div>dir=rtl</div>
|
||||
<div class="fieldset rtl"><div class="legend top">foo bar</div>dir=rtl align=left</div>
|
||||
<div class="fieldset rtl"><div class="legend center">foo bar</div>dir=rtl align=center</div>
|
||||
<div class="fieldset rtl"><div class="legend bottom">foo bar</div>dir=rtl align=right</div>
|
||||
<div class=fieldset><div class="legend top">foo bar</div>align=left</div>
|
||||
<div class=fieldset><div class="legend center">foo bar</div>align=center</div>
|
||||
<div class=fieldset><div class="legend bottom">foo bar</div>align=right</div></div>
|
|
@ -0,0 +1,27 @@
|
|||
<!DOCTYPE html>
|
||||
<title>fieldset vertical</title>
|
||||
<link rel=stylesheet href=resources/fieldset-vertical.css>
|
||||
<link rel=match href=fieldset-vertical-ref.html>
|
||||
<p>vertical-lr
|
||||
<div style="writing-mode: vertical-lr">
|
||||
<fieldset><legend>foo bar</legend>normal</fieldset>
|
||||
<fieldset dir=rtl><legend>foo bar</legend>dir=rtl</fieldset>
|
||||
<fieldset dir=rtl><legend align=left>foo bar</legend>dir=rtl align=left</fieldset>
|
||||
<fieldset dir=rtl><legend align=center>foo bar</legend>dir=rtl align=center</fieldset>
|
||||
<fieldset dir=rtl><legend align=right>foo bar</legend>dir=rtl align=right</fieldset>
|
||||
<fieldset><legend align=left>foo bar</legend>align=left</fieldset>
|
||||
<fieldset><legend align=center>foo bar</legend>align=center</fieldset>
|
||||
<fieldset><legend align=right>foo bar</legend>align=right</fieldset>
|
||||
</div>
|
||||
<hr>
|
||||
<p>vertical-rl
|
||||
<div style="writing-mode: vertical-rl">
|
||||
<fieldset><legend>foo bar</legend>normal</fieldset>
|
||||
<fieldset dir=rtl><legend>foo bar</legend>dir=rtl</fieldset>
|
||||
<fieldset dir=rtl><legend align=left>foo bar</legend>dir=rtl align=left</fieldset>
|
||||
<fieldset dir=rtl><legend align=center>foo bar</legend>dir=rtl align=center</fieldset>
|
||||
<fieldset dir=rtl><legend align=right>foo bar</legend>dir=rtl align=right</fieldset>
|
||||
<fieldset><legend align=left>foo bar</legend>align=left</fieldset>
|
||||
<fieldset><legend align=center>foo bar</legend>align=center</fieldset>
|
||||
<fieldset><legend align=right>foo bar</legend>align=right</fieldset>
|
||||
</div>
|
|
@ -0,0 +1,7 @@
|
|||
<!doctype html>
|
||||
<title>Reference for Rendering of display: none legend</title>
|
||||
<style>
|
||||
div { border: 2em solid lime; width: 0; }
|
||||
</style>
|
||||
<p>There should be a green box below.</p>
|
||||
<div></div>
|
|
@ -0,0 +1,11 @@
|
|||
<!doctype html>
|
||||
<title>Rendering of display: none legend</title>
|
||||
<link rel=match href=legend-display-none-rendering-ref.html>
|
||||
<style>
|
||||
fieldset { border: 2em solid lime; width: 0; margin: 0; padding: 0; }
|
||||
legend { display: none; background: red; }
|
||||
</style>
|
||||
<p>There should be a green box below.</p>
|
||||
<fieldset>
|
||||
<legend>FAIL</legend>
|
||||
</fieldset>
|
|
@ -0,0 +1,16 @@
|
|||
<!doctype html>
|
||||
<title>legend display: none</title>
|
||||
<script src=/resources/testharness.js></script>
|
||||
<script src=/resources/testharnessreport.js></script>
|
||||
<style>
|
||||
legend { display: none; }
|
||||
</style>
|
||||
<fieldset>
|
||||
<legend>Foo</legend>
|
||||
</fieldset>
|
||||
<script>
|
||||
test(() => {
|
||||
const display = getComputedStyle(document.querySelector('legend')).display;
|
||||
assert_equals(display, 'none');
|
||||
});
|
||||
</script>
|
|
@ -0,0 +1,7 @@
|
|||
<!doctype html>
|
||||
<title>Reference for legend and dipslay: list-item</title>
|
||||
<style>
|
||||
div { margin: 0 40px; display: list-item; }
|
||||
</style>
|
||||
<p>There should be a bullet point below.</p>
|
||||
<div>X</div>
|
|
@ -0,0 +1,11 @@
|
|||
<!doctype html>
|
||||
<title>legend and dipslay: list-item</title>
|
||||
<link rel=match href=fieldset-list-item-ref.html>
|
||||
<style>
|
||||
fieldset { margin: 0; padding: 0; border: none; }
|
||||
legend { margin: 0 40px; padding: 0; display: list-item; }
|
||||
</style>
|
||||
<p>There should be a bullet point below.</p>
|
||||
<fieldset>
|
||||
<legend>X</legend>
|
||||
</fieldset>
|
|
@ -0,0 +1,18 @@
|
|||
body > div { display: inline-block }
|
||||
fieldset, .fieldset { padding: 0; height:10em; width:2em; border:1em groove; margin: 0em; line-height:1 }
|
||||
legend, .legend { padding: 0; width: 1em }
|
||||
.legend {
|
||||
background: white; /* overlap the border to emulate the border not being painted */
|
||||
display: table; /* shrink-wrap */
|
||||
}
|
||||
|
||||
[style="writing-mode: vertical-lr"] .legend {
|
||||
margin-left: -1em;
|
||||
}
|
||||
[style="writing-mode: vertical-rl"] .legend {
|
||||
margin-right: -1em;
|
||||
}
|
||||
.top { margin-bottom: auto }
|
||||
.center { margin-top: auto; margin-bottom: auto }
|
||||
.bottom { margin-top: auto }
|
||||
.rtl { direction: rtl }
|
|
@ -0,0 +1,35 @@
|
|||
<!DOCTYPE html>
|
||||
<body>
|
||||
<script src=/resources/testharness.js></script>
|
||||
<script src=/resources/testharnessreport.js></script>
|
||||
<script src=/resources/testdriver.js></script>
|
||||
<script src=/resources/testdriver-vendor.js></script>
|
||||
<script src=/common/media.js></script>
|
||||
<script src=/feature-policy/resources/featurepolicy.js></script>
|
||||
<script src=/feature-policy/resources/autoplay.js></script>
|
||||
<script>
|
||||
'use strict';
|
||||
const relative_path = '/feature-policy/resources/feature-policy-autoplay.html';
|
||||
const base_src = '/feature-policy/resources/redirect-on-load.html#';
|
||||
const same_origin_src = base_src + relative_path;
|
||||
const cross_origin_src = base_src + 'https://{{domains[www]}}:{{ports[https][0]}}' +
|
||||
relative_path;
|
||||
const header = 'Feature-Policy allow="autoplay"';
|
||||
|
||||
async_test(t => {
|
||||
simulateGesture(t, () => {
|
||||
test_feature_availability(
|
||||
'autoplay', t, same_origin_src,
|
||||
expect_feature_available_default, 'autoplay');
|
||||
});
|
||||
}, header + ' allows same-origin navigation in an iframe.');
|
||||
|
||||
async_test(t => {
|
||||
simulateGesture(t, () => {
|
||||
test_feature_availability(
|
||||
'autoplay', t, cross_origin_src,
|
||||
expect_feature_unavailable_default, 'autoplay');
|
||||
});
|
||||
}, header + ' disallows cross-origin navigation in an iframe.');
|
||||
</script>
|
||||
</body>
|
|
@ -0,0 +1,34 @@
|
|||
<!DOCTYPE html>
|
||||
<body>
|
||||
<script src=/resources/testharness.js></script>
|
||||
<script src=/resources/testharnessreport.js></script>
|
||||
<script src=/resources/testdriver.js></script>
|
||||
<script src=/resources/testdriver-vendor.js></script>
|
||||
<script src=/common/media.js></script>
|
||||
<script src=/feature-policy/resources/featurepolicy.js></script>
|
||||
<script src=/feature-policy/resources/autoplay.js></script>
|
||||
<script>
|
||||
'use strict';
|
||||
const same_origin_src = '/feature-policy/resources/feature-policy-autoplay.html';
|
||||
const cross_origin_src = 'https://{{domains[www]}}:{{ports[https][0]}}' +
|
||||
same_origin_src;
|
||||
const feature_name = 'Feature policy "autoplay"';
|
||||
const header = 'allow="autoplay" attribute';
|
||||
|
||||
async_test(t => {
|
||||
simulateGesture(t, () => {
|
||||
test_feature_availability(
|
||||
'autoplay', t, same_origin_src,
|
||||
expect_feature_available_default, 'autoplay');
|
||||
});
|
||||
}, feature_name + ' can be enabled in same-origin iframe using ' + header);
|
||||
|
||||
async_test(t => {
|
||||
simulateGesture(t, () => {
|
||||
test_feature_availability(
|
||||
'autoplay', t, cross_origin_src,
|
||||
expect_feature_available_default, 'autoplay');
|
||||
});
|
||||
}, feature_name + ' can be enabled in cross-origin iframe using ' + header);
|
||||
</script>
|
||||
</body>
|
|
@ -0,0 +1,39 @@
|
|||
<!DOCTYPE html>
|
||||
<body>
|
||||
<script src=/resources/testharness.js></script>
|
||||
<script src=/resources/testharnessreport.js></script>
|
||||
<script src=/resources/testdriver.js></script>
|
||||
<script src=/resources/testdriver-vendor.js></script>
|
||||
<script src=/common/media.js></script>
|
||||
<script src=/feature-policy/resources/featurepolicy.js></script>
|
||||
<script src=/feature-policy/resources/autoplay.js></script>
|
||||
<script>
|
||||
'use strict';
|
||||
const same_origin_src = '/feature-policy/resources/feature-policy-autoplay.html';
|
||||
const cross_origin_src = 'https://{{domains[www]}}:{{ports[https][0]}}' +
|
||||
same_origin_src;
|
||||
const header = 'Feature-Policy header: autoplay *';
|
||||
|
||||
async_test(t => {
|
||||
simulateGesture(t, () => {
|
||||
isAutoplayAllowed().then(t.step_func_done((result) => {
|
||||
assert_true(result);
|
||||
}));
|
||||
});
|
||||
}, header + ' allows the top-level document.');
|
||||
|
||||
async_test(t => {
|
||||
simulateGesture(t, () => {
|
||||
test_feature_availability('autoplay', t, same_origin_src,
|
||||
expect_feature_available_default);
|
||||
});
|
||||
}, header + ' allows same-origin iframes.');
|
||||
|
||||
async_test(t => {
|
||||
simulateGesture(t, () => {
|
||||
test_feature_availability('autoplay', t, cross_origin_src,
|
||||
expect_feature_available_default);
|
||||
});
|
||||
}, header + ' allows cross-origin iframes.');
|
||||
</script>
|
||||
</body>
|
|
@ -0,0 +1 @@
|
|||
Feature-Policy: autoplay *
|
|
@ -0,0 +1,39 @@
|
|||
<!DOCTYPE html>
|
||||
<body>
|
||||
<script src=/resources/testharness.js></script>
|
||||
<script src=/resources/testharnessreport.js></script>
|
||||
<script src=/resources/testdriver.js></script>
|
||||
<script src=/resources/testdriver-vendor.js></script>
|
||||
<script src=/common/media.js></script>
|
||||
<script src=/feature-policy/resources/featurepolicy.js></script>
|
||||
<script src=/feature-policy/resources/autoplay.js></script>
|
||||
<script>
|
||||
'use strict';
|
||||
const same_origin_src = '/feature-policy/resources/feature-policy-autoplay.html';
|
||||
const cross_origin_src = 'https://{{domains[www]}}:{{ports[https][0]}}' +
|
||||
same_origin_src;
|
||||
const header = 'Default "autoplay" feature policy ["self"]';
|
||||
|
||||
async_test(t => {
|
||||
simulateGesture(t, () => {
|
||||
isAutoplayAllowed().then(t.step_func_done((result) => {
|
||||
assert_true(result);
|
||||
}));
|
||||
});
|
||||
}, header + ' allows the top-level document.');
|
||||
|
||||
async_test(t => {
|
||||
simulateGesture(t, () => {
|
||||
test_feature_availability('autoplay', t, same_origin_src,
|
||||
expect_feature_available_default);
|
||||
});
|
||||
}, header + ' allows same-origin iframes.');
|
||||
|
||||
async_test(t => {
|
||||
simulateGesture(t, () => {
|
||||
test_feature_availability('autoplay', t, cross_origin_src,
|
||||
expect_feature_unavailable_default,);
|
||||
});
|
||||
}, header + ' disallows cross-origin iframes.');
|
||||
</script>
|
||||
</body>
|
|
@ -0,0 +1,39 @@
|
|||
<!DOCTYPE html>
|
||||
<body>
|
||||
<script src=/resources/testharness.js></script>
|
||||
<script src=/resources/testharnessreport.js></script>
|
||||
<script src=/resources/testdriver.js></script>
|
||||
<script src=/resources/testdriver-vendor.js></script>
|
||||
<script src=/common/media.js></script>
|
||||
<script src=/feature-policy/resources/featurepolicy.js></script>
|
||||
<script src=/feature-policy/resources/autoplay.js></script>
|
||||
<script>
|
||||
'use strict';
|
||||
const same_origin_src = '/feature-policy/resources/feature-policy-autoplay.html';
|
||||
const cross_origin_src = 'https://{{domains[www]}}:{{ports[https][0]}}' +
|
||||
same_origin_src;
|
||||
const header = 'Feature-Policy header: autoplay "none"';
|
||||
|
||||
async_test(t => {
|
||||
simulateGesture(t, () => {
|
||||
isAutoplayAllowed().then(t.step_func_done((result) => {
|
||||
assert_true(result);
|
||||
}));
|
||||
});
|
||||
}, header + ' has no effect on the top level document.');
|
||||
|
||||
async_test(t => {
|
||||
simulateGesture(t, () => {
|
||||
test_feature_availability('autoplay', t, same_origin_src,
|
||||
expect_feature_unavailable_default);
|
||||
});
|
||||
}, header + ' disallows same-origin iframes.');
|
||||
|
||||
async_test(t => {
|
||||
simulateGesture(t, () => {
|
||||
test_feature_availability('autoplay', t, cross_origin_src,
|
||||
expect_feature_unavailable_default,);
|
||||
});
|
||||
}, header + ' disallows cross-origin iframes.');
|
||||
</script>
|
||||
</body>
|
|
@ -0,0 +1 @@
|
|||
Feature-Policy: autoplay 'none'
|
|
@ -1,2 +0,0 @@
|
|||
<!doctype html>
|
||||
010-1
|
|
@ -1,5 +0,0 @@
|
|||
<!doctype html>
|
||||
010-2
|
||||
<script>
|
||||
onload = function() {history.back()}
|
||||
</script>
|
|
@ -1,22 +0,0 @@
|
|||
<!doctype html>
|
||||
<title>Salvagability of document.opened document</title>
|
||||
<script src="/resources/testharness.js"></script>
|
||||
<script src="/resources/testharnessreport.js"></script>
|
||||
<div id="log"></div>
|
||||
<iframe src="010-1.html"></iframe>
|
||||
<script>
|
||||
var iframe;
|
||||
var t = async_test();
|
||||
onload = t.step_func(function() {
|
||||
iframe = document.getElementsByTagName("iframe")[0];
|
||||
assert_equals(iframe.contentDocument.open(), iframe.contentDocument);
|
||||
iframe.contentDocument.close();
|
||||
|
||||
iframe.contentWindow.setTimeout(t.step_func(function() {t.done();}), 500);
|
||||
|
||||
onload = null;
|
||||
|
||||
iframe.src = "010-2.html"
|
||||
setTimeout(t.step_func(function() {assert_unreached()}), 1000)
|
||||
})
|
||||
</script>
|
|
@ -0,0 +1,29 @@
|
|||
// Historically, document.open() created an entry in the session history so
|
||||
// that the original page could be seen by going back. Test that this behavior
|
||||
// no longer occurs.
|
||||
//
|
||||
// This test uses window.open() for variety, as most other tests in this
|
||||
// directory use document.open(). An <iframe> would probably work also. We can
|
||||
// always add an <iframe>-based test later if it is deemed necessary.
|
||||
|
||||
const t = async_test("document.open should not add an entry to the session history");
|
||||
|
||||
const frameURL = new URL("resources/history-frame.html", document.URL).href;
|
||||
|
||||
let origLength;
|
||||
window.onFrameLoaded = t.step_func(() => {
|
||||
window.onFrameLoaded = t.unreached_func("onFrameLoaded should only be called once");
|
||||
assert_equals(win.document.URL, frameURL);
|
||||
assert_true(win.document.body.textContent.includes("Old"));
|
||||
origLength = win.history.length;
|
||||
});
|
||||
window.onDocumentOpen = t.step_func_done(() => {
|
||||
window.onDocumentOpen = t.unreached_func("onDocumentOpen should only be called once");
|
||||
assert_equals(win.document.URL, frameURL);
|
||||
assert_true(win.document.body.textContent.includes("New"));
|
||||
assert_not_equals(origLength, undefined);
|
||||
assert_equals(win.history.length, origLength);
|
||||
});
|
||||
|
||||
const win = window.open(frameURL);
|
||||
t.add_cleanup(() => win.close());
|
|
@ -0,0 +1,74 @@
|
|||
test(t => {
|
||||
const frame = document.body.appendChild(document.createElement("iframe"));
|
||||
t.add_cleanup(() => frame.contentDocument.close());
|
||||
assert_equals(frame.contentDocument.compatMode, "BackCompat");
|
||||
frame.contentDocument.open();
|
||||
assert_equals(frame.contentDocument.compatMode, "CSS1Compat");
|
||||
frame.contentDocument.close();
|
||||
assert_equals(frame.contentDocument.compatMode, "BackCompat");
|
||||
}, "document.open() sets document to no-quirks mode (write no doctype)");
|
||||
|
||||
test(t => {
|
||||
const frame = document.body.appendChild(document.createElement("iframe"));
|
||||
t.add_cleanup(() => frame.contentDocument.close());
|
||||
assert_equals(frame.contentDocument.compatMode, "BackCompat");
|
||||
frame.contentDocument.open();
|
||||
assert_equals(frame.contentDocument.compatMode, "CSS1Compat");
|
||||
frame.contentDocument.write("<!doctype html public");
|
||||
assert_equals(frame.contentDocument.compatMode, "CSS1Compat");
|
||||
frame.contentDocument.write(" \"-//IETF//DTD HTML 3//\"");
|
||||
assert_equals(frame.contentDocument.compatMode, "CSS1Compat");
|
||||
frame.contentDocument.write(">");
|
||||
assert_equals(frame.contentDocument.compatMode, "BackCompat");
|
||||
frame.contentDocument.close();
|
||||
assert_equals(frame.contentDocument.compatMode, "BackCompat");
|
||||
}, "document.open() sets document to no-quirks mode (write old doctype)");
|
||||
|
||||
test(t => {
|
||||
const frame = document.body.appendChild(document.createElement("iframe"));
|
||||
t.add_cleanup(() => frame.contentDocument.close());
|
||||
assert_equals(frame.contentDocument.compatMode, "BackCompat");
|
||||
frame.contentDocument.open();
|
||||
assert_equals(frame.contentDocument.compatMode, "CSS1Compat");
|
||||
frame.contentDocument.write("<!doctype html");
|
||||
assert_equals(frame.contentDocument.compatMode, "CSS1Compat");
|
||||
frame.contentDocument.write(">");
|
||||
assert_equals(frame.contentDocument.compatMode, "CSS1Compat");
|
||||
frame.contentDocument.close();
|
||||
assert_equals(frame.contentDocument.compatMode, "CSS1Compat");
|
||||
}, "document.open() sets document to no-quirks mode (write new doctype)");
|
||||
|
||||
// This tests the document.open() call in fact sets the document to no-quirks
|
||||
// mode, not limited-quirks mode. It is derived from
|
||||
// quirks/blocks-ignore-line-height.html in WPT, as there is no direct way to
|
||||
// distinguish between a no-quirks document and a limited-quirks document. It
|
||||
// assumes that the user agent passes the linked test, which at the time of
|
||||
// writing is all major web browsers.
|
||||
test(t => {
|
||||
const frame = document.body.appendChild(document.createElement("iframe"));
|
||||
t.add_cleanup(() => frame.contentDocument.close());
|
||||
assert_equals(frame.contentDocument.compatMode, "BackCompat");
|
||||
frame.contentDocument.open();
|
||||
assert_equals(frame.contentDocument.compatMode, "CSS1Compat");
|
||||
|
||||
// Create the DOM tree manually rather than going through document.write() to
|
||||
// bypass the parser, which resets the document mode.
|
||||
const html = frame.contentDocument.appendChild(frame.contentDocument.createElement("html"));
|
||||
const body = html.appendChild(frame.contentDocument.createElement("body"));
|
||||
assert_equals(frame.contentDocument.body, body);
|
||||
body.innerHTML = `
|
||||
<style>#ref { display:block }</style>
|
||||
<div id=test><font size=1>x</font></div>
|
||||
<font id=ref size=1>x</font>
|
||||
<div id=s_ref>x</div>
|
||||
`;
|
||||
assert_equals(frame.contentDocument.compatMode, "CSS1Compat");
|
||||
|
||||
const idTest = frame.contentDocument.getElementById("test");
|
||||
const idRef = frame.contentDocument.getElementById("ref");
|
||||
const idSRef = frame.contentDocument.getElementById("s_ref");
|
||||
assert_equals(frame.contentWindow.getComputedStyle(idTest).height,
|
||||
frame.contentWindow.getComputedStyle(idSRef).height);
|
||||
assert_not_equals(frame.contentWindow.getComputedStyle(idTest).height,
|
||||
frame.contentWindow.getComputedStyle(idRef).height);
|
||||
}, "document.open() sets document to no-quirks mode, not limited-quirks mode");
|
|
@ -0,0 +1,25 @@
|
|||
// This tests the behavior of dynamic markup insertion APIs with a document's
|
||||
// readiness.
|
||||
|
||||
async_test(t => {
|
||||
const frame = document.body.appendChild(document.createElement("iframe"));
|
||||
t.add_cleanup(() => { frame.remove(); });
|
||||
frame.src = "/common/blank.html";
|
||||
frame.onload = t.step_func_done(() => {
|
||||
const states = [];
|
||||
frame.contentDocument.onreadystatechange = t.step_func(() => {
|
||||
states.push(frame.contentDocument.readyState);
|
||||
});
|
||||
assert_equals(frame.contentDocument.readyState, "complete");
|
||||
assert_array_equals(states, []);
|
||||
|
||||
// When open() is called, it first removes the event listeners and handlers
|
||||
// from all nodes in the DOM tree. Then, after a new parser is created and
|
||||
// initialized, it changes the current document readiness to "loading".
|
||||
// However, because all event listeners are removed, we cannot observe the
|
||||
// readystatechange event fired for "loading" inside open().
|
||||
frame.contentDocument.open();
|
||||
assert_equals(frame.contentDocument.readyState, "loading");
|
||||
assert_array_equals(states, []);
|
||||
});
|
||||
}, "document.open() and readiness");
|
|
@ -0,0 +1,20 @@
|
|||
<script>
|
||||
function queueTest() {
|
||||
// The timeout is necessary to avoid the parser still being active when
|
||||
// `document.open()` is called and becoming a no-op.
|
||||
//
|
||||
// We also cannot use setTimeout(..., 0), as the parser is terminated in a
|
||||
// task with DOM manipulation task source while the timeout is run in a task
|
||||
// on the timer task source. The order is therefore not guaranteed. Let's
|
||||
// play it safer and use some actual timeout.
|
||||
setTimeout(() => {
|
||||
document.open();
|
||||
document.write("<p>New content</p>");
|
||||
document.close();
|
||||
opener.onDocumentOpen();
|
||||
}, 200);
|
||||
}
|
||||
</script>
|
||||
<body onload="opener.onFrameLoaded(); queueTest();">
|
||||
<p>Old content</p>
|
||||
</body>
|
|
@ -0,0 +1,9 @@
|
|||
<script>
|
||||
onload = () => {
|
||||
const beforeURL = document.URL;
|
||||
document.open();
|
||||
const afterURL = document.URL;
|
||||
document.close();
|
||||
parent.testDone(beforeURL, afterURL);
|
||||
}
|
||||
</script>
|
|
@ -0,0 +1,26 @@
|
|||
async_test(t => {
|
||||
const frame = document.body.appendChild(document.createElement("iframe")),
|
||||
urlSansHash = document.URL;
|
||||
t.add_cleanup(() => { frame.remove(); });
|
||||
assert_equals(frame.contentDocument.URL, "about:blank");
|
||||
assert_equals(frame.contentWindow.location.href, "about:blank");
|
||||
self.onhashchange = t.step_func_done(() => {
|
||||
frame.contentDocument.open();
|
||||
assert_equals(frame.contentDocument.URL, urlSansHash);
|
||||
assert_equals(frame.contentWindow.location.href, urlSansHash);
|
||||
});
|
||||
self.location.hash = "heya";
|
||||
}, "document.open() and document's URL containing a fragment (entry is not relevant)");
|
||||
|
||||
window.testDone = undefined;
|
||||
async_test(t => {
|
||||
const frame = document.body.appendChild(document.createElement("iframe"))
|
||||
t.add_cleanup(() => { frame.remove(); });
|
||||
frame.src = "resources/url-frame.html#heya";
|
||||
window.testDone = t.step_func_done((beforeURL, afterURL) => {
|
||||
assert_equals(beforeURL, frame.src);
|
||||
assert_equals(afterURL, frame.src);
|
||||
assert_equals(frame.contentDocument.URL, frame.src);
|
||||
assert_equals(frame.contentWindow.location.href, frame.src);
|
||||
});
|
||||
}, "document.open() and document's URL containing a fragment (entry is relevant)");
|
Loading…
Add table
Add a link
Reference in a new issue