Webstorm debug session - Variables view - debugging

When I am debugging from the IDE using the Chrome addin
It starts up and I can set breakpoints and edit the code live which is really great, but when I try to inspect the current state using the Variables view, I can't see all of the object members. For example, if I debug using the Chrome Developer Tools I see...
...I have live access to the entire object structure.
But in Webstorm I can only see this...
It seems like it only works for user defined properties and the __proto__ object. Is this the case or is there a setting somewhere to enable this? There is nothing I can find in the Webstorm documentation indicating that this is a limitation of the tool...
I just want to know if this is a limitation or not.
Just in case the pics are not clear, here are the pics of the document node in the WS IDE, Watches window...
And here is what I expect to see and what I do see in the Chrome Dev tools...

Related

Selectors only work when webpage is opened in Internet Explorer

I created a login sequence and my selectors for the input email, password, click login and element exists are valid. But only when I have the Internet Explorer page open on the website I'm working with.
I did that sequence again, and I ran it, initially it worked but when I ran the hole project it broke again, I tried "repair" and "indicate", I tried to eliminate the title but nothing is working.
As far as I can see, you are using selector attribute:
"title=ACME System 1 - Dashboard"
Try using a wildcard: title='ACME System 1*', so it can work when you leave the dashboard.
This worked for me when I took those UiPath Academy courses.
In order to automate tasks within a browser with UiPath, the browser must be open. There is an activity called Open Browser that's included in the default activities for every project. You need to add this activity to the beginning of your sequence and pass in the appropriate parameters, (ie. URL, browser type) you can then pass the outputted browser variable to an attach browser sequence and execute your browser automation acivities within that.
Browser activity sceenshot
In addition, the selector that you have shared does not look like a stable selector. There may be other 'H1' elements on the screen that will cause your automation to fail. I would use the UI explorer to help you build a better, more stable selector.
Did you initially use IE to indicate screen elements and then changed the BrowserType property to use a different browser? Please share the sequence to suggest you a fix for your issue.
I would also suggest you to modify the selector to 'title='ACME System *'.
In order for selector to work the application needs to be open and the desired element needs to be available. So when you close the browser the selector disappears.
You may consider swithching to 'Modern Design Experience' and use 'Use Application/Browser' scope to make this more intuitive, and it will also automatically open the browser for you if it is closed.

Standalone IntelliTrace collected recording shows only external code

I am testing the standalone IntelliTrace recorder tool but struggle to use it for post-mortem debugging of a client WPF application.
I managed to record the data using the IntelliTrace recorder. However, when I view the created .itrace file in Visual Studio 2017 15.8.6 Enterprise, I cannot see any references to the code. VS tells me for all events that all threads execute only external or framework code.
The events that have been recorded are mostly WPF button click gestures. Even though the button click method itself is in BCL libraries, I was expecting to see click handler code. Furthermore, I also added a line to throw an exception in my app (which then of course is thrown in the code of the application), but for this, I also cannot see any code.
The collection plan did not make any difference. I was using the builtin ASP.NET Trace collection plan as it is supposed to be verbose, the default plan and a customized plan where I removed everything that is not important for the app under test.
The program database files are located next to the executables as I was executing the program from in its build output directory, so VS should not have any problems finding the pdbs.
The commandline I was using to start the collection is
C:\IntelliTrace\IntelliTraceSC.exe launch /cp:C:\IntelliTrace\collection_plan.ASP.NET.trace.xml /f:C:\IntelliTrace\test.itrace MyApp.exe
Am I missing something? What is required to see the actual code? Currently, I only see the sequence of events, which alone is pretty useless for debugging.
I am using the IntelliTrace collector version 14.0.24720.00.
You have to check your debbuger.
Try Right click on the project and under Configuration Properties -> Debugging there should be a row with Debugger type).
Can you try debugging with the type switched to mixed mode? It seems like you also have managed code running and it may be using the incorrect debugger if it is set to auto.
Are you still getting the same issue?
Also can you try debugging with Just My Code turned off. Tools -> Optio -> Debugging. Make sure Enabled Just My Code is unchecked. Does this issue still appear?
Also, try with:
Debug > Options > General > Uncheck "Enable Just My Code"
All the references that I mention has background in:
https://msdn.microsoft.com/de-de/library/dd264915(v=vs.120)
Hope it fix your issue

