@acemir/cssom 0.9.16 → 0.9.18

package/lib/CSSFontFaceRule.js

@@ -3,6 +3,12 @@ var CSSOM = {
 	CSSStyleDeclaration: require("./CSSStyleDeclaration").CSSStyleDeclaration,
 	CSSRule: require("./CSSRule").CSSRule
 };
+// Use cssstyle if available
+try {
+	CSSOM.CSSStyleDeclaration = require("cssstyle").CSSStyleDeclaration;
+} catch (e) {
+	// ignore
+}
 ///CommonJS
 
 
@@ -12,8 +18,8 @@ var CSSOM = {
  */
 CSSOM.CSSFontFaceRule = function CSSFontFaceRule() {
 	CSSOM.CSSRule.call(this);
-	this.style = new CSSOM.CSSStyleDeclaration();
-	this.style.parentRule = this;
+	this.__style = new CSSOM.CSSStyleDeclaration();
+	this.__style.parentRule = this;
 };
 
 CSSOM.CSSFontFaceRule.prototype = new CSSOM.CSSRule();
@@ -23,10 +29,23 @@ CSSOM.CSSFontFaceRule.prototype.type = 5;
 //CSSOM.CSSFontFaceRule.prototype.insertRule = CSSStyleSheet.prototype.insertRule;
 //CSSOM.CSSFontFaceRule.prototype.deleteRule = CSSStyleSheet.prototype.deleteRule;
 
+Object.defineProperty(CSSOM.CSSFontFaceRule.prototype, "style", {
+	get: function() {
+		return this.__style;	
+	},
+	set: function(value) {
+		if (typeof value === "string") {
+			this.__style.cssText = value;
+		} else {
+			this.__style = value;
+		}
+	}
+});
+
 // http://www.opensource.apple.com/source/WebCore/WebCore-955.66.1/css/WebKitCSSFontFaceRule.cpp
 Object.defineProperty(CSSOM.CSSFontFaceRule.prototype, "cssText", {
   get: function() {
-    return "@font-face { " + this.style.cssText + " }";
+    return "@font-face {" + (this.style.cssText ? " " + this.style.cssText : "") + " }";
   }
 });
 

package/lib/CSSGroupingRule.js

@@ -3,6 +3,7 @@ var CSSOM = {
 	CSSRule: require("./CSSRule").CSSRule,
 	parse: require('./parse').parse
 };
+var errorUtils = require("./errorUtils").errorUtils;
 ///CommonJS
 
 
@@ -36,11 +37,42 @@ CSSOM.CSSGroupingRule.prototype.constructor = CSSOM.CSSGroupingRule;
  * @return {number} The index within the grouping rule's collection of the newly inserted rule.
  */
  CSSOM.CSSGroupingRule.prototype.insertRule = function insertRule(rule, index) {
-	if (index < 0 || index > this.cssRules.length) {
-		throw new RangeError("INDEX_SIZE_ERR");
+	if (rule === undefined && index === undefined) {
+		errorUtils.throwMissingArguments(this, 'insertRule', this.constructor.name);
 	}
-	var cssRule = CSSOM.parse(rule).cssRules[0];
-	cssRule.parentRule = this;
+	if (index === void 0) {
+		index = 0;
+	}
+	index = Number(index);
+	if (index < 0) {
+		index = 4294967296 + index;
+	}
+	if (index > this.cssRules.length) {
+		errorUtils.throwIndexError(this, 'insertRule', this.constructor.name, index, this.cssRules.length);
+	}
+	
+	var ruleToParse = String(rule);
+	var parsedSheet = CSSOM.parse(ruleToParse);
+	if (parsedSheet.cssRules.length !== 1) {
+		errorUtils.throwParseError(this, 'insertRule', this.constructor.name, ruleToParse, 'SyntaxError');
+	}
+	var cssRule = parsedSheet.cssRules[0];
+	
+	// Check for rules that cannot be inserted inside a CSSGroupingRule
+	if (cssRule.constructor.name === 'CSSImportRule' || cssRule.constructor.name === 'CSSNamespaceRule') {
+		var ruleKeyword = cssRule.constructor.name === 'CSSImportRule' ? '@import' : '@namespace';
+		errorUtils.throwError(this, 'DOMException', 
+			"Failed to execute 'insertRule' on '" + this.constructor.name + "': " +
+			"'" + ruleKeyword + "' rules cannot be inserted inside a group rule.",
+			'HierarchyRequestError');
+	}
+	
+	// Check for CSSLayerStatementRule (@layer statement rules)
+	if (cssRule.constructor.name === 'CSSLayerStatementRule') {
+		errorUtils.throwParseError(this, 'insertRule', this.constructor.name, ruleToParse, 'SyntaxError');
+	}
+	
+	cssRule.__parentRule = this;
 	this.cssRules.splice(index, 0, cssRule);
 	return index;
 };
@@ -58,10 +90,17 @@ CSSOM.CSSGroupingRule.prototype.constructor = CSSOM.CSSGroupingRule;
  * @see https://www.w3.org/TR/cssom-1/#dom-cssgroupingrule-deleterule
  */
  CSSOM.CSSGroupingRule.prototype.deleteRule = function deleteRule(index) {
-	if (index < 0 || index >= this.cssRules.length) {
-		throw new RangeError("INDEX_SIZE_ERR");
+	if (index === undefined) {
+		errorUtils.throwMissingArguments(this, 'deleteRule', this.constructor.name);
+	}
+	index = Number(index);
+	if (index < 0) {
+		index = 4294967296 + index;
+	}
+	if (index >= this.cssRules.length) {
+		errorUtils.throwIndexError(this, 'deleteRule', this.constructor.name, index, this.cssRules.length);
 	}
-	this.cssRules.splice(index, 1)[0].parentRule = null;
+	this.cssRules.splice(index, 1)[0].__parentRule = null;
 };
 
 //.CommonJS

package/lib/CSSImportRule.js

@@ -28,7 +28,7 @@ CSSOM.CSSImportRule.prototype.type = 3;
 Object.defineProperty(CSSOM.CSSImportRule.prototype, "cssText", {
   get: function() {
     var mediaText = this.media.mediaText;
-    return "@import url(" + this.href + ")" + (this.layerName !== null ? " layer" + (this.layerName && "(" + this.layerName + ")") : "" ) + (this.supportsText ? " supports(" + this.supportsText + ")" : "" ) + (mediaText ? " " + mediaText : "") + ";";
+    return "@import url(\"" + this.href + "\")" + (this.layerName !== null ? " layer" + (this.layerName && "(" + this.layerName + ")") : "" ) + (this.supportsText ? " supports(" + this.supportsText + ")" : "" ) + (mediaText ? " " + mediaText : "") + ";";
   },
   set: function(cssText) {
     var i = 0;
@@ -46,7 +46,7 @@ Object.defineProperty(CSSOM.CSSImportRule.prototype, "cssText", {
     var index;
 
     var layerRegExp = /layer\(([^)]*)\)/;
-    var layerRuleNameRegExp = /^(-?[_a-zA-Z]+[_a-zA-Z0-9-]*)$/;
+    var layerRuleNameRegExp = /^(-?[_a-zA-Z]+(\.[_a-zA-Z]+)*[_a-zA-Z0-9-]*)$/;
     var supportsRegExp = /supports\(([^)]+)\)/;
     var doubleOrMoreSpacesRegExp = /\s{2,}/g;
 
@@ -129,12 +129,12 @@ Object.defineProperty(CSSOM.CSSImportRule.prototype, "cssText", {
 
                 if (layerMatch) {
                   var layerName = layerMatch[1].trim();
-                  bufferTrimmed = bufferTrimmed.replace(layerRegExp, '')
-                    .replace(doubleOrMoreSpacesRegExp, ' ') // Replace double or more spaces with single space
-                    .trim();
 
                   if (layerName.match(layerRuleNameRegExp) !== null) {
                     this.layerName = layerMatch[1].trim();
+                    bufferTrimmed = bufferTrimmed.replace(layerRegExp, '')
+                      .replace(doubleOrMoreSpacesRegExp, ' ') // Replace double or more spaces with single space
+                      .trim();
                   } else {
                     // REVIEW: In the browser, an empty layer() is not processed as a unamed layer
                     // and treats the rest of the string as mediaText, ignoring the parse of supports()

package/lib/CSSKeyframeRule.js

@@ -3,6 +3,12 @@ var CSSOM = {
 	CSSRule: require("./CSSRule").CSSRule,
 	CSSStyleDeclaration: require('./CSSStyleDeclaration').CSSStyleDeclaration
 };
+// Use cssstyle if available
+try {
+	CSSOM.CSSStyleDeclaration = require("cssstyle").CSSStyleDeclaration;
+} catch (e) {
+	// ignore
+}
 ///CommonJS
 
 
@@ -13,8 +19,8 @@ var CSSOM = {
 CSSOM.CSSKeyframeRule = function CSSKeyframeRule() {
 	CSSOM.CSSRule.call(this);
 	this.keyText = '';
-	this.style = new CSSOM.CSSStyleDeclaration();
-	this.style.parentRule = this;
+	this.__style = new CSSOM.CSSStyleDeclaration();
+	this.__style.parentRule = this;
 };
 
 CSSOM.CSSKeyframeRule.prototype = new CSSOM.CSSRule();
@@ -24,10 +30,23 @@ CSSOM.CSSKeyframeRule.prototype.type = 8;
 //CSSOM.CSSKeyframeRule.prototype.insertRule = CSSStyleSheet.prototype.insertRule;
 //CSSOM.CSSKeyframeRule.prototype.deleteRule = CSSStyleSheet.prototype.deleteRule;
 
+Object.defineProperty(CSSOM.CSSKeyframeRule.prototype, "style", {
+	get: function() {
+		return this.__style;	
+	},
+	set: function(value) {
+		if (typeof value === "string") {
+			this.__style.cssText = value;
+		} else {
+			this.__style = value;
+		}
+	}
+});
+
 // http://www.opensource.apple.com/source/WebCore/WebCore-955.66.1/css/WebKitCSSKeyframeRule.cpp
 Object.defineProperty(CSSOM.CSSKeyframeRule.prototype, "cssText", {
   get: function() {
-    return this.keyText + " { " + this.style.cssText + " } ";
+    return this.keyText + " {" + (this.style.cssText ? " " + this.style.cssText : "") + " }";
   }
 });
 

package/lib/CSSKeyframesRule.js

@@ -1,7 +1,9 @@
 //.CommonJS
 var CSSOM = {
-	CSSRule: require("./CSSRule").CSSRule
+	CSSRule: require("./CSSRule").CSSRule,
+	parse: require("./parse").parse
 };
+var errorUtils = require("./errorUtils").errorUtils;
 ///CommonJS
 
 
@@ -13,14 +15,42 @@ CSSOM.CSSKeyframesRule = function CSSKeyframesRule() {
 	CSSOM.CSSRule.call(this);
 	this.name = '';
 	this.cssRules = [];
+	
+	// Set up initial indexed access
+	this._setupIndexedAccess();
+	
+	// Override cssRules methods after initial setup, store references as non-enumerable properties
+	var self = this;
+	var originalPush = this.cssRules.push;
+	var originalSplice = this.cssRules.splice;
+	
+	// Create non-enumerable method overrides
+	Object.defineProperty(this.cssRules, 'push', {
+		value: function() {
+			var result = originalPush.apply(this, arguments);
+			self._setupIndexedAccess();
+			return result;
+		},
+		writable: true,
+		enumerable: false,
+		configurable: true
+	});
+	
+	Object.defineProperty(this.cssRules, 'splice', {
+		value: function() {
+			var result = originalSplice.apply(this, arguments);
+			self._setupIndexedAccess();
+			return result;
+		},
+		writable: true,
+		enumerable: false,
+		configurable: true
+	});
 };
 
 CSSOM.CSSKeyframesRule.prototype = new CSSOM.CSSRule();
 CSSOM.CSSKeyframesRule.prototype.constructor = CSSOM.CSSKeyframesRule;
 CSSOM.CSSKeyframesRule.prototype.type = 7;
-//FIXME
-//CSSOM.CSSKeyframesRule.prototype.insertRule = CSSStyleSheet.prototype.insertRule;
-//CSSOM.CSSKeyframesRule.prototype.deleteRule = CSSStyleSheet.prototype.deleteRule;
 
 // http://www.opensource.apple.com/source/WebCore/WebCore-955.66.1/css/WebKitCSSKeyframesRule.cpp
 Object.defineProperty(CSSOM.CSSKeyframesRule.prototype, "cssText", {
@@ -29,10 +59,174 @@ Object.defineProperty(CSSOM.CSSKeyframesRule.prototype, "cssText", {
     for (var i=0, length=this.cssRules.length; i < length; i++) {
       cssTexts.push(this.cssRules[i].cssText);
     }
-    return "@" + (this._vendorPrefix || '') + "keyframes " + this.name + (this.name && " ") + "{" + (cssTexts.length ? "\n  " + cssTexts.join("\n  ") : "") + "\n}";
+    var cssWideKeywords = ['initial', 'inherit', 'revert', 'revert-layer', 'unset', 'none'];
+    var processedName = cssWideKeywords.includes(this.name) ? '"' + this.name + '"' : this.name;
+    return "@" + (this._vendorPrefix || '') + "keyframes " + processedName + (processedName && " ") + "{" + (cssTexts.length ? "\n  " + cssTexts.join("\n  ") : "") + "\n}";
   }
 });
 
+/**
+ * Appends a new keyframe rule to the list of keyframes.
+ * 
+ * @param {string} rule - The keyframe rule string to append (e.g., "50% { opacity: 0.5; }")
+ * @see https://www.w3.org/TR/css-animations-1/#dom-csskeyframesrule-appendrule
+ */
+CSSOM.CSSKeyframesRule.prototype.appendRule = function appendRule(rule) {
+	if (arguments.length === 0) {
+		errorUtils.throwMissingArguments(this, 'appendRule', 'CSSKeyframesRule');
+	}
+	
+	var parsedRule;
+	try {
+		// Parse the rule string as a keyframe rule
+		var tempStyleSheet = CSSOM.parse("@keyframes temp { " + rule + " }");
+		if (tempStyleSheet.cssRules.length > 0 && tempStyleSheet.cssRules[0].cssRules.length > 0) {
+			parsedRule = tempStyleSheet.cssRules[0].cssRules[0];
+		} else {
+			throw new Error("Failed to parse keyframe rule");
+		}
+	} catch (e) {
+		errorUtils.throwParseError(this, 'appendRule', 'CSSKeyframesRule', rule);
+	}
+	
+	parsedRule.__parentRule = this;
+	this.cssRules.push(parsedRule);
+};
+
+/**
+ * Deletes a keyframe rule that matches the specified key.
+ * 
+ * @param {string} select - The keyframe selector to delete (e.g., "50%", "from", "to")
+ * @see https://www.w3.org/TR/css-animations-1/#dom-csskeyframesrule-deleterule
+ */
+CSSOM.CSSKeyframesRule.prototype.deleteRule = function deleteRule(select) {
+	if (arguments.length === 0) {
+		errorUtils.throwMissingArguments(this, 'deleteRule', 'CSSKeyframesRule');
+	}
+	
+	var normalizedSelect = this._normalizeKeyText(select);
+	
+	for (var i = 0; i < this.cssRules.length; i++) {
+		var rule = this.cssRules[i];
+		if (this._normalizeKeyText(rule.keyText) === normalizedSelect) {
+			rule.__parentRule = null;
+			this.cssRules.splice(i, 1);
+			return;
+		}
+	}
+};
+
+/**
+ * Finds and returns the keyframe rule that matches the specified key.
+ * When multiple rules have the same key, returns the last one.
+ * 
+ * @param {string} select - The keyframe selector to find (e.g., "50%", "from", "to")
+ * @return {CSSKeyframeRule|null} The matching keyframe rule, or null if not found
+ * @see https://www.w3.org/TR/css-animations-1/#dom-csskeyframesrule-findrule
+ */
+CSSOM.CSSKeyframesRule.prototype.findRule = function findRule(select) {
+	if (arguments.length === 0) {
+		errorUtils.throwMissingArguments(this, 'findRule', 'CSSKeyframesRule');
+	}
+	
+	var normalizedSelect = this._normalizeKeyText(select);
+	
+	// Iterate backwards to find the last matching rule
+	for (var i = this.cssRules.length - 1; i >= 0; i--) {
+		var rule = this.cssRules[i];
+		if (this._normalizeKeyText(rule.keyText) === normalizedSelect) {
+			return rule;
+		}
+	}
+	
+	return null;
+};
+
+/**
+ * Normalizes keyframe selector text for comparison.
+ * Handles "from" -> "0%" and "to" -> "100%" conversions and trims whitespace.
+ * 
+ * @private
+ * @param {string} keyText - The keyframe selector text to normalize
+ * @return {string} The normalized keyframe selector text
+ */
+CSSOM.CSSKeyframesRule.prototype._normalizeKeyText = function _normalizeKeyText(keyText) {
+	if (!keyText) return '';
+	
+	var normalized = keyText.toString().trim().toLowerCase();
+	
+	// Convert keywords to percentages for comparison
+	if (normalized === 'from') {
+		return '0%';
+	} else if (normalized === 'to') {
+		return '100%';
+	}
+	
+	return normalized;
+};
+
+/**
+ * Makes CSSKeyframesRule iterable over its cssRules.
+ * Allows for...of loops and other iterable methods.
+ */
+if (typeof Symbol !== 'undefined' && Symbol.iterator) {
+	CSSOM.CSSKeyframesRule.prototype[Symbol.iterator] = function() {
+		var index = 0;
+		var cssRules = this.cssRules;
+		
+		return {
+			next: function() {
+				if (index < cssRules.length) {
+					return { value: cssRules[index++], done: false };
+				} else {
+					return { done: true };
+				}
+			}
+		};
+	};
+}
+
+/**
+ * Adds indexed getters for direct access to cssRules by index.
+ * This enables rule[0], rule[1], etc. access patterns.
+ * Works in environments where Proxy is not available (like jsdom).
+ */
+CSSOM.CSSKeyframesRule.prototype._setupIndexedAccess = function() {
+	// Remove any existing indexed properties
+	for (var i = 0; i < 1000; i++) { // reasonable upper limit
+		if (this.hasOwnProperty(i)) {
+			delete this[i];
+		} else {
+			break;
+		}
+	}
+	
+	// Add indexed getters for current cssRules
+	for (var i = 0; i < this.cssRules.length; i++) {
+		(function(index) {
+			Object.defineProperty(this, index, {
+				get: function() {
+					return this.cssRules[index];
+				},
+				enumerable: false,
+				configurable: true
+			});
+		}.call(this, i));
+	}
+	
+	// Update length property
+	Object.defineProperty(this, 'length', {
+		get: function() {
+			return this.cssRules.length;
+		},
+		enumerable: false,
+		configurable: true
+	});
+};
+
+
+
+
 
 //.CommonJS
 exports.CSSKeyframesRule = CSSOM.CSSKeyframesRule;

package/lib/CSSNestedDeclarations.js

@@ -1,23 +1,44 @@
 //.CommonJS
 var CSSOM = {
   CSSRule: require("./CSSRule").CSSRule,
+  CSSStyleDeclaration: require('./CSSStyleDeclaration').CSSStyleDeclaration
 };
+// Use cssstyle if available
+try {
+	CSSOM.CSSStyleDeclaration = require("cssstyle").CSSStyleDeclaration;
+} catch (e) {
+	// ignore
+}
 ///CommonJS
 
+
 /**
  * @constructor
  * @see https://drafts.csswg.org/css-nesting-1/
  */
 CSSOM.CSSNestedDeclarations = function CSSNestedDeclarations() {
   CSSOM.CSSRule.call(this);
-  this.style = new CSSOM.CSSStyleDeclaration();
-  this.style.parentRule = this;
+  this.__style = new CSSOM.CSSStyleDeclaration();
+  this.__style.parentRule = this;
 };
 
 CSSOM.CSSNestedDeclarations.prototype = new CSSOM.CSSRule();
 CSSOM.CSSNestedDeclarations.prototype.constructor = CSSOM.CSSNestedDeclarations;
 CSSOM.CSSNestedDeclarations.prototype.type = 0;
 
+Object.defineProperty(CSSOM.CSSNestedDeclarations.prototype, "style", {
+	get: function() {
+		return this.__style;	
+	},
+	set: function(value) {
+		if (typeof value === "string") {
+			this.__style.cssText = value;
+		} else {
+			this.__style = value;
+		}
+	}
+});
+
 Object.defineProperty(CSSOM.CSSNestedDeclarations.prototype, "cssText", {
   get: function () {
     return this.style.cssText;

package/lib/CSSRule.js

@@ -8,35 +8,48 @@ var CSSOM = {};
  * @see http://www.w3.org/TR/DOM-Level-2-Style/css.html#CSS-CSSRule
  */
 CSSOM.CSSRule = function CSSRule() {
-  this.parentRule = null;
-  this.parentStyleSheet = null;
+  this.__parentRule = null;
+  this.__parentStyleSheet = null;
 };
 
-CSSOM.CSSRule.UNKNOWN_RULE = 0; // obsolete
-CSSOM.CSSRule.STYLE_RULE = 1;
-CSSOM.CSSRule.CHARSET_RULE = 2; // obsolete
-CSSOM.CSSRule.IMPORT_RULE = 3;
-CSSOM.CSSRule.MEDIA_RULE = 4;
-CSSOM.CSSRule.FONT_FACE_RULE = 5;
-CSSOM.CSSRule.PAGE_RULE = 6;
-CSSOM.CSSRule.KEYFRAMES_RULE = 7;
-CSSOM.CSSRule.KEYFRAME_RULE = 8;
-CSSOM.CSSRule.MARGIN_RULE = 9;
-CSSOM.CSSRule.NAMESPACE_RULE = 10;
-CSSOM.CSSRule.COUNTER_STYLE_RULE = 11;
-CSSOM.CSSRule.SUPPORTS_RULE = 12;
-CSSOM.CSSRule.DOCUMENT_RULE = 13;
-CSSOM.CSSRule.FONT_FEATURE_VALUES_RULE = 14;
-CSSOM.CSSRule.VIEWPORT_RULE = 15;
-CSSOM.CSSRule.REGION_STYLE_RULE = 16;
-CSSOM.CSSRule.CONTAINER_RULE = 17;
-CSSOM.CSSRule.LAYER_BLOCK_RULE = 18;
-CSSOM.CSSRule.STARTING_STYLE_RULE = 1002;
+Object.defineProperties(CSSOM.CSSRule.prototype, {
 
-CSSOM.CSSRule.prototype = {
-  constructor: CSSOM.CSSRule,
-  //FIXME
-};
+  constructor: { value: CSSOM.CSSRule },
+
+  parentRule: {
+    get: function() {
+      return this.__parentRule
+    }
+  },
 
+  parentStyleSheet: {
+    get: function() {
+      return this.__parentStyleSheet
+    }
+  },
+  
+  UNKNOWN_RULE: { value: 0, enumerable: true }, // obsolet
+  STYLE_RULE: { value: 1, enumerable: true },
+  CHARSET_RULE: { value: 2, enumerable: true }, // obsolet
+  IMPORT_RULE: { value: 3, enumerable: true },
+  MEDIA_RULE: { value: 4, enumerable: true },
+  FONT_FACE_RULE: { value: 5, enumerable: true },
+  PAGE_RULE: { value: 6, enumerable: true },
+  KEYFRAMES_RULE: { value: 7, enumerable: true },
+  KEYFRAME_RULE: { value: 8, enumerable: true },
+  MARGIN_RULE: { value: 9, enumerable: true },
+  NAMESPACE_RULE: { value: 10, enumerable: true },
+  COUNTER_STYLE_RULE: { value: 11, enumerable: true },
+  SUPPORTS_RULE: { value: 12, enumerable: true },
+  DOCUMENT_RULE: { value: 13, enumerable: true },
+  FONT_FEATURE_VALUES_RULE: { value: 14, enumerable: true },
+  VIEWPORT_RULE: { value: 15, enumerable: true },
+  REGION_STYLE_RULE: { value: 16, enumerable: true },
+  CONTAINER_RULE: { value: 17, enumerable: true },
+  LAYER_BLOCK_RULE: { value: 18, enumerable: true },
+  STARTING_STYLE_RULE: { value: 1002, enumerable: true },
+})
+
+//.CommonJS
 exports.CSSRule = CSSOM.CSSRule;
 ///CommonJS

package/lib/CSSStyleRule.js

@@ -4,6 +4,12 @@ var CSSOM = {
 	CSSGroupingRule: require("./CSSGroupingRule").CSSGroupingRule,
 	CSSRule: require("./CSSRule").CSSRule
 };
+// Use cssstyle if available
+try {
+	CSSOM.CSSStyleDeclaration = require("cssstyle").CSSStyleDeclaration;
+} catch (e) {
+	// ignore
+}
 ///CommonJS
 
 
@@ -14,14 +20,40 @@ var CSSOM = {
  */
 CSSOM.CSSStyleRule = function CSSStyleRule() {
 	CSSOM.CSSGroupingRule.call(this);
-	this.selectorText = "";
-	this.style = new CSSOM.CSSStyleDeclaration();
-	this.style.parentRule = this;
+	this.__selectorText = "";
+	this.__style = new CSSOM.CSSStyleDeclaration();
+	this.__style.parentRule = this;
 };
 
 CSSOM.CSSStyleRule.prototype = new CSSOM.CSSGroupingRule();
 CSSOM.CSSStyleRule.prototype.constructor = CSSOM.CSSStyleRule;
-CSSOM.CSSStyleRule.prototype.type = 1;
+
+Object.defineProperty(CSSOM.CSSStyleRule.prototype, "type", {
+	value: 1,
+	writable: false
+});
+
+Object.defineProperty(CSSOM.CSSStyleRule.prototype, "selectorText", {
+	get: function() {
+		return this.__selectorText;	
+	},
+	set: function(value) {
+		this.__selectorText = value;
+	}
+});
+
+Object.defineProperty(CSSOM.CSSStyleRule.prototype, "style", {
+	get: function() {
+		return this.__style;	
+	},
+	set: function(value) {
+		if (typeof value === "string") {
+			this.__style.cssText = value;
+		} else {
+			this.__style = value;
+		}
+	}
+});
 
 Object.defineProperty(CSSOM.CSSStyleRule.prototype, "cssText", {
 	get: function() {
@@ -34,7 +66,7 @@ Object.defineProperty(CSSOM.CSSStyleRule.prototype, "cssText", {
 				valuesArr.push(this.cssRules.map(function(rule){ return rule.cssText }).join("\n  "));
 				values = valuesArr.join("\n  ") + "\n}"
 			} else {
-				values = " { " + this.style.cssText + " }";
+				values = " {" + (this.style.cssText ? " " + this.style.cssText : "") + " }";
 			}
 			text = this.selectorText + values;
 		} else {
@@ -44,8 +76,8 @@ Object.defineProperty(CSSOM.CSSStyleRule.prototype, "cssText", {
 	},
 	set: function(cssText) {
 		var rule = CSSOM.CSSStyleRule.parse(cssText);
-		this.style = rule.style;
-		this.selectorText = rule.selectorText;
+		this.__style = rule.style;
+		this.__selectorText = rule.selectorText;
 	}
 });