Bug 719054 - matrix() and matrix3d() with length units should be parse errors; r=dbaron

This commit is contained in:
Aryeh Gregor 2012-02-13 11:29:30 -05:00
parent 11df0cc2ad
commit b29d7e95d1
11 changed files with 67 additions and 32 deletions

View File

@ -3,7 +3,7 @@
<link rel='stylesheet' type='text/css' href='style.css'>
<style>
body > div:nth-child(1) { -moz-transform: matrix(1, -0.2, 0, 1, 0, 0); }
body > div:nth-child(2) { -moz-transform: matrix(1, 0, 0.6, 1, 15em, 0); }
body > div:nth-child(2) { -moz-transform: translateX(15em) matrix(1, 0, 0.6, 1, 0, 0); }
body > div:nth-child(3) { -moz-transform: rotate(30deg); }
body > div:nth-child(4) { -moz-transform: scale(2, 4); }
body > div:nth-child(5) { -moz-transform: scale(0.1, 0.4); }

View File

@ -3,7 +3,7 @@
<link rel='stylesheet' type='text/css' href='style.css'>
<style>
progress:nth-child(1) { -moz-transform: matrix(1, -0.2, 0, 1, 0, 0); }
progress:nth-child(2) { -moz-transform: matrix(1, 0, 0.6, 1, 15em, 0); }
progress:nth-child(2) { -moz-transform: translateX(15em) matrix(1, 0, 0.6, 1, 0, 0); }
progress:nth-child(3) { -moz-transform: rotate(30deg); }
progress:nth-child(4) { -moz-transform: scale(2, 4); }
progress:nth-child(5) { -moz-transform: scale(0.1, 0.4); }

View File

@ -2,7 +2,7 @@
<head>
</head>
<body>
<div style="-moz-transform: matrix(1, 0, 0, 1, 100px, 0); width: 100px; height: 100px; background-color: gold;">
<div style="-moz-transform: matrix(1, 0, 0, 1, 100, 0); width: 100px; height: 100px; background-color: gold;">
</div>
</body>
</html>

View File

@ -2,7 +2,7 @@
<head>
</head>
<body>
<div style="-moz-transform: matrix(1, 0, 0, 1, 0, 100px); width: 100px; height: 100px; background-color: gold;">
<div style="-moz-transform: matrix(1, 0, 0, 1, 0, 100); width: 100px; height: 100px; background-color: gold;">
</div>
</body>
</html>

View File

@ -2,7 +2,7 @@
<head>
</head>
<body>
<div style="-moz-transform: matrix(1, 0, 0, 1, 47%, 0); width: 100px; height: 100px; background-color: gold;">
<div style="-moz-transform: matrix(1, 0, 0, 1, 47, 0); width: 100px; height: 100px; background-color: gold;">
</div>
</body>
</html>

View File

@ -2,7 +2,7 @@
<head>
</head>
<body>
<div style="-moz-transform: matrix(1, 0, 0, 1, 0, 23%); width: 100px; height: 100px; background-color: gold;">
<div style="-moz-transform: matrix(1, 0, 0, 1, 0, 23); width: 100px; height: 100px; background-color: gold;">
</div>
</body>
</html>

View File

@ -2,7 +2,7 @@
<head>
</head>
<body>
<div style="-moz-transform: matrix(1, 0, 0, 1, 50px, 0);">
<div style="-moz-transform: matrix(1, 0, 0, 1, 50, 0);">
Test Text
</div>
</body>

View File

@ -2,7 +2,7 @@
<head>
</head>
<body>
<div style="-moz-transform: matrix(1, 0, 0, 1, 0, 50px);">
<div style="-moz-transform: matrix(1, 0, 0, 1, 0, 50);">
Test Text
</div>
</body>

View File

