Bug 1526718 [wpt PR 15205] - Fix canonical form of rotate property., a=testonly

Automatic update from web-platform-tests
Fix canonical form of rotate property.

Expected behavior is outlined in the spec here:
https://drafts.csswg.org/css-transforms-2/#individual-transform-serialization.

Summary:
  * 2d serializes to just an angle.
  * Axis must be specified for 3-D rotations.  If the axis is parallel to the x, y or z axis, the appropriate axis name must be used.

Bug: 905274
Change-Id: I5d16f3301baf9720099e4b5b42a1b87077b97998
Reviewed-on: https://chromium-review.googlesource.com/c/1447844
Commit-Queue: Kevin Ellis <kevers@chromium.org>
Reviewed-by: Anders Hartvoll Ruud <andruud@chromium.org>
Cr-Commit-Position: refs/heads/master@{#630796}

--

wpt-commits: a01ac89be3f48fa64bd96d36ac1a65ac9074eb4f
wpt-pr: 15205
This commit is contained in:
Kevin Ellis 2019-02-19 14:39:11 +00:00 коммит произвёл James Graham
Родитель f6c1011f0d
Коммит 505e411bd8
3 изменённых файлов: 11 добавлений и 5 удалений

Просмотреть файл

@ -53,7 +53,7 @@
.rotate_2 {
left: 450px;
transform-origin: 50% 50%;
transform: rotate3d(0, 0, 1, 90deg);
transform: rotate3d(1, 0, 0, 45deg);
}
.row_3 {
transform: perspective(500px);

Просмотреть файл

@ -6,7 +6,7 @@
<link rel="author" title="CJ Ku" href="mailto:cku@mozilla.com">
<link rel="author" title="Mozilla" href="https://www.mozilla.org">
<link rel="help" href="https://drafts.csswg.org/css-transforms-2/#individual-transforms">
<meta name="assert" content="Tests whether individaul transform works correctlyi by compare the rendering result with transfrom functions of the 'transform' property."/>
<meta name="assert" content="Tests whether individual transforms work correctly by comparing the rendering result with transform functions of the 'transform' property."/>
<link rel="match" href="individual-transform-1-ref.html">
<style>
div {
@ -36,7 +36,7 @@
.rotate_1 {
left: 450px;
transform-origin: 50% 50%;
/* test 'rota: te<angle>' */
/* test 'rotate: <angle>' */
rotate: 90deg;
}
@ -59,8 +59,8 @@
.rotate_2 {
left: 450px;
transform-origin: 50% 50%;
/* test 'rotate: <number>{3}<angle>'*/
rotate: 0 0 1 90deg;
/* test 'rotate: axis <angle>'*/
rotate: x 45deg;
}
.row_3 {
transform: perspective(500px);

Просмотреть файл

@ -12,13 +12,19 @@
</head>
<body>
<script>
// https://drafts.csswg.org/css-transforms-2/#individual-transform-serialization
// Serialize as the keyword none if and only if none was originally specified.
test_valid_value("rotate", "none");
// If a 2d rotation is specified, the property must serialize as just an <angle>.
test_valid_value("rotate", "0deg");
// If a 3d rotation is specified, the property must serialize with an axis specified.
test_valid_value("rotate", "100 200 300 400grad");
test_valid_value("rotate", "400grad 100 200 300", "100 200 300 400grad");
// If the axis is parallel with the x, y, or z axis, it must serialize as the appropriate keyword.
test_valid_value("rotate", "x 400grad");
test_valid_value("rotate", "400grad x", "x 400grad");
test_valid_value("rotate", "1 0 0 400grad", "x 400grad");