Implement CSSKeyframesRule.name

components/script/dom/csskeyframesrule.rs

@@ -5,6 +5,7 @@
 use cssparser::Parser;
 use dom::bindings::codegen::Bindings::CSSKeyframesRuleBinding;
 use dom::bindings::codegen::Bindings::CSSKeyframesRuleBinding::CSSKeyframesRuleMethods;
+use dom::bindings::error::{Error, ErrorResult};
 use dom::bindings::inheritance::Castable;
 use dom::bindings::js::{MutNullableJS, Root};
 use dom::bindings::reflector::{DomObject, reflect_dom_object};
@@ -15,6 +16,7 @@ use dom::cssrulelist::{CSSRuleList, RulesSource};
 use dom::cssstylesheet::CSSStyleSheet;
 use dom::window::Window;
 use parking_lot::RwLock;
+use servo_atoms::Atom;
 use std::sync::Arc;
 use style::keyframes::{Keyframe, KeyframeSelector};
 use style::parser::ParserContextExtraData;
@@ -101,6 +103,27 @@ impl CSSKeyframesRuleMethods for CSSKeyframesRule {
             self.rulelist().item(idx as u32)
         }).and_then(Root::downcast)
     }
+
+    // https://drafts.csswg.org/css-animations/#dom-csskeyframesrule-name
+    fn Name(&self) -> DOMString {
+        DOMString::from(&*self.keyframesrule.read().name)
+    }
+
+    // https://drafts.csswg.org/css-animations/#dom-csskeyframesrule-name
+    fn SetName(&self, value: DOMString) -> ErrorResult {
+        // https://github.com/w3c/csswg-drafts/issues/801
+        // Setting this property to a CSS-wide keyword or `none` will
+        // throw a Syntax Error.
+        match_ignore_ascii_case! { value,
+            "initial" => return Err(Error::Syntax),
+            "inherit" => return Err(Error::Syntax),
+            "unset" => return Err(Error::Syntax),
+            "none" => return Err(Error::Syntax),
+            _ => ()
+        }
+        self.keyframesrule.write().name = Atom::from(value);
+        Ok(())
+    }
 }
 
 impl SpecificCSSRule for CSSKeyframesRule {

components/script/dom/webidls/CSSKeyframesRule.webidl

@@ -5,7 +5,8 @@
 // https://drafts.csswg.org/css-animations/#interface-csskeyframesrule
 [Exposed=Window]
 interface CSSKeyframesRule : CSSRule {
-  //          attribute DOMString   name;
+  [SetterThrows]
+           attribute DOMString   name;
   readonly attribute CSSRuleList cssRules;
 
   void            appendRule(DOMString rule);

tests/wpt/web-platform-tests/cssom/CSSKeyframesRule.html

@@ -15,18 +15,19 @@
     <script>
     test(function () {
         var keyframe = document.styleSheets[0].cssRules[0];
+        assert_equals(keyframe.name, "foo", "CSSKeyframesRule name attribute");
         assert_equals(keyframe.cssRules.length, 2, "CSSKeyframesRule cssRule length attribute");
         assert_equals(keyframe.cssRules[0].cssText, "0% { top: 0px; }", "CSSKeyframesRule cssRule cssText attribute");
         assert_equals(keyframe.cssRules[1].cssText, "100% { top: 200px; }", "CSSKeyframesRule cssRule cssText attribute");
 
         keyframe.appendRule("50% { top: 100px; }");
-        assert_equals(keyframe.cssRules.length, 3, "CSSKeyframesRule prefix attribute after appendRule function");
+        assert_equals(keyframe.cssRules.length, 3, "CSSKeyframesRule cssRule length attribute after appendRule function");
         assert_equals(keyframe.cssRules[0].cssText, "0% { top: 0px; }", "CSSKeyframesRule cssRule cssText attribute after appendRule function");
         assert_equals(keyframe.cssRules[1].cssText, "100% { top: 200px; }", "CSSKeyframesRule cssRule cssText attribute after appendRule function");
         assert_equals(keyframe.cssRules[2].cssText, "50% { top: 100px; }", "CSSKeyframesRule cssRule cssText attribute after appendRule function");
 
         keyframe.appendRule("0% { top: 50px; }");
-        assert_equals(keyframe.cssRules.length, 4, "CSSKeyframesRule prefix attribute after appendRule function");
+        assert_equals(keyframe.cssRules.length, 4, "CSSKeyframesRule cssRule length attribute after appendRule function");
         assert_equals(keyframe.cssRules[0].cssText, "0% { top: 0px; }", "CSSKeyframesRule cssRule cssText attribute after appendRule function");
         assert_equals(keyframe.cssRules[1].cssText, "100% { top: 200px; }", "CSSKeyframesRule cssRule cssText attribute after appendRule function");
         assert_equals(keyframe.cssRules[2].cssText, "50% { top: 100px; }", "CSSKeyframesRule cssRule cssText attribute after appendRule function");
@@ -40,18 +41,29 @@
         assert_equals(find3, null, "CSSKeyframesRule findRule function");
 
         keyframe.deleteRule("100%");
-        assert_equals(keyframe.cssRules.length, 3, "CSSKeyframesRule prefix attribute after deleteRule function");
+        assert_equals(keyframe.cssRules.length, 3, "CSSKeyframesRule cssRule length attribute after deleteRule function");
         assert_equals(keyframe.cssRules[0].cssText, "0% { top: 0px; }", "CSSKeyframesRule cssRule cssText attribute after deleteRule function");
         assert_equals(keyframe.cssRules[1].cssText, "50% { top: 100px; }", "CSSKeyframesRule cssRule cssText attribute after deleteRule function");
         assert_equals(keyframe.cssRules[2].cssText, "0% { top: 50px; }", "CSSKeyframesRule cssRule cssText attribute after deleteRule function");
         assert_equals(keyframe.cssRules[3], undefined, "CSSKeyframesRule cssRule cssText attribute after deleteRule function");
 
         keyframe.deleteRule("80%");
-        assert_equals(keyframe.cssRules.length, 3, "CSSKeyframesRule prefix attribute after deleteRule function");
+        assert_equals(keyframe.cssRules.length, 3, "CSSKeyframesRule cssRule length attribute after deleteRule function");
         assert_equals(keyframe.cssRules[0].cssText, "0% { top: 0px; }", "CSSKeyframesRule cssRule cssText attribute after deleteRule function");
         assert_equals(keyframe.cssRules[1].cssText, "50% { top: 100px; }", "CSSKeyframesRule cssRule cssText attribute after deleteRule function");
         assert_equals(keyframe.cssRules[2].cssText, "0% { top: 50px; }", "CSSKeyframesRule cssRule cssText attribute after deleteRule function");
         assert_equals(keyframe.cssRules[3], undefined, "CSSKeyframesRule cssRule cssText attribute after deleteRule function");
+
+        keyframe.name = "bar";
+        assert_equals(keyframe.name, "bar", "CSSKeyframesRule name setter");
+
+        assert_throws("SyntaxError",
+                      function () { keyframe.name = "initial"; },
+                      "CSSKeyframesRule name setter on invalid keyword.");
+
+        assert_throws("SyntaxError",
+                      function () { keyframe.name = "none"; },
+                      "CSSKeyframesRule name setter on invalid keyword.");
     });
     </script>
 </head>