less 2.3.0 → 2.3.1

package/test/less-bom/selectors.less

@@ -0,0 +1,174 @@
+h1, h2, h3 {
+  a, p {
+    &:hover {
+      color: red;
+    }
+  }
+}
+
+#all { color: blue; }
+#the { color: blue; }
+#same { color: blue; }
+
+ul, li, div, q, blockquote, textarea {
+  margin: 0;
+}
+
+td {
+  margin: 0;
+  padding: 0;
+}
+
+td, input {
+  line-height: 1em;
+}
+
+a {
+  color: red;
+
+  &:hover { color: blue; }
+
+  div & { color: green; }
+
+  p & span { color: yellow; }
+}
+
+.foo {
+  .bar, .baz {
+    & .qux {
+      display: block;
+    }
+    .qux & {
+      display: inline;
+    }
+    .qux& {
+      display: inline-block;
+    }
+    .qux & .biz {
+      display: none;
+    }
+  }
+}
+
+.b {
+ &.c {
+  .a& {
+   color: red;
+  }
+ }
+}
+
+.b {
+ .c & {
+  &.a {
+   color: red;
+  }
+ }
+}
+
+.p {
+  .foo &.bar {
+    color: red;
+  }
+}
+
+.p {
+  .foo&.bar {
+    color: red;
+  }
+}
+
+.foo {
+  .foo + & {
+    background: amber;
+  }
+  & + & {
+    background: amber;
+  }
+}
+
+.foo, .bar {
+  & + & {
+    background: amber;
+  }
+}
+
+.foo, .bar {
+  a, b {
+    & > & {
+      background: amber;
+    }
+  }
+}
+
+.other ::fnord { color: red }
+.other::fnord { color: red }
+.other {
+  ::bnord {color: red }
+  &::bnord {color: red }
+}
+// selector interpolation
+@theme: blood;
+@selector: ~".@{theme}";
+@{selector} {
+  color:red;
+}
+@{selector}red {
+  color: green;
+}
+.red {
+  #@{theme}.@{theme}&.black:@{theme} {
+    color:black;
+  }
+}
+@num: 3;
+:nth-child(@{num}) {
+  selector: interpolated;
+}
+.test {
+  &:nth-child(@{num}) {
+    selector: interpolated;
+  }
+  &:nth-child(odd):not(:nth-child(3)) {
+    color: #ff0000;
+  }
+ }
+[prop],
+[prop=10%],
+[prop="value@{num}"],
+[prop*="val@{num}"],
+[|prop~="val@{num}"],
+[*|prop$="val@{num}"],
+[ns|prop^="val@{num}"],
+[@{num}^="val@{num}"],
+[@{num}=@{num}],
+[@{num}] {
+  attributes: yes;
+}
+
+/*
+Large comment means chunk will be emitted after } which means chunk will begin with whitespace...
+blank blank blank blank blank blank blank blank blank blank blank blank blank blank blank blank
+blank blank blank blank blank blank blank blank blank blank blank blank blank blank blank blank
+blank blank blank blank blank blank blank blank blank blank blank blank blank blank blank blank
+blank blank blank blank blank blank blank blank blank blank blank blank blank blank blank blank
+blank blank blank blank blank blank blank blank blank blank blank blank blank blank blank blank
+*/
+@{selector} {
+  color: red;
+}
+.only-nested {
+  .level2 {
+    .foo:not(.tst&:hover) {
+      test: only-nested;
+    }
+  }
+}
+.nestend-and-non-nested {
+  .foo&:not(.tst&:hover) {
+    test: nestend-and-non-nested;
+  }
+}
+.selector:not(&:hover) {
+  test: global scope;
+}

package/test/less-bom/sourcemaps/basic.json

@@ -0,0 +1,3 @@
+{
+    "my-color": "red"
+}

package/test/less-bom/sourcemaps/basic.less

@@ -0,0 +1,27 @@
+@var: black;
+
+.a() {
+  color: red;
+}
+
+.b {
+  color: green;
+  .a();
+  color: blue;
+  background: @var;
+}
+
+.a, .b {
+  background: green;
+  .c, .d {
+    background: gray;
+    & + & {
+      color: red;
+    }
+  }
+}
+
+.extend:extend(.a all) {
+  color: pink;
+}
+@import (inline) "imported.css";

