mirror of
https://github.com/servo/servo.git
synced 2025-08-15 18:35:33 +01:00
Update web-platform-tests to revision 716f0ac8e3e016318c301828428ce241a1dd0e08
This commit is contained in:
WPT Sync Bot
parent
e81af16de8
commit
5735600736
4480 changed files with 66427 additions and 61007 deletions
|
|
@ -1,22 +0,0 @@
|
|||
<!DOCTYPE html>
|
||||
<meta charset="utf-8">
|
||||
<body>
|
||||
<svg width=200 height=200>
|
||||
<image href="/images/background.png" width="32" height="32"/>
|
||||
</svg>
|
||||
<svg width=200 height=200>
|
||||
<image href="/images/background.png" width="300" height="150"/>
|
||||
</svg>
|
||||
<svg width=400 height=400>
|
||||
<image href="/images/background.png" width="300" height="150"/>
|
||||
</svg>
|
||||
<svg width=200 height=200>
|
||||
<image href="/images/background.png" width="300" height="150"/>
|
||||
</svg>
|
||||
<svg width=200 height=200>
|
||||
<image href="/images/background.png" height="50" width="100"/>
|
||||
</svg>
|
||||
<svg width=200 height=200>
|
||||
<image href="/images/background.png" width="100" height="100"/>
|
||||
</svg>
|
||||
</body>
|
||||
|
|
@ -1,24 +0,0 @@
|
|||
<!DOCTYPE html>
|
||||
<meta charset="utf-8">
|
||||
<link rel="match" href="intrinsicsize-svg-image-ref.html">
|
||||
<meta name="assert" content="test">
|
||||
<body>
|
||||
<svg width=200 height=200>
|
||||
<image href="/images/background.png"/>
|
||||
</svg>
|
||||
<svg width=200 height=200>
|
||||
<image href="/images/background.png" intrinsicsize="300x150"/>
|
||||
</svg>
|
||||
<svg width=400 height=400>
|
||||
<image href="/images/background.png" intrinsicsize="300x150"/>
|
||||
</svg>
|
||||
<svg width=200 height=200>
|
||||
<image href="/images/background.png" intrinsicsize="300x150" width="300"/>
|
||||
</svg>
|
||||
<svg width=200 height=200>
|
||||
<image href="/images/background.png" intrinsicsize="300x150" height="50"/>
|
||||
</svg>
|
||||
<svg width=200 height=200>
|
||||
<image href="/images/background.png" intrinsicsize="300x150" width="100" height="100"/>
|
||||
</svg>
|
||||
</body>
|
||||
|
|
@ -12,6 +12,7 @@
|
|||
<img id="imgTestTag3" style="width: 80px; height:auto;">
|
||||
<img id="imgTestTag4">
|
||||
<img id="imgTestTag5">
|
||||
<div id="image-container"></div>
|
||||
|
||||
<script>
|
||||
var imageInstance = document.createElement('img');
|
||||
|
|
@ -26,9 +27,59 @@
|
|||
assert_true(document.getElementById("imgTestTag").complete);
|
||||
}, "img src and srcset omitted");
|
||||
|
||||
test(function() {
|
||||
var img = document.createElement("img");
|
||||
assert_true(img.complete);
|
||||
}, "img src and srcset omitted on newly-created image");
|
||||
|
||||
test(function() {
|
||||
var cont = document.getElementById("image-container");
|
||||
this.add_cleanup(() => { cont.innerHTML = "" });
|
||||
var img = document.createElement("img");
|
||||
cont.appendChild(img);
|
||||
assert_true(img.complete);
|
||||
}, "img src and srcset omitted on newly-created-and-inserted image");
|
||||
|
||||
test(function() {
|
||||
var cont = document.getElementById("image-container");
|
||||
this.add_cleanup(() => { cont.innerHTML = "" });
|
||||
cont.innerHTML = "<img>";
|
||||
assert_true(cont.querySelector("img").complete);
|
||||
}, "img src and srcset omitted on newly-created-via-innerHTML image");
|
||||
|
||||
test(function() {
|
||||
assert_true(document.getElementById("imgTestTag2").complete);
|
||||
}, "img src and srcset empty");
|
||||
}, "img src empty and srcset omitted");
|
||||
|
||||
test(function() {
|
||||
var img = document.createElement("img");
|
||||
img.setAttribute("src", "");
|
||||
assert_true(img.complete);
|
||||
}, "img src empty and srcset omitted on newly-created image");
|
||||
|
||||
test(function() {
|
||||
var cont = document.getElementById("image-container");
|
||||
this.add_cleanup(() => { cont.innerHTML = "" });
|
||||
var img = document.createElement("img");
|
||||
img.setAttribute("src", "");
|
||||
cont.appendChild(img);
|
||||
assert_true(img.complete);
|
||||
}, "img src empty and srcset omitted on newly-created-and-inserted image");
|
||||
|
||||
test(function() {
|
||||
var cont = document.getElementById("image-container");
|
||||
this.add_cleanup(() => { cont.innerHTML = "" });
|
||||
cont.innerHTML = "<img src=''>";
|
||||
assert_true(cont.querySelector("img").complete);
|
||||
}, "img src empty and srcset omitted on newly-created-via-innerHTML image");
|
||||
|
||||
test(function() {
|
||||
var img = document.createElement("img");
|
||||
img.src = location.href;
|
||||
assert_false(img.complete, "Should have a load going");
|
||||
img.removeAttribute("src");
|
||||
assert_true(img.complete);
|
||||
}, "img src and srcset omitted on image after it started a load");
|
||||
|
||||
// test if set to true after img is completely available
|
||||
var t = async_test("async src complete test");
|
||||
|
|
@ -103,4 +154,57 @@
|
|||
assert_true(img4.complete);
|
||||
t2.done();
|
||||
});
|
||||
|
||||
var t3 = async_test("async src removal test");
|
||||
t3.step(function() {
|
||||
var img = document.createElement("img");
|
||||
assert_true(img.complete);
|
||||
img.src = `3.jpg?nocache=${Math.random()}`;
|
||||
assert_false(img.complete);
|
||||
img.onload = this.step_func_done(() => {
|
||||
assert_true(img.complete);
|
||||
img.removeAttribute("src");
|
||||
assert_true(img.complete, "Should be complete, since we removed the src");
|
||||
});
|
||||
});
|
||||
|
||||
var t4 = async_test("async srcset removal test");
|
||||
t4.step(function() {
|
||||
var img = document.createElement("img");
|
||||
assert_true(img.complete);
|
||||
img.srcset = `3.jpg?nocache=${Math.random()} 1x`;
|
||||
assert_false(img.complete);
|
||||
img.onload = this.step_func_done(() => {
|
||||
assert_true(img.complete);
|
||||
img.removeAttribute("srcset");
|
||||
assert_true(img.complete, "Should be complete, since we removed the srcset");
|
||||
});
|
||||
});
|
||||
|
||||
var t5 = async_test("async src available image lookup test");
|
||||
t5.step(function() {
|
||||
var preload = document.createElement("img");
|
||||
var url = `3.jpg?nocache=${Math.random()}`;
|
||||
preload.src = url;
|
||||
preload.onload = this.step_func_done(function() {
|
||||
var img = document.createElement("img");
|
||||
assert_true(img.complete);
|
||||
img.src = url;
|
||||
assert_true(img.complete, "Should be complete because we should hit the available image cache");
|
||||
});
|
||||
});
|
||||
|
||||
var t6 = async_test("async pending request test");
|
||||
t6.step(function() {
|
||||
var img = document.createElement("img");
|
||||
img.src = `3.jpg?nocache=${Math.random()}`;
|
||||
img.onload = this.step_func_done(function() {
|
||||
assert_true(img.complete);
|
||||
img.src = `3.jpg?nocache=${Math.random()}`;
|
||||
// This is not strictly per spec, but that's a spec bug. See
|
||||
// https://github.com/whatwg/html/issues/4884
|
||||
assert_false(img.complete, "Should not be complete because we have started a new load");
|
||||
});
|
||||
});
|
||||
|
||||
</script>
|
||||
|
|
|
|||
|
|
@ -1,96 +0,0 @@
|
|||
<!DOCTYPE html>
|
||||
<body>
|
||||
<script src="/resources/testharness.js"></script>
|
||||
<script src="/resources/testharnessreport.js"></script>
|
||||
<script>
|
||||
'use strict';
|
||||
|
||||
const srcs = [
|
||||
"/images/green.svg",
|
||||
"/images/green.png",
|
||||
];
|
||||
|
||||
for (var src of srcs) {
|
||||
async_test(t => {
|
||||
var img = document.createElement('IMG');
|
||||
img.intrinsicSize = '400 x 500';
|
||||
var expected_intrinsic_width = 400;
|
||||
var expected_intrinsic_height = 500;
|
||||
var expected_width = expected_intrinsic_width;
|
||||
var expected_height = expected_intrinsic_height;
|
||||
|
||||
document.body.appendChild(img);
|
||||
img.addEventListener('load', t.step_func(() => {
|
||||
assert_equals(img.width, expected_width, 'width');
|
||||
assert_equals(img.height, expected_height, 'height');
|
||||
assert_equals(img.naturalWidth, expected_intrinsic_width, 'naturalWidth');
|
||||
assert_equals(img.naturalHeight, expected_intrinsic_height, 'naturalHeigh');
|
||||
t.done();
|
||||
}));
|
||||
img.srcset = src + ' 3x';
|
||||
}, 'Test image ' + src + ' with no specified sizes, width, or height');
|
||||
|
||||
async_test(t => {
|
||||
var img = document.createElement('IMG');
|
||||
img.intrinsicSize = '400 x 500';
|
||||
img.width = '800'; /* 2x of intrinsic width */
|
||||
var expected_intrinsic_width = 400;
|
||||
var expected_intrinsic_height = 500;
|
||||
var expected_width = expected_intrinsic_width * 2;
|
||||
var expected_height = expected_intrinsic_height * 2;
|
||||
|
||||
document.body.appendChild(img);
|
||||
img.addEventListener('load', t.step_func(() => {
|
||||
assert_equals(img.width, expected_width, 'width');
|
||||
assert_equals(img.height, expected_height, 'height');
|
||||
assert_equals(img.naturalWidth, expected_intrinsic_width, 'naturalWidth');
|
||||
assert_equals(img.naturalHeight, expected_intrinsic_height, 'naturalHeigh');
|
||||
t.done();
|
||||
}));
|
||||
img.srcset = src + ' 3x';
|
||||
}, 'Test image ' + src + ' with width = 800, no specified sizes, or height');
|
||||
|
||||
async_test(t => {
|
||||
var img = document.createElement('IMG');
|
||||
img.intrinsicSize = '400 x 500';
|
||||
img.width = '800';
|
||||
img.style = 'height:800px;';
|
||||
var expected_intrinsic_width = 400;
|
||||
var expected_intrinsic_height = 500;
|
||||
var expected_width = 800;
|
||||
var expected_height = 800;
|
||||
|
||||
document.body.appendChild(img);
|
||||
img.addEventListener('load', t.step_func(() => {
|
||||
assert_equals(img.width, expected_width, 'width');
|
||||
assert_equals(img.height, expected_height, 'height');
|
||||
assert_equals(img.naturalWidth, expected_intrinsic_width, 'naturalWidth');
|
||||
assert_equals(img.naturalHeight, expected_intrinsic_height, 'naturalHeigh');
|
||||
t.done();
|
||||
}));
|
||||
img.srcset = src + ' 3x';
|
||||
}, 'Test image ' + src + ' with width = 800, height = 800, and no specified sizes');
|
||||
}
|
||||
|
||||
async_test(t => {
|
||||
var img = document.createElement('IMG');
|
||||
img.intrinsicSize = '400 x 500';
|
||||
img.sizes = '100px';
|
||||
var expected_intrinsic_width = 100;
|
||||
var expected_intrinsic_height = 125;
|
||||
var expected_width = 100;
|
||||
var expected_height = 125;
|
||||
|
||||
document.body.appendChild(img);
|
||||
img.addEventListener('load', t.step_func(() => {
|
||||
assert_equals(img.width, expected_width, 'width');
|
||||
assert_equals(img.height, expected_height, 'height');
|
||||
assert_equals(img.naturalWidth, expected_intrinsic_width, 'naturalWidth');
|
||||
assert_equals(img.naturalHeight, expected_intrinsic_height, 'naturalHeigh');
|
||||
t.done();
|
||||
}));
|
||||
img.srcset = '/images/background.png 32w';
|
||||
}, 'Test image (32 x 32) with sizes = 100 and srcset descriptor = 32w');
|
||||
|
||||
</script>
|
||||
</body>
|
||||
|
|
@ -1,66 +0,0 @@
|
|||
<!DOCTYPE html>
|
||||
<body>
|
||||
<script src="/resources/testharness.js"></script>
|
||||
<script src="/resources/testharnessreport.js"></script>
|
||||
<script>
|
||||
'use strict';
|
||||
|
||||
const srcs = [
|
||||
"/images/green.svg",
|
||||
"/images/green.png",
|
||||
];
|
||||
|
||||
// Set new attribute, and wait til the media element is repainted.
|
||||
function updateAttribute(e, attribute, value) {
|
||||
return new Promise(resolve => {
|
||||
requestAnimationFrame(() => requestAnimationFrame(() => resolve()));
|
||||
e.setAttribute(attribute, value);
|
||||
});
|
||||
}
|
||||
|
||||
for (var src of srcs) {
|
||||
promise_test(async() => {
|
||||
var img = document.createElement('IMG');
|
||||
document.body.appendChild(img);
|
||||
img.src = src;
|
||||
await new Promise(resolve =>
|
||||
img.addEventListener('load', () => resolve(), {once: true}));
|
||||
await updateAttribute(img, 'intrinsicSize', '400 x 500');
|
||||
assert_equals(img.width, 400, 'width');
|
||||
assert_equals(img.height, 500, 'height');
|
||||
assert_equals(img.naturalWidth, 400, 'naturalWidth');
|
||||
assert_equals(img.naturalHeight, 500, 'naturalHeight');
|
||||
|
||||
await updateAttribute(img, 'width', '800');
|
||||
assert_equals(img.width, 800, 'width');
|
||||
assert_equals(img.height, 1000, 'height');
|
||||
assert_equals(img.naturalWidth, 400, 'naturalWidth');
|
||||
assert_equals(img.naturalHeight, 500, 'naturalHeight');
|
||||
|
||||
await updateAttribute(img, 'style', 'height:800px;');
|
||||
assert_equals(img.width, 800, 'width');
|
||||
assert_equals(img.height, 800, 'height');
|
||||
assert_equals(img.naturalWidth, 400, 'naturalWidth');
|
||||
assert_equals(img.naturalHeight, 500, 'naturalHeight');
|
||||
|
||||
await updateAttribute(img, 'width', '');
|
||||
assert_equals(img.width, 640, 'width');
|
||||
assert_equals(img.height, 800, 'height');
|
||||
assert_equals(img.naturalWidth, 400, 'naturalWidth');
|
||||
assert_equals(img.naturalHeight, 500, 'naturalHeight');
|
||||
|
||||
await updateAttribute(img, 'style', 'height:800px; writing-mode: vertical-rl;');
|
||||
assert_equals(img.width, 640, 'width');
|
||||
assert_equals(img.height, 800, 'height');
|
||||
assert_equals(img.naturalWidth, 400, 'naturalWidth');
|
||||
assert_equals(img.naturalHeight, 500, 'naturalHeight');
|
||||
|
||||
await updateAttribute(img, 'style', 'height:800px; writing-mode: horizontal-tb;');
|
||||
assert_equals(img.width, 640, 'width');
|
||||
assert_equals(img.height, 800, 'height');
|
||||
assert_equals(img.naturalWidth, 400, 'naturalWidth');
|
||||
assert_equals(img.naturalHeight, 500, 'naturalHeight');
|
||||
}, 'Test intrinsicsize for html image element, src=' + src);
|
||||
}
|
||||
</script>
|
||||
</body>
|
||||
|
|
@ -1 +0,0 @@
|
|||
Feature-Policy: unsized-media *
|
||||
|
|
@ -1,39 +0,0 @@
|
|||
<!DOCTYPE html>
|
||||
<body>
|
||||
<script src="/resources/testharness.js"></script>
|
||||
<script src="/resources/testharnessreport.js"></script>
|
||||
<script>
|
||||
'use strict';
|
||||
|
||||
promise_test(async() => {
|
||||
var video = document.createElement('video');
|
||||
document.body.appendChild(video);
|
||||
video.src = "/images/pattern.ogv";
|
||||
await new Promise(resolve =>
|
||||
video.addEventListener('canplaythrough', () => resolve(), {once: true}));
|
||||
video.intrinsicSize = '400 x 500';
|
||||
assert_equals(video.getBoundingClientRect().width, 400, 'width');
|
||||
assert_equals(video.getBoundingClientRect().height, 500, 'height');
|
||||
assert_equals(video.videoWidth, 400, 'naturalWidth');
|
||||
assert_equals(video.videoHeight, 500, 'naturalHeight');
|
||||
|
||||
video.width = '800';
|
||||
assert_equals(video.getBoundingClientRect().width, 800, 'width');
|
||||
assert_equals(video.getBoundingClientRect().height, 1000, 'height');
|
||||
assert_equals(video.videoWidth, 400, 'naturalWidth');
|
||||
assert_equals(video.videoHeight, 500, 'naturalHeight');
|
||||
|
||||
video.style = 'height:800px;';
|
||||
assert_equals(video.getBoundingClientRect().width, 800, 'width');
|
||||
assert_equals(video.getBoundingClientRect().height, 800, 'height');
|
||||
assert_equals(video.videoWidth, 400, 'naturalWidth');
|
||||
assert_equals(video.videoHeight, 500, 'naturalHeight');
|
||||
|
||||
video.removeAttribute('width');
|
||||
assert_equals(video.getBoundingClientRect().width, 640, 'width');
|
||||
assert_equals(video.getBoundingClientRect().height, 800, 'height');
|
||||
assert_equals(video.videoWidth, 400, 'naturalWidth');
|
||||
assert_equals(video.videoHeight, 500, 'naturalHeight');
|
||||
}, 'Test intrinsicsize for html video element');
|
||||
</script>
|
||||
</body>
|
||||
|
|
@ -1 +0,0 @@
|
|||
Feature-Policy: unsized-media *
|
||||
|
|
@ -0,0 +1,21 @@
|
|||
<!DOCTYPE html>
|
||||
<script src="/resources/testharness.js"></script>
|
||||
<script src="/resources/testharnessreport.js"></script>
|
||||
<script src="resources/utils.js"></script>
|
||||
|
||||
<body>
|
||||
<script>
|
||||
'use strict';
|
||||
|
||||
promise_test(async t => {
|
||||
await waitForLoad(window);
|
||||
await timeOut(t, 1000);
|
||||
let element = document.createElement('input');
|
||||
element.autofocus = true;
|
||||
document.body.appendChild(element);
|
||||
await waitUntilStableAutofocusState();
|
||||
assert_equals(document.activeElement, element);
|
||||
}, 'Autofocus should work if an element with autofocus is inserted into a ' +
|
||||
'document which was loaded some time ago.');
|
||||
</script>
|
||||
</body>
|
||||
|
|
@ -0,0 +1,22 @@
|
|||
<!DOCTYPE html>
|
||||
<meta charset="utf-8">
|
||||
<script src="/resources/testharness.js"></script>
|
||||
<script src="/resources/testharnessreport.js"></script>
|
||||
<script src="resources/utils.js"></script>
|
||||
|
||||
<input autofocus id="i1">
|
||||
<input autofocus id="i2">
|
||||
<script>
|
||||
"use strict";
|
||||
|
||||
promise_test(async () => {
|
||||
const input1 = document.querySelector("#i1");
|
||||
const input2 = document.querySelector("#i2");
|
||||
input1.remove();
|
||||
input2.parentNode.insertBefore(input1, input2);
|
||||
|
||||
await waitUntilStableAutofocusState();
|
||||
assert_equals(document.activeElement, input2);
|
||||
}, 'The second autofocus element wins if the first autofocus element was ' +
|
||||
'disconnected and reconnected before flushing the autofocus candidates.');
|
||||
</script>
|
||||
|
|
@ -6,22 +6,21 @@
|
|||
|
||||
<script src="/resources/testharness.js"></script>
|
||||
<script src="/resources/testharnessreport.js"></script>
|
||||
<script src="resources/utils.js"></script>
|
||||
|
||||
<input autofocus>
|
||||
|
||||
<script>
|
||||
"use strict";
|
||||
|
||||
const input1 = document.querySelector("input");
|
||||
promise_test(async () => {
|
||||
const input1 = document.querySelector("input");
|
||||
const input2 = document.createElement("input");
|
||||
input2.autofocus = true;
|
||||
document.body.prepend(input2);
|
||||
|
||||
const input2 = document.createElement("input");
|
||||
input2.autofocus = true;
|
||||
document.body.prepend(input2);
|
||||
|
||||
step_timeout(() => {
|
||||
assert_equals(document.activeElement, input1);
|
||||
assert_not_equals(document.activeElement, input2);
|
||||
|
||||
done();
|
||||
}, 100);
|
||||
await waitUntilStableAutofocusState();
|
||||
assert_equals(document.activeElement, input1);
|
||||
assert_not_equals(document.activeElement, input2);
|
||||
}, 'The temporally first autofocus in the document wins, even if an element is inserted later that is previous in the document tree.');
|
||||
</script>
|
||||
|
|
|
|||
|
|
@ -6,22 +6,21 @@
|
|||
|
||||
<script src="/resources/testharness.js"></script>
|
||||
<script src="/resources/testharnessreport.js"></script>
|
||||
<script src="resources/utils.js"></script>
|
||||
|
||||
<input autofocus>
|
||||
|
||||
<script>
|
||||
"use strict";
|
||||
|
||||
const input1 = document.querySelector("input");
|
||||
promise_test(async () => {
|
||||
const input1 = document.querySelector("input");
|
||||
const input2 = document.createElement("input");
|
||||
input2.autofocus = true;
|
||||
document.body.appendChild(input2);
|
||||
|
||||
const input2 = document.createElement("input");
|
||||
input2.autofocus = true;
|
||||
document.body.appendChild(input2);
|
||||
|
||||
step_timeout(() => {
|
||||
assert_equals(document.activeElement, input1);
|
||||
assert_not_equals(document.activeElement, input2);
|
||||
|
||||
done();
|
||||
}, 100);
|
||||
await waitUntilStableAutofocusState();
|
||||
assert_equals(document.activeElement, input1);
|
||||
assert_not_equals(document.activeElement, input2);
|
||||
}, 'The first autofocus in the document wins, even if elements are inserted later.');
|
||||
</script>
|
||||
|
|
|
|||
|
|
@ -6,6 +6,7 @@
|
|||
|
||||
<script src="/resources/testharness.js"></script>
|
||||
<script src="/resources/testharnessreport.js"></script>
|
||||
<script src="resources/utils.js"></script>
|
||||
|
||||
<input autofocus>
|
||||
<input autofocus>
|
||||
|
|
@ -13,12 +14,11 @@
|
|||
<script>
|
||||
"use strict";
|
||||
|
||||
const [input1, input2] = document.querySelectorAll("input");
|
||||
promise_test(async () => {
|
||||
const [input1, input2] = document.querySelectorAll("input");
|
||||
|
||||
step_timeout(() => {
|
||||
await waitUntilStableAutofocusState();
|
||||
assert_equals(document.activeElement, input1);
|
||||
assert_not_equals(document.activeElement, input2);
|
||||
|
||||
done();
|
||||
}, 100);
|
||||
}, 'The first autofocus element in the document should win.');
|
||||
</script>
|
||||
|
|
|
|||
|
|
@ -0,0 +1,24 @@
|
|||
<!DOCTYPE html>
|
||||
<script src="/resources/testharness.js"></script>
|
||||
<script src="/resources/testharnessreport.js"></script>
|
||||
<script src="resources/utils.js"></script>
|
||||
|
||||
<iframe srcdoc="<input><script>document.querySelector('input').focus();</script>"></iframe>
|
||||
|
||||
<script>
|
||||
'use strict';
|
||||
|
||||
promise_test(async () => {
|
||||
await waitForLoad(window);
|
||||
let iframe = document.querySelector('iframe');
|
||||
assert_equals(document.activeElement, iframe, 'Prereq: IFRAME should be focused');
|
||||
|
||||
let input = document.createElement('input');
|
||||
input.autofocus = true;
|
||||
document.body.appendChild(input);
|
||||
|
||||
await waitUntilStableAutofocusState();
|
||||
assert_equals(document.activeElement, iframe, 'activeElement should not be changed');
|
||||
assert_not_equals(document.activeElement, input);
|
||||
}, 'If topDocument\'s focused area is not topDocument, autofocus is not processed.');
|
||||
</script>
|
||||
|
|
@ -0,0 +1,17 @@
|
|||
<!DOCTYPE html>
|
||||
<script src="/resources/testharness.js"></script>
|
||||
<script src="/resources/testharnessreport.js"></script>
|
||||
<script src="resources/utils.js"></script>
|
||||
|
||||
<iframe sandbox srcdoc="<input autofocus>"></iframe>
|
||||
|
||||
<script>
|
||||
'use strict';
|
||||
|
||||
promise_test(async () => {
|
||||
await waitForLoad(window);
|
||||
await waitUntilStableAutofocusState();
|
||||
assert_not_equals(document.activeElement, document.querySelector('iframe'));
|
||||
}, 'If the sandboxed automatic features browsing context flag is set, ' +
|
||||
'autofocus in the browsing context should not be handled.');
|
||||
</script>
|
||||
|
|
@ -0,0 +1,20 @@
|
|||
<!DOCTYPE html>
|
||||
<script src="/resources/testharness.js"></script>
|
||||
<script src="/resources/testharnessreport.js"></script>
|
||||
<script src="resources/utils.js"></script>
|
||||
|
||||
<textarea autofocus disabled></textarea>
|
||||
<select autofocus></select>
|
||||
|
||||
<script>
|
||||
'use strict';
|
||||
|
||||
promise_test(async () => {
|
||||
const [textarea, select] = document.querySelectorAll('[autofocus]');
|
||||
textarea.disabled = false;
|
||||
|
||||
await waitUntilStableAutofocusState();
|
||||
assert_equals(document.activeElement, textarea);
|
||||
assert_not_equals(document.activeElement, select);
|
||||
}, 'If the first autofocus element is not focusable, but becomes focusable before a frame, it should be focused.');
|
||||
</script>
|
||||
|
|
@ -0,0 +1,3 @@
|
|||
#first {
|
||||
display: none;
|
||||
}
|
||||
|
|
@ -0,0 +1,5 @@
|
|||
<!DOCTYPE html>
|
||||
<body>
|
||||
<div id="anchor1"></div>
|
||||
<input autofocus>
|
||||
</body>
|
||||
|
|
@ -0,0 +1,10 @@
|
|||
<!DOCTYPE html>
|
||||
<body>
|
||||
<script>
|
||||
const input = document.createElement('input');
|
||||
input.autofocus = true;
|
||||
document.body.appendChild(input);
|
||||
input.autofocus = false;
|
||||
window.opener.document.body.appendChild(input);
|
||||
</script>
|
||||
</body>
|
||||
|
|
@ -6,6 +6,19 @@ function waitForEvent(target, type, options) {
|
|||
});
|
||||
}
|
||||
|
||||
function waitForAnimationFrame(w) {
|
||||
let targetWindow = w || window;
|
||||
return new Promise((resolve, reject) => {
|
||||
targetWindow.requestAnimationFrame(resolve);
|
||||
});
|
||||
}
|
||||
|
||||
function waitForEvent(target, type, options) {
|
||||
return new Promise((resolve, reject) => {
|
||||
target.addEventListener(type, resolve, options);
|
||||
});
|
||||
}
|
||||
|
||||
function waitForLoad(target) {
|
||||
return waitForEvent(target, 'load');
|
||||
}
|
||||
|
|
@ -21,7 +34,9 @@ function timeOut(test, ms) {
|
|||
// function.
|
||||
// Exception: If the document has script-blocking style sheets, this function
|
||||
// doesn't work well.
|
||||
async function waitUntilStableAutofocusState(test) {
|
||||
// TODO: Update this for https://github.com/web-platform-tests/wpt/pull/17929
|
||||
await timeOut(test, 100);
|
||||
async function waitUntilStableAutofocusState(w) {
|
||||
let targetWindow = w || window;
|
||||
// Awaiting two animation frames is an easy way to determine autofocus state.
|
||||
await waitForAnimationFrame(targetWindow);
|
||||
await waitForAnimationFrame(targetWindow);
|
||||
}
|
||||
|
|
|
|||
|
|
@ -0,0 +1,17 @@
|
|||
<!DOCTYPE html>
|
||||
<script src="/resources/testharness.js"></script>
|
||||
<script src="/resources/testharnessreport.js"></script>
|
||||
<script src="resources/utils.js"></script>
|
||||
<script>
|
||||
'use strict';
|
||||
|
||||
promise_test(async () => {
|
||||
let w = window.open('resources/moving-autofocus-to-parent.html');
|
||||
await waitForLoad(w);
|
||||
await waitUntilStableAutofocusState(w);
|
||||
assert_equals(w.document.activeElement, w.document.body);
|
||||
assert_equals(document.activeElement, document.body);
|
||||
w.close();
|
||||
}, 'Autofocus elements queued in another top-level browsing context\'s ' +
|
||||
'documents should be skipped.');
|
||||
</script>
|
||||
|
|
@ -0,0 +1,32 @@
|
|||
<!DOCTYPE html>
|
||||
<script src="/resources/testharness.js"></script>
|
||||
<script src="/resources/testharnessreport.js"></script>
|
||||
<script src="resources/utils.js"></script>
|
||||
|
||||
<iframe src="resources/frame-with-autofocus-element.html#anchor1"></iframe>
|
||||
<iframe src="resources/frame-with-autofocus-element.html#non-existent-anchor"></iframe>
|
||||
|
||||
<script>
|
||||
'use strict';
|
||||
|
||||
promise_test(async () => {
|
||||
await waitForLoad(window);
|
||||
await waitUntilStableAutofocusState();
|
||||
assert_equals(document.activeElement, document.body,
|
||||
'Autofocus elements in iframes should not be focused.');
|
||||
|
||||
let input = document.createElement('input');
|
||||
input.autofocus = true;
|
||||
document.body.appendChild(input);
|
||||
await waitUntilStableAutofocusState();
|
||||
assert_equals(document.activeElement, input);
|
||||
}, 'Autofocus elements in iframed documents with URL fragments should be skipped.');
|
||||
|
||||
promise_test(async () => {
|
||||
let w = window.open('resources/frame-with-autofocus-element.html#xpointer(//body)');
|
||||
await waitForLoad(w);
|
||||
await waitUntilStableAutofocusState(w);
|
||||
assert_equals(w.document.activeElement, w.document.body);
|
||||
w.close();
|
||||
}, 'Autofocus elements in top-level browsing context\'s documents with URI fragments should be skipped.');
|
||||
</script>
|
||||
|
|
@ -0,0 +1,19 @@
|
|||
<!DOCTYPE html>
|
||||
<script src="/resources/testharness.js"></script>
|
||||
<script src="/resources/testharnessreport.js"></script>
|
||||
<script src="resources/utils.js"></script>
|
||||
|
||||
<textarea autofocus disabled></textarea>
|
||||
<select autofocus></select>
|
||||
|
||||
<script>
|
||||
'use strict';
|
||||
|
||||
promise_test(async () => {
|
||||
const [textarea, select] = document.querySelectorAll('[autofocus]');
|
||||
|
||||
await waitUntilStableAutofocusState();
|
||||
assert_not_equals(document.activeElement, textarea);
|
||||
assert_equals(document.activeElement, select);
|
||||
}, 'Non-focusable autofocus element is skipped.');
|
||||
</script>
|
||||
|
|
@ -0,0 +1,18 @@
|
|||
<!DOCTYPE html>
|
||||
<script src="/resources/testharness.js"></script>
|
||||
<script src="/resources/testharnessreport.js"></script>
|
||||
<script src="resources/utils.js"></script>
|
||||
|
||||
<iframe srcdoc="<input autofocus><script>window.frameElement.remove();</script>"></iframe>
|
||||
|
||||
<script>
|
||||
'use strict';
|
||||
|
||||
promise_test(async () => {
|
||||
let iframe = document.querySelector('iframe');
|
||||
let iframeDocument = iframe.contentDocument;
|
||||
await waitForLoad(window);
|
||||
assert_not_equals(document.activeElement, iframe);
|
||||
assert_equals(iframeDocument.activeElement, iframeDocument.body);
|
||||
}, 'Autofocus element in not-fully-active document should be skipped.');
|
||||
</script>
|
||||
|
|
@ -0,0 +1,17 @@
|
|||
<!DOCTYPE html>
|
||||
<script src="/resources/testharness.js"></script>
|
||||
<script src="/resources/testharnessreport.js"></script>
|
||||
<script src="resources/utils.js"></script>
|
||||
<link rel="stylesheet" href="resources/erase-first.css?pipe=trickle(d1)">
|
||||
|
||||
<input id="first" autofocus>
|
||||
<input id="second" autofocus>
|
||||
|
||||
<script>
|
||||
'use strict';
|
||||
|
||||
promise_test(async () => {
|
||||
await waitForEvent(document.body, 'focus', {capture:true});
|
||||
assert_equals(document.activeElement.id, 'second');
|
||||
}, 'Script-blocking style sheet should pause flushing autofocus candidates.');
|
||||
</script>
|
||||
|
|
@ -11,7 +11,7 @@ promise_test(async t => {
|
|||
await waitForLoad(w);
|
||||
t.add_cleanup(() => { w.close(); });
|
||||
w.document.body.innerHTML = '<div contenteditable=true autofocus></div>';
|
||||
await waitUntilStableAutofocusState(t);
|
||||
await waitUntilStableAutofocusState(w);
|
||||
assert_equals(w.document.activeElement.tagName, 'DIV');
|
||||
}, 'Contenteditable element should support autofocus');
|
||||
|
||||
|
|
@ -20,7 +20,7 @@ promise_test(async t => {
|
|||
await waitForLoad(w);
|
||||
t.add_cleanup(() => { w.close(); });
|
||||
w.document.body.innerHTML = '<span tabindex=0></span>';
|
||||
await waitUntilStableAutofocusState(t);
|
||||
await waitUntilStableAutofocusState(w);
|
||||
assert_equals(w.document.activeElement.tagName, 'SPAN');
|
||||
}, 'Element with tabindex should support autofocus');
|
||||
|
||||
|
|
@ -31,7 +31,7 @@ promise_test(async t => {
|
|||
let element = w.document.createElementNS('uri1', 'prefix:local');
|
||||
element.setAttribute('autofocus', '');
|
||||
w.document.body.appendChild(element);
|
||||
await waitUntilStableAutofocusState(t);
|
||||
await waitUntilStableAutofocusState(w);
|
||||
assert_equals(w.document.activeElement.tagName, 'BODY');
|
||||
}, 'Non-HTMLElement should not support autofocus');
|
||||
</script>
|
||||
|
|
|
|||
|
|
@ -0,0 +1,41 @@
|
|||
<!DOCTYPE html>
|
||||
<script src="/resources/testharness.js"></script>
|
||||
<script src="/resources/testharnessreport.js"></script>
|
||||
<link rel="help" href="https://html.spec.whatwg.org/C/#update-the-rendering">
|
||||
|
||||
<body>
|
||||
<script>
|
||||
'use strict';
|
||||
|
||||
async_test(t => {
|
||||
t.events = [];
|
||||
|
||||
let iframe = document.createElement('iframe');
|
||||
iframe.addEventListener('load', t.step_func(() => {
|
||||
let w = iframe.contentWindow;
|
||||
w.requestAnimationFrame(t.step_func(() => {
|
||||
t.events.push('animationFrame');
|
||||
w.requestAnimationFrame(t.step_func(() => {
|
||||
t.events.push('animationFrame-should-not-be-recorded');
|
||||
}));
|
||||
}));
|
||||
let element = w.document.createElement('input');
|
||||
element.autofocus = true;
|
||||
element.addEventListener('focus', t.step_func(() => {
|
||||
t.events.push('autofocus');
|
||||
iframe.style.width = '71px';
|
||||
}));
|
||||
|
||||
w.addEventListener('resize', t.step_func_done(() => {
|
||||
t.events.push('resize');
|
||||
assert_array_equals(t.events, ['animationFrame', 'autofocus', 'resize']);
|
||||
}));
|
||||
|
||||
w.document.body.appendChild(element);
|
||||
}));
|
||||
document.body.appendChild(iframe);
|
||||
}, '"Flush autofocus candidates" should be happen after the first animation ' +
|
||||
'frame callbacks, and before a resize event in the next iteration of ' +
|
||||
'window event loop.');
|
||||
</script>
|
||||
</body>
|
||||
|
|
@ -106,7 +106,8 @@
|
|||
{conditions: {max: "5", value: "1abc"}, expected: false, name: "[target] The value is not a number"},
|
||||
{conditions: {max: "5", value: "6"}, expected: true, name: "[target] The value is greater than max(integer)"},
|
||||
{conditions: {max: "-5.5", value: "-5.4"}, expected: true, name: "[target] The value is greater than max(floating number)"},
|
||||
{conditions: {max: "-5e-1", value: "5e+2"}, expected: true, name: "[target] The value is greater than max(scientific notation)"}
|
||||
{conditions: {max: "-1", value: "-.8"}, expected: true, name: "[target] The value is greater than max(special floating number)"},
|
||||
{conditions: {max: "-5e-1", value: "5e+2"}, expected: true, name: "[target] The value is greater than max(scientific notation)"},
|
||||
]
|
||||
}
|
||||
];
|
||||
|
|
|
|||
|
|
@ -104,6 +104,7 @@
|
|||
{conditions: {min: "5", value: "6abc"}, expected: false, name: "[target] The value is not a number"},
|
||||
{conditions: {min: "6", value: "5"}, expected: true, name: "[target] The value is less than min(integer)"},
|
||||
{conditions: {min: "-5.4", value: "-5.5"}, expected: true, name: "[target] The value is less than min(floating number)"},
|
||||
{conditions: {min: "1", value: "-.8"}, expected: true, name: "[target] The value is less than min(special floating number)"},
|
||||
{conditions: {min: "5e+2", value: "-5e-1"}, expected: true, name: "[target] The value is less than min(scientific notation)"}
|
||||
]
|
||||
}
|
||||
|
|
|
|||
|
|
@ -66,7 +66,8 @@
|
|||
types: ["number"],
|
||||
testData: [
|
||||
{conditions: {step: "", value: "1"}, expected: false, name: "[target] The step attribute is not set"},
|
||||
{conditions: {step: 2 * 1 * 1, value: ""}, expected: false, name: "[target] The value attibute is empty string"},
|
||||
{conditions: {step: "", value: "-.8"}, expected: true, name: "[target] The step attribute is not set and the value attribute is a floating number"},
|
||||
{conditions: {step: 2 * 1 * 1, value: ""}, expected: false, name: "[target] The value attribute is empty string"},
|
||||
{conditions: {step: 2 * 1 * 1, value: "2"}, expected: false, name: "[target] The value must match the step"},
|
||||
{conditions: {step: 2 * 1 * 1, value: "3"}, expected: true, name: "[target] The value must mismatch the step"}
|
||||
]
|
||||
|
|
|
|||
Loading…
Add table
Add a link
Reference in a new issue