Debugging obfuscated JS errors in GWT (<=2.5.1)

Avadhut Phatarpekar bio photo By Avadhut Phatarpekar Comment

Ever had one of these when working with GWT? uncaught exception: com.google.gwt.core.client.JavaScriptException: (TypeError)

Imgur-JS error

The problem is GWT compiles all your Java into a big blog of obfuscated, performant JS. So when the browser throws up something like this, it’s pretty much impossible to debug. To solve for this, you could add the following flag to your GWT compile command. Mine's in Eclipse, so I'd add it as one of the params to the run configurations:

-style DETAILED

By default, this style is OBS; and the options are OBS, PRETTY, and DETAILED. Read more about this here.

If you’re using Maven, then chances are you’re using the Maven GWT plugin. In this case, you could add the following configuration details, just below the <excecution> block:

<executions>
    <execution>
        <goals>
            <goal>compile</goal>
            <goal>test</goal>
        </goals>
        <configuration>
            <style>DETAILED</style>
        </configuration>
    </execution>
</executions>

Now, the JS generated by GWT will be non-obfuscated and can be easily debugged in Firebug or Chrome Dev Tools. Do not forget to turn off the flag/delete it for production though.