third_party/WebKit/LayoutTests/custom-properties/unregister-property.html - Issue 2330893002: CSS Properties and Values API: Support more syntax strings

Side by Side Diff: third_party/WebKit/LayoutTests/custom-properties/unregister-property.html

Issue 2330893002: CSS Properties and Values API: Support more syntax strings (Closed)

Patch Set: move some syntax parsing logic into helpers 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:

« no previous file with comments | « third_party/WebKit/LayoutTests/custom-properties/register-property-syntax-parsing-expected.txt ('k') | third_party/WebKit/Source/core/css/CSSSyntaxDescriptor.h » ('j') | no next file with comments »
Toggle Intra-line Diffs ('i') | Expand Comments ('e') | Collapse Comments ('c') | Hide Comments ('s')

OLD	NEW
1 <!DOCTYPE HTML>	1 <!DOCTYPE HTML>

2 <script src="../resources/testharness.js"></script>	2 <script src="../resources/testharness.js"></script>

3 <script src="../resources/testharnessreport.js"></script>	3 <script src="../resources/testharnessreport.js"></script>

4	4

	5 <style>

	6 #div1 {

	7 --length: 5px;

	8 --color: notacolor;

	9 }

	10 #div2 {

	11 --color: pink;

	12 }

	13 </style>

	14

	15 <div id=div1></div>

	16 <div id=div2></div>

	17 <div id=div3></div>

	18

5 <script>	19 <script>

6 test(function() {	20 test(function() {

7 var reregisterError = {name: 'InvalidModificationError'};	21 var reregisterError = {name: 'InvalidModificationError'};

8 var unregisterError = {name: 'NotFoundError'};	22 var unregisterError = {name: 'NotFoundError'};

9 CSS.registerProperty({name: '--property'});	23 CSS.registerProperty({name: '--property'});

10 assert_throws(reregisterError, () => CSS.registerProperty({name: '--property '}));	24 assert_throws(reregisterError, () => CSS.registerProperty({name: '--property '}));

11 assert_throws(unregisterError, () => CSS.unregisterProperty({name: '--proper ty2'}));	25 assert_throws(unregisterError, () => CSS.unregisterProperty({name: '--proper ty2'}));

12	26

13 CSS.registerProperty({name: '--property2', syntax: '<length>', initialValue: '5px'});	27 CSS.registerProperty({name: '--property2', syntax: '<length>', initialValue: '5px'});

14 assert_throws(reregisterError, () => CSS.registerProperty({name: '--property 2'}));	28 assert_throws(reregisterError, () => CSS.registerProperty({name: '--property 2'}));

15 assert_throws(reregisterError, () => CSS.registerProperty({name: '--property '}));	29 assert_throws(reregisterError, () => CSS.registerProperty({name: '--property '}));

16	30

17 CSS.unregisterProperty('--property');	31 CSS.unregisterProperty('--property');

18 assert_throws(unregisterError, () => CSS.unregisterProperty({name: '--proper ty'}));	32 assert_throws(unregisterError, () => CSS.unregisterProperty({name: '--proper ty'}));

19 assert_throws(reregisterError, () => CSS.registerProperty({name: '--property 2'}));	33 assert_throws(reregisterError, () => CSS.registerProperty({name: '--property 2'}));

20 CSS.registerProperty({name: '--property'});	34 CSS.registerProperty({name: '--property'});

21 assert_throws(reregisterError, () => CSS.registerProperty({name: '--property '}));	35 assert_throws(reregisterError, () => CSS.registerProperty({name: '--property '}));

22	36

23 CSS.unregisterProperty('--property2');	37 CSS.unregisterProperty('--property2');

24 assert_throws(unregisterError, () => CSS.unregisterProperty({name: '--proper ty2'}));	38 assert_throws(unregisterError, () => CSS.unregisterProperty({name: '--proper ty2'}));

25 }, "Registration state is correctly managed and correct errors are thrown");	39 }, "Registration state is correctly managed and correct errors are thrown");

	40

	41 test(function() {

	42 computedStyle1 = getComputedStyle(div1);

	43 computedStyle2 = getComputedStyle(div2);

	44 assert_equals(computedStyle1.getPropertyValue('--length'), ' 5px');

	45 assert_equals(computedStyle1.getPropertyValue('--color'), ' notacolor');

	46 assert_equals(computedStyle2.getPropertyValue('--length'), '');

	47 assert_equals(computedStyle2.getPropertyValue('--color'), ' pink');

	48

	49 CSS.registerProperty({name: '--length', syntax: '<length>', initialValue: '1 0px'});

	50 CSS.registerProperty({name: '--color', syntax: '<color>', initialValue: 'red '});

	51 assert_equals(computedStyle1.getPropertyValue('--length'), '5px');

	52 assert_equals(computedStyle1.getPropertyValue('--color'), 'red');

	53 assert_equals(computedStyle2.getPropertyValue('--length'), '10px');

	54 assert_equals(computedStyle2.getPropertyValue('--color'), 'pink');

	55

	56 CSS.unregisterProperty('--length');

	57 CSS.unregisterProperty('--color');

	58 assert_equals(computedStyle1.getPropertyValue('--length'), ' 5px');

	59 assert_equals(computedStyle1.getPropertyValue('--color'), ' notacolor');

	60 assert_equals(computedStyle2.getPropertyValue('--length'), '');

	61 assert_equals(computedStyle2.getPropertyValue('--color'), ' pink');

	62 }, "Unregistration correctly updates computed style");

	63

	64 test(function() {

	65 computedStyle = getComputedStyle(div3);

	66 assert_equals(computedStyle.getPropertyValue('--x'), '');

	67

	68 CSS.registerProperty({name: '--x', syntax: '<length>', initialValue: '10px'} );

	69 assert_equals(computedStyle.getPropertyValue('--x'), '10px');

	70

	71 CSS.unregisterProperty('--x');

	72 assert_equals(computedStyle.getPropertyValue('--x'), '');

	73

	74 CSS.registerProperty({name: '--x', syntax: '<color>', initialValue: 'purple' });

	75 div3.style.setProperty('--x', '5px');

	76 assert_equals(computedStyle.getPropertyValue('--x'), 'purple');

	77 }, "Property can be re-registered with different type");

26 </script>	78 </script>

OLD	NEW