This Bugzilla instance is a read-only archive of historic NetBeans bug reports. To report a bug in NetBeans please follow the project's instructions for reporting issues.

Bug 227510 - LESS parsing issues
Summary: LESS parsing issues
Status: VERIFIED FIXED
Alias: None
Product: web
Classification: Unclassified
Component: CSS Preprocessors (SASS, LESS, ...) (show other bugs)
Version: 7.4
Hardware: All All
: P2 normal with 2 votes (vote)
Assignee: Marek Fukala
URL:
Keywords:
: 229594 230977 232308 234683 235269 (view as bug list)
Depends on:
Blocks:
 
Reported: 2013-03-15 09:48 UTC by Vladimir Riha
Modified: 2013-11-05 08:10 UTC (History)
11 users (show)

See Also:
Issue Type: DEFECT
Exception Reporter:


Attachments

Note You need to log in before you can comment on or make changes to this bug.
Description Vladimir Riha 2013-03-15 09:48:58 UTC
#1 multiple @variables as a single parameter (on line with  .test(@a @b); )

.test(@a){
    font: @a;
}

foo{
    @a: 12px;
    @b: normal;
    .test(@a @b);
}

==============================
#2 +, > selector

form {
    dl {
        + p {
            margin-bottom: 0;
        }
    }
}

============================
#3 LESS comment on last line in less file - if the comment is on the very last line, "unexpected token error found"

// comment on last line

============================
#4 using @function in less - apparently, it is simply a variable (unlike in sass) but in less file, following is marked with error (on first line)

.transform (@function) {
	-webkit-transform: @function;
}

div{
  .transform(rotate(90));
}

==========================
#5 comma separated list of variables

.grd {
    background-size: @pw / @cols, @pw / @cols;
}
============================
#6 keyframes in less (works fine in css)

@-moz-keyframes flash {
    0%, 50%, 100% {opacity: 1;}
    25%, 75% {opacity: 0;}
}

@keyframes shake {
	0%, 100% {transform: translateX(0);}
	10%, 30%, 50%, 70%, 90% {transform: translateX(-10px);}
	20%, 40%, 60%, 80% {transform: translateX(10px);}
}

===========================
#7 unexpected token dimension

.3dtransform (@perspective: 300, @rotateY: 180deg) {
	-webkit-perspective: @perspective;  
}
============================
#8 unexpected token COMMA and WS, line 2