debugger doesn't work in chrome / safari/ firefox for ember app

I am working in an ember application. The version is "ember-cli": "1.13.13".
For a very strange reason, debugger doesn't work in Chrome. (I also tried Safari, and Firefox developer's edition. Same thing.)
Specifically, the problem is I put a debugger statement in a function. Ember app loads and hits the function and the debugger statement in the function. What happens in the Developer Tools -> Sources tab is that it doesn't show me the function that the debugger is in.
Instead it keeps highlighting the last line of app-boot.js file. The breakpoint, or the line that it's paused on, is not showing up at all. (see screenshot attached)
Furthermore when I step into the function call using the down arrow, it remains at app-boot.js, so I have no idea whether it did step into the function or not.
This has been plaguing me for a while now.
I've resolved many times similar error on OSX + Chrome by using Empty Cache and Hard Reload - after that code in Sources tab was updated and I could correctly see actual source code.
Make sure you didn't blackbox scripts of your application.
Alternatively you could try to reinstall npm packages, bower packages - it might be issue with creating source maps in Ember CLI.
If nothing helps please investigate your JavaScript and associated map files and check if something might be missing, or maps don't update. You could possibly try turning them on and off in Ember CLI.
See Source Maps section in Ember CLI guides how to enable/disable them.

How do I know which part of JavaScript is executed when some event is occurred

How do I know which part of JavaScript that is executed when some event is occurred in Mozilla Firefox?
This is a very broad question but I'll take a shot. I was a bit curious about the now native debugger in Firefox so I looked into this for you. Firebug is still a nice tool but you don't need it for debugging if you're running Firefox 19 or later. Let me also suggest trying Chrome's DevTools, they are my personal favorite.
To use the native debugger in Firefox, there's two options you will need to configure. Go to about:config (paste that in the address bar). Proceed past the warning. Update the following settings to be true (search is your friend):
devtools.chrome.enabled: true
devtools.debugger.remote-enabled: true
You need to do that so you can set breakpoints in the code. Now load the debugger, the shortcut is Ctrl+Shift+S.
At this point you need to have some idea where to set your breakpoints. If you wrote the JavaScript, you shouldn't have much trouble. If you're inspecting 3rd party code, you might need to browse the source code to get an idea where to begin.
With the debugger loaded, select a source file in the dropdown. It could be a JavaScript file, or any other resource that has JavaScript. You should open whichever file you're interested in inspecting.
To add a breakpoint, click to the left of the line number. You can also right-click on a given line and select "Add breakpoint." If you are debugging something that happens on page load, refresh the page. If it's an event handler, interact with the page to fire the event.
Those are the basics you'll need to get started with debugging in Firefox. Here are some resources you might need to go further.
MDN article: Debugging JavaScript
YouTube video using FireBug: Firebug DebuggingIntro
Chrome DevTools: Breakpoints in Chrome
I hope that helps!

Debug problem occurs sometimes in Silverlight when in Chrome

I am using a dedicated test SL web application that hosts SL object I am debugging.
I am debugging using basic F5 and use browser Google Chrome. Sometimes a bug happens, how I reproduce it.
I was running build->debug like 100 times already, but then I made a mistake that caused StackOverflowException and happened in main page constructor and afterwards when I rebuild and hit F5 it says no symbols have been loaded. Note that NOTHING has changed , I use the same 2 buttons combinations rebuild solution-> start debugging.
In order for debug to continue to attach I need to close XAML main page , open it again (in visual stuido) and hit rebuild ->f5 again, afterwards it works fine. (found this solution after SOME time)
I am not sure whats bugged but it appears to be a bug somewhere in SL to me.
Question is - whats going on maybe someone can explain.
This sounds more like Chrome's isolation mode for plug-ins. Generally speaking it's best to manually attach to the Chrome process that is running Silverlight (which isn't always one VS attaches to when pressing F5).
Actually error was super simple, I wasn't understanding how "exactly" xap works, it was a little more magical to me than it is. I just needed to rebuild & clear cache in browser ( chrome in this case) to attach successfully. For some reason I thought that local version doesn't require clear cache call.
Actually chrome is pretty bad to debug silverlight so I recommend IE for this sole purpose, sometimes debugger simply fails to attach to chrome, in that case you usually need to do this by attach to process - choose chrome with silverlight name there.

Resources