Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

Debugging Closure-compiler Compiled Javascript

I have a complex dojo app that works correctly uncompiled, but after compiling with Google's Closure Compiler, I get subtle differences in some behaviours.

As it is, it's exceedingly difficult to debug, and I've been unable to find any information about possible functional differences between compiled and uncompiled Javascript with Google Closure.

Can anyone point me in the direction of known differences, or share any similar experiences and some ideas of where to start looking?

like image 531
Hamish Avatar asked Dec 26 '22 12:12

Hamish


2 Answers

General Closure Compiler Debugging Tips

  • Use the VERBOSE warning level. This turns on all of the checks.
  • Use the debug flag. It makes renamed symbols ridiculously long, but they are named in such a way you can find the original. If code works with the debug flag but not without it, it is almost certainly a renaming issue.
  • Definitely use formatting=PRETTY_PRINT. Debugging compacted code is painful without it.
  • Use source maps
  • Disable the type based optimizations with --use_types_for_optimization false. Incorrect type annotations can cause the compiler to make invalid assumptions.

UPDATE: As of the 20150315 compiler release, the type based optimizations are enabled by default.

like image 76
Chad Killingsworth Avatar answered Dec 29 '22 01:12

Chad Killingsworth


With the help of Chad's answer, I found a bug where my working code like so:

a = [b, b = a][0]; // swap variable values

Was compiled to:

a = b;

It might be fixed in later versions, because tests with the online Closure compiler app don't demonstrate the same bug. Fixed it by not trying to be clever, and using a 3rd variable to hold the old value while swapping values.

like image 33
Hamish Avatar answered Dec 29 '22 02:12

Hamish