Chromium Code Reviews Chromium Code Reviews
Issue 2241993002:
CSS Motion Path: New names for properties (Closed)
Base URL: https://chromium.googlesource.com/chromium/src.git@master| 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> |
|
suzyh_UTC10 (ex-contributor)
2016/09/19 01:21:04
I'm surprised these tests didn't already exist for
Eric Willigers
2016/09/19 01:54:40
I am copying the existing tests.
motion-path.html
suzyh_UTC10 (ex-contributor)
2016/09/19 03:32:30
Oh, codereview just showed them up as completely n
|
| +<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; |
| +} |
|
alancutter (OOO until 2018)
2016/09/19 00:49:54
These tests would be easier to read if the offset
Eric Willigers
2016/09/19 01:54:40
Sure, I can refactor when adding new tests. For th
alancutter (OOO until 2018)
2016/09/19 04:20:02
Ah, didn't realise this was a copy + rename. Never
|
| +</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> |
