Question

Widgets and Javascript

2

Is there any way how to debug widget javascript files in runtime? Or there is only way to use console.info and write values to console? Regards, Lukas

asked 2012-03-06

Lukas Vondracek

4 answers

8

Using firebug in firefox or chrome's debugger you can add breakpoints to javascript files.

In both (more or less), open the debugger/developer tools, go to the scripts tab, select the widgets.js file and select the line numbers you want to break on.

If the widgets.js file is minified (or you want to see your widget javascript files individually) then delete it from your projects deployment directory (yourProject/deployment/web/widgets/widgets.js), clear your browser cache and refresh the page, subsequently adding breakpoints to your scripts as mentioned above and refreshing the page again.

answered 2012-03-06

Marlo Vlietstra

2

Use debugger tools such as the chrome javascript debugger (built-in, recommended) or firebug for firefox. You can use debugger statements, break on exceptions and do anything a decent debugger can. Even modify your code on the fly.

answered 2012-03-06

Michel Weststrate

0

Thanks guys, you save my file. I remeber I tried that before in firebug. But JS files were minimized. And it never stops in breakpoint. And the help on forum was use console.info

Is this ability new in new version of Mendix or I am so summy?

regards, Lukas

answered 2012-03-06

Lukas Vondracek

Robert van 't Hof · Accepted Answer · 2012-03-06

Try using the Google Chrome Debugger. It's (imho) the best debugger currently available and works great with Mendix widgets as well.

Simply open your localhost, press F12 for the developer tools and go to the Script tab. There you can find the widgets.js file which contains all your widgets' code in one big file.

You can either delete the widgets.js.gz from your deployment and edit the widgets.js there to do live updates (only a browser refresh needed, no restart) or you can delete both those and enter the specific widget folders, as those are used as fallback in case widgets.js could not be found.

Next to that, the Developer Tools support inline editing! Simply double click anywhere in the code and it enters Edit mode (also a button in the lower left). Press Ctrl-S to save and run the function again to try out the new changes.

Last but not least it supports Pretty print. This de-minifies code, in this case either mendix.js or dojo.js, which are minified by default. This way you get a little bit more information where exactly your error is.