Vaadin Sass Parser diverse problems

I tried to use a sass port of twitert’s bootstrap with the vaadin parser.

Some examples of the resulting problems:

Error when parsing file ../bootstrap/scaffolding.scss on line 65, column 14
encountered ")". Was expecting one of: "+" "-" "." "to" "through" "from" <STRING> <IDENT> <NUMBER> <URL> <VARIABLE> <PERCENTAGE> <PT> <MM> <CM> <PC> <IN> <PX> <EMS> <LEM> <REM> <EXS> <DEG> <RAD> <GRAD> <MS> <SECOND> <HZ> <KHZ> <DIMEN> <HASH> <UNICODERANGE> <FUNCTION>

Warning when parsing file ../bootstrap/type.scss on line 10, column 43
Skipping: }

Error when parsing file ../bootstrap/code.scss on line 25, column 42
encountered ";". Was expecting one of: "}" "+" ">" "~" "[" "*" "&" "." ":" <INTERPOLATION> "@include" "@debug" "@warn" "@each" "@if" "@extend" "@content" <MICROSOFT_RULE> <IDENT> <VARIABLE> <HASH> "@import" "@media" <KEY_FRAME_SYM>

Another example are the mixins in mixins.scss. The Vaadin scss parser doesn’t seem to support empty parameter brackets ().

Hopefully there is a workarround for this or a quick fix in one of the next vaadin releases.

There seem to be at least two issues here: empty parentheses for a mixin (problematic both when declaring a mixin and when using one) and some arithmetic operations (possibly only using the “/” operator). Also, I am not certain if parentheses in arithmetic expressions are fully supported or not.

create tickets
about each of these with samples of the code that breaks the compiler, as well as any other similar problems you run into.

Note that the “/” operator is very tricky, as it also has a completely different meaning in CSS that can come up in almost identical contexts (e.g. for fonts). Furthermore, distinguishing between lists and arithmetic expressions and lists containing arithmetic expressions can also be tricky. The SASS language specification does try to define how this should work for “/”, but the specification isn’t really perfect.

As to possible workarounds: Often you can help Vaadin SASS compiler deduce how to deal with arithmetic expressions by using/omitting spaces in the expression, I don’t know if it would work in this case. Also, if arithmetic expressions in lists do not work, creating a temporary variable for the result of the arithmetic expression and using it in the list might help.

It seems the Vaadin compiler is not yet fully supporting all scss specs.
In the meantime a workaround would be to use the original Ruby compiler through JRuby.
If you want compilation on the fly, it’s still possible to implement a filter to serve the compiled scss from the original Ruby compiler.
You might need some pre-compilation and caching strategies as you can’t expect high performances with scss being compiled when requested by the client.