package/test/less-bom/sourcemaps/imported.css

@@ -0,0 +1,7 @@
+/*comments*/
+.unused-css {
+    color: white;
+}
+.imported {
+    color: black;
+}

package/test/less-bom/static-urls/urls.less

@@ -0,0 +1,33 @@
+@font-face {
+  src: url("/fonts/garamond-pro.ttf");
+  src: local(Futura-Medium),
+       url(fonts.svg#MyGeometricModern) format("svg");
+}
+#shorthands {
+  background: url("http://www.lesscss.org/spec.html") no-repeat 0 4px;
+}
+#misc {
+  background-image: url(images/image.jpg);
+}
+#data-uri {
+  background: url(data:image/png;charset=utf-8;base64,
+    kiVBORw0KGgoAAAANSUhEUgAAABAAAAAQAQMAAAAlPW0iAAAABlBMVEUAAAD/
+    k//+l2Z/dAAAAM0lEQVR4nGP4/5/h/1+G/58ZDrAz3D/McH8yw83NDDeNGe4U
+    kg9C9zwz3gVLMDA/A6P9/AFGGFyjOXZtQAAAAAElFTkSuQmCC);
+  background-image: url(data:image/x-png,f9difSSFIIGFIFJD1f982FSDKAA9==);
+  background-image: url(http://fonts.googleapis.com/css?family=\"Rokkitt\":\(400\),700);
+}
+
+#svg-data-uri {
+  background: transparent url('data:image/svg+xml, <svg version="1.1"><g></g></svg>');
+}
+
+.comma-delimited {
+  background: url(bg.jpg) no-repeat, url(bg.png) repeat-x top left, url(bg);
+}
+.values {
+    @a: 'Trebuchet';
+    url: url(@a);
+}
+
+@import "../import/import-and-relative-paths-test";

package/test/less-bom/strict-units/strict-units.less

@@ -0,0 +1,4 @@
+.units {
+  cancels-to-nothing: (1px / 1px);
+  cancels: ((((10px / 5em) / 1px) * 3em) * 1px);
+}

package/test/less-bom/strings.less

@@ -0,0 +1,73 @@
+#strings {
+  background-image: url("http://son-of-a-banana.com");
+  quotes: "~" "~";
+  content: "#*%:&^,)!.(~*})";
+  empty: "";
+  brackets: "{" "}";
+  escapes: "\"hello\" \\world";
+  escapes2: "\"llo";
+}
+#comments {
+  content: "/* hello */ // not-so-secret";
+}
+#single-quote {
+  quotes: "'" "'";
+  content: '""#!&""';
+  empty: '';
+  semi-colon: ';';
+}
+#escaped {
+  filter: ~"DX.Transform.MS.BS.filter(opacity=50)";
+}
+#one-line { image: url(http://tooks.com) }
+#crazy { image: url(http://), "}", url("http://}") }
+#interpolation {
+  @var: '/dev';
+  url: "http://lesscss.org@{var}/image.jpg";
+
+  @var2: 256;
+  url2: "http://lesscss.org/image-@{var2}.jpg";
+
+  @var3: #456;
+  url3: "http://lesscss.org@{var3}";
+
+  @var4: hello;
+  url4: "http://lesscss.org/@{var4}";
+
+  @var5: 54.4px;
+  url5: "http://lesscss.org/@{var5}";
+}
+
+// multiple calls with string interpolation
+
+.mix-mul (@a: green) {
+    color: ~"@{a}";
+}
+.mix-mul-class {
+    .mix-mul(blue);
+    .mix-mul(red);
+    .mix-mul(black);
+    .mix-mul(orange);
+}
+
+@test: Arial, Verdana, San-Serif;
+.watermark {
+  @family: ~"Univers, @{test}";
+  family: @family;
+}
+#iterated-interpolation {
+  @box-small: 10px;
+  @box-large: 100px;
+
+  .mixin { // both ruleset and mixin
+    width: ~"@{box-@{suffix}}";
+    weird: ~"@{box}-@{suffix}}";
+    width-str: "@{box-@{suffix}}";
+    weird-str: "@{box}-@{suffix}}";
+    @box: ~"@{box";
+    @suffix: large;
+  }
+  .interpolation-mixin {
+    .mixin(); //call the above as mixin
+  }
+}

package/test/less-bom/url-args/urls.less

