From 143172719ae398b85319206d71056fe560843572 Mon Sep 17 00:00:00 2001
From: aardgoose <angus.sawyer@gmail.com>
Date: Fri, 10 May 2019 06:33:37 +0100
Subject: [PATCH] add tests for options 'imageOrientation' (#16728)

---
 .../imagebitmap/createImageBitmap-flipY.html  | 63 +++++++++++++++++++
 1 file changed, 63 insertions(+)
 create mode 100644 2dcontext/imagebitmap/createImageBitmap-flipY.html
diff --git a/2dcontext/imagebitmap/createImageBitmap-flipY.html b/2dcontext/imagebitmap/createImageBitmap-flipY.html
new file mode 100644
index 00000000000000..0112ac73c8db9b
--- /dev/null
+++ b/2dcontext/imagebitmap/createImageBitmap-flipY.html
@@ -0,0 +1,63 @@
+<!DOCTYPE html>
+<html>
+<title>createImageBitmap + drawImage test</title>
+<script src="/resources/testharness.js"></script>
+<script src="/resources/testharnessreport.js"></script>
+<script src="/common/canvas-tests.js"></script>
+<script src="/common/media.js"></script>
+<script src="/common/namespaces.js"></script>
+<script src="common.sub.js"></script>
+<link rel="stylesheet" href="/common/canvas-tests.css">
+<body>
+<script>
+function testCanvasDisplayingPattern(canvas, width, height, flipped)
+{
+    var tolerance = 10; // for creating ImageBitmap from a video, the tolerance needs to be high
+    const check = (x, y, r, g, b, a) =>
+        _assertPixelApprox(canvas, x,y, r,g,b,a, `${x},${y}`, `${r},${g},${b},${a}`, tolerance);
+    if (flipped) {
+        check(1 * width / 4, 3 * height / 4, 255,0,0,255);
+        check(3 * width / 4, 3 * height / 4, 0,255,0,255);
+        check(1 * width / 4, 1 * height / 4, 0,0,255,255);
+        check(3 * width / 4, 1 * height / 4, 0,0,0,255);
+    } else {
+        check(1 * width / 4, 1 * height / 4, 255,0,0,255);
+        check(3 * width / 4, 1 * height / 4, 0,255,0,255);
+        check(1 * width / 4, 3 * height / 4, 0,0,255,255);
+        check(3 * width / 4, 3 * height / 4, 0,0,0,255);
+    }
+}
+
+function testDrawImageBitmap(source, args = [], flipped, { resizeWidth = 20, resizeHeight = 20 } = {})
+{
+    var canvas = document.createElement("canvas");
+    canvas.width = resizeWidth;
+    canvas.height = resizeHeight;
+    var ctx = canvas.getContext("2d");
+    return createImageBitmap(source, ...args).then(imageBitmap => {
+        assert_equals(imageBitmap.width, resizeWidth);
+        assert_equals(imageBitmap.height, resizeHeight);
+        ctx.drawImage(imageBitmap, 0, 0);
+        testCanvasDisplayingPattern(canvas, resizeWidth, resizeHeight, flipped);
+    });
+}
+
+for (let { name, factory } of imageSourceTypes) {
+    promise_test(function() {
+        return factory().then(function(img) {
+            const options = { imageOrientation: 'none' };
+            return testDrawImageBitmap(img, [options], false);
+        });
+    }, `createImageBitmap from ${name} imageOrientation: "none", and drawImage on the created ImageBitmap`);
+
+    promise_test(function() {
+        return factory().then(function(img) {
+            const options = { imageOrientation: 'flipY' };
+            return testDrawImageBitmap(img, [options], true);
+        });
+    }, `createImageBitmap from ${name} imageOrientation: "flipY", and drawImage on the created ImageBitmap`);
+
+}
+</script>
+</body>
+</html>
