| This tests the CSSKeyframeRule and CSSKeyframesRule interfaces. |
| |
| On success, you will see a series of "PASS" messages, followed by "TEST COMPLETE". |
| |
| Constants |
| PASS CSSKeyframeRule exists on Window object |
| PASS CSSKeyframesRule exists on Window object |
| PASS WEBKIT_KEYFRAME_RULE does not exist on Window.CSSRule object |
| PASS WEBKIT_KEYFRAMES_RULE does not exist on Window.CSSRule object |
| PASS KEYFRAME_RULE exists on Window.CSSRule object |
| PASS KEYFRAMES_RULE exists on Window.CSSRule object |
| |
| |
| Basic queries |
| PASS keyframes1.type is window.CSSRule.KEYFRAMES_RULE |
| PASS keyframes1.name is 'test1' |
| PASS rules1.length is 2 |
| PASS rules1.item(0).type is window.CSSRule.KEYFRAME_RULE |
| PASS rules1.item(0).cssText is '0% { left: 10px; }' |
| PASS rules1.item(1).cssText is '100% { left: 20px; }' |
| |
| |
| Insert new rules |
| PASS rules1.length is 5 |
| PASS rules1.item(0).cssText is '0% { left: 10px; }' |
| PASS rules1.item(1).cssText is '100% { left: 20px; }' |
| PASS rules1.item(2).cssText is '30% { left: 30px; }' |
| PASS rules1.item(3).cssText is '60% { left: 60px; }' |
| PASS rules1.item(4).cssText is '20% { left: 50px; }' |
| |
| |
| Insert invalid rules |
| PASS rules2.length is 6 |
| PASS rules2.item(5).cssText is '10% { left: 30px; }' |
| |
| |
| Keys |
| PASS keyframes3.type is window.CSSRule.KEYFRAMES_RULE |
| PASS keyframes3.name is 'test3' |
| PASS rules3.length is 3 |
| PASS rules3.item(0).type is window.CSSRule.KEYFRAME_RULE |
| PASS rules3.item(0).keyText is '0%' |
| PASS rules3.item(1).keyText is '50%, 60%' |
| PASS rules3.item(2).keyText is '90%, 100%' |
| PASS rules3.item(0).cssText is '0% { left: 10px; }' |
| PASS rules3.item(1).cssText is '50%, 60% { left: 30px; }' |
| PASS rules3.item(2).cssText is '90%, 100% { left: 20px; }' |
| |
| |
| Find a rule |
| PASS rules3.item(0).style is an instance of CSSStyleDeclaration |
| PASS rules3.item(0).style.length is 1 |
| PASS rule.type is window.CSSRule.KEYFRAME_RULE |
| PASS rule.cssText is '0% { left: 10px; }' |
| |
| |
| Find a rule with multiple key values |
| PASS rule.type is window.CSSRule.KEYFRAME_RULE |
| PASS rule.cssText is '50%, 60% { left: 30px; }' |
| |
| |
| Find a rule using from and to |
| PASS keyframes4.type is window.CSSRule.KEYFRAMES_RULE |
| PASS rule.type is window.CSSRule.KEYFRAME_RULE |
| PASS rule.cssText is '0% { left: 10px; }' |
| PASS rule.type is window.CSSRule.KEYFRAME_RULE |
| PASS rule.cssText is '100% { left: 20px; }' |
| |
| |
| Try to find a rule that doesn't exist |
| PASS Non-existent rule was not found |
| |
| |
| Delete a rule |
| PASS rules5.length is 2 |
| PASS rules5.item(0).type is window.CSSRule.KEYFRAME_RULE |
| PASS rules5.item(0).keyText is '0%' |
| PASS rules5.item(1).keyText is '90%, 100%' |
| |
| |
| Delete a from rule |
| PASS rules6.length is 2 |
| PASS rules6.item(0).type is window.CSSRule.KEYFRAME_RULE |
| PASS rules6.item(0).keyText is '50%' |
| PASS rules6.item(1).keyText is '100%' |
| |
| |
| Delete a rule that doesn't exist |
| PASS rules7.length is 2 |
| PASS rules7.item(0).type is window.CSSRule.KEYFRAME_RULE |
| PASS rules7.item(0).keyText is '0%' |
| PASS rules7.item(1).keyText is '90%, 100%' |
| |
| |
| Set a keyframe key |
| PASS rules8.length is 2 |
| PASS rules8.item(0).type is window.CSSRule.KEYFRAME_RULE |
| PASS rules8.item(0).keyText is '70%' |
| PASS rules8.item(1).keyText is '90%, 100%' |
| |
| |
| Set a keyframe key with 'from' |
| PASS rules9.length is 2 |
| PASS rules9.item(0).type is window.CSSRule.KEYFRAME_RULE |
| PASS rules9.item(0).keyText is '0%' |
| PASS rules9.item(1).keyText is '90%, 100%' |
| |
| |
| Set a keyframe key with multiple values |
| PASS rules10.length is 2 |
| PASS rules10.item(0).type is window.CSSRule.KEYFRAME_RULE |
| PASS rules10.item(0).keyText is '0%, 10%, 0%, 20%, 30%, 100%' |
| PASS rules10.item(1).keyText is '90%, 100%' |
| |
| |
| Set a keyframe key with an out-of-range value |
| PASS rules11.item(0).keyText = "40%, -50%, 60%"; threw exception SyntaxError: Failed to set the 'keyText' property on 'CSSKeyframeRule': The key '40%, -50%, 60%' is invalid and cannot be parsed. |
| PASS rules11.length is 2 |
| PASS rules11.item(0).type is window.CSSRule.KEYFRAME_RULE |
| PASS rules11.item(0).keyText is '0%' |
| PASS rules11.item(1).keyText is '90%, 100%' |
| |
| |
| Set a keyframe key with an invalid value |
| PASS rules12.item(0).keyText = "foo"; threw exception SyntaxError: Failed to set the 'keyText' property on 'CSSKeyframeRule': The key 'foo' is invalid and cannot be parsed. |
| PASS rules12.length is 2 |
| PASS rules12.item(0).type is window.CSSRule.KEYFRAME_RULE |
| PASS rules12.item(0).keyText is '0%' |
| PASS rules12.item(1).keyText is '90%, 100%' |
| |
| |
| Set a keyframe key with a null value |
| PASS rules13.item(0).keyText = null; threw exception SyntaxError: Failed to set the 'keyText' property on 'CSSKeyframeRule': The key 'null' is invalid and cannot be parsed. |
| PASS rules13.length is 2 |
| PASS rules13.item(0).type is window.CSSRule.KEYFRAME_RULE |
| PASS rules13.item(0).keyText is '0%' |
| PASS rules13.item(1).keyText is '90%, 100%' |
| PASS successfullyParsed is true |
| |
| TEST COMPLETE |
| |