@@ -0,0 +1,63 @@
+@font-face {
+  src: url("/fonts/garamond-pro.ttf");
+  src: local(Futura-Medium),
+       url(fonts.svg#MyGeometricModern) format("svg");
+}
+#shorthands {
+  background: url("http://www.lesscss.org/spec.html") no-repeat 0 4px;
+  background: url("img.jpg") center / 100px;
+  background: #fff url(image.png) center / 1px 100px repeat-x scroll content-box padding-box;
+}
+#misc {
+  background-image: url(images/image.jpg);
+}
+#data-uri {
+  background: url(data:image/png;charset=utf-8;base64,
+    kiVBORw0KGgoAAAANSUhEUgAAABAAAAAQAQMAAAAlPW0iAAAABlBMVEUAAAD/
+    k//+l2Z/dAAAAM0lEQVR4nGP4/5/h/1+G/58ZDrAz3D/McH8yw83NDDeNGe4U
+    kg9C9zwz3gVLMDA/A6P9/AFGGFyjOXZtQAAAAAElFTkSuQmCC);
+  background-image: url(data:image/x-png,f9difSSFIIGFIFJD1f982FSDKAA9==);
+  background-image: url(http://fonts.googleapis.com/css?family=\"Rokkitt\":\(400\),700);
+  background-image: url("http://fonts.googleapis.com/css?family=\"Rokkitt\":\(400\),700");
+}
+
+#svg-data-uri {
+  background: transparent url('data:image/svg+xml, <svg version="1.1"><g></g></svg>');
+}
+
+.comma-delimited {
+  background: url(bg.jpg) no-repeat, url(bg.png) repeat-x top left, url(bg);
+}
+.values {
+    @a: 'Trebuchet';
+    url: url(@a);
+}
+
+@import "../import/imports/font";
+
+#data-uri {
+  uri: data-uri('image/jpeg;base64', '../../data/image.jpg');
+}
+
+#data-uri-guess {
+  uri: data-uri('../../data/image.jpg');
+}
+
+#data-uri-ascii {
+  uri-1: data-uri('text/html', '../../data/page.html');
+  uri-2: data-uri('../../data/page.html');
+}
+
+#svg-functions {
+  background-image: svg-gradient(to bottom, black, white);
+  background-image: svg-gradient(to bottom, black, orange 3%, white);
+  @green_5: green 5%;
+  @orange_percentage: 3%;
+  @orange_color: orange;
+  background-image: svg-gradient(to bottom, (mix(black, white) + #444) 1%, @orange_color @orange_percentage, ((@green_5)), white 95%);
+}
+
+#data-uri-with-spaces {
+  background-image: url( data:image/x-png,f9difSSFIIGFIFJD1f982FSDKAA9==);
+  background-image: url( ' data:image/x-png,f9difSSFIIGFIFJD1f982FSDKAA9==');
+}

package/test/less-bom/urls.less

