Bug 1635554 [wpt PR 23404] - New image-resolution tests, a=testonly

Automatic update from web-platform-tests
New image-resolution tests (#23404)

Co-authored-by: Mike <mike@qtunes.org>
--

wpt-commits: 6b55f8a01ed6899d55117cdd61f6d5e92ec0b431
wpt-pr: 23404
This commit is contained in:
Mike Bremford 2020-05-20 16:59:59 +00:00 коммит произвёл moz-wptsync-bot
Родитель 9abef2ab87
Коммит 21c2bf159b
15 изменённых файлов: 217 добавлений и 0 удалений

Просмотреть файл

@ -0,0 +1,18 @@
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>CSS Images Module Level 4: image-resolution set manually</title>
<link rel="author" title="Mike Bremford" href="http://bfo.com/">
<link rel="help" href="https://drafts.csswg.org/css-images-4/#propdef-image-resolution">
<link rel="match" href="../reference/100x100-blue.html">
<style>
img {
image-resolution: 14.4dpi;
}
</style>
</head>
<body>
<img src="../support/swatch-blue.png" />
</body>
</html>

Просмотреть файл

@ -0,0 +1,18 @@
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>CSS Images Module Level 4: image-resolution scaling up from image</title>
<link rel="author" title="Mike Bremford" href="http://bfo.com/">
<link rel="help" href="https://drafts.csswg.org/css-images-4/#propdef-image-resolution">
<link rel="match" href="../reference/100x100-blue.html">
<style>
img {
image-resolution: from-image;
}
</style>
</head>
<body>
<img src="support/swatch-blue-48dpi.png" />
</body>
</html>

Просмотреть файл

@ -0,0 +1,18 @@
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>CSS Images Module Level 4: image-resolution scaling down from image</title>
<link rel="author" title="Mike Bremford" href="http://bfo.com/">
<link rel="help" href="https://drafts.csswg.org/css-images-4/#propdef-image-resolution">
<link rel="match" href="../reference/100x100-blue.html">
<style>
img {
image-resolution: from-image;
}
</style>
</head>
<body>
<img src="support/swatch-blue-192dpi.png" />
</body>
</html>

Просмотреть файл

@ -0,0 +1,19 @@
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>CSS Images Module Level 4: units in filters are not affected by manual image-resolution</title>
<link rel="author" title="Mike Bremford" href="http://bfo.com/">
<link rel="help" href="https://drafts.csswg.org/css-images-4/#propdef-image-resolution">
<link rel="match" href="reference/100x100-blue-blur4px.html">
<style>
img {
image-resolution: 14.4dpi;
filter: blur(4px);
}
</style>
</head>
<body>
<img src="../support/swatch-blue.png" />
</body>
</html>

Просмотреть файл

@ -0,0 +1,19 @@
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>CSS Images Module Level 4: units in filters are not affected by image-resolution</title>
<link rel="author" title="Mike Bremford" href="http://bfo.com/">
<link rel="help" href="https://drafts.csswg.org/css-images-4/#propdef-image-resolution">
<link rel="match" href="reference/100x100-blue-blur4px.html">
<style>
img {
image-resolution: from-image;
filter: blur(4px);
}
</style>
</head>
<body>
<img src="support/swatch-blue-48dpi.png" />
</body>
</html>

Просмотреть файл

@ -0,0 +1,19 @@
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>CSS Images Module Level 4: units in filters are not affected by image-resolution</title>
<link rel="author" title="Mike Bremford" href="http://bfo.com/">
<link rel="help" href="https://drafts.csswg.org/css-images-4/#propdef-image-resolution">
<link rel="match" href="reference/100x100-blue-blur4px.html">
<style>
img {
image-resolution: from-image;
filter: blur(4px);
}
</style>
</head>
<body>
<img src="support/swatch-blue-192dpi.png" />
</body>
</html>

Просмотреть файл

@ -0,0 +1,18 @@
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>CSS Images Module Level 4: image-resolution scaling from image with animorphic aspect ratio</title>
<link rel="author" title="Mike Bremford" href="http://bfo.com/">
<link rel="help" href="https://drafts.csswg.org/css-images-4/#propdef-image-resolution">
<link rel="match" href="../reference/100x100-blue.html">
<style>
img {
image-resolution: from-image;
}
</style>
</head>
<body>
<img src="support/swatch-blue-48x192dpi.png" />
</body>
</html>

Просмотреть файл

@ -0,0 +1,21 @@
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>CSS Images Module Level 4: image-resolution set manually applies to background images</title>
<link rel="author" title="Mike Bremford" href="http://bfo.com/">
<link rel="help" href="https://drafts.csswg.org/css-images-4/#propdef-image-resolution">
<link rel="match" href="../reference/100x100-blue.html">
<style>
div {
width: 100px;
height: 100px;
image-resolution: 14.4dpi;
background: url("../support/swatch-blue.png") top left no-repeat;
}
</style>
</head>
<body>
<div></div>
</body>
</html>

Просмотреть файл

@ -0,0 +1,21 @@
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>CSS Images Module Level 4: image-resolution from images applies to background images</title>
<link rel="author" title="Mike Bremford" href="http://bfo.com/">
<link rel="help" href="https://drafts.csswg.org/css-images-4/#propdef-image-resolution">
<link rel="match" href="../reference/100x100-blue.html">
<style>
div {
width: 100px;
height: 100px;
image-resolution: from-image;
background: url("support/swatch-blue-48dpi.png") top left no-repeat;
}
</style>
</head>
<body>
<div></div>
</body>
</html>

Просмотреть файл

@ -0,0 +1,22 @@
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>CSS Images Module Level 4: image-resolution set manually applies to background images and filters are unaffected</title>
<link rel="author" title="Mike Bremford" href="http://bfo.com/">
<link rel="help" href="https://drafts.csswg.org/css-images-4/#propdef-image-resolution">
<link rel="match" href="reference/100x100-blue-blur4px.html">
<style>
div {
width: 100px;
height: 100px;
image-resolution: 14.4dpi;
background: url("../support/swatch-blue.png") top left no-repeat;
filter: blur(4px);
}
</style>
</head>
<body>
<div></div>
</body>
</html>

Просмотреть файл

@ -0,0 +1,22 @@
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>CSS Images Module Level 4: image-resolution set manually applies to background images and filters are unaffected</title>
<link rel="author" title="Mike Bremford" href="http://bfo.com/">
<link rel="help" href="https://drafts.csswg.org/css-images-4/#propdef-image-resolution">
<link rel="match" href="reference/100x100-blue-blur4px.html">
<style>
div {
width: 100px;
height: 100px;
/* Not exactly an image-resolution test, but confirming that background-size is applied before filter */
background: url("../support/swatch-blue.png") top left / 100px 100px no-repeat;
filter: blur(4px);
}
</style>
</head>
<body>
<div></div>
</body>
</html>

Просмотреть файл

@ -0,0 +1,2 @@
<!doctype html>
<div style="width: 100px;height: 100px;background-color: blue;filter:blur(4px)"></div>

Двоичный файл не отображается.

После

Ширина:  |  Высота:  |  Размер: 1.8 KiB

Двоичный файл не отображается.

После

Ширина:  |  Высота:  |  Размер: 1.6 KiB

Двоичный файл не отображается.

После

Ширина:  |  Высота:  |  Размер: 1.8 KiB