Fixes #3235

lib/less/functions/types.js

@@ -85,5 +85,8 @@ functionRegistry.addMultiple({
     },
     length: function(values) {
         return new Dimension(getItemsFromNode(values).length);
+    },
+    _SELF: function(n) {
+        return n;
     }
 });

lib/less/tree/variable.js

@@ -1,4 +1,5 @@
-var Node = require('./node');
+var Node = require('./node'),
+    Call = require('./call');
 
 var Variable = function (name, index, currentFileInfo) {
     this.name = name;
@@ -30,7 +31,13 @@ Variable.prototype.eval = function (context) {
                 var importantScope = context.importantScope[context.importantScope.length - 1];
                 importantScope.important = v.important;
             }
-            return v.value.eval(context);
+            // If in calc, wrap vars in a function call to cascade evaluate args first
+            if (context.inCalc) {
+                return (new Call('_SELF', [v.value])).eval(context);
+            }
+            else {
+                return v.value.eval(context);
+            }
         }
     });
     if (variable) {

test/css/calc.css

@@ -1,4 +1,6 @@
 .no-math {
+  root: calc(100% - 30px);
+  root2: calc(100% - 40px);
   width: calc(50% + (25vh - 20px));
   height: calc(50% + (25vh - 20px));
   min-height: calc((10vh) + calc(5vh));

test/less/calc.less

@@ -1,4 +1,9 @@
+@val: 10px;
 .no-math {
+  @c: 10px + 20px;
+  @calc: (@val + 30px);
+  root: calc(100% - @c);
+  root2: calc(100% - @calc);
   @var: 50vh/2;
   width: calc(50% + (@var - 20px));
   height: calc(50% + ((@var - 20px)));