diff --git a/lib/less/parser.js b/lib/less/parser.js index 41f007fd..a87a0e2e 100644 --- a/lib/less/parser.js +++ b/lib/less/parser.js @@ -1379,7 +1379,7 @@ less.Parser = function Parser(env) { features = $(this.mediaFeatures); if (rules = $(this.block)) { - media = new(tree.Media)(rules, features); + media = new(tree.Media)(rules, features, i, env.currentFileInfo); if(env.dumpLineNumbers) media.debugInfo = debugInfo; return media; @@ -1455,11 +1455,11 @@ less.Parser = function Parser(env) { if (hasBlock) { if (rules = $(this.block)) { - return new(tree.Directive)(name, rules); + return new(tree.Directive)(name, rules, i, env.currentFileInfo); } } else { if ((value = hasExpression ? $(this.expression) : $(this.entity)) && $(';')) { - var directive = new(tree.Directive)(name, value); + var directive = new(tree.Directive)(name, value, i, env.currentFileInfo); if (env.dumpLineNumbers) { directive.debugInfo = getDebugInfo(i, input, env); } diff --git a/lib/less/tree/directive.js b/lib/less/tree/directive.js index 3fb33e8d..d9e66fd6 100644 --- a/lib/less/tree/directive.js +++ b/lib/less/tree/directive.js @@ -1,6 +1,6 @@ (function (tree) { -tree.Directive = function (name, value) { +tree.Directive = function (name, value, index, currentFileInfo) { this.name = name; if (Array.isArray(value)) { @@ -9,6 +9,7 @@ tree.Directive = function (name, value) { } else { this.value = value; } + this.currentFileInfo = currentFileInfo; }; tree.Directive.prototype = { type: "Directive", @@ -17,6 +18,11 @@ tree.Directive.prototype = { this.value = visitor.visit(this.value); }, toCSS: function (env) { + + if (this.currentFileInfo.silent) { + return ""; + } + if (this.ruleset) { this.ruleset.root = true; return this.name + (env.compress ? '{' : ' {\n ') + @@ -30,7 +36,7 @@ tree.Directive.prototype = { var evaldDirective = this; if (this.ruleset) { env.frames.unshift(this); - evaldDirective = new(tree.Directive)(this.name); + evaldDirective = new(tree.Directive)(this.name, null, this.index, this.currentFileInfo); evaldDirective.ruleset = this.ruleset.eval(env); env.frames.shift(); } diff --git a/lib/less/tree/media.js b/lib/less/tree/media.js index 0fea084e..4870509c 100644 --- a/lib/less/tree/media.js +++ b/lib/less/tree/media.js @@ -1,6 +1,9 @@ (function (tree) { -tree.Media = function (value, features) { +tree.Media = function (value, features, index, currentFileInfo) { + this.index = index; + this.currentFileInfo = currentFileInfo; + var selectors = this.emptySelectors(); this.features = new(tree.Value)(features); @@ -16,9 +19,14 @@ tree.Media.prototype = { toCSS: function (env) { var features = this.features.toCSS(env); - return '@media ' + features + (env.compress ? '{' : ' {\n ') + - this.ruleset.toCSS(env).trim().replace(/\n/g, '\n ') + - (env.compress ? '}': '\n}\n'); + var content = this.ruleset.toCSS(env).trim().replace(/\n/g, '\n '); + + if (content.match(/\S/)) { + return '@media ' + features + (env.compress ? '{' : ' {\n ') + content + + (env.compress ? '}': '\n}\n'); + } else { + return ""; + } }, eval: function (env) { if (!env.mediaBlocks) { @@ -26,7 +34,7 @@ tree.Media.prototype = { env.mediaPath = []; } - var media = new(tree.Media)([], []); + var media = new(tree.Media)([], [], this.index, this.currentFileInfo); if(this.debugInfo) { this.ruleset.debugInfo = this.debugInfo; media.debugInfo = this.debugInfo; @@ -62,7 +70,7 @@ tree.Media.prototype = { rulesets: function () { return tree.Ruleset.prototype.rulesets.apply(this.ruleset) }, emptySelectors: function() { var el = new(tree.Element)('', '&', 0); - return [new(tree.Selector)([el])]; + return [new(tree.Selector)([el], null, this.index, this.currentFileInfo)]; }, evalTop: function (env) { diff --git a/test/css/import-silent.css b/test/css/import-silent.css index 688ddfd3..53040b1e 100644 --- a/test/css/import-silent.css +++ b/test/css/import-silent.css @@ -1,3 +1,14 @@ +@media only screen and (max-width: 200px) { + width: 480px; +} +@media (max-width: 1200px) { + /* a comment */ +} +/* + The media statements - 1 is invalid (no selector) and 1 is just a comment + We should band invalid media queries solving the 1st case and not treat comments as rules, + solving the 2nd issue. +*/ .visible { color: red; } diff --git a/test/css/media.css b/test/css/media.css index 5aa1d4e8..9bd80b31 100644 --- a/test/css/media.css +++ b/test/css/media.css @@ -52,9 +52,6 @@ .sidebar { width: 500px; } -} -@media a { - } @media a and b { .first .second .third { diff --git a/test/less/import-silent.less b/test/less/import-silent.less index 8b36dece..78c37819 100644 --- a/test/less/import-silent.less +++ b/test/less/import-silent.less @@ -1,10 +1,17 @@ @import (silent) url("import-once.less"); +@import (silent) url("css-3.less"); +@import (silent) url("media.less"); +/* + The media statements - 1 is invalid (no selector) and 1 is just a comment + We should band invalid media queries solving the 1st case and not treat comments as rules, + solving the 2nd issue. +*/ @import (silent) url("import/import-silent.less"); .b { - .a(); + .z(); } -.visible:extend(.a all) { +.visible:extend(.z all) { extend: test; } \ No newline at end of file diff --git a/test/less/import/import-silent.less b/test/less/import/import-silent.less index ab04d7a3..266523b5 100644 --- a/test/less/import/import-silent.less +++ b/test/less/import/import-silent.less @@ -1,11 +1,11 @@ -.a { +.z { color: red; .c { color: green; } } .only-with-visible, -.a { +.z { color: green; &:hover { color: green; @@ -25,4 +25,10 @@ .hidden { hidden: true; } +} + +@media tv { + .hidden { + hidden: true; + } } \ No newline at end of file