keyframes-name-valid.html (2680B)
1 <!DOCTYPE html> 2 <html> 3 <head> 4 <meta charset="UTF-8"> 5 <title>CSS Animations: parsing @keyframes name with valid values</title> 6 <link rel="author" title="yisibl(一丝)" href="https://github.com/yisibl"/> 7 <link rel="help" href="https://drafts.csswg.org/css-animations/#typedef-keyframes-name"> 8 <meta name="assert" content="@keyframes name supports the full grammar '<custom-ident> | <string>'."> 9 <script src="/resources/testharness.js"></script> 10 <script src="/resources/testharnessreport.js"></script> 11 <script src="/css/support/parsing-testcommon.js"></script> 12 </head> 13 <body> 14 <div> 15 <main id="main"></main> 16 </div> 17 <script> 18 // Test <custom-ident> 19 test_keyframes_name_valid(' foo '); 20 test_keyframes_name_valid(' foo'); 21 test_keyframes_name_valid('-foo'); 22 test_keyframes_name_valid('_bar'); 23 test_keyframes_name_valid('__bar'); 24 test_keyframes_name_valid('__bar__'); 25 test_keyframes_name_valid('ease-out'); 26 test_keyframes_name_valid('example'); 27 test_keyframes_name_valid('EXAMPLE'); 28 29 test_keyframes_name_valid('not'); 30 test_keyframes_name_valid('and'); 31 test_keyframes_name_valid('all'); 32 test_keyframes_name_valid('or'); 33 34 // <custom-ident> may disable the `auto/normal` keywords in the future 35 // https://github.com/w3c/csswg-drafts/issues/7431 36 test_keyframes_name_valid('auto'); 37 test_keyframes_name_valid('normal'); 38 39 // Test <string> 40 test_keyframes_name_valid('" foo "'); 41 test_keyframes_name_valid('" foo"'); 42 test_keyframes_name_valid('"-foo"'); 43 test_keyframes_name_valid('"_bar"'); 44 test_keyframes_name_valid('"__bar"'); 45 test_keyframes_name_valid('"__bar__"'); 46 test_keyframes_name_valid('"ease-out"'); 47 test_keyframes_name_valid('"example"'); 48 test_keyframes_name_valid('"EXAMPLE"'); 49 50 test_keyframes_name_valid('"one two"'); 51 test_keyframes_name_valid('"one, two"'); 52 53 test_keyframes_name_valid('"not"'); 54 test_keyframes_name_valid('"and"'); 55 test_keyframes_name_valid('"all"'); 56 test_keyframes_name_valid('"or"'); 57 58 test_keyframes_name_valid('"auto"'); 59 test_keyframes_name_valid('"normal"'); 60 test_keyframes_name_valid('"none"'); 61 62 test_keyframes_name_valid('"default"'); 63 test_keyframes_name_valid('"initial"'); 64 test_keyframes_name_valid('"inherit"'); 65 test_keyframes_name_valid('"unset"'); 66 test_keyframes_name_valid('"revert"'); 67 test_keyframes_name_valid('"revert-layer"'); 68 </script> 69 </body> 70 </html>