@@ -0,0 +1,94 @@
+@import "nested-gradient-with-svg-gradient/mixin-consumer.less";
+
+@font-face {
+  src: url("/fonts/garamond-pro.ttf");
+  src: local(Futura-Medium),
+       url(fonts.svg#MyGeometricModern) format("svg");
+  not-a-comment: url(//z);
+}
+#shorthands {
+  background: url("http://www.lesscss.org/spec.html") no-repeat 0 4px;
+  background: url("img.jpg") center / 100px;
+  background: #fff url(image.png) center / 1px 100px repeat-x scroll content-box padding-box;
+}
+#misc {
+  background-image: url(images/image.jpg);
+}
+#data-uri {
+  background: url(data:image/png;charset=utf-8;base64,
+    kiVBORw0KGgoAAAANSUhEUgAAABAAAAAQAQMAAAAlPW0iAAAABlBMVEUAAAD/
+    k//+l2Z/dAAAAM0lEQVR4nGP4/5/h/1+G/58ZDrAz3D/McH8yw83NDDeNGe4U
+    kg9C9zwz3gVLMDA/A6P9/AFGGFyjOXZtQAAAAAElFTkSuQmCC);
+  background-image: url(data:image/x-png,f9difSSFIIGFIFJD1f982FSDKAA9==);
+  background-image: url(http://fonts.googleapis.com/css?family=\"Rokkitt\":\(400\),700);
+  background-image: url("http://fonts.googleapis.com/css?family=\"Rokkitt\":\(400\),700");
+}
+
+#svg-data-uri {
+  background: transparent url('data:image/svg+xml, <svg version="1.1"><g></g></svg>');
+}
+
+.comma-delimited {
+  background: url(bg.jpg) no-repeat, url(bg.png) repeat-x top left, url(bg);
+}
+.values {
+    @a: 'Trebuchet';
+    url: url(@a);
+}
+
+@import "import/import-and-relative-paths-test";
+
+#relative-url-import {
+    .unquoted-relative-path-bg;
+    .quoted-relative-path-border-image;
+}
+
+#data-uri {
+  uri: data-uri('image/jpeg;base64', '../data/image.jpg');
+  @var: replace('../data/replace.jpg', "replace", "image");
+  background-image: data-uri(@var), data-uri(replace('../data/image.filext', "filext", "jpg"));
+  
+  uri-fragment: data-uri('image/jpeg;base64', '../data/image.jpg#fragment');
+}
+
+#data-uri-guess {
+  uri: data-uri('../data/image.jpg');
+}
+
+#data-uri-ascii {
+  uri-1: data-uri('text/html', '../data/page.html');
+  uri-2: data-uri('../data/page.html');
+}
+
+#file-functions {
+  uri: data-uri('../data/data-uri-fail.png');
+  svg-not-base-64: data-uri('../data/image.svg');
+  size: image-size('../data/data-uri-fail.png');
+  width: image-width('../data/data-uri-fail.png');
+  height: image-height('../data/data-uri-fail.png');
+}
+.add_an_import(@file_to_import) {
+@import "@{file_to_import}";
+}
+
+.add_an_import("file.css");
+
+#svg-functions {
+  background-image: svg-gradient(to bottom, black, white);
+  background-image: svg-gradient(to bottom, black, orange 3%, white);
+  @green_5: green 5%;
+  @orange_percentage: 3%;
+  @orange_color: orange;
+  background-image: svg-gradient(to bottom, (mix(black, white) + #444) 1%, @orange_color @orange_percentage, ((@green_5)), white 95%);
+}
+//it should work also inside @font-face #2035
+@font-face {
+  font-family: 'MyWebFont';
+  src: url(webfont.eot);
+  src+: url('webfont.eot?#iefix');
+  src+_: format('embedded-opentype');
+  src+: url('webfont.woff') format('woff');
+  src+: format('truetype');
+  src+_: url('webfont.ttf');
+  src+: url('webfont.svg#svgFontName') format('svg');
+}

package/test/less-bom/variables-in-at-rules.less

@@ -0,0 +1,20 @@
+
+@Eight: 8;
+@charset "UTF-@{Eight}";
+
+@ns: less;
+@namespace @ns "http://lesscss.org";
+
+@name: enlarger;
+@keyframes @name {
+    from {font-size: 12px;}
+    to   {font-size: 15px;}
+}
+
+.m(reducer);
+.m(@name) {
+    @-webkit-keyframes @name {
+        from {font-size: 13px;}
+        to   {font-size: 10px;}
+    }
+}

package/test/less-bom/variables.less

@@ -0,0 +1,119 @@
+@a: 2;
+@x: (@a * @a);
+@y: (@x + 1);
+@z: (@x * 2 + @y);
+@var: -1;
+
+.variables {
+  width: (@z + 1cm); // 14cm
+}
+
+@b: @a * 10;
+@c: #888;
+
+@fonts: "Trebuchet MS", Verdana, sans-serif;
+@f: @fonts;
+
+@quotes: "~" "~";
+@q: @quotes;
+@onePixel: 1px;
+
+.variables {
+  height: (@b + @x + 0px); // 24px
+  color: @c;
+  font-family: @f;
+  quotes: @q;
+}
+
+.redef {
+    @var: 0;
+    .inition {
+        @var: 4;
+        @var: 2;
+        three: @var;
+        @var: 3;
+    }
+    zero: @var;
+}
+
+@important-var: @c !important;
+@important-var-two: @a !important;
+.values {
+    minus-one: @var;
+    @a: 'Trebuchet';
+    @multi: 'A', B, C;
+    font-family: @a, @a, @a;
+    color: @c !important;
+    same-color: @important-var;
+    same-again: @important-var !important;
+    multi-important: @important-var @important-var, @important-var-two;
+    multi: something @multi, @a;
+}
+
+.variable-names {
+    .quoted {
+        @var: 'hello';
+        @name: 'var';
+        name: @@name;
+    }
+
+    .unquoted {
+        @var: 'hello';
+        @name: var;
+        name: @@name;
+    }
+    
+    .color-keyword {
+        @red: 'hello';
+        @name: red;
+        name: @@name;
+    }
+}
+
+.alpha {
+    @var: 42;
+    filter: alpha(opacity=@var);
+}
+
+.polluteMixin() {
+    @a: 'pollution';
+}
+.testPollution {
+    @a: 'no-pollution';
+    a: @a;
+    .polluteMixin();
+    a: @a;
+}
+
+.units {
+  width: @onePixel;
+  same-unit-as-previously: (@onePixel / @onePixel);
+  square-pixel-divided: (@onePixel * @onePixel / @onePixel);
+  odd-unit: unit((@onePixel * 4em / 2cm));
+  percentage: (10 * 50%);
+  pixels: (50px * 10);
+  conversion-metric-a: (20mm + 1cm);
+  conversion-metric-b: (1cm + 20mm);
+  conversion-imperial: (1in + 72pt + 6pc);
+  custom-unit: (42octocats * 10);
+  custom-unit-cancelling: (8cats * 9dogs / 4cats);
+  mix-units: (1px + 1em);
+  invalid-units: (1px * 1px);
+  .fallback {
+    @px: 14px;
+    @em: 1.4em;
+    @cm: 10cm;
+    div-px-1: (@px / @em);
+    div-px-2: ((@px / @em) / @cm);
+    sub-px-1: (@px - @em);
+    sub-cm-1: (@cm - (@px - @em));
+    mul-px-1: (@px * @em);
+    mul-em-1: (@em * @px);
+    mul-em-2: ((@em * @px) * @cm);
+    mul-cm-1: (@cm * (@em * @px));
+    add-px-1: (@px + @em);
+    add-px-2: ((@px + @em) + @cm);
+    mul-px-2: ((1 * @px) * @cm);
+    mul-px-3: ((@px * 1) * @cm);
+  }
+}

package/test/less-bom/whitespace.less

@@ -0,0 +1,44 @@
+
+
+.whitespace
+  { color: white; }
+
+.whitespace
+{
+  color: white;
+}
+  .whitespace
+{ color: white; }
+
+.whitespace{color:white;}
+.whitespace { color : white ; }
+
+.white,
+.space,
+.mania
+{ color: white; }
+
+.no-semi-column { color: white }
+.no-semi-column {
+  color: white;
+  white-space: pre
+}
+.no-semi-column {border: 2px solid white}
+.newlines {
+  background: the,
+              great,
+              wall;
+  border: 2px
+          solid
+          black;
+}
+.empty {
+
+}
+.sel
+.newline_ws .tab_ws {
+color:
+white;
+background-position: 45
+-23;
+}

package/test/less-test.js

@@ -112,8 +112,8 @@ module.exports = function() {
     function globalReplacements(input, directory) {
         var p = path.join(process.cwd(), directory),
             pathimport = path.join(process.cwd(), directory + "import/"),
-            pathesc = p.replace(/[.:/\\]/g, function(a) { return '\\' + (a=='\\' ? '\/' : a); }),
-            pathimportesc = pathimport.replace(/[.:/\\]/g, function(a) { return '\\' + (a=='\\' ? '\/' : a); });
+            pathesc = p.replace(/[.:/\\]/g, function(a) { return '\\' + (a == '\\' ? '\/' : a); }),
+            pathimportesc = pathimport.replace(/[.:/\\]/g, function(a) { return '\\' + (a == '\\' ? '\/' : a); });
 
         return input.replace(/\{path\}/g, p)
                 .replace(/\{pathesc\}/g, pathesc)

package/test/modify-vars.js

@@ -8,10 +8,12 @@ var options = {
 }
 
 less.render(input, options, function (err, result) {
-  if (err) console.log(err);
+  if (err) {
+      console.log(err);
+  }
   if (result.css === expectedCss) {
-    console.log("PASS")
+    console.log("PASS");
   } else {
-    console.log("FAIL")
+    console.log("FAIL");
   }
-})
+});