Invalid CSS after "bootstrap-theme.css.map */": expected selector or at-rule, was "..."

Question

In my Ruby on Rails project I have some strange problem. I had to switch from sass to less for some reasons. In development all css work is fine. I see my site with right design. But, when I try do some cucumber tests I get error with long trace and it starts from:

Invalid CSS after "bootstrap-theme.css.map */": expected selector or at-rule, was "{"version":3,"s..."

This is not my file, it comes from twitter bootstrap.

Actually, this is json file. Before it come several css files, and all is ok.

Strange that is in development and visual view is good, but in cucumber test I get this error.

Answer 1

It seems your test fails on the CSS sourcemap syntax. Since version 1.5 Less support v3 source map.

When you compile your Less code with source maps, your CSS will end with a reference to sourcemap file, for instance as follows:

 /*# sourceMappingURL=bootstrap-theme.css.map */

Notice that the above is valid CSS comment syntax.

And the bootstrap-theme.css.map file has been created. That file indeed contains JSON and not CSS, something like that shown below:

{"version":3,"file":"bootstrap-theme.css","sources":["less/theme.less"

So your tests should not validate *.css.map files as CSS.