Unreviewed GTK test gardening
[WebKit-https.git] / LayoutTests / css-custom-properties-api / registerProperty.html
1 <!DOCTYPE html><!-- webkit-test-runner [ experimental:CSSCustomPropertiesAndValuesEnabled=true ] -->
2 <!-- https://chromium.googlesource.com/chromium/src/+/01ce431409e3a019858677626a983c55168da6dc/third_party/WebKit/LayoutTests/custom-properties/register-property.html -->
3 <script src="../resources/testharness.js"></script>
4 <script src="../resources/testharnessreport.js"></script>
5 <div id="el"></div>
6 <script>
7 // Tests for error checking during property registration
8 test(function() {
9     assert_throws(new TypeError(), () => CSS.registerProperty());
10     assert_throws(new TypeError(), () => CSS.registerProperty(undefined));
11     assert_throws(new TypeError(), () => CSS.registerProperty(true));
12     assert_throws(new TypeError(), () => CSS.registerProperty(2));
13     assert_throws(new TypeError(), () => CSS.registerProperty("css"));
14     assert_throws(new TypeError(), () => CSS.registerProperty(null));
15 }, "registerProperty requires a Dictionary type");
16 test(function() {
17     // Valid property names, shouldn't throw
18     CSS.registerProperty({name: '--name1', inherits: false});
19     CSS.registerProperty({name: '--name2, no need for escapes', inherits: false});
20     CSS.registerProperty({name: ['--name', 3], inherits: false});
21     // Invalid property names
22     assert_throws(new SyntaxError(), () => CSS.registerProperty({name: 'no-leading-dash', inherits: false}));
23     assert_throws(new SyntaxError(), () => CSS.registerProperty({name: '', inherits: false}));
24     assert_throws(new SyntaxError(), () => CSS.registerProperty({name: '\\--name', inherits: false}));
25 }, "registerProperty requires a name matching <custom-property-name>");
26 test(function() {
27     CSS.registerProperty({name: '--syntax-test-1', inherits: false, syntax: '*'});
28     CSS.registerProperty({name: '--syntax-test-2', inherits: false, syntax: ' * '});
29     CSS.registerProperty({name: '--syntax-test-3', inherits: false, initialValue: '500px'});
30     assert_throws(new TypeError(), () => CSS.registerProperty({}));
31     assert_throws(new TypeError(), () => CSS.registerProperty({name: '--no-inherits'}));
32     assert_throws(new TypeError(), () => CSS.registerProperty({inherits: false}));
33     // Repeated name
34     assert_throws(null,
35         () => CSS.registerProperty({name: '--syntax-test-3', inherits: false, initialValue: '500px'}));
36 }, "registerProperty always allows omitting initialValue and syntax, requires name and inherits");
37 test(function() {
38     CSS.registerProperty({name: '--syntax-test-4', inherits: false, syntax: '*'});
39     CSS.registerProperty({name: '--syntax-test-5', inherits: false, syntax: ' * '});
40 }, "registerProperty requires inherits and name");
41 test(function() {
42   CSS.registerProperty({name: '--initialvalue-test-0', inherits: false, syntax: '<length>', initialValue: 'calc(10px + 10in)'});
43   assert_equals(window.getComputedStyle(el).getPropertyValue('--initialvalue-test-0').toString(), '970px');
44
45   assert_throws(new SyntaxError(),
46     () => CSS.registerProperty({name: '--initialvalue-test-1', inherits: false, syntax: '<length>', initialValue: '10em'}));
47   assert_throws(new SyntaxError(),
48     () => CSS.registerProperty({name: '--initialvalue-test-2', inherits: false, syntax: '<length>', initialValue: 'calc(10px + 10em)'}));
49   assert_throws(new SyntaxError(),
50     () => CSS.registerProperty({name: '--initialvalue-test-3', inherits: false, syntax: '<length>', initialValue: 'calc(10px + 10%)'}));
51 }, "registerProperty requires initialValue to be computationally independent");
52 </script>