.colourise (@image, @colour) {
	background: -webkit-linear-gradient(left, @colour, @colour), url (@image);
}
.test{
 .colourise('aaa.png', #444); 
}

============================
# 9 JavaScript expression (problem with `)

@var: `"hello".toUpperCase() + '!'`;

============================
#10 Escaped value

.test{
width: ~"100%";
}




Product Version: NetBeans IDE Dev (Build web-main-10093-on-20130315)
Java: 1.7.0_17; Java HotSpot(TM) Client VM 23.7-b01
Runtime: Java(TM) SE Runtime Environment 1.7.0_17-b02
System: Linux version 3.2.0-38-generic-pae running on i386; UTF-8; en_US (nb)
Comment 1 Vladimir Riha 2013-03-25 22:09:05 UTC
#11 selector interpolation - unexpected character @ found

@name: blocked;
.@{name} {
    color: black;
}

==============================

#12 Media Queries as Variables - 2 errors on line with @media

@singleQuery: "(max-width: 500px)";
@media screen, @singleQuery {
  set {
    padding: 3 3 3 3;
  }
}





Product Version: NetBeans IDE Dev (Build web-main-10168-on-20130325)
Java: 1.7.0; Java HotSpot(TM) 64-Bit Server VM 21.0-b17
Runtime: Java(TM) SE Runtime Environment 1.7.0-b147
System: Linux version 3.5.0-26-generic running on amd64; UTF-8; en_US (nb)
Comment 2 Vladimir Riha 2013-05-14 08:15:11 UTC
*** Bug 229594 has been marked as a duplicate of this bug. ***
Comment 3 Vladimir Riha 2013-06-09 09:25:11 UTC
*** Bug 230977 has been marked as a duplicate of this bug. ***
Comment 4 Marek Fukala 2013-06-20 13:09:24 UTC
extracted from issue 227484#c23:

1. Unexpected token NUMBER found
http://i43.tinypic.com/33ju82w.png

2. Unexpected token COMMA found
http://i43.tinypic.com/34o351l.png
Comment 5 Vladimir Riha 2013-06-25 12:49:04 UTC
#14 usage of !important

.mixin(@val){
    color: red
}
.important {
  .mixin(2) !important; 
} 

=> unexpected token IMPORTANT_SYM


Product Version: NetBeans IDE Dev (Build 201306242301)
Comment 6 Vladimir Riha 2013-06-25 13:08:42 UTC
#15 Guarded mixins

.mixin (@a) when (lightness(@a) >= 50%) {
  background-color: black;
}

=> unexpected token PERCENTAGE, GREATER_OR_EQ and LBRACE


=============================

#16 unexpected token comma

.child, .sibling {
    .parent & {
        color: black;
    }
    & + & {
        color: red;
    }
}




Product Version: NetBeans IDE Dev (Build 201306242301)
Comment 7 Vladimir Riha 2013-06-25 13:21:20 UTC
#16 Problem when mixin declaration is after its usage

@attr:1;
@name:1;

pre {    
    .test2(red);
}

.test2(@j){
    color: @j;
    font-size: @attr;
}

=> unexpected token RPAREN and IDENT. If I flip order of pre and .test2 declarations, it is OK
Comment 8 Vladimir Riha 2013-06-25 13:44:54 UTC
Last one

#17 valid MQ in Less

@media screen and (max-width: 400px) {
  h1 { color: green; }
}

=> unexpected token IDENT, LPAREN etc.
Comment 9 Vladimir Riha 2013-07-07 10:20:31 UTC
*** Bug 232308 has been marked as a duplicate of this bug. ***
Comment 10 Vladimir Riha 2013-07-18 09:19:33 UTC
To reproduce #1 and #8, you need to have some code below, e.g. for #1:

.test(@a){
    font: @a;
}

foo{
    @a: 12px;
    @b: normal;
    .test(@a @b);
}

div{}

What seems to be OK now: #2, #3, #5, 



===========================
#18 from issue 229594
.subnav-fixed {
#gradient > .vertical(#f5f5f5, #eeeeee);
}


Product Version: NetBeans IDE Dev (Build 201307172300)
Java: 1.7.0_40-ea; Java HotSpot(TM) Client VM 24.0-b52
Runtime: Java(TM) SE Runtime Environment 1.7.0_40-ea-b33
System: Linux version 3.2.0-48-generic-pae running on i386; UTF-8; en_US (nb)
Comment 11 mcfedr 2013-08-07 14:01:31 UTC
#19 Multiple selectors

.a,
.b {
    width: 1050px;
}

=> Unexpected token COMMA
Comment 12 Marek Fukala 2013-08-09 11:39:57 UTC
#19 - the first selector is incorrectly recognized as mixin call, then the parsing fails:

.transition() {
  h1 {
    color: red;
  }
}

.transition; //correct mixin call

.transition, div { //not a mixin call
 }
Comment 13 Marek Fukala 2013-08-09 11:54:40 UTC
changeset:   260814:06ead4ff16c1
summary:     #227510 - fixing case #19 - class selector in selectors group recognized as less mixin call
Comment 14 Marek Fukala 2013-08-09 11:56:11 UTC
I think I should have started this one already ... quite a lot of work here.
Comment 15 Quality Engineering 2013-08-10 02:05:47 UTC
Integrated into 'main-silver', will be available in build *201308092300* on http://bits.netbeans.org/dev/nightly/ (upload may still be in progress)

Changeset: http://hg.netbeans.org/main-silver/rev/06ead4ff16c1
User: Marek Fukala <mfukala@netbeans.org>
Log: #227510 - fixing case #19 - class selector in selectors group recognized as less mixin call
Comment 16 Marek Fukala 2013-08-19 14:07:24 UTC
2,3,5,6,8,16/1,17,19 are fixed, the rest (12 issues) is in progress
Comment 17 Marek Fukala 2013-08-20 08:36:19 UTC
changeset:   261536:da3f4a9aae0e
summary:     #227510/1 - mixin call followed by a block

changeset:   261537:3073bb6c058f
summary:     #227510/4 - sass keywords as less variable names

as for #7 - it looks like it is an invalid class name so the editor error is correct. 

W3C's css validator says:

In CSS1, a class name could start with a digit (".55ft"), unless it was a dimension (".55in"). In CSS2, such classes are parsed as unknown dimensions (to allow for future additions of new units) To make "3dtransform" a valid class, CSS2 requires the first digit to be escaped ".\33 dtransform" [3dtransform]
Comment 18 Vladimir Riha 2013-08-20 08:49:58 UTC
"Tricky" is that technically it is not class selector, but mixin and I haven't found any limitations on mixin's name. But I'm fine with not fixing it, it is probably corner case
Comment 19 Marek Fukala 2013-08-20 08:55:58 UTC
changeset:   261601:de387926ef8b
summary:     #227510/9 - LESS javascript expressions

changeset:   261602:623e29c38d61
summary:     #227510/10 - less escaped content
Comment 20 Marek Fukala 2013-08-20 09:07:01 UTC
> "Tricky" is that technically it is not class selector, but mixin and I
> haven't found any limitations on mixin's name. But I'm fine with not fixing
> it, it is probably corner case
you are right, technically almost anything can be a mixin name in less, vrrrr...
Comment 21 Marek Fukala 2013-08-20 09:54:15 UTC
changeset:   261603:168ee8a72c66
summary:     #227510/11 - selector interpolation

changeset:   261614:23fa62847e46
summary:     #227510/12 - less variable as media query
Comment 22 Marek Fukala 2013-08-20 10:04:55 UTC
#13 works fine, so I've added tests for the cases extracted from the screenshots:

changeset:   261615:d7c2bab45d24
summary:     #227510/13 - adding tests for: function in mixin call, mixin call with ws separated values, comma in selectors group
Comment 23 Marek Fukala 2013-08-20 11:21:31 UTC
searching for changes
summary:     #227510/14 - important symbol in mixin call

changeset:   261617:2a45b6fc21b1
summary:     #227510/15 - less guarded mixin w/ less function in condition
Comment 24 Marek Fukala 2013-08-20 11:26:37 UTC
#16/2 - already fixed by a former fix of the mixin declaration predicate

searching for changes
summary:     #227510/16 - adding test for nested selector concatenation

changeset:   261622:d52cd939a586
summary:     #227510/16/2 - adding test for mixin declaration predicate
Comment 25 Marek Fukala 2013-08-20 12:33:37 UTC
(In reply to Marek Fukala from comment #20)
> > "Tricky" is that technically it is not class selector, but mixin and I
> > haven't found any limitations on mixin's name. But I'm fine with not fixing
> > it, it is probably corner case
> you are right, technically almost anything can be a mixin name in less,
> vrrrr...

I've added this case to following issue:

https://netbeans.org/bugzilla/show_bug.cgi?id=231249#c5

So if I'm not mistaken, the only remaining issue is the case #18 which so far somehow resists all my attempts to fix :-)

=> filed as issue Bug 234639 - can't parse mixin call acting as selector
Comment 26 Vladimir Riha 2013-08-20 12:44:00 UTC
Thanks :) I'll verify it all tomorrow or on Thursday.
Comment 27 Marek Fukala 2013-08-21 08:15:22 UTC
*** Bug 234683 has been marked as a duplicate of this bug. ***
Comment 28 Vladimir Riha 2013-08-23 07:05:47 UTC
Thanks Marku, verified

Product Version: NetBeans IDE Dev (Build 201308222300)
Updates: Updates available
Java: 1.7.0_40; Java HotSpot(TM) Client VM 24.0-b55
Runtime: Java(TM) SE Runtime Environment 1.7.0_40-b39
System: Linux version 3.2.0-48-generic-pae running on i386; UTF-8; en_US (nb)
Comment 29 Vladimir Riha 2013-08-30 06:57:28 UTC
*** Bug 235269 has been marked as a duplicate of this bug. ***
Comment 30 code-guru 2013-10-27 21:47:59 UTC
Some issues is still persisting with LESS parsing.

These are unsolved from the previous mentions:

//#7 unexpected token dimension
.3dtransform (@perspective: 300, @rotateY: 180deg) {
	-webkit-perspective: @perspective;  
}
//---------------------------------------------------

//#18 unexpected token WS found from issue 229594
.subnav-fixed {
#gradient > .vertical(#f5f5f5, #eeeeee);
}
//---------------------------------------------------


These haven't been mentioned and have parsing issue:

//#20 unexpected token LPAREN/IDENT found
import (less) "theme";
import (css) "../base.css";

//#21 unexpected LPAREN found
.pull-right > .dropdown-menu();
#gradient > .horizontal(@start-color: rgba(0,0,0,.5); @end-color: rgba(0,0,0,.0001));


//#22 unexpecten RPAREN/SEMI/LBRACE found
.img-responsive(@display: block;) {
  height: auto;
}

//#23 unexpected token IDENT
.modal {
    &.in .modal-dialog { .translate(0, 0)}
}
Comment 31 Vladimir Riha 2013-11-05 08:10:22 UTC
code-guru, please don't add new problems to this issue but report a new one next time with one problem in one issue. Thank you in advance.

As you can see, #7 and #18 are tracked as separate issues, no reason to mention it here again. I reported your cases and added you to cc of these issues:

#20: issue 237975
#21: I think this is another instance of #18
#22: issue 237976
#23: I would guess it is again similar as #18, but I'm not sure so reported as issue 237977


Closing this issue back as fixed. Thanks