@ -8058,11 +8058,11 @@ static bool GetFunctionParseInformation(nsCSSKeyword aToken,
{VARIANT_NUMBER, VARIANT_NUMBER, VARIANT_NUMBER},
{VARIANT_NUMBER, VARIANT_NUMBER, VARIANT_NUMBER, VARIANT_ANGLE_OR_ZERO},
{VARIANT_NUMBER, VARIANT_NUMBER, VARIANT_NUMBER, VARIANT_NUMBER,
VARIANT_LPNCALC, VARIANT_LPNCALC},
VARIANT_NUMBER, VARIANT_NUMBER},
{VARIANT_NUMBER, VARIANT_NUMBER, VARIANT_NUMBER, VARIANT_NUMBER,
VARIANT_NUMBER, VARIANT_NUMBER, VARIANT_NUMBER, VARIANT_NUMBER,
VARIANT_NUMBER, VARIANT_NUMBER, VARIANT_NUMBER, VARIANT_NUMBER,
VARIANT_LPNCALC, VARIANT_LPNCALC, VARIANT_LNCALC, VARIANT_NUMBER}};
VARIANT_NUMBER, VARIANT_NUMBER, VARIANT_NUMBER, VARIANT_NUMBER}};
#ifdef DEBUG
static const PRUint8 kVariantMaskLengths[eNumVariantMasks] =
@ -8152,7 +8152,7 @@ static bool GetFunctionParseInformation(nsCSSKeyword aToken,
aMaxElems = 1U;
break;
case eCSSKeyword_matrix:
/* Six values, which can be numbers, lengths, or percents. */
/* Six values, all numbers. */
variantIndex = eMatrix;
aMinElems = 6U;
aMaxElems = 6U;

View File

@ -1132,18 +1132,46 @@ var gCSSProperties = {
type: CSS_TYPE_LONGHAND,
prerequisites: { "width": "300px", "height": "50px" },
initial_values: [ "none" ],
other_values: [ "translatex(1px)", "translatex(4em)", "translatex(-4px)", "translatex(3px)", "translatex(0px) translatex(1px) translatex(2px) translatex(3px) translatex(4px)", "translatey(4em)", "translate(3px)", "translate(10px, -3px)", "rotate(45deg)", "rotate(45grad)", "rotate(45rad)", "rotate(0.25turn)", "rotate(0)", "scalex(10)", "scaley(10)", "scale(10)", "scale(10, 20)", "skewx(30deg)", "skewx(0)", "skewy(0)", "skewx(30grad)", "skewx(30rad)", "skewx(0.08turn)", "skewy(30deg)", "skewy(30grad)", "skewy(30rad)", "skewy(0.08turn)", "matrix(1, 2, 3, 4, 5px, 6em)", "rotate(45deg) scale(2, 1)", "skewx(45deg) skewx(-50grad)", "translate(0, 0) scale(1, 1) skewx(0) skewy(0) matrix(1, 0, 0, 1, 0, 0)", "translatex(50%)", "translatey(50%)", "translate(50%)", "translate(3%, 5px)", "translate(5px, 3%)", "matrix(1, 2, 3, 4, 5px, 6%)", "matrix(1, 2, 3, 4, 5%, 6px)", "matrix(1, 2, 3, 4, 5%, 6%)", "matrix(1, 2, 3, 4, 5, 6)",
other_values: [ "translatex(1px)", "translatex(4em)",
"translatex(-4px)", "translatex(3px)",
"translatex(0px) translatex(1px) translatex(2px) translatex(3px) translatex(4px)",
"translatey(4em)", "translate(3px)", "translate(10px, -3px)",
"rotate(45deg)", "rotate(45grad)", "rotate(45rad)",
"rotate(0.25turn)", "rotate(0)", "scalex(10)", "scaley(10)",
"scale(10)", "scale(10, 20)", "skewx(30deg)", "skewx(0)",
"skewy(0)", "skewx(30grad)", "skewx(30rad)", "skewx(0.08turn)",
"skewy(30deg)", "skewy(30grad)", "skewy(30rad)", "skewy(0.08turn)",
"rotate(45deg) scale(2, 1)", "skewx(45deg) skewx(-50grad)",
"translate(0, 0) scale(1, 1) skewx(0) skewy(0) matrix(1, 0, 0, 1, 0, 0)",
"translatex(50%)", "translatey(50%)", "translate(50%)",
"translate(3%, 5px)", "translate(5px, 3%)",
"matrix(1, 2, 3, 4, 5, 6)",
/* valid calc() values */
"translatex(-moz-calc(5px + 10%))",
"translatey(-moz-calc(0.25 * 5px + 10% / 3))",
"translate(-moz-calc(5px - 10% * 3))",
"translate(-moz-calc(5px - 3 * 10%), 50px)",
"translate(-50px, -moz-calc(5px - 10% * 3))",
"matrix(1, 0, 0, 1, -moz-calc(5px * 3), -moz-calc(10% - 3px))"
].concat(SpecialPowers.getBoolPref("layout.3d-transforms.enabled") ? [
"translatez(1px)", "translatez(4em)", "translatez(-4px)", "translatez(0px)", "translatez(2px) translatez(5px)", "translate3d(3px, 4px, 5px)", "translate3d(2em, 3px, 1em)", "translatex(2px) translate3d(4px, 5px, 6px) translatey(1px)", "scale3d(4, 4, 4)", "scale3d(-2, 3, -7)", "scalez(4)", "scalez(-6)", "rotate3d(2, 3, 4, 45deg)", "rotate3d(-3, 7, 0, 12rad)", "rotatex(15deg)", "rotatey(-12grad)", "rotatez(72rad)", "rotatex(0.125turn)", "perspective(1000px)", "matrix3d(1, 2, 3, 4, 5, 6, 7, 8, 9, 10, 11, 12, 13, 14, 15, 16)", "matrix3d(1, 2, 3, 4, 5, 6, 7, 8, 9, 10, 11, 12, 13px, 14em, 15px, 16)", "matrix3d(1, 2, 3, 4, 5, 6, 7, 8, 9, 10, 11, 12, 20%, 10%, 15, 16)"
"translatez(1px)", "translatez(4em)", "translatez(-4px)",
"translatez(0px)", "translatez(2px) translatez(5px)",
"translate3d(3px, 4px, 5px)", "translate3d(2em, 3px, 1em)",
"translatex(2px) translate3d(4px, 5px, 6px) translatey(1px)",
"scale3d(4, 4, 4)", "scale3d(-2, 3, -7)", "scalez(4)",
"scalez(-6)", "rotate3d(2, 3, 4, 45deg)",
"rotate3d(-3, 7, 0, 12rad)", "rotatex(15deg)", "rotatey(-12grad)",
"rotatez(72rad)", "rotatex(0.125turn)", "perspective(1000px)",
"matrix3d(1, 2, 3, 4, 5, 6, 7, 8, 9, 10, 11, 12, 13, 14, 15, 16)",
] : []),
invalid_values: ["1px", "#0000ff", "red", "auto", "translatex(1px 1px)", "translatex(translatex(1px))", "translatex(#0000ff)", "translatex(red)", "translatey()", "matrix(1px, 2px, 3px, 4px, 5px, 6px)", "scale(150%)", "skewx(red)", "matrix(1%, 0, 0, 0, 0px, 0px)", "matrix(0, 1%, 2, 3, 4px,5px)", "matrix(0, 1, 2%, 3, 4px, 5px)", "matrix(0, 1, 2, 3%, 4%, 5%)",
invalid_values: ["1px", "#0000ff", "red", "auto",
"translatex(1px 1px)", "translatex(translatex(1px))",
"translatex(#0000ff)", "translatex(red)", "translatey()",
"matrix(1px, 2px, 3px, 4px, 5px, 6px)", "scale(150%)",
"skewx(red)", "matrix(1%, 0, 0, 0, 0px, 0px)",
"matrix(0, 1%, 2, 3, 4px,5px)", "matrix(0, 1, 2%, 3, 4px, 5px)",
"matrix(0, 1, 2, 3%, 4%, 5%)", "matrix(1, 2, 3, 4, 5px, 6%)",
"matrix(1, 2, 3, 4, 5%, 6px)", "matrix(1, 2, 3, 4, 5%, 6%)",
"matrix(1, 2, 3, 4, 5px, 6em)",
/* invalid calc() values */
"translatey(-moz-min(5px,10%))",
"translatex(-moz-max(5px,10%))",
@ -1153,7 +1181,14 @@ var gCSSProperties = {
// Bug 734953
"skew(45deg)", "skew(45deg, 45deg)",
].concat(SpecialPowers.getBoolPref("layout.3d-transforms.enabled") ? [
"perspective(0px)", "perspective(-10px)", "matrix3d(dinosaur)", "matrix3d(1, 2, 3, 4, 5, 6, 7, 8, 9, 10, 11, 12, 13, 14, 15, 16, 17)", "matrix3d(1, 2, 3, 4, 5, 6, 7, 8, 9, 10, 11, 12, 13, 14, 15)", "matrix3d(1, 2, 3, 4, 5, 6, 7, 8, 9, 10, 11, 12, 13, 14, 15%, 16)", "matrix3d(1, 2, 3, 4, 5, 6, 7, 8, 9, 10, 11, 12, 13, 14, 15, 16px)", "rotatey(words)", "rotatex(7)", "translate3d(3px, 4px, 1px, 7px)"
"perspective(0px)", "perspective(-10px)", "matrix3d(dinosaur)",
"matrix3d(1, 2, 3, 4, 5, 6, 7, 8, 9, 10, 11, 12, 13, 14, 15, 16, 17)",
"matrix3d(1, 2, 3, 4, 5, 6, 7, 8, 9, 10, 11, 12, 13, 14, 15)",
"matrix3d(1, 2, 3, 4, 5, 6, 7, 8, 9, 10, 11, 12, 13, 14, 15%, 16)",
"matrix3d(1, 2, 3, 4, 5, 6, 7, 8, 9, 10, 11, 12, 13, 14, 15, 16px)",
"rotatey(words)", "rotatex(7)", "translate3d(3px, 4px, 1px, 7px)",
"matrix3d(1, 2, 3, 4, 5, 6, 7, 8, 9, 10, 11, 12, 13px, 14em, 15px, 16)",
"matrix3d(1, 2, 3, 4, 5, 6, 7, 8, 9, 10, 11, 12, 20%, 10%, 15, 16)"
] : [])
},
"transform-origin": {

View File

@ -1459,7 +1459,7 @@ function test_transform_transition(prop) {
// matrix decomposition
// Four pairs of the same matrix expressed different ways.
{ start: 'matrix(-1, 0, 0, -1, 0pt, 0pt)', /* rotate(180deg) */
{ start: 'matrix(-1, 0, 0, -1, 0, 0)', /* rotate(180deg) */
end: 'matrix(1, 0, 0, 1, 0, 0)',
expected: c('rotate(135deg)') },
{ start: 'scale(-1)', end: 'none',
@ -1472,34 +1472,34 @@ function test_transform_transition(prop) {
expected: c('rotate(225deg)') },
// matrix followed by scale
{ start: 'matrix(2, 0, 0, 2, 10px, 20px) scale(2)',
{ start: 'matrix(2, 0, 0, 2, 10, 20) scale(2)',
end: 'none',
expected: 'matrix(3.0625, 0, 0, 3.0625, 7.5, 15)' },
// ... and a bunch of similar possibilities. The spec isn't settled
// here; there are multiple options. See:
// http://lists.w3.org/Archives/Public/www-style/2010Jun/0602.html
{ start: 'matrix(-1, 0, 0, 1, 0pt, 0pt)', /* scaleX(-1) */
{ start: 'matrix(-1, 0, 0, 1, 0, 0)', /* scaleX(-1) */
end: 'matrix(1, 0, 0, 1, 0, 0)',
expected: c('scaleX(-0.5)') },
{ start: 'matrix(1, 0, 0, -1, 0pt, 0pt)', /* rotate(-180deg) scaleX(-1) */
{ start: 'matrix(1, 0, 0, -1, 0, 0)', /* rotate(-180deg) scaleX(-1) */
end: 'matrix(1, 0, 0, 1, 0, 0)',
expected: c('rotate(-135deg) scaleX(-0.5)') },
{ start: 'matrix(0, 1, 1, 0, 0pt, 0pt)', /* rotate(-90deg) scaleX(-1) */
{ start: 'matrix(0, 1, 1, 0, 0, 0)', /* rotate(-90deg) scaleX(-1) */
end: 'matrix(1, 0, 0, 1, 0, 0)',
expected: c('rotate(-67.5deg) scaleX(-0.5)') },
{ start: 'matrix(0, -1, 1, 0, 0pt, 0pt)', /* rotate(-90deg) */
{ start: 'matrix(0, -1, 1, 0, 0, 0)', /* rotate(-90deg) */
end: 'matrix(1, 0, 0, 1, 0, 0)',
expected: c('rotate(-67.5deg)') },
{ start: 'matrix(0, 1, -1, 0, 0pt, 0pt)', /* rotate(90deg) */
{ start: 'matrix(0, 1, -1, 0, 0, 0)', /* rotate(90deg) */
end: 'matrix(1, 0, 0, 1, 0, 0)',
expected: c('rotate(67.5deg)') },
{ start: 'matrix(0, -1, -1, 0, 0pt, 0pt)', /* rotate(90deg) scaleX(-1) */
{ start: 'matrix(0, -1, -1, 0, 0, 0)', /* rotate(90deg) scaleX(-1) */
end: 'matrix(1, 0, 0, 1, 0, 0)',
expected: c('rotate(67.5deg) scaleX(-0.5)') },
@ -1511,42 +1511,42 @@ function test_transform_transition(prop) {
// to the current code's behavior.
// ... start with four with positive determinants
{ start: 'none',
end: 'matrix(1, 0, 1.5, 1, 0pt, 0pt)',
end: 'matrix(1, 0, 1.5, 1, 0, 0)',
/* skewX(atan(1.5)) */
expected: 'matrix(1, 0, ' + 1.5 * 0.25 + ', 1, 0, 0)',
round_error_ok: true },
{ start: 'none',
end: 'matrix(-1, 0, 2, -1, 0pt, 0pt)',
end: 'matrix(-1, 0, 2, -1, 0, 0)',
/* rotate(180deg) skewX(atan(-2)) */
expected: c('rotate(45deg) matrix(1, 0, ' + -2 * 0.25 + ', 1, 0, 0)'),
round_error_ok: true },
{ start: 'none',
end: 'matrix(0, -1, 1, -3, 0pt, 0pt)',
end: 'matrix(0, -1, 1, -3, 0, 0)',
/* rotate(-90deg) skewX(atan(3)) */
expected: c('rotate(-22.5deg) matrix(1, 0, ' + 3 * 0.25 + ', 1, 0, 0)'),
round_error_ok: true },
{ start: 'none',
end: 'matrix(0, 1, -1, 4, 0pt, 0pt)',
end: 'matrix(0, 1, -1, 4, 0, 0)',
/* rotate(90deg) skewX(atan(4)) */
expected: c('rotate(22.5deg) matrix(1, 0, ' + 4 * 0.25 + ', 1, 0, 0)'),
round_error_ok: true },
// and then four with negative determinants
{ start: 'none',
end: 'matrix(1, 0, 1, -1, 0pt, 0pt)',
end: 'matrix(1, 0, 1, -1, 0, 0)',
/* rotate(-180deg) skewX(atan(-1)) scaleX(-1) */
expected: c('rotate(-45deg) matrix(1, 0, ' + -1 * 0.25 + ', 1, 0, 0) scaleX(0.5)'),
round_error_ok: true },
{ start: 'none',
end: 'matrix(-1, 0, -1, 1, 0pt, 0pt)',
end: 'matrix(-1, 0, -1, 1, 0, 0)',
/* skewX(atan(-1)) scaleX(-1) */
expected: c('matrix(1, 0, ' + -1 * 0.25 + ', 1, 0, 0) scaleX(0.5)') },
{ start: 'none',
end: 'matrix(0, 1, 1, -2, 0pt, 0pt)',
end: 'matrix(0, 1, 1, -2, 0, 0)',
/* rotate(-90deg) skewX(atan(2)) scaleX(-1) */
expected: c('rotate(-22.5deg) matrix(1, 0, ' + 2 * 0.25 + ', 1, 0, 0) scaleX(0.5)'),
round_error_ok: true },
{ start: 'none',
end: 'matrix(0, -1, -1, 0.5, 0pt, 0pt)',
end: 'matrix(0, -1, -1, 0.5, 0, 0)',
/* rotate(90deg) skewX(atan(0.5)) scaleX(-1) */
expected: c('rotate(22.5deg) matrix(1, 0, ' + 0.5 * 0.25 + ', 1, 0, 0) scaleX(0.5)'),
round_error_ok: true },