Update web-platform-tests to revision b'b728032f59a396243864b0f8584e7211e3632005'

This commit is contained in:
WPT Sync Bot 2022-11-10 01:22:36 +00:00
parent ace9b32b1c
commit df68c4e5d1
15632 changed files with 514865 additions and 155000 deletions

View file

@ -0,0 +1,20 @@
<!doctype html>
<meta charset="utf-8">
<title>Image dimensions are available synchronously after changing src to an already-loaded image</title>
<script src="/resources/testharness.js"></script>
<script src="/resources/testharnessreport.js"></script>
<link rel="help" href="https://bugzilla.mozilla.org/show_bug.cgi?id=1797798">
<img id="existing">
<script>
let src = "/images/green.png";
let existing = document.getElementById("existing");
async_test(function(t) {
let tmp = document.createElement("img");
tmp.src = src;
tmp.onload = t.step_func_done(function() {
existing.src = src;
assert_equals(existing.width, 100);
assert_equals(existing.height, 50);
});
});
</script>

View file

@ -0,0 +1,25 @@
<!DOCTYPE html>
<meta charset="utf-8">
<title>Inline image element blocks load until source is changed to empty source</title>
<script src="/resources/testharness.js"></script>
<script src="/resources/testharnessreport.js"></script>
<img src="/images/blue.png?pipe=trickle(d100)">
<script>
async_test(t => {
const image = document.querySelector("img");
assert_false(image.complete, "The image is loading initially");
// Complete the test as soon as we obtained the window "load" event,
// which should happen as soon as the image stops loading by moving
// to an empty source.
window.addEventListener("load", t.step_func_done(() => {
assert_true(image.complete, "The image is no longer loading once the window 'load' event is dispatched");
}));
// Stop loading the image.
image.src = "";
}, "Image element delays window's load event until the image changes to empty source");
</script>

View file

