How to do Javascript debug logging - javascript

I am writing an Angular app, with bit and pieces of JQuery plugins around the place.
Some of the logic is pretty complex and I'd like to have some debug logging that I can leave in the codebase that won't print out to the console in production.
What are people using to achieve this these days? I know Angular has its own logging but this logging needs to be across both the Angular stuff and the JQuery stuff. I can't rewrite the JQuery to be 'angularised'.
How can I best achieve this?

Maybe you can try chrome develop tools?
WIN: ctrl+shift+j
MAC: command+shift+j.
sources - > your script - > double click to add a breakpoint -> refresh
Here is a shortcut.

Definitely breakpoints but you also need to check out
Batarang - chrome extension developed by angular team. I find it extremely useful for scope inheritance. It does crash now and then but it is still quite useful.

Related

Testing Angularjs locators

Kind of getting desperate here.
I have a legacy testsuite using AngularJS (5.4.1) driven by Node 8.12.0.
I want to debug some tests but it seems impossible.
Control flow is enabled in the tests, so I followed the docs on the protractor website. Sadly, it does not work.
browser.pause() just get skipped and using browser.debugger() is deprecated from Node 8.
I decided to disable the control flow but I ran into another problem.
We go to a login page before accessing the application, and the angular debugger does not like that. When accessing the non-angular page, the debugger just quits, stating that angular is not defined.
I then turned to Google to see if there are any Chrome extensions that enable me to use the dev tools to test the locators, but to no avail.
Would be great if I can get the debugger working.
Thanks in advance.
Regards
Here is a setup for IntelliJ
(working directory is example)

Intellij IDEA, run Javascript code right in the editor

After having written large amounts of code in Intellij Idea Ultimate edition, I often want to test a method, or big pieces.
I often resort to having to paste the code in firebug in firefox, a small annoying cramping space, with no editor features. If the code needs adjusting I need to do it there, test again, copy and insert into Intellij Idea.
Is it possible to run firebug like console code, right in Intellij ? Similar to in Java debug mode with the Inspect tool ? It would have been really useful, even more useful just to highlight some code and press run.
Browser support is not important, any browser will do.
Is this possible already? Is there an Intellij plugin for this? Why not? :(
Thanks!
If the browser is not important, you could use the node.js plugin as a javascript repl / debugger. Keep in mind that it will not provide an HTML DOM so if your code makes jQuery calls, it will not run out of the box. Otherwise, if it's just plain javascript, it will run just fine.
Just stumbled over this. A bit late but anyway:
Debugging Javascript, editing values, etc. works fine using intelliJ with its Chrome Plugin.
See https://www.jetbrains.com/idea/webhelp/configuring-javascript-debugger.html or
http://blog.jetbrains.com/idea/2011/03/intellij-idea-debugging-javascript-in-google-chrome/
You can set breakpoints to stop where you want and can from there evaluate expressions and all the other stuff you would like to do.
Hope this is what you wanted to know.

Web-based JavaScript Debugger

I have an idea for a project that has to do with helping people learn to program. One of the things I think would be cool would be to have a place on the site where you can edit JavaScript code in real time in your browser.
I know there are a number of web-based JavaScript editors, but I haven't been able to find out if there are any tools that let you debug JavaScript from your browser. I think being able to step through your code is a valuable learning experience for people who are new to programming. It seems like something along those lines should be possible, though.
I originally thought you could use something like Firebug Lite: http://getfirebug.com/firebuglite, but they don't support debugging. Is this just too hard of a problem to solve in JavaScript?
I suggest you try Cloud9. It is a full-featured web based IDE for Javascript, which includes a great debugger. It is free for open source projects, which I imagine would include most learning purposes.
Why not just use the build in Javascript console from the browser? Every modern browser has this feature.

Windows Gadgets: Testing environment?

Is there anything that provides a console, error logging, etc. for testing Windows Gadgets? I've searched but I'm unable to find anything.
Thanks in advance!
A simple and easy start is to just use any web developing toolkit. I found out myself that for developing simple Windows Gadgets, Notepad++ and Firefox with its Web Developer toolbar was more than enough. You can implement all the business logic and just test the results in a browser. Actually starting it as a Gadget was only needed to fine-tune some graphical glitches that always occur because of different browsers still interpreting CSS a little differently.
Firefox has some nice tools for debugging Javascript.
You can use firebug lite for IE (i.e put a script tag and include the latest firebug lite version).It does look a bit crude but it works nonetheless and its seamless integration for testing.
http://getfirebug.com/lite/ie.html
Though your gadget might seem a bit mutilated when using it.
:)

Are alert()'s the Javascript equivalent of Visual Studio IDE breakpoints?

I'm trying to find a less haphazard way than a write-and-test way to write Javascript. I don't really use an IDE - I write, then test in browser - if anything's wrong, I then use alert()'s to try tracing. This can be a tedious process having to go back and forth from Notepad++ to the browser, so I wonder if there are better ways of doing this, whether there's a good debug-friendly IDE for Javascript / jQuery or something better than alert's to use (dynamic tracing?).
Are alert()'s the Javascript equivalent of Visual Studio IDE breakpoints?
There are a couple of different solutions available.
Firebug: http://getfirebug.com/doc/breakpoints/demo.html
Venkman Debugger: https://developer.mozilla.org/en/using_breakpoints_in_venkman
Aptana: http://docs.aptana.com/docs/index.php/Adding_a_breakpoint
if you're using firefox, check out firebug. its not so much an ide as a slick debugging tool with a lot of extras.
also, if you're looking for something a little more portable, try blackbird.js one of the coolest little debugging tools i've seen, though nowhere near as frilly as firebugs it will work in any browser and provide your log messages and profiles with a visible place on the screen.
Chrome and IE8 have built-in developer tools that you can use to debug JavaScript code. Firefox has a plug-in for that, too - called Firebug.

Categories