Experimental support for mixins with interpolated selectors

lib/less/tree/selector.js

@@ -33,22 +33,32 @@ tree.Selector.prototype = {
         var elements = this.elements,
             len = elements.length,
             oelements, olen, max, i;
+
+        oelements = other.elements.map( function(v) {
+            return v.combinator.value + (v.value.value || v.value);
+        }).join("").match(/[,&#\.\w-]([\w-]|(\\.))*/g); 
+        // ^ regexp could be more simple but see test/less/css-escapes.less:17, doh!
+
+        if (!oelements) {
+            return 0;
+        }
 
-        oelements = other.elements.slice(
-            (other.elements.length && other.elements[0].value === "&") ? 1 : 0);
-        olen = oelements.length;
-        max = Math.min(len, olen);
+        if (oelements[0] === "&") {
+            oelements.shift();
+        }
 
+        olen = oelements.length;
         if (olen === 0 || len < olen) {
             return 0;
         } else {
+            max = Math.min(len, olen);
             for (i = 0; i < max; i++) {
-                if (elements[i].value !== oelements[i].value) {
+                if (elements[i].value !== oelements[i]) {
                     return 0;
                 }
             }
         }
-        return max; // return number of matched selectors 
+        return max; // return number of matched elements
     },
     eval: function (env) {
         var evaldCondition = this.condition && this.condition.eval(env),

test/css/mixins-interpolated.css

@@ -0,0 +1,39 @@
+.foo {
+  a: 1;
+}
+.foo {
+  a: 2;
+}
+#foo {
+  a: 3;
+}
+#foo {
+  a: 4;
+}
+mi-test-a {
+  a: 1;
+  a: 2;
+  a: 3;
+  a: 4;
+}
+.b .bb.foo-xxx .yyy-foo#foo .foo.bbb {
+  b: 1;
+}
+mi-test-b {
+  b: 1;
+}
+#foo-foo > .bar .baz {
+  c: c;
+}
+mi-test-c-1 > .bar .baz {
+  c: c;
+}
+mi-test-c-2 .baz {
+  c: c;
+}
+mi-test-c-3 {
+  c: c;
+}
+mi-test-d {
+  gender: "Male";
+}

test/less/mixins-interpolated.less

@@ -0,0 +1,69 @@
+
+@a1: foo;
+@a2: ~".foo";
+@a4: ~"#foo";
+
+.@{a1} {
+    a: 1;
+}
+
+@{a2} {
+    a: 2;
+}
+
+#@{a1} {
+    a: 3;
+}
+
+@{a4} {
+    a: 4;
+}
+
+mi-test-a {
+    .foo;
+    #foo;
+}
+
+.b .bb {
+    &.@{a1}-xxx .yyy-@{a1}@{a4} {
+        & @{a2}.bbb {
+            b: 1;
+        }
+    }
+}
+
+mi-test-b {
+    .b.bb.foo-xxx.yyy-foo#foo.foo.bbb;
+}
+
+@c1: @a1;
+@c2: bar;
+@c3: baz;
+
+#@{c1}-foo {
+    > .@{c2} {
+        .@{c3} {
+            c: c;
+        }
+    }
+}
+
+mi-test-c {
+    &-1 {#foo-foo;}
+    &-2 {#foo-foo > .bar;}
+    &-3 {#foo-foo > .bar.baz;}
+}
+
+.Person(@name, @gender_) {
+    .@{name} {
+        @gender: @gender_;
+        .sayGender() {
+            gender: @gender;
+        }
+    }
+}
+
+mi-test-d {
+    .Person(person, "Male");
+    .person.sayGender();
+}