Vaadin sass -ms-filter compilation - filter

Question

I have problem with compilation -ms-filter property in scss mixin.
mytheme.scss
#import "../reindeer/reindeer.scss";
#import "bg-alpha.scss";
#mixin mytheme {
#include reindeer;
.v-button {
#include bg-alpha(0.7);
-ms-filter:alpha(opacity=0.4); <---- OK
}
}
bg-alpha.scss
#mixin bg-alpha ($a) {
opacity:$a;
-ms-filter:alpha(opacity=$a*100); <---- ERROR
}
During compilation is thrown this error
com.vaadin.sass.internal.parser.SCSSParseException: Error when parsing file C:\Develop...\VAADIN\themes\mytheme\bg-alpha.scss
Encountered "-ms-filter" at line 3, column 9.
Was expecting one of:
"}" ...
"+" ...
">" ...
"~" ...
"[" ...
"*" ...
"&" ...
"." ...
":" ...
<INTERPOLATION> ...
"#include" ...
"#debug" ...
"#warn" ...
"#each" ...
"#if" ...
"#extend" ...
"#content" ...
<IDENT> ...
<VARIABLE> ...
<HASH> ...
"#media" ...
"#page" ...
"#font-face" ...
<KEY_FRAME_SYM> ...
at com.vaadin.sass.internal.ScssStylesheet.get(ScssStylesheet.java:141)
at com.vaadin.sass.internal.visitor.ImportNodeHandler.traverse(ImportNodeHandler.java:69)
at com.vaadin.sass.internal.visitor.ImportNodeHandler.traverse(ImportNodeHandler.java:81)
at com.vaadin.sass.internal.ScssStylesheet.importOtherFiles(ScssStylesheet.java:192)
at com.vaadin.sass.internal.ScssStylesheet.compile(ScssStylesheet.java:185)
at com.vaadin.server.VaadinServlet.serveOnTheFlyCompiledScss(VaadinServlet.java:815)
at com.vaadin.server.VaadinServlet.serveStaticResourcesInVAADIN(VaadinServlet.java:601)
at com.vaadin.server.VaadinServlet.serveStaticResources(VaadinServlet.java:571)
at com.vaadin.server.VaadinServlet.service(VaadinServlet.java:229)
at javax.servlet.http.HttpServlet.service(HttpServlet.java:717)
at org.apache.catalina.core.ApplicationFilterChain.internalDoFilter(ApplicationFilterChain.java:290)
at org.apache.catalina.core.ApplicationFilterChain.doFilter(ApplicationFilterChain.java:206)
at org.apache.catalina.core.StandardWrapperValve.invoke(StandardWrapperValve.java:233)
at org.apache.catalina.core.StandardContextValve.invoke(StandardContextValve.java:191)
at org.apache.catalina.core.StandardHostValve.invoke(StandardHostValve.java:127)
at org.apache.catalina.valves.ErrorReportValve.invoke(ErrorReportValve.java:102)
at org.apache.catalina.core.StandardEngineValve.invoke(StandardEngineValve.java:109)
at org.apache.catalina.connector.CoyoteAdapter.service(CoyoteAdapter.java:298)
at org.apache.coyote.http11.Http11Processor.process(Http11Processor.java:859)
at org.apache.coyote.http11.Http11Protocol$Http11ConnectionHandler.process(Http11Protocol.java:588)
at org.apache.tomcat.util.net.JIoEndpoint$Worker.run(JIoEndpoint.java:489)
at java.lang.Thread.run(Unknown Source)
This problem belongs to mixins, because when I delete "-ms-filter:alpha(opacity=$a*100);" from bg-alpha mixin, everything is ok and no error is thrown.
Please, can anybody help me solve this problem? I googled lot of hours for finding solution, but I wasnt successful. Also I tryed simulate this problem with pure sass compilator. It seems to be right sass code.

Answer 1

SASS arithmetic is a fairly new feature in Vaadin 7 - I think only in Vaadin 7.1 - and appears to have a few bugs (Look at the Vaadin Forum); the SASS parser/compiler is not a separate library, but completely implemented in the Vaadin framework itself.
I've not used Vaadin + SASS in anger - but personally, I would
a) Ensure you're using Vaadin 7.1
b) If that doesn't work, try assigning the value to an interim variable first, e.g.
#mixin bg-alpha ($a) {
$msopacity=$a * 100;
opacity:$a;
-ms-filter:alpha(opacity=$msopacity);
}