Bug 1617969 [wpt PR 21962] - Add a test for content-dpr in various scenarios, a=testonly
authorNoam Rosenthal <noamr@users.noreply.github.com>
Wed, 26 Feb 2020 10:42:10 +0000
changeset 515813 0368c9164bf6a678cc68c70851d3b0bcbfa144d6
parent 515812 603b84d4b2f324e709125b10adbf59d6c5b6f8f7
child 515814 3635945246f0c95f9cba7d36bd2a609b3da0a708
push id37162
push usernbeleuzu@mozilla.com
push dateThu, 27 Feb 2020 09:49:56 +0000
treeherdermozilla-central@9e8d5431c412 [default view] [failures only]
perfherder[talos] [build metrics] [platform microbench] (compared to previous push)
reviewerstestonly
bugs1617969, 21962
milestone75.0a1
first release with
nightly linux32
nightly linux64
nightly mac
nightly win32
nightly win64
last release without
nightly linux32
nightly linux64
nightly mac
nightly win32
nightly win64
Bug 1617969 [wpt PR 21962] - Add a test for content-dpr in various scenarios, a=testonly Automatic update from web-platform-tests Add a test for content-dpr in various scenarios (#21962) * Add a test for content-dpr in various elements * Fix typo -- wpt-commits: a29d8d7a84b904431727039d9db9992cc77288ac wpt-pr: 21962
testing/web-platform/tests/content-dpr/content-dpr-various-elements-ref.html
testing/web-platform/tests/content-dpr/content-dpr-various-elements.html
new file mode 100644
--- /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>
new file mode 100644
--- /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>