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

Unified Diff: third_party/WebKit/LayoutTests/typedcssom/cssMatrixComponent.html

Issue 2943303002: [CSS Typed OM] Refactor is2D handling in CSSTransformComponents to match new spec (Closed)
Patch Set: rebase Created 3 years, 6 months 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: third_party/WebKit/LayoutTests/typedcssom/cssMatrixComponent.html
diff --git a/third_party/WebKit/LayoutTests/typedcssom/cssMatrixComponent.html b/third_party/WebKit/LayoutTests/typedcssom/cssMatrixComponent.html
index 64dcc9440e1d96995b7d0b1bbf4d8e3744bbced8..3920f6a4958262f9ab5d1e2799f626285dd36cfc 100644
--- a/third_party/WebKit/LayoutTests/typedcssom/cssMatrixComponent.html
+++ b/third_party/WebKit/LayoutTests/typedcssom/cssMatrixComponent.html
@@ -1,104 +1,73 @@
<!DOCTYPE html>
<script src="../resources/testharness.js"></script>
<script src="../resources/testharnessreport.js"></script>
+<script src="resources/comparisons.js"></script>
<script>
+var EPSILON = 10e-6; // Float epsilon
+
var testParams = [
{
- input: new CSSMatrixComponent(new DOMMatrixReadOnly([0, 0, 0, 0, 0, 0])),
- a: 0, b: 0, c: 0, d: 0, e: 0, f: 0,
+ input: new DOMMatrixReadOnly([0, 0, 0, 0, 0, 0]),
is2D: true,
cssText: "matrix(0, 0, 0, 0, 0, 0)"
},
{
- input: new CSSMatrixComponent(new DOMMatrixReadOnly([2, 4, 6, 8, 10, 12])),
- a: 2, b: 4, c: 6, d: 8, e: 10, f: 12,
+ input: new DOMMatrixReadOnly([2, 4, 6, 8, 10, 12]),
is2D: true,
cssText: "matrix(2, 4, 6, 8, 10, 12)"
},
{
- input: new CSSMatrixComponent(
- new DOMMatrixReadOnly([-2, -4, -6, -8, -10, -12])),
- a: -2, b: -4, c: -6, d: -8, e: -10, f: -12,
+ input: new DOMMatrixReadOnly([-2, -4, -6, -8, -10, -12]),
is2D: true,
cssText: "matrix(-2, -4, -6, -8, -10, -12)"
},
{
- input: new CSSMatrixComponent(
- new DOMMatrixReadOnly([1.1, -2.2, 3.3, -4.4, 5.5, 0.6])),
- a: 1.1, b: -2.2, c: 3.3, d: -4.4, e: 5.5, f: 0.6,
+ input: new DOMMatrixReadOnly([1.1, -2.2, 3.3, -4.4, 5.5, 0.6]),
is2D: true,
cssText: "matrix(1.1, -2.2, 3.3, -4.4, 5.5, 0.6)"
},
{
- input: new CSSMatrixComponent(
- new DOMMatrixReadOnly(
- [0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0])),
- m11: 0, m12: 0, m13: 0, m14: 0, m21: 0, m22: 0, m23: 0, m24: 0,
- m31: 0, m32: 0, m33: 0, m34: 0, m41: 0, m42: 0, m43: 0, m44: 0,
+ input: new DOMMatrixReadOnly(
+ [0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0]),
is2D: false,
cssText: "matrix3d(0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0)"
},
{
- input: new CSSMatrixComponent(
- new DOMMatrixReadOnly(
- [11, 12, 13, 14, 21, 22, 23, 24, 31, 32, 33, 34, 41, 42, 43, 44])),
- m11: 11, m12: 12, m13: 13, m14: 14, m21: 21, m22: 22, m23: 23, m24: 24,
- m31: 31, m32: 32, m33: 33, m34: 34, m41: 41, m42: 42, m43: 43, m44: 44,
+ input: new DOMMatrixReadOnly(
+ [11, 12, 13, 14, 21, 22, 23, 24, 31, 32, 33, 34, 41, 42, 43, 44]),
is2D: false,
cssText: "matrix3d(11, 12, 13, 14, 21, 22, 23, 24, 31, 32, 33, 34, 41, 42, 43, 44)"
},
{
- input: new CSSMatrixComponent(
- new DOMMatrixReadOnly(
- [1.1, 1.2, -13, -1.4, 2, 0, -2, 4, 3.1, 3, 3, 3.4, -4.1, 42, 43, 4.4])),
- m11: 1.1, m12: 1.2, m13: -13, m14: -1.4, m21: 2, m22: 0, m23: -2, m24: 4,
- m31: 3.1, m32: 3, m33: 3, m34: 3.4, m41: -4.1, m42: 42, m43: 43, m44: 4.4,
+ input: new DOMMatrixReadOnly(
+ [1.1, 1.2, -13, -1.4, 2, 0, -2, 4, 3.1, 3, 3, 3.4, -4.1, 42, 43, 4.4]),
is2D: false,
cssText: "matrix3d(1.1, 1.2, -13, -1.4, 2, 0, -2, 4, 3.1, 3, 3, 3.4, -4.1, 42, 43, 4.4)"
+},
+// Set is2D to true with options, while also passing a 3D matrix. Should be
+// truncated for cssText.
+{
+ input: new DOMMatrixReadOnly(
+ [11, 12, 13, 14, 21, 22, 23, 24, 31, 32, 33, 34, 41, 42, 43, 44]),
+ is2D: true,
+ cssText: "matrix(11, 12, 21, 22, 41, 42)"
}
];
-var attributeValues2D = ["a", "b", "c", "d", "e", "f"];
-var attributeValues3D = [
- "m11",
- "m12",
- "m13",
- "m14",
- "m21",
- "m22",
- "m23",
- "m24",
- "m31",
- "m32",
- "m33",
- "m34",
- "m41",
- "m42",
- "m43",
- "m44"
-];
-
for (let params of testParams) {
+ let matrixComponent = new CSSMatrixComponent(params.input, {is2D: params.is2D});
+
test(() => {
- var attributeValues = params.is2D ? attributeValues2D : attributeValues3D;
- for (var j = 0; j < attributeValues.length; ++j) {
- var attribute = attributeValues[j];
- assert_equals(params.input.matrix[attribute], params[attribute]);
- }
- }, "(a, ... , f) and (m11, ... , m44) attributes are correct for " +
- params.cssText);
-}
+ assert_matrix_approx_equals(matrixComponent.matrix, params.input, EPSILON);
+ }, "matrix getter returns same matrix as the input for " + params.cssText);
-for (let params of testParams) {
test(() => {
- assert_equals(params.input.is2D(), params.is2D);
+ assert_equals(matrixComponent.is2D, params.is2D);
}, "is2D value is correct for " + params.cssText);
-}
-for (let params of testParams) {
test(() => {
- assert_equals(params.input.toString(), params.cssText);
+ assert_equals(matrixComponent.toString(), params.cssText);
}, "toString is correct for " + params.cssText);
}
@@ -110,4 +79,17 @@ test(() => {
assert_throws(new TypeError(), () => { new CSSMatrixComponent(undefined); });
}, "invalid number of arguments to the constructor throws");
+test(() => {
+ let matrix3d = new DOMMatrixReadOnly(
+ [1, 2, 3, 4, 5, 6, 7, 8, 9, 10, 11, 12, 13, 14, 15, 16]);
+ let matrix2d = new DOMMatrixReadOnly([1, 2, 5, 6, 13, 14]);
+ let matrixComponent = new CSSMatrixComponent(matrix3d);
+ matrixComponent.is2D = true;
+ assert_matrix_approx_equals(matrixComponent.matrix, matrix3d, EPSILON);
+
+ let transformValue = new CSSTransformValue([matrixComponent]);
+ assert_true(transformValue.is2D);
+ assert_matrix_approx_equals(transformValue.toMatrix(), matrix2d, EPSILON);
+}, "Matrix is converted to 2D inside CSSTransformValue when is2D is true.");
+
</script>

Powered by Google App Engine
This is Rietveld 408576698