dynamic selectors

Allows things like:

  a:nth-child(@var) {}

lib/less/parser.js

@@ -823,6 +823,8 @@ less.Parser = function Parser(env) {
                 e = $(/^(?:\d+\.\d+|\d+)%/) || $(/^(?:[.#]?|:*)(?:[\w-]|\\(?:[a-fA-F0-9]{1,6} ?|[^a-fA-F0-9]))+/) ||
                     $('*') || $(this.attribute) || $(/^\([^)@]+\)/);
 
+                e || ($('(') && (e = $(this.entities.variable)) && $(')'));
+
                 if (e) { return new(tree.Element)(c, e, i) }
 
                 if (c.value && c.value.charAt(0) === '&') {

lib/less/tree/element.js

@@ -3,11 +3,23 @@
 tree.Element = function (combinator, value, index) {
     this.combinator = combinator instanceof tree.Combinator ?
                       combinator : new(tree.Combinator)(combinator);
-    this.value = value ? value.trim() : "";
+
+    if (typeof(value) === 'string') {
+        this.value = value.trim();
+    } else if (value) {
+        this.value = value;
+    } else {
+        this.value = "";
+    }
     this.index = index;
 };
+tree.Element.prototype.eval = function (env) {
+    return new(tree.Element)(this.combinator,
+                             this.value.eval ? this.value.eval(env) : this.value,
+                             this.index);
+};
 tree.Element.prototype.toCSS = function (env) {
-    return this.combinator.toCSS(env || {}) + this.value;
+    return this.combinator.toCSS(env || {}) + (this.value.toCSS ? '(' + this.value.toCSS(env) + ')' : this.value);
 };
 
 tree.Combinator = function (value) {

lib/less/tree/ruleset.js

@@ -7,7 +7,8 @@ tree.Ruleset = function (selectors, rules) {
 };
 tree.Ruleset.prototype = {
     eval: function (env) {
-        var ruleset = new(tree.Ruleset)(this.selectors, this.rules.slice(0));
+        var selectors = this.selectors && this.selectors.map(function (s) { return s.eval(env) });
+        var ruleset = new(tree.Ruleset)(selectors, this.rules.slice(0));
 
         ruleset.root = this.root;
 

lib/less/tree/selector.js

@@ -22,6 +22,11 @@ tree.Selector.prototype.match = function (other) {
     }
     return true;
 };
+tree.Selector.prototype.eval = function (env) {
+    return new(tree.Selector)(this.elements.map(function (e) {
+        return e.eval(env);
+    }));
+};
 tree.Selector.prototype.toCSS = function (env) {
     if (this._css) { return this._css }
 

test/css/variables.css

@@ -22,3 +22,6 @@
 .alpha {
   filter: alpha(opacity=42);
 }
+a:nth-child(2) {
+  border: 1px;
+}

test/less/variables.less

@@ -48,3 +48,7 @@
     @var: 42;
     filter: alpha(opacity=@var);
 }
+
+a:nth-child(@a) {
+    border: 1px;
+}