| <!DOCTYPE html> |
| <html> |
| <head> |
| <title>CSS Shadow Parts - Part Name IDL</title> |
| <meta href="mailto:fergal@chromium.org" rel="author" title="Fergal Daly"> |
| <link href="http://www.google.com/" rel="author" title="Google"> |
| <link href="https://drafts.csswg.org/css-shadow-parts/" rel="help"> |
| <script src="/resources/testharness.js"></script> |
| <script src="/resources/testharnessreport.js"></script> |
| <script src="support/shadow-helper.js"></script> |
| </head> |
| <body> |
| <span id="s_no_part"></span> |
| <span id="s_part" part="part1"></span> |
| <span id="s_2_parts" part="part1 part2"></span> |
| <script> |
| "use strict"; |
| test(function() { |
| const parts = s_no_part.part; |
| assert_equals(parts.length, 0); |
| assert_equals(parts.value, ""); |
| }, "Access to .part returns an empty DOMTokenList."); |
| test(function() { |
| const parts = s_2_parts.part; |
| assert_equals(parts.length, 2); |
| assert_equals(parts[0], "part1"); |
| assert_equals(parts[1], "part2"); |
| assert_equals(parts.value, "part1 part2"); |
| }, "Multiple names give a DOMTokenList with multiple entries."); |
| test(function() { |
| const parts = s_no_part.part; |
| assert_equals(parts.length, 0); |
| assert_equals(parts.value, ""); |
| parts.add("part1"); |
| assert_equals(parts.length, 1); |
| assert_equals(parts.value, "part1"); |
| }, "DOMTokenList created by access is persisted."); |
| test(function() { |
| const parts = s_part.part; |
| assert_equals(parts.length, 1); |
| assert_equals(parts.value, "part1"); |
| parts.add("part2"); |
| assert_equals(parts.length, 2); |
| assert_equals(parts.value, "part1 part2"); |
| assert_equals(s_part.getAttribute("part"), parts.value); |
| parts.remove("part1"); |
| assert_equals(parts.length, 1); |
| assert_equals(parts.value, "part2"); |
| assert_equals(s_part.getAttribute("part"), parts.value); |
| }, "Changes in DOMTokenList are refected in attribute."); |
| </script> |
| </body> |
| </html> |
