Allow multiple extends for more declarative multiple inheritance

Author: lukeapage

lib/less/parser.js

@@ -789,27 +789,34 @@ less.Parser = function Parser(env) {
             // extend syntax - used to extend selectors
             //
             extend: function(isRule) {
-                var elements = [], e, args, index = i, option;
+                var elements, e, index = i, option, extendList = [];
 
                 if (!$(isRule ? /^&:extend\(/ : /^:extend\(/)) { return; }
 
-                while (true) {
-                    option = $(/^(all)(?=\s*\))/);
-                    if (option) { break; }
-                    e = $(this.element);
-                    if (!e) { break; }
-                    elements.push(e);
-                }
+                do {
+                    option = null;
+                    elements = [];
+                    while (true) {
+                        option = $(/^(all)(?=\s*(\)|,))/);
+                        if (option) { break; }
+                        e = $(this.element);
+                        if (!e) { break; }
+                        elements.push(e);
+                    }
+
+                    option = option && option[1];
+
+                    extendList.push(new(tree.Extend)(new(tree.Selector)(elements), option, index));
+
+                } while($(","))
 
                 expect(/^\)/);
-                
-                option = option && option[1];
-                
+
                 if (isRule) {
                     expect(/^;/);
                 }
 
-                return new(tree.Extend)(new(tree.Selector)(elements), option, index);
+                return extendList;
             },
 
             //
@@ -1118,7 +1125,7 @@ less.Parser = function Parser(env) {
 
                 while ((extend = $(this.extend)) || (e = $(this.element))) {
                     if (extend) {
-                        extendList.push(extend);
+                        extendList.push.apply(extendList, extend);
                     } else {
                         if (extendList.length) {
                             error("Extend can only be used at the end of selector");

test/css/extend.css

@@ -56,3 +56,22 @@ div.ext7,
 .foo {
   result: match-nested-foo;
 }
+.aa,
+.bb,
+.cc {
+  color: black;
+}
+.aa .dd,
+.aa .ee {
+  background: red;
+}
+.bb,
+.cc,
+.ee,
+.ff {
+  background: red;
+}
+.bb .bb,
+.ff .ff {
+  color: black;
+}

test/less/extend.less

@@ -62,4 +62,20 @@ div.ext5,
 .foo:extend(.ext8.ext9 all) {}
 .bar:extend(.ext8 .ext9 all) {}
 .zap:extend(.ext8 + .ext9 all) {}
-.zoo:extend(.ext8 > .ext9 all) {}
+.zoo:extend(.ext8 > .ext9 all) {}
+
+.aa {
+  color: black;
+  .dd {
+    background: red;
+  }
+}
+.bb:extend(.aa) {
+  background: red;
+  .bb {
+    color: black;
+  }
+}
+.cc:extend(.aa,.bb) {}
+.ee:extend(.dd all,.bb) {}
+.ff:extend(.dd,.bb all) {}