Event listener breakpoints in Google Chrome Devtools offers various number of options, but for me, they are not really of great use since they always throw me to some irrelevant part of code.
What I would like to know is if it is possible to limit it to just one class? For example onMouseClick send me to the 1st method that executes after mouse click, inside specific class. If none of the methods are fired inside this class, than simply do nothing.
You can set the breakpoints for each script and each line individually.
First open the debug-tools and chose a script in the sources-tab:
Then you can click on the line-number (here only no. 1) and it looks like this:
As you see now is the line marked, but also in the right col your individual breakpoint is listed.
After having marked the breakpoint you still have to reload the page that the scripts are executed again till to the breakpoint. Afterwards you can use the icons above the right col to step in or step over the commands following the breakpoint.
Having minified scripts, breakpoints are hard to use, so it's better to have a script where each line has only one command, it's much easier then to debug.
So for debugging you should change the corresponding script in your page to the non-minified version, perhaps also with a map-file if available.
Related
How to know what are the lines of code covered in the java class for a particular point of execution in eclipse. For example,if button click event is fired then how to know what are the lines of code is being executed during this event. Any plugins in eclipse or any free software for this to track the code ?
Go to the following page, it will instruct you through the process. The only thing you need to do is prepare a j-unit test for your code (for the method that gets called when pressing the button).
http://crunchify.com/what-is-the-best-code-coverage-plugin-you-should-use-in-eclipse-ide/
I am trying to find out which Javascript method is called when I click a button. I have blackboxed some third party javascript files. I am using the latest versions of Chrome and Canary.
I have enabled the Mouse click event listener breakpoint in devtools. When I click a button, a debugger breakpoint is hit inside a js file which is blackboxed. I am using a third party button whose JS click event handler executes first before mine. I have blackboxed their code file hoping that my code gets the breakpoint. A 'This script is blackboxed in debugger' yellow message shows up for their code file.
Why is the breakpoint hit when the script file is blackboxed?
I created a test where I added a click Event Listener Breakpoint on this page and it paused in jquery-min.js. I blackboxed that script and tried again. It didn't break in jQuery anymore.
I re-read your post and you mentioned 'a debugger breakpoint is hit'. I now take that to mean an explicit breakpoint like a debugger; statement in the source code or one set in Dev Tools (by clicking line number), and that the Event Listener Breakpoint is irrelevant.
If you have a debugger; statement in a library that is blackboxed, the breakpoint will still be hit. You can disable the breakpoint by right clicking on the line number where the statement exists and selecting 'Never pause here'.
As it stands, if you put a breakpoint in a blackboxed library via Dev Tools, it will still break in that script. It shows more explicit intent to break on the code, rather than something perhaps left in by a 3rd party. You would have to disable or remove them.
There appears to be a debate about whether blackboxing a script should ignore breakpoints set in that library, as blackboxing could be considered to be more about not stepping into the library code/seeing it in the call stack. See the discussion here. Interestingly, the documentation includes the following still:
The debugger will not pause on any breakpoints set in library code.
https://developer.chrome.com/devtools/docs/blackboxing
This isn't the case.
There is come inconsistency here with the behaviour and documentation. I will try and get an update on this.
Say I want to look at an object and so I log it to the console:
console.log(theNoticeObj);
Then using Chrome Dev Tools, I inspect it in the console and change its property theNoticeObj.bounceHeight to 10px
Now if I want to trigger theNoticeObj.bounce() on that object immediately to locate it, is there an easy way to do that from the console?
Thanks
EDIT:
Breakpoints where suggested below, but this freezes execution.
In face what I want is the command line API to work with javascript objects, not just DOM elements. If that were possible I'm sure I would be able to find it. I might go and see if there are any feature requests to that end for chrome.
https://developers.google.com/chrome-developer-tools/docs/console#using_the_command_line_api
Try adding window.tno = theNoticeObject under the console.log statement. Reload the page and see if you can execute tno.bounce() from the console. If theNoticeObject is still in scope, this should work.
You can navigate to the Sources tab and open your javascript file containing the piece of code you want to play with, in this case let us assume it is
console.log(theNoticeObj);
Once you find this line, you can set a breakpoint at this point and when your program execution comes to this line it will halt.
You can then use the Console tab to do operations on all the javascript objects in current local scope, window scope. You can simply call:
theNoticeObj.bounce();
It executes in the current context reflecting changes on the screen.
Hope this helps.
Now you can right click any object in the console and use "Store as global variable".
A new console line appears with the name of a new global variable holding reference to the selected object.
In eclipse, when debugging, let's say you have a method call with parameters, and then when you press step into, it'll evaluate parameters first and only then will go into function. But in eclipse there is a hotkey, so you put your mouse cursor on function name, press it, and debugger will stop inside that function, so it'll skip parameters evaluation (it will evaluate them, but won't stop there). Is there such function in intellij idea?
EDIT: there is a workaround for this, go inside method, put a breakpoint, then resume your application and it'll stop at that breakpoint. But is there a way without setting an additional breakpoing?
If i well understanding,you can you the Smart Step Into debugging features(Smart Selective Step Into). When you press shift+F7 a popup ask you into witch method you want to step into.
You can select the method directly, avoiding the parameters evalutation.
Is there any tutorial for debugging applications/ running profiler in eclipse? Please let me know thanks..
This will depend on what language you are using. How you setup for debugging PHP vs C++ is a little different as they use different underlying tools (PHP - Xdebug vs C++ - gdb)
In a general sense, you will configure the app much like you would set it up to run within Eclipse. In some cases you will have to be sure to enable debugging information within the code base for the debuggers to provide detailed information. From there you're looking at setting breakpoints, stepping, and setting up watches which is very similar language-to-language within the Debug Perspective in Eclipse.
A common scenario is to set a breakpoint within the codebase by clicking on the left bar in the editor, and selecting toggle breakpoint. Then click the debug button in the IDE and it should open the Debug Perspective and either break at the beginning of main, or will run to the breakpoint you set in the code. Once the break is hit, you will be able to browse the stack frames within one of the views within the perspective and you will see tabs for watches, breakpoints, etc. The buttons near the top that look similar to play, and then arrows jumping over dots are the way you control the execution from your breakpoint. If you click "step over" the code will go line by line in the source file you're in until it must goto another file to follow the execution of your code. It will not go into a function call, rather call it execute it and return to the next line in the current source. If you want to go into the function call and continue debugging from there, you would use the "step into" button which is right next to "step over" in most cases. Resume restarts regular execution and will run your program normally until the end or another breakpoint is hit.
Start from there and get comfortable with it and then start playing with things like conditional breakpoints and watches. Conditional breaks are exactly like breakpoints but they only stop execution if the condition you specify is met. With C++ this is usually done by right clicking on the breakpoint and providing the conditional expression where appropriate in the menu. (I forget the exact verbage)
Watches allow you to watch memory and have the program break when memory is read, written to, or both so you can inspect your application.
Some debuggers in Eclipse may lack some of these features or offer more advanced features than those listed above, but these concepts should get you well on your way.
Good luck!