summaryrefslogtreecommitdiffstats
path: root/testing/web-platform/tests/css/css-paint-api/hidpi/device-pixel-ratio-ref.html
diff options
context:
space:
mode:
Diffstat (limited to 'testing/web-platform/tests/css/css-paint-api/hidpi/device-pixel-ratio-ref.html')
-rw-r--r--testing/web-platform/tests/css/css-paint-api/hidpi/device-pixel-ratio-ref.html24
1 files changed, 24 insertions, 0 deletions
diff --git a/testing/web-platform/tests/css/css-paint-api/hidpi/device-pixel-ratio-ref.html b/testing/web-platform/tests/css/css-paint-api/hidpi/device-pixel-ratio-ref.html
new file mode 100644
index 0000000000..205cf8963b
--- /dev/null
+++ b/testing/web-platform/tests/css/css-paint-api/hidpi/device-pixel-ratio-ref.html
@@ -0,0 +1,24 @@
+<!DOCTYPE html>
+<html>
+<style>
+html, body { margin: 0; padding: 0; }
+canvas {width: 150px; height: 150px; }
+</style>
+<body>
+<p>This test ensures that the PaintWorkletGlobalScope.devicePixelRatio returns
+the correct value, which should be identical as window.devicePixelRatio. To
+manually test, open both this file and "device-pixel-ratio-ref.html" with a
+browser, and you should see two idential green rectangles.</p>
+<canvas id ="canvas" width="100" height="100"></canvas>
+<script>
+var canvas = document.getElementById('canvas');
+canvas.width = 150 * window.devicePixelRatio;
+canvas.height = 150 * window.devicePixelRatio;
+var context = canvas.getContext("2d");
+context.fillStyle = 'green';
+var draw_width = Math.floor(canvas.width / window.devicePixelRatio);
+var draw_height = Math.floor(canvas.height / window.devicePixelRatio);
+context.fillRect(0, 0, draw_width, draw_height);
+</script>
+</body>
+</html>