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

Unified Diff: third_party/WebKit/LayoutTests/custom-properties/var-reference-registered-properties.html

Issue 2358203003: CSS Properties and Values API: Use initial value where appropriate for var() (Closed)
Patch Set: bla Created 4 years, 3 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/custom-properties/var-reference-registered-properties.html
diff --git a/third_party/WebKit/LayoutTests/custom-properties/var-reference-registered-properties.html b/third_party/WebKit/LayoutTests/custom-properties/var-reference-registered-properties.html
index 5ccbaef46f742b62eea6ca8662e8feafdbf6407f..6e08ff8674533b87331a5988aee899d843671183 100644
--- a/third_party/WebKit/LayoutTests/custom-properties/var-reference-registered-properties.html
+++ b/third_party/WebKit/LayoutTests/custom-properties/var-reference-registered-properties.html
@@ -9,24 +9,36 @@ div {
--registered-length-4: calc(var(--length-1) + 40px);
--registered-length-5: var(--invalid, 70px);
--registered-length-6: calc(var(--registered-length-3)*4);
+ --registered-length-7: var(--123px, 6px);
--length-1: 20px;
--length-2: var(--registered-length-1);
+ --length-3: calc(var(--123px, 6px) + var(--123px));
--percentage: 10%;
--registered-length-invalid: var(--percentage);
+
+ --registered-token-stream-1:var(--invalid);
+ --registered-token-stream-2:var(--invalid,fallback);
+ --token-stream-1:var(--registered-token-stream-1,moo);
}
</style>
<div id=element></div>
<script>
+CSS.registerProperty({name: '--123px', syntax: '<length>', initialValue: '123px'});
+
CSS.registerProperty({name: '--registered-length-1', syntax: '<length>', initialValue: '0px'});
CSS.registerProperty({name: '--registered-length-2', syntax: '<length>', initialValue: '0px'});
CSS.registerProperty({name: '--registered-length-3', syntax: '<length>', initialValue: '0px'});
CSS.registerProperty({name: '--registered-length-4', syntax: '<length>', initialValue: '0px'});
CSS.registerProperty({name: '--registered-length-5', syntax: '<length>', initialValue: '0px'});
CSS.registerProperty({name: '--registered-length-6', syntax: '<length>', initialValue: '0px'});
+CSS.registerProperty({name: '--registered-length-7', syntax: '<length>', initialValue: '0px'});
CSS.registerProperty({name: '--registered-length-invalid', syntax: '<length>', initialValue: '15px'});
+CSS.registerProperty({name: '--registered-token-stream-1', syntax: '*'});
+CSS.registerProperty({name: '--registered-token-stream-2', syntax: '*'});
+
test(function() {
computedStyle = getComputedStyle(element);
assert_equals(computedStyle.getPropertyValue('--registered-length-1'), '10px');
@@ -35,8 +47,14 @@ test(function() {
assert_equals(computedStyle.getPropertyValue('--registered-length-4'), '60px');
assert_equals(computedStyle.getPropertyValue('--registered-length-5'), '70px');
assert_equals(computedStyle.getPropertyValue('--registered-length-6'), '80px');
+ assert_equals(computedStyle.getPropertyValue('--registered-length-7'), '123px');
assert_equals(computedStyle.getPropertyValue('--length-1'), ' 20px');
assert_equals(computedStyle.getPropertyValue('--length-2'), ' 10px');
+ assert_equals(computedStyle.getPropertyValue('--length-3'), ' calc(123px + 123px)');
assert_equals(computedStyle.getPropertyValue('--registered-length-invalid'), '15px');
+
+ assert_equals(computedStyle.getPropertyValue('--registered-token-stream-1'), '');
+ assert_equals(computedStyle.getPropertyValue('--registered-token-stream-2'), 'fallback');
+ assert_equals(computedStyle.getPropertyValue('--token-stream-1'), 'moo');
}, "var() references work with registered properties");
</script>

Powered by Google App Engine
This is Rietveld 408576698