How to debug CoffeeScript using the generated source maps? Do I need to include the map file? What else do I need to do? I'm currently including both the compiled JS file and the map file, but my Firefox debugger doesn't seem to be doing anything special....
SourceMap debugging is only available on the next Firefox release, starting from Firefox 23.
You can download the developper preview (google for firefox 23). It should be available as RC during august according to Mozilla website.
In practice, you don't have to include the map file in your html file, you just have to reference your map in the javascript file. But the CoffeeScript compiler does it for you.
If you want to give a try at debugging CoffeeScript with SourceMap, you can try with Google Chrome dev Tools. Be sure to check Enable source maps in the dev tool configuration.
If you need further advices or examples on how to debugg CoffeeScript with Chrome, ask and I'll edit this post.
Related
Is it possible to ignore certain javascript files when debugging with breakpoints in Chrome Developer Tools? Let's say on this website http://todomvc.com/architecture-examples/angularjs/#/ I want to debug only todoCtrl.js and ignore all other ones like angular.js.
Yes, you can use JS Blackboxing to do this. The documentation for this feature will be going live soon, but for now you can read the WIP doc on how to do this here:
https://rawgit.com/jaredwilli/devtools-docs/blackboxing/docs/blackboxing.html
Long time reader, first time asking a question.
Most of my development work has been in .NET using Visual Studio. Recently I took over maintenance of a website built on PHP and downloaded NetBeans as an IDE.
NetBeans has a very nice CSS property wizard for HTML projects that highlights the CSS rules in use for a particular element and lets you edit the rules directly. However, this doesn't appear to be available for PHP projects, even for pure HTML files within the project. Is that correct, or am I just missing some configuration? I can't seem to find any confirmation either way in the documentation or forums. (It would be unfortunate if it didn't work... it's a really useful feature.)
Thanks,
Terry
If you are referring to the visual CSS editing support that works with Google Chrome and the WebKit browser embedded in NetBeans, then this feature will be available for PHP projects in the upcoming NetBeans 7.4 release. See also this blog post: https://blogs.oracle.com/netbeanswebclient/entry/html5_development_with_java_ee
Hope this helps,
Petr
I wonder if there is a way to perform a step-by-step debugging of the compiled GWT code, in order to determine how some events are being fired.
The interest I have on this is that I'm using SmartGWT, and for some reason the click events on their components propagate to pop up windows that occupy the same position. However this only happens in Mobile Safari.
Even more interesting it only happens with smartGWT version of onClick and not with the plain GWT onClick.
Mostly a hack for now, but I suppose it'll work (you'll have to recompile your app though):
First, compile a recent GWT from trunk: https://developers.google.com/web-toolkit/makinggwtbetter#workingoncode
Then recompile your app with source maps enabled: http://code.google.com/p/google-web-toolkit/wiki/SourceMaps
Follow the steps in the comments of this wiki page to be able to use SourceMaps in Chrome, then re-deploy your app
Get Chrome on the Dev channel: http://www.chromium.org/getting-involved/dev-channel
Use http://www.iwebinspector.com/ to start Mobile Safari with remote debugging and then connect to it from your Chrome desktop: http://www.webkit.org/blog/1620/webkit-remote-debugging/
Finally, enable source maps in Chrome so you'll see your Java code in the Web Inspector!
See http://www.youtube.com/watch?v=-xJl22Kvgjg for a preview of the future of debugging with GWT, that will allow this kind of things in a much less hackish way in the near future.
I don't know if there is a nice way to debug compiled javascript GWT code, but why do you need it?
For described purpose it's better to use GWT development mode with debugging options. You can add the following parametres e-Xdebug -Xrunjdwp:transport=dt_socket,address={PORT},server=y,suspend=n to the development mode running command, it will give an opportunity to add breakpoints to the cliend side GWT/SmardGWT source code. Then for debugging you should connect to port specified in parametres from your java IDE.
Debugging GWT https://developers.google.com/web-toolkit/doc/latest/DevGuideCompilingAndDebugging
I want to write something similar to ActiveInbox.
In addition to original ActiveInbox, I need to add logic that will perform some actions on the emails that come.
What language(s) are programs like ActiveInbox written in?
Thank you
Activeinbox is a browser plugin, written in Javascript. It's easy to have a look inside: download the xpi (the Firefox version of the plugin). An xpi file is a zipfile, so open it with your zipfile manager of choice.
After that you should head over to Mozilla's developer site or a Chrome extension development tutorial to learn how to wite a Firefox/Chrome plugin.
Extensions can be written in pure Javascript on Chrome and Firefox.
I want to write something similar to ActiveInbox.
In addition to original ActiveInbox, I need to add logic that will perform some actions on the emails that come.
What language(s) are programs like ActiveInbox written in?
Thank you
Activeinbox is a browser plugin, written in Javascript. It's easy to have a look inside: download the xpi (the Firefox version of the plugin). An xpi file is a zipfile, so open it with your zipfile manager of choice.
After that you should head over to Mozilla's developer site or a Chrome extension development tutorial to learn how to wite a Firefox/Chrome plugin.
Extensions can be written in pure Javascript on Chrome and Firefox.