diff options
| author | Daniel Baumann <daniel.baumann@progress-linux.org> | 2024-04-07 09:22:09 +0000 |
|---|---|---|
| committer | Daniel Baumann <daniel.baumann@progress-linux.org> | 2024-04-07 09:22:09 +0000 |
| commit | 43a97878ce14b72f0981164f87f2e35e14151312 (patch) | |
| tree | 620249daf56c0258faa40cbdcf9cfba06de2a846 /testing/web-platform/tests/content-dpr | |
| parent | Initial commit. (diff) | |
| download | firefox-43a97878ce14b72f0981164f87f2e35e14151312.tar.xz firefox-43a97878ce14b72f0981164f87f2e35e14151312.zip | |
Adding upstream version 110.0.1.upstream/110.0.1upstream
Signed-off-by: Daniel Baumann <daniel.baumann@progress-linux.org>
Diffstat (limited to 'testing/web-platform/tests/content-dpr')
15 files changed, 332 insertions, 0 deletions
diff --git a/testing/web-platform/tests/content-dpr/content-dpr-various-elements-ref.html b/testing/web-platform/tests/content-dpr/content-dpr-various-elements-ref.html new file mode 100644 index 0000000000..9a7e10e51b --- /dev/null +++ b/testing/web-platform/tests/content-dpr/content-dpr-various-elements-ref.html @@ -0,0 +1,48 @@ +<html> + <head> + <title>Content-DPR: various elements</title> + <link rel="author" title="Noam Rosenthal" href="noam@webkit.org"> + <meta name="assert" content="Assert that content-dpr is taken into account for images in all relevant elements (input/canvas/svg/video-poster)"> + <style> + .row { + display: flex; + } + + .row > * { + object-fit: none; + object-position: top left; + margin: 5px; + width: 100px; + height: 100px; + background: yellow; + } + </style> + <script> + document.addEventListener("DOMContentLoaded", () => { + const canvas = document.getElementById('canvas') + const image = new Image() + image.onload = () => { + const ctx = canvas.getContext('2d') + ctx.drawImage(image, 0, 0, 50, 50) + } + image.src = "resources/square.png" + }); + </script> + </head> + <body> + <p>There following green boxes should all be 50px by 50px (cover 25% of the yellow boxes)</p> + <div class="row"> + <div> + <img src="resources/square.png" width="50" height="50" /> + </div> + <div> + <video poster="resources/square.png" width="50" height="50"></video> + </div> + <svg xmlns="http://www.w3.org/2000/svg" ><image href="resources/square.png" width="50" height="50" /></svg> + <div> + <input type="image" src="resources/square.png" width="50" height="50" /> + </div> + <canvas id="canvas" width="100" height="100"> + </div> + </body> +</html> diff --git a/testing/web-platform/tests/content-dpr/content-dpr-various-elements.html b/testing/web-platform/tests/content-dpr/content-dpr-various-elements.html new file mode 100644 index 0000000000..728ef264e9 --- /dev/null +++ b/testing/web-platform/tests/content-dpr/content-dpr-various-elements.html @@ -0,0 +1,47 @@ +<html> + <head> + <title>Content-DPR: various elements</title> + <link rel="author" title="Noam Rosenthal" href="noam@webkit.org"> + <link rel="match" href="content-dpr-various-elements-ref.html" /> + <meta name="assert" content="Assert that content-dpr is taken into account for images in all relevant elements (input/canvas/svg/video-poster)"> + <style> + .row { + display: flex; + } + + .row > * { + object-fit: none; + object-position: top left; + margin: 5px; + width: 100px; + height: 100px; + background: yellow; + } + </style> + <script> + document.addEventListener("DOMContentLoaded", () => { + const canvas = document.getElementById('canvas') + const image = new Image() + image.onload = () => { + const ctx = canvas.getContext('2d') + ctx.drawImage(image, 0, 0) + } + image.src = "resources/dpr.py?name=square.png&mimeType=image/png&dpr=2&cacheKiller=canvas" + }); + </script> + </head> + <body> + <p>There following green boxes should all be 50px by 50px (cover 25% of the yellow boxes)</p> + <div class="row"> + <div> + <img src="resources/square.png" width="50" height="50" /> + </div> + <video poster="resources/dpr.py?name=square.png&mimeType=image/png&dpr=2&cacheKiller=2"></video> + <svg xmlns="http://www.w3.org/2000/svg" ><image href="resources/dpr.py?name=square.png&mimeType=image/png&dpr=2&cacheKiller=3" /></svg> + <div> + <input type="image" src="resources/dpr.py?name=square.png&mimeType=image/png&dpr=2&cacheKiller=4" /> + </div> + <canvas id="canvas" width="100" height="100"> + </div> + </body> +</html> diff --git a/testing/web-platform/tests/content-dpr/image-pseudo-element-content-dpr-ref.html b/testing/web-platform/tests/content-dpr/image-pseudo-element-content-dpr-ref.html new file mode 100644 index 0000000000..baa25ac87c --- /dev/null +++ b/testing/web-platform/tests/content-dpr/image-pseudo-element-content-dpr-ref.html @@ -0,0 +1,12 @@ +<html> + <head> + <title>Content-DPR: pseudo elements</title> + <link rel="author" title="Noam Rosenthal" href="noam@webkit.org"> + <meta name="assert" content="Assert that content-dpr is taken into account for images in pseudo-elements"> + </head> + <body> + The following squares should be identical <br /> + <img src="resources/square.png" width="50" /> + <img src="resources/square.png" width="50" /> + </body> +</html> diff --git a/testing/web-platform/tests/content-dpr/image-pseudo-element-content-dpr.html b/testing/web-platform/tests/content-dpr/image-pseudo-element-content-dpr.html new file mode 100644 index 0000000000..7770df3999 --- /dev/null +++ b/testing/web-platform/tests/content-dpr/image-pseudo-element-content-dpr.html @@ -0,0 +1,17 @@ +<html> + <head> + <title>Content-DPR: pseudo elements</title> + <link rel="author" title="Noam Rosenthal" href="noam@webkit.org"> + <link rel="match" href="image-pseudo-element-content-dpr-ref.html" /> + <meta name="assert" content="Assert that content-dpr is taken into account for images in pseudo-elements"> + <style> + body::after { + content: url(resources/dpr.py?name=square.png&mimeType=image/png&dpr=2); + } + </style> + </head> + <body> + The following squares should be identical <br /> + <img src="resources/square.png" width="50" /> + </body> +</html> diff --git a/testing/web-platform/tests/content-dpr/image-with-content-dpr-and-explicit-dimensions-ref.html b/testing/web-platform/tests/content-dpr/image-with-content-dpr-and-explicit-dimensions-ref.html new file mode 100644 index 0000000000..27ce1be8b0 --- /dev/null +++ b/testing/web-platform/tests/content-dpr/image-with-content-dpr-and-explicit-dimensions-ref.html @@ -0,0 +1,10 @@ +<html> + <head> + <title>Content-DPR: render natural size</title> + <link rel="author" title="Noam Rosenthal" href="noam@webkit.org"> + </head> + <body> + <img src="resources/square.png" style="width: 100px; height: 120px" /> + <img src="resources/square.png" style="width: 100px; height: 120px" /> + </body> +</html> diff --git a/testing/web-platform/tests/content-dpr/image-with-content-dpr-and-explicit-dimensions.html b/testing/web-platform/tests/content-dpr/image-with-content-dpr-and-explicit-dimensions.html new file mode 100644 index 0000000000..783fb03a3b --- /dev/null +++ b/testing/web-platform/tests/content-dpr/image-with-content-dpr-and-explicit-dimensions.html @@ -0,0 +1,12 @@ +<html> + <head> + <title>Content-DPR: with size attributes</title> + <link rel="author" title="Noam Rosenthal" href="noam@webkit.org"> + <link rel="match" href="image-with-content-dpr-and-explicit-dimensions-ref.html" /> + <meta name="assert" content="Assert explicit width/height attributes to supercede content-dpr"> + </head> + <body> + <img src="resources/dpr.py?name=square.png&mimeType=image/png&dpr=4.0" width="100px" height="120px" /> + <img src="resources/dpr.py?name=square.png&mimeType=image/png&dpr=4.0" style="width: 100px; height: 120px;" /> + </body> +</html> diff --git a/testing/web-platform/tests/content-dpr/image-with-dpr-header.html b/testing/web-platform/tests/content-dpr/image-with-dpr-header.html new file mode 100644 index 0000000000..bfa1509d46 --- /dev/null +++ b/testing/web-platform/tests/content-dpr/image-with-dpr-header.html @@ -0,0 +1,40 @@ +<!DOCTYPE html> +<body> +<script src="/resources/testharness.js"></script> +<script src="/resources/testharnessreport.js"></script> +<img id="int_dpr" src="resources/dpr.py?name=square.png&mimeType=image/png&dpr=4.0"> +<img id="fractional_dpr" src="resources/dpr.py?name=square.png&mimeType=image/png&dpr=2.5"> +<img id="smaller_than_one" src="resources/dpr.py?name=square.png&mimeType=image/png&dpr=0.5"> +<img id="srcset" srcset="resources/square.png 4x"> +<img id="invalid" src="resources/dpr.py?name=square.png&mimeType=image/png&dpr=xx"> +<img id="invalid_negative" src="resources/dpr.py?name=square.png&mimeType=image/png&dpr=-2"> +<img id="invalid_zero" src="resources/dpr.py?name=square.png&mimeType=image/png&dpr=0"> +<img id="header_and_srcset_invalid" srcset="resources/dpr.py?name=square.png&mimeType=image/png&dpr=xx 4x"> +<img id="header_and_srcset_valid" srcset="resources/dpr.py?name=square.png&mimeType=image/png&dpr=4.0 2x"> +<img id="explicit_width" src="resources/dpr.py?name=square.png&mimeType=image/png&dpr=4.0" width="100" height="100"> +<img id="double_dpr" src="resources/dpr.py?name=square.png&mimeType=image/png&dpr=4.0&double=4.0"> +<img id="double_dpr_different_values" src="resources/dpr.py?name=square.png&mimeType=image/png&dpr=4.0&double=2.5"> + +<script> + let run_test = () => { + test(() => { + assert_equals(document.getElementById("int_dpr").naturalWidth, 25, "Integer Content-DPR header value") + assert_equals(document.getElementById("fractional_dpr").naturalWidth, 40, "Fractional Content-DPR header value") + assert_equals(document.getElementById("smaller_than_one").naturalWidth, 200, "Smaller than one Content-DPR header value") + assert_equals(document.getElementById("srcset").naturalWidth, 25, "srcset") + assert_equals(document.getElementById("invalid").naturalWidth, 100, "Invalid Content-DPR header value") + assert_equals(document.getElementById("invalid_negative").naturalWidth, 100, "Negative Content-DPR header value") + assert_equals(document.getElementById("invalid_zero").naturalWidth, 100, "Zero Content-DPR header value") + assert_equals(document.getElementById("header_and_srcset_invalid").naturalWidth, 25, "Invalid Content-DPR header value with valid srcset") + assert_equals(document.getElementById("header_and_srcset_valid").naturalWidth, 25, "Value Content-DPR header value and srcset") + assert_equals(document.getElementById("explicit_width").naturalWidth, 25, "Explicit width attribute") + assert_equals(document.getElementById("double_dpr").naturalWidth, 25, "Double Content-DPR header") + assert_equals(document.getElementById("double_dpr_different_values").naturalWidth, 40, "Double Content-DPR header different values") + + }, "Test the image dimensions of different DPR sizes"); + } + window.addEventListener("load", run_test); +</script> + +</body> +</html> diff --git a/testing/web-platform/tests/content-dpr/resources/background.png b/testing/web-platform/tests/content-dpr/resources/background.png Binary files differnew file mode 100644 index 0000000000..6db6c6b1b9 --- /dev/null +++ b/testing/web-platform/tests/content-dpr/resources/background.png diff --git a/testing/web-platform/tests/content-dpr/resources/background.svg b/testing/web-platform/tests/content-dpr/resources/background.svg new file mode 100644 index 0000000000..b2c544ed2d --- /dev/null +++ b/testing/web-platform/tests/content-dpr/resources/background.svg @@ -0,0 +1,8 @@ +<?xml version="1.0" standalone="yes"?> + +<svg version="1.1" viewBox="0 0 32 32" width="32" height="32" fill="none" stroke="none" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink"> +<rect x="0" y="0" width="16" height="16" fill="#c0c0c0" /> +<rect x="16" y="0" width="16" height="16" fill="#ffffff" /> +<rect x="0" y="16" width="16" height="16" fill="#ffffff" /> +<rect x="16" y="16" width="16" height="16" fill="#c0c0c0" /> +</svg> diff --git a/testing/web-platform/tests/content-dpr/resources/dpr.py b/testing/web-platform/tests/content-dpr/resources/dpr.py new file mode 100644 index 0000000000..969ac2458d --- /dev/null +++ b/testing/web-platform/tests/content-dpr/resources/dpr.py @@ -0,0 +1,26 @@ +from wptserve.utils import isomorphic_decode + +def main(request, response): + """ + Simple handler that sets a response header based on which client hint + request headers were received. + """ + + response.headers.append(b"Access-Control-Allow-Origin", b"*") + values = request.GET + name = values.first(b'name') + type = values.first(b'mimeType') + dpr = values.first(b'dpr') + double = None + if b'double' in values: + double = values.first(b'double') + image_path = request.doc_root + u"/".join(request.url_parts[2].split(u"/")[:-1]) + u"/" + isomorphic_decode(name) + f = open(image_path, "rb") + buff = f.read() + f.close() + response.headers.set(b"Content-Type", type) + response.headers.set(b"Content-DPR", dpr) + if double: + response.headers.append(b"Content-DPR", double) + response.headers.set(b"Content-Length", len(buff)) + response.content = buff diff --git a/testing/web-platform/tests/content-dpr/resources/square.png b/testing/web-platform/tests/content-dpr/resources/square.png Binary files differnew file mode 100644 index 0000000000..01c9666a8d --- /dev/null +++ b/testing/web-platform/tests/content-dpr/resources/square.png diff --git a/testing/web-platform/tests/content-dpr/tiled-background-image-with-content-dpr-ref.html b/testing/web-platform/tests/content-dpr/tiled-background-image-with-content-dpr-ref.html new file mode 100644 index 0000000000..58cbeb436f --- /dev/null +++ b/testing/web-platform/tests/content-dpr/tiled-background-image-with-content-dpr-ref.html @@ -0,0 +1,29 @@ +<html> + <head> + <title>Content-DPR: css tiled background</title> + <link rel="author" title="Noam Rosenthal" href="noam@webkit.org"> + <meta name="assert" content="Assert that content-dpr is taken into account for tiled background images"> + <style> + #bg, #bg2 { + background-image: url(resources/background.png); + width: 32px; + height: 32px; + } + #bg { + background-size: 16px 16px; + } + + #bg2 { + background-size: 8px 8px; + } + </style> + </head> + <body> + The next div should have 16 boxes + <div id="bg"> + </div> + The next div should have 64 boxes + <div id="bg2"> + </div> + </body> +</html> diff --git a/testing/web-platform/tests/content-dpr/tiled-background-image-with-content-dpr.html b/testing/web-platform/tests/content-dpr/tiled-background-image-with-content-dpr.html new file mode 100644 index 0000000000..94f2f72d40 --- /dev/null +++ b/testing/web-platform/tests/content-dpr/tiled-background-image-with-content-dpr.html @@ -0,0 +1,27 @@ +<html> + <head> + <title>Content-DPR: css tiled background</title> + <link rel="author" title="Noam Rosenthal" href="noam@webkit.org"> + <link rel="match" href="tiled-background-image-with-content-dpr-ref.html" /> + <meta name="assert" content="Assert that content-dpr is taken into account for tiled background images"> + <style> + #bg, #bg2 { + width: 32px; + height: 32px; + background-image: url(resources/dpr.py?name=background.png&mimeType=image/png&dpr=2.0); + } + + #bg2 { + background-size: 8px 8px; + } + </style> + </head> + <body> + The next div should have 16 boxes + <div id="bg"> + </div> + The next div should have 64 boxes + <div id="bg2"> + </div> + </body> +</html> diff --git a/testing/web-platform/tests/content-dpr/tiled-background-svg-image-with-content-dpr-ref.html b/testing/web-platform/tests/content-dpr/tiled-background-svg-image-with-content-dpr-ref.html new file mode 100644 index 0000000000..cd8c7d3ea9 --- /dev/null +++ b/testing/web-platform/tests/content-dpr/tiled-background-svg-image-with-content-dpr-ref.html @@ -0,0 +1,29 @@ +<html> + <head> + <title>Content-DPR: css tiled background</title> + <link rel="author" title="Noam Rosenthal" href="noam@webkit.org"> + <meta name="assert" content="Assert that content-dpr is taken into account for tiled background images"> + <style> + #bg, #bg2 { + background-image: url(resources/background.svg); + width: 32px; + height: 32px; + } + #bg { + background-size: 16px 16px; + } + + #bg2 { + background-size: 8px 8px; + } + </style> + </head> + <body> + The next div should have 16 boxes + <div id="bg"> + </div> + The next div should have 64 boxes + <div id="bg2"> + </div> + </body> +</html> diff --git a/testing/web-platform/tests/content-dpr/tiled-background-svg-image-with-content-dpr.html b/testing/web-platform/tests/content-dpr/tiled-background-svg-image-with-content-dpr.html new file mode 100644 index 0000000000..56948ea286 --- /dev/null +++ b/testing/web-platform/tests/content-dpr/tiled-background-svg-image-with-content-dpr.html @@ -0,0 +1,27 @@ +<html> + <head> + <title>Content-DPR: css tiled background</title> + <link rel="author" title="Noam Rosenthal" href="noam@webkit.org"> + <link rel="match" href="tiled-background-image-with-content-dpr-ref.html" /> + <meta name="assert" content="Assert that content-dpr is taken into account for tiled background images"> + <style> + #bg, #bg2 { + width: 32px; + height: 32px; + background-image: url(resources/dpr.py?name=background.svg&mimeType=image/svg%2Bxml&dpr=2.0); + } + + #bg2 { + background-size: 8px 8px; + } + </style> + </head> + <body> + The next div should have 16 boxes + <div id="bg"> + </div> + The next div should have 64 boxes + <div id="bg2"> + </div> + </body> +</html> |
