Add interface and test for the transform (concatenate) method

Bug: 1140535 Change-Id: I12fc6011ef36a98af8a98c41031a7075b800ad59 Reviewed-on: https://chromium-review.googlesource.com/c/chromium/src/+/2659355 Reviewed-by: Yi Xu <yiyix@chromium.org> Reviewed-by: Xida Chen <xidachen@chromium.org> Commit-Queue: Aaron Krajeski <aaronhk@chromium.org> Cr-Commit-Position: refs/heads/master@{#849613}
web-platform-tests · Feb 2, 2021 · 284cfb0 · 284cfb0
1 parent a92fea0
commit 284cfb0
Show file tree

Hide file tree

Showing 2 changed files with 47 additions and 1 deletion.
diff --git a/html/canvas/element/transformations/2d.transformation.transform.3d.html b/html/canvas/element/transformations/2d.transformation.transform.3d.html
@@ -0,0 +1,34 @@
+<!DOCTYPE html>
+<!-- DO NOT EDIT! This test has been generated by /html/canvas/tools/gentest.py. -->
+<title>Canvas test: 2d.transformation.transform.3d</title>
+<script src="/resources/testharness.js"></script>
+<script src="/resources/testharnessreport.js"></script>
+<script src="/html/canvas/resources/canvas-tests.js"></script>
+<link rel="stylesheet" href="/html/canvas/resources/canvas-tests.css">
+<body class="show_output">
+
+<h1>2d.transformation.transform.3d</h1>
+<p class="desc">transform() with 4x4 matrix concatenates properly</p>
+
+
+<p class="output">Actual output:</p>
+<canvas id="c" class="output" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
+
+<ul id="d"></ul>
+<script>
+var t = async_test("transform() with 4x4 matrix concatenates properly");
+_addTest(function(canvas, ctx) {
+
+const transform = new DOMMatrix([1,2,3,4,5,6,7,8,9,10,11,12,13,14,15,16]);
+ctx.transform(1, 2, 3, 4, 5, 6, 7, 8, 9, 10, 11, 12, 13, 14, 15, 16);
+let canvasTransform = ctx.getTransform();
+_assert(transform.toLocaleString() == canvasTransform.toLocaleString(), "transform.toLocaleString() == canvasTransform.toLocaleString()");
+ctx.transform(1, 2, 3, 4, 5, 6, 7, 8, 9, 10, 11, 12, 13, 14, 15, 16);
+canvasTransform = ctx.getTransform();
+transform.multiplySelf(transform);
+_assert(transform.toLocaleString() == canvasTransform.toLocaleString(), "transform.toLocaleString() == canvasTransform.toLocaleString()");
+
+
+});
+</script>
+
diff --git a/html/canvas/tools/yaml/element/transformations.yaml b/html/canvas/tools/yaml/element/transformations.yaml
@@ -411,4 +411,16 @@
     const canvasTransform = ctx.getTransform();
     @assert transform.toLocaleString() == canvasTransform.toLocaleString();
 
-
+- name: 2d.transformation.transform.3d
+  desc: transform() with 4x4 matrix concatenates properly
+  testing:
+  - 2d.transformation.transform.3d
+  code: |
+    const transform = new DOMMatrix([1,2,3,4,5,6,7,8,9,10,11,12,13,14,15,16]);
+    ctx.transform(1, 2, 3, 4, 5, 6, 7, 8, 9, 10, 11, 12, 13, 14, 15, 16);
+    let canvasTransform = ctx.getTransform();
+    @assert transform.toLocaleString() == canvasTransform.toLocaleString();
+    ctx.transform(1, 2, 3, 4, 5, 6, 7, 8, 9, 10, 11, 12, 13, 14, 15, 16);
+    canvasTransform = ctx.getTransform();
+    transform.multiplySelf(transform);
+    @assert transform.toLocaleString() == canvasTransform.toLocaleString();