Implemented support for @host blocks. (#72)

Implemented support for @host blocks.

Author: Munter

lib/CSSHostRule.js

@@ -0,0 +1,37 @@
+//.CommonJS
+var CSSOM = {
+	CSSRule: require("./CSSRule").CSSRule
+};
+///CommonJS
+
+
+/**
+ * @constructor
+ * @see http://www.w3.org/TR/shadow-dom/#host-at-rule
+ */
+CSSOM.CSSHostRule = function CSSHostRule() {
+	CSSOM.CSSRule.call(this);
+	this.cssRules = [];
+};
+
+CSSOM.CSSHostRule.prototype = new CSSOM.CSSRule();
+CSSOM.CSSHostRule.prototype.constructor = CSSOM.CSSHostRule;
+CSSOM.CSSHostRule.prototype.type = 1001;
+//FIXME
+//CSSOM.CSSHostRule.prototype.insertRule = CSSStyleSheet.prototype.insertRule;
+//CSSOM.CSSHostRule.prototype.deleteRule = CSSStyleSheet.prototype.deleteRule;
+
+Object.defineProperty(CSSOM.CSSHostRule.prototype, "cssText", {
+	get: function() {
+		var cssTexts = [];
+		for (var i=0, length=this.cssRules.length; i < length; i++) {
+			cssTexts.push(this.cssRules[i].cssText);
+		}
+		return "@host {" + cssTexts.join("") + "}";
+	}
+});
+
+
+//.CommonJS
+exports.CSSHostRule = CSSOM.CSSHostRule;
+///CommonJS

lib/parse.js

@@ -43,7 +43,7 @@ CSSOM.parse = function parse(token) {
 	// @type CSSMediaRule|CSSKeyframesRule|CSSDocumentRule
 	var parentRule;
 
-	var name, priority="", styleRule, mediaRule, importRule, fontFaceRule, keyframesRule, documentRule;
+	var name, priority="", styleRule, mediaRule, importRule, fontFaceRule, keyframesRule, documentRule, hostRule;
 
 	var atKeyframesRegExp = /@(-(?:\w+-)+)?keyframes/g;
 
@@ -149,6 +149,13 @@ CSSOM.parse = function parse(token) {
 				i += "media".length;
 				buffer = "";
 				break;
+			} else if (token.indexOf("@host", i) === i) {
+				state = "hostRule-begin";
+				i += "host".length;
+				hostRule = new CSSOM.CSSHostRule();
+				hostRule.__starts = i;
+				buffer = "";
+				break;
 			} else if (token.indexOf("@import", i) === i) {
 				state = "importRule-begin";
 				i += "import".length;
@@ -191,6 +198,11 @@ CSSOM.parse = function parse(token) {
 				mediaRule.parentStyleSheet = styleSheet;
 				buffer = "";
 				state = "before-selector";
+			} else if (state === "hostRule-begin") {
+				currentScope = parentRule = hostRule;
+				hostRule.parentStyleSheet = styleSheet;
+				buffer = "";
+				state = "before-selector";
 			} else if (state === "fontFaceRule-begin") {
 				if (parentRule) {
 					fontFaceRule.parentRule = parentRule;
@@ -373,6 +385,7 @@ CSSOM.CSSStyleRule = require("./CSSStyleRule").CSSStyleRule;
 CSSOM.CSSImportRule = require("./CSSImportRule").CSSImportRule;
 CSSOM.CSSMediaRule = require("./CSSMediaRule").CSSMediaRule;
 CSSOM.CSSFontFaceRule = require("./CSSFontFaceRule").CSSFontFaceRule;
+CSSOM.CSSHostRule = require("./CSSHostRule").CSSHostRule;
 CSSOM.CSSStyleDeclaration = require('./CSSStyleDeclaration').CSSStyleDeclaration;
 CSSOM.CSSKeyframeRule = require('./CSSKeyframeRule').CSSKeyframeRule;
 CSSOM.CSSKeyframesRule = require('./CSSKeyframesRule').CSSKeyframesRule;

spec/parse.spec.js

@@ -754,6 +754,33 @@ var TESTS = [
 			return result;
 		})()
 	},
+	{
+		input: "@host { body { background: red; } }",
+		result: (function() {
+			var result = {
+				cssRules: [
+					{
+						cssRules: {
+							0: {
+								selectorText: "body",
+								style: {
+									0: "background",
+									length: 1,
+									parentRule: "..",
+									background: "red"
+								}
+							}
+						},
+						parentRule: null
+					}
+				],
+				parentStyleSheet: null
+			};
+			result.cssRules[0].parentStyleSheet = result.cssRules[0].cssRules[0].parentStyleSheet = result;
+			result.cssRules[0].cssRules[0].parentRule = result.cssRules[0];
+			return result;
+		})()
+	},
 	{
 		// Non-vendor prefixed @keyframes rule, from Twitter Bootstrap (progress-bars):
 		input: '@keyframes progress-bar-stripes {\n  from  { background-position: 0 0; }\n  to    { background-position: 40px 0; }\n}',

src/files.js

@@ -6,6 +6,7 @@ exports.files = [
 	"CSSMediaRule",
 	"CSSImportRule",
 	"CSSFontFaceRule",
+	"CSSHostRule",
 	"StyleSheet",
 	"CSSStyleSheet",
 	"CSSKeyframesRule",