Troubleshooting errors with Yahoo’s YUI Compressor

I use Yahoo’s YUI Compressor to minify Javascript and CSS files. Recently I got an error message when attempting to minify a Javascript file: this post looks at the error message and how to use it to work out where the error occurs.

The error message

The error message looked like this:

[ERROR] 6657:51:invalid property id

[ERROR] 6661:51:invalid property id

[ERROR] 1:0:Compilation produced 2 syntax errors.
org.mozilla.javascript.EvaluatorException: Compilation produced 2 syntax errors.
        at com.yahoo.platform.yui.compressor.YUICompressor$1.runtimeError(YUICompressor.java:135)
        at org.mozilla.javascript.Parser.parse(Parser.java:410)
        at org.mozilla.javascript.Parser.parse(Parser.java:355)
        at com.yahoo.platform.yui.compressor.JavaScriptCompressor.parse(JavaScriptCompressor.java:312)
        at com.yahoo.platform.yui.compressor.JavaScriptCompressor.<init>(JavaScriptCompressor.java:533)
        at com.yahoo.platform.yui.compressor.YUICompressor.main(YUICompressor.java:112)
        at sun.reflect.NativeMethodAccessorImpl.invoke0(Native Method)
        at sun.reflect.NativeMethodAccessorImpl.invoke(NativeMethodAccessorImpl.java:57)
        at sun.reflect.DelegatingMethodAccessorImpl.invoke(DelegatingMethodAccessorImpl.java:43)
        at java.lang.reflect.Method.invoke(Method.java:616)
        at com.yahoo.platform.yui.compressor.Bootstrap.main(Bootstrap.java:20)

The last [ERROR] is a backtrace and isn’t useful for our purposes.

Where did the error occur?

The error message is fairly obvious in that it gives a line and column number where the error occurs and then what the error message is.

Using the first error message above, I’ve highlighted in blue the line number, in red the column number and in green the error message.

[ERROR] 6657:51:invalid property id

Now it’s simply a matter of locating that line and column in the source file and fixing the error.

The error I had

For the record, here’s one of the lines in my Javascript file the YUI Compressor was having an issue with:

$('span', '#searchform_distance').css({float: 'none'});

That’s perfectly valid Javascript but because the YUI Compressor didn’t like it, it didn’t compress the file. The solution was to add quotes around ‘float’ like so:

$('span', '#searchform_distance').css({'float': 'none'});

This is also valid Javascript and now the YUI Compressor was able to succesfully compress the file.