| Index: third_party/WebKit/LayoutTests/css3/motion-path/offset.html
|
| diff --git a/third_party/WebKit/LayoutTests/css3/motion-path/offset.html b/third_party/WebKit/LayoutTests/css3/motion-path/offset.html
|
| new file mode 100644
|
| index 0000000000000000000000000000000000000000..079bc44ac18bdd6adb88af2cdacdbad80dff31a0
|
| --- /dev/null
|
| +++ b/third_party/WebKit/LayoutTests/css3/motion-path/offset.html
|
| @@ -0,0 +1,69 @@
|
| +<!DOCTYPE html>
|
| +<html>
|
| +<head>
|
| +<script src="../../resources/testharness.js"></script>
|
| +<script src="../../resources/testharnessreport.js"></script>
|
| +<style>
|
| +#div2 {
|
| + offset: none 50% auto 400grad;
|
| +}
|
| +#div3 {
|
| + offset: path('M 10 20 h 30 v 150') 70px 0rad;
|
| +}
|
| +#div4 {
|
| + offset: none 10px 90deg reverse;
|
| +}
|
| +</style>
|
| +</head>
|
| +<body>
|
| +<div id="div1"></div>
|
| +<div id="div2"></div>
|
| +<div id="div3"></div>
|
| +<div id="div4"></div>
|
| +<span id="span1" style="offset: path('M 1 2 V 3') 4px 5deg"></span>
|
| +<script>
|
| +"use strict";
|
| +
|
| +test(function() {
|
| + assert_equals(getComputedStyle(div1, null).offsetPath, 'none');
|
| + assert_equals(getComputedStyle(div1, null).offsetDistance, '0px');
|
| + assert_equals(getComputedStyle(div1, null).offsetRotation, 'auto 0deg');
|
| + assert_equals(getComputedStyle(div1, null).offset, 'none 0px auto 0deg');
|
| + assert_equals(getComputedStyle(div1, null).transform, 'none');
|
| +}, 'offset default is none 0px auto 0deg');
|
| +
|
| +test(function() {
|
| + assert_equals(getComputedStyle(div2, null).offsetPath, 'none');
|
| + assert_equals(getComputedStyle(div2, null).offsetDistance, '50%');
|
| + assert_equals(getComputedStyle(div2, null).offsetRotation, 'auto 360deg');
|
| + assert_equals(getComputedStyle(div2, null).offset, 'none 50% auto 360deg');
|
| + assert_equals(getComputedStyle(div2, null).transform, 'none');
|
| +}, 'offset supports various angle units');
|
| +
|
| +test(function() {
|
| + assert_equals(getComputedStyle(div3, null).offsetPath, "path('M 10 20 h 30 v 150')");
|
| + assert_equals(getComputedStyle(div3, null).offsetDistance, '70px');
|
| + assert_equals(getComputedStyle(div3, null).offsetRotation, '0deg');
|
| + assert_equals(getComputedStyle(div3, null).offset, "path('M 10 20 h 30 v 150') 70px 0deg");
|
| + assert_equals(getComputedStyle(div3, null).transform, 'matrix(1, 0, 0, 1, 0, 0)');
|
| +}, 'offset supports SVG path data');
|
| +
|
| +test(function() {
|
| + assert_equals(getComputedStyle(div4, null).offsetPath, 'none');
|
| + assert_equals(getComputedStyle(div4, null).offsetDistance, '10px');
|
| + assert_equals(getComputedStyle(div4, null).offsetRotation, 'auto 270deg');
|
| + assert_equals(getComputedStyle(div4, null).offset, 'none 10px auto 270deg');
|
| + assert_equals(getComputedStyle(div4, null).transform, 'none');
|
| +}, 'offset property data can be supplied in any order');
|
| +
|
| +test(function() {
|
| + assert_equals(span1.style.offsetPath, "path('M 1 2 V 3')");
|
| + assert_equals(span1.style.offsetDistance, '4px');
|
| + assert_equals(span1.style.offsetRotation, '5deg');
|
| + assert_equals(span1.style.offset, "path('M 1 2 V 3') 4px 5deg");
|
| + assert_equals(span1.style.transform, '');
|
| +}, 'offset style can be set inline');
|
| +
|
| +</script>
|
| +</body>
|
| +</html>
|
|
|
Chromium Code Reviews
Issue 2241993002:
CSS Motion Path: New names for properties (Closed)
Base URL: https://chromium.googlesource.com/chromium/src.git@master