@ -39,7 +39,7 @@ onload = function() {
var expected = {wide:resolve(img.dataset.wide), narrow:resolve(img.dataset.narrow)};
var current = iframe.className;
var next = current === 'wide' ? 'narrow' : 'wide';
var expect_change = expected[next].indexOf('broken.png') === -1 && !('noChange' in img.dataset);
var expect_change = expected[next].indexOf('undecodable.png') === -1 && !('noChange' in img.dataset);
test(function() {
assert_equals(img.currentSrc, expected[current]);

View file

@ -1,5 +1,6 @@
<!DOCTYPE html>
<html>
<meta name="viewport" content="width=device-width,initial-scale=1,minimum-scale=1">
<style>
html { overflow: hidden; }
#change {

View file

@ -2,6 +2,7 @@
<html class="reftest-wait">
<title>Composited images correctly display under large scale transform changes</title>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width,initial-scale=1,minimum-scale=1">
<link rel="match" href="image-compositing-large-scale-change-ref.html"/>
<link rel="help" href="https://html.spec.whatwg.org/multipage/#the-img-element">
<style>

View file

@ -0,0 +1,2 @@
<!DOCTYPE html>
<img src="resources/image.png">

View file

@ -0,0 +1,14 @@
<!DOCTYPE html>
<html class="reftest-wait">
<link rel="author" title="Xianzhu Wang" href="mailto:wangxianzhu@chromium.org">
<link rel="help" href="https://html.spec.whatwg.org/multipage/urls-and-fetching.html#lazy-loading-attributes">
<link rel="help" href="https://crbug.com/1308299">
<link rel="match" href="image-loading-lazy-clip-path-ref.html">
<script src="/common/reftest-wait.js"></script>
<img id=target loading="lazy"
src="resources/image.png"
style="vertical-align: middle; clip-path: polygon(0 0, 110% 0, 110% 110%, 0 110%, 0 0)">
<script>
target.onload = takeScreenshot;
</script>
</html>

View file

@ -28,7 +28,7 @@
img.promise
.then(t.unreached_func("The image should not load."))
.catch(t.step_func_done());
.catch(t.step_func(() => { img.element().onload = t.step_func_done(); img.element().src = 'resources/image.png'; }));
}, "Test that when deferred image is loaded, it uses the latest crossorigin attribute.");
</script>

View file

@ -0,0 +1,2 @@
<!DOCTYPE html>
<img src="resources/image.png">

View file

@ -0,0 +1,24 @@
<!DOCTYPE html>
<html class="reftest-wait">
<head>
<title>Lazy loaded Images with data url placeholders can be overwritten by a src change</title>
<link rel="help" href="https://html.spec.whatwg.org/multipage/images.html#update-the-image-data">
<link rel="match" href="image-loading-lazy-data-url-to-https-ref.html">
<script src="/common/reftest-wait.js"></script>
</head>
<body>
<img id="image" loading="lazy" src="data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 872 490' width='872' height='490' style='background: green' %3E%3C/svg%3E">
<script>
const image = document.querySelector('#image');
window.onload = function() {
// trigger intersection observer through forced layout.
image.offsetWidth;
image.setAttribute("src", 'resources/image.png');
setTimeout(() => { takeScreenshot(); }, 100);
};
</script>
</body>
</html>

View file

@ -0,0 +1,25 @@
<!DOCTYPE html>
<html>
<title>Lazy loaded Images handle correctly when setting src to empty</title>
<link rel="help" href="https://html.spec.whatwg.org/multipage/images.html#update-the-image-data">
<div id=log></div>
<script src="/resources/testharness.js"></script>
<script src="/resources/testharnessreport.js"></script>
<img id="image" loading="lazy" src="resources/image.png">
<script>
const image = document.querySelector('#image');
async_test(function(t) {
image.onerror = t.step_func(function(e) {
assert_equals(e.type, "error", "null image source check failed");
image.onload = t.step_func(function() {
t.done();
});
image.src = "resources/image.png";
});
image.src = "";
}, "lazy loaded image and empty src");
</script>

View file

@ -10,8 +10,7 @@
<div style="height:1000vh;"></div>
<iframe id="iframe" src="resources/image-loading-lazy-in-viewport.html">
</iframe>
<iframe id="sandboxediframe" sandbox="allow-same-origin"
src="resources/subframe.html">
<iframe id="sandboxediframe" sandbox="allow-same-origin">
</iframe>
<script>
promise_test(async t => {

View file

@ -37,19 +37,24 @@
function changeImageSourceAndScrollToTop() {
top_div.scrollIntoView();
// Lazily load a "different" image.
image.src = 'resources/image.png?image-loading-lazy-multiple-times-second';
image.onload =
t.unreached_func("The loading=lazy below-viewport image should lazily " +
"load its second image, and not load it eagerly when " +
"the `src` attribute is changed");
// In 1s, scroll the image *back* into view, and record that it loads
// successfully.
// Allow some time for scroll back to top, since we don't
// want the image to still be in the viewport and trigger a
// load due to the scroll being slow.
t.step_timeout(() => {
image.onload = t.step_func_done();
image.scrollIntoView();
}, 1000);
// Lazily load a "different" image.
image.src = 'resources/image.png?image-loading-lazy-multiple-times-second';
image.onload =
t.unreached_func("The loading=lazy below-viewport image should lazily " +
"load its second image, and not load it eagerly when " +
"the `src` attribute is changed");
// In 1s, scroll the image *back* into view, and record that it loads
// successfully.
t.step_timeout(() => {
image.onload = t.step_func_done();
image.scrollIntoView();
}, 1000);
}, 500);
}
</script>
</body>

View file

@ -0,0 +1,19 @@
<!DOCTYPE html>
<meta charset="utf-8">
<title>Image with zero intersection area is lazy-loaded</title>
<link rel="author" title="Emilio Cobos Álvarez" href="mailto:emilio@crisal.io">
<link rel="author" title="Mozilla" href="https://mozilla.org">
<link rel="help" href="https://html.spec.whatwg.org/multipage/#the-img-element">
<link rel="help" href="https://html.spec.whatwg.org/#lazy-load-intersection-observer">
<link rel="help" href="https://bugzilla.mozilla.org/show_bug.cgi?id=1785186">
<script src="/resources/testharness.js"></script>
<script src="/resources/testharnessreport.js"></script>
<div style="height: 0; overflow: hidden;">
<img style="display: block" id=target loading="lazy" width="100" height="100">
</div>
<script>
async_test(function(t) {
target.addEventListener("load", t.step_func_done(function() {}));
target.src = "resources/image.png?zero-intersection-area";
});
</script>

View file

@ -95,8 +95,6 @@
<picture><source type=""><img src="/images/green-2x2.png" data-desc="parent is picture, previous source has type changed"></picture>
<picture><source type=""><img src="/images/green-2x2.png" data-desc="parent is picture, previous source has type removed"></picture>
<!-- should not invoke update the image data -->
<img srcset="/images/green-2x2.png" data-desc="srcset is set to same value">
<img srcset="/images/green-2x2.png" sizes data-desc="sizes is set to same value">
@ -475,11 +473,11 @@ onload = function() {
t('srcset is set to same value', function(img) {
img.srcset = "/images/green-2x2.png";
}, 'timeout');
}, 'load');
t('sizes is set to same value', function(img) {
img.sizes = '';
}, 'timeout');
}, 'load');
t('crossorigin state not changed: absent, removeAttribute', function(img) {
img.removeAttribute('crossorigin');

View file

@ -0,0 +1,32 @@
<!DOCTYPE html>
<title>Scrolling a lazy loaded image into view in an iframe</title>
<script src='/resources/testharness.js'></script>
<script src='/resources/testharnessreport.js'></script>
<iframe onload="async_test(this.contentWindow.run)" srcdoc="
<!DOCTYPE html>
<script src='/resources/testharness.js'></script>
<script src='/resources/testharnessreport.js'></script>
<script src='../resources/common.js'></script>
<h1>Scroll down...</h1>
<p>Scroll down...</p>
<p>Scroll down...</p>
<img id='below_iframe_viewport_img' src='resources/image.png' loading='lazy'
onload='below_iframe_viewport_img.resolve();' onerror='below_iframe_viewport_img.reject();'>
<script>
const scroll_trigger_img = new ElementLoadPromise('visible');
const below_iframe_viewport_img = new ElementLoadPromise('below_iframe_viewport_img');
function run(t) {
below_iframe_viewport_img.element().scrollIntoView();
below_iframe_viewport_img.promise
.then(t.step_func(() => {
assert_not_equals(below_iframe_viewport_img.element().width, 0, 'width should be greater than zero after scrolling');
assert_not_equals(below_iframe_viewport_img.element().height, 0, 'height should be greater than zero after scrolling');
t.done();
}))
.catch(t.unreached_func('The below_iframe_viewport image should load'));
};
</script>
"></iframe>

View file

@ -82,7 +82,7 @@
<img srcset='/images/green-1x1.png?e60 50w, /images/green-16x16.png?e60 51w' sizes='(min-width:0) or (min-width:-1px) 1px'>
<img srcset='/images/green-1x1.png?e61 50w, /images/green-16x16.png?e61 51w' sizes='(min-width:0) or (unknown "general-enclosed") 1px'>
<img srcset='/images/green-1x1.png?e62 50w, /images/green-16x16.png?e62 51w' sizes='(min-width:0) or unknown-general-enclosed(foo) 1px'>
<img srcset='/images/green-1x1.png?e63 50w, /images/green-16x16.png?e63 51w' sizes='(min-width:0) or (!) 100vw, 1px'>
<img srcset='/images/green-1x1.png?e63 50w, /images/green-16x16.png?e63 51w' sizes='(min-width:0) or (]) 100vw, 1px'>
<img srcset='/images/green-1x1.png?e64 50w, /images/green-16x16.png?e64 51w' sizes='(min-width:0) or unknown-media-type 100vw, 1px'>
<img srcset='/images/green-1x1.png?e65 50w, /images/green-16x16.png?e65 51w' sizes='(123) 100vw, 1px'>
<img srcset='/images/green-1x1.png?e66 50w, /images/green-16x16.png?e66 51w' sizes='not (123) 100vw, 1px'>

View file

@ -0,0 +1,38 @@
<!DOCTYPE html>
<title>An img's current request should be updated in a microtask after selecting an image source</title>
<script src="/resources/testharness.js"></script>
<script src="/resources/testharnessreport.js"></script>
<div id=log></div>
<script>
async_test(function(t) {
const picture = document.createElement("picture");
const nonMatchingSource = document.createElement("source");
nonMatchingSource.media = "not all";
nonMatchingSource.srcset = "data:,a";
picture.append(nonMatchingSource);
const matchingSource = document.createElement("source");
matchingSource.media = "all";
matchingSource.srcset = "data:,b";
picture.append(matchingSource);
const img = document.createElement("img");
img.src = "data:,c";
assert_equals(img.currentSrc, "", "after assigning to img.src but before the corresponding microtask is run");
queueMicrotask(t.step_func(function() {
assert_equals(img.currentSrc, "data:,c", "after assigning to img.src and after corresponding microtask is run");
picture.append(img);
assert_equals(img.currentSrc, "data:,c", "after appending img to picture but before the corresponding microtask is run");
queueMicrotask(t.step_func(function() {
assert_equals(img.currentSrc, "data:,b", "after appending img to picture and after the corresponding microtask is run");
t.done();
}));
}));
}, "currentSrc is updated only after the microtask that updates the current request is run");
</script>