Chromium Code Reviews
chromiumcodereview-hr@appspot.gserviceaccount.com (chromiumcodereview-hr) | Please choose your nickname with Settings | Help | Chromium Project | Gerrit Changes | Sign out
(49)

Unified Diff: LayoutTests/fast/canvas/canvas-createImageBitmap-createPattern.html

Issue 703783004: Use CanvasImageSource union type instead of overloading (Closed) Base URL: https://chromium.googlesource.com/chromium/blink.git@master
Patch Set: don't append canvases to document.body Created 6 years, 1 month ago
Use n/p to move between diff chunks; N/P to move between comments. Draft comments are only viewable by you.
Jump to:
View side-by-side diff with in-line comments
Download patch
Index: LayoutTests/fast/canvas/canvas-createImageBitmap-createPattern.html
diff --git a/LayoutTests/fast/canvas/canvas-createImageBitmap-createPattern.html b/LayoutTests/fast/canvas/canvas-createImageBitmap-createPattern.html
new file mode 100644
index 0000000000000000000000000000000000000000..1ab2ba70854a196c49cc453dacf71f2ac8f8ed42
--- /dev/null
+++ b/LayoutTests/fast/canvas/canvas-createImageBitmap-createPattern.html
@@ -0,0 +1,189 @@
+<!DOCTYPE HTML PUBLIC "-//IETF//DTD HTML//EN">
+<html>
+<head>
+<script src="../../resources/js-test.js"></script>
+</head>
+<body>
+<script>
+
+description("Ensure correct behavior of createPattern with ImageBitmaps.");
+window.jsTestIsAsync = true;
+
+function jsWrapperClass(node)
+{
+ // returns the ClassName of node
+ if (!node)
+ return "[null]";
+ var string = Object.prototype.toString.apply(node);
+
+ // string will be of the form [object ClassName]
+ return string.substr(8, string.length - 9);
+}
+
+function shouldBeType(expression, className)
+{
+ shouldBe("jsWrapperClass(" + expression + ")", "'" + className + "'");
+}
+
+function shouldNotBeCalled() {
+ testFailed("createImageBitmap promise rejected.");
+ finishJSTest();
+}
+
+function shouldBeRed(x, y) {
+ d = ctx.getImageData(x, y, 1, 1).data;
+ shouldBeTrue("d[0] == 255");
+ shouldBeTrue("d[1] == 0");
+ shouldBeTrue("d[2] == 0");
+ shouldBeTrue("d[3] == 255");
+}
+
+function shouldBeGreen(x, y) {
+ d = ctx.getImageData(x, y, 1, 1).data;
+ shouldBeTrue("d[0] == 0");
+ shouldBeTrue("d[1] == 255");
+ shouldBeTrue("d[2] == 0");
+ shouldBeTrue("d[3] == 255");
+}
+
+function shouldBeBlue(x, y) {
+ d = ctx.getImageData(x, y, 1, 1).data;
+ shouldBeTrue("d[0] == 0");
+ shouldBeTrue("d[1] == 0");
+ shouldBeTrue("d[2] == 255");
+ shouldBeTrue("d[3] == 255");
+}
+
+function shouldBeBlack(x, y) {
+ d = ctx.getImageData(x, y, 1, 1).data;
+ shouldBeTrue("d[0] == 0");
+ shouldBeTrue("d[1] == 0");
+ shouldBeTrue("d[2] == 0");
+ shouldBeTrue("d[3] == 255");
+}
+
+function shouldBeClear(x, y) {
+ // should be transparent black pixels
+ d = ctx.getImageData(x, y, 1, 1).data;
+ shouldBeTrue("d[0] == 0");
+ shouldBeTrue("d[1] == 0");
+ shouldBeTrue("d[2] == 0");
+ shouldBeTrue("d[3] == 0");
+}
+
+var checks = { red: shouldBeRed,
+ green: shouldBeGreen,
+ blue: shouldBeBlue,
+ black: shouldBeBlack,
+ clear: shouldBeClear };
+
+function checkQuad(x, y, top_left, top_right, bottom_left, bottom_right) {
+ checks[top_left](x, y);
+ checks[top_right](x + 1, y);
+ checks[bottom_left](x, y + 1);
+ checks[bottom_right](x + 1, y + 1);
+}
+
+function drawPattern(ctx) {
+ // Draw a four-color pattern
+ ctx.beginPath();
+ ctx.fillStyle = "rgb(255, 0, 0)";
+ ctx.fillRect(0, 0, 10, 10);
+ ctx.fillStyle = "rgb(0, 255, 0)";
+ ctx.fillRect(10, 0, 10, 10);
+ ctx.fillStyle = "rgb(0, 0, 255)";
+ ctx.fillRect(0, 10, 10, 10);
+ ctx.fillStyle = "rgb(0, 0, 0)";
+ ctx.fillRect(10, 10, 10, 10);
+}
+
+function clearContext(context) {
+ context.clearRect(0, 0, 50, 50);
+}
+
+var bitmap;
+var image;
+var testBitmap; // this is an ImageBitmap that is uncropped. We use this to test createImageBitmap(testBitmap)
+var d; // image.imageData
+var elements;
+
+var imageWidth = 20;
+var imageHeight = 20;
+
+// Draw to an auxillary canvas.
+var aCanvas = document.createElement("canvas");
+aCanvas.width = imageWidth;
+aCanvas.height = imageHeight;
+var aCtx = aCanvas.getContext("2d");
+drawPattern(aCtx);
+
+var canvas = document.createElement("canvas");
+canvas.setAttribute("width", "50");
+canvas.setAttribute("height", "50");
+var ctx = canvas.getContext("2d");
+
+image = new Image();
+image.onload = imageLoaded;
+image.src = aCanvas.toDataURL();
+
+var imageLoaded = false;
+var imageBitmapLoaded = false;
+
+function imageLoaded() {
+ createImageBitmap(image).then(imageBitmapLoadedCallback, shouldNotBeCalled);
+ d = aCtx.getImageData(0, 0, 20, 20);
+ imageLoaded = true;
+ loaded();
+}
+
+function imageBitmapLoadedCallback(imageBitmap) {
+ testBitmap = imageBitmap;
+
+ shouldBe("testBitmap.width", "imageWidth");
+ shouldBe("testBitmap.height", "imageHeight");
+
+ // width and height are readonly
+ testBitmap.width = 42;
+ testBitmap.height = 42;
+ shouldBe("testBitmap.width", "imageWidth");
+ shouldBe("testBitmap.height", "imageHeight");
+
+ imageBitmapLoaded = true;
+ loaded();
+}
+
+function loaded() {
+ if (imageLoaded && imageBitmapLoaded) {
+ ctx.fillStyle = ctx.createPattern(testBitmap, "repeat");
+ ctx.fillRect(10, 10, 30, 30);
+
+ // Check each pixel quad at each corner. The filled pattern
+ // is 3x3 squares of different colors, so there are four rows
+ // of four corners.
+
+ checkQuad(9, 9, "clear", "clear", "clear", "black");
+ checkQuad(19, 9, "clear", "clear", "black", "blue");
+ checkQuad(29, 9, "clear", "clear", "blue", "black");
+ checkQuad(39, 9, "clear", "clear", "black", "clear");
+
+ checkQuad(9, 19, "clear", "black", "clear", "green");
+ checkQuad(19, 19, "black", "blue", "green", "red");
+ checkQuad(29, 19, "blue", "black", "red", "green");
+ checkQuad(39, 19, "black", "clear", "green", "clear");
+
+ checkQuad(9, 29, "clear", "green", "clear", "black");
+ checkQuad(19, 29, "green", "red", "black", "blue");
+ checkQuad(29, 29, "red", "green", "blue", "black");
+ checkQuad(39, 29, "green", "clear", "black", "clear");
+
+ checkQuad(9, 39, "clear", "black", "clear", "clear");
+ checkQuad(19, 39, "black", "blue", "clear", "clear");
+ checkQuad(29, 39, "blue", "black", "clear", "clear");
+ checkQuad(39, 39, "black", "clear", "clear", "clear");
+
+ finishJSTest();
+ }
+}
+</script>
+</body>
+</html>

Powered by Google App Engine
This is Rietveld 408576698