How to debug queries to the DOM in Visual Studio Express - visual-studio

Can someone help me figure out the most suitable debugging features in visual studio for my problem below please. I'm coding in JS and have a line of code below
listView = utils.query("#termTest");
ui.setOptions(listView, {
itemDataSource: publicMembers.itemList,
itemTemplate: utils.query(".itemtemplate"),
oniteminvoked: this._itemInvoked,
})
My application runs fine and doesn't cause an error however my data isn't being bound to that listview making me assume that for some reason it's not querying or finding the right element of the DOM. How do I found where it is actually pointing?

Have you tried using the watch feature, rather than just mousing over?
You can set a variable in the watch window, right click it and set it to break when that value changes.
This should enable you to easily see when this value changes.

Related

Visual studio way to label watching value

I am curious is there any way to label value of object in watch window - to help in readability? (Like in the picture)
It will be really helpful to debug.
I tried double click on name and changed it, but it looks like we cannot change it.
How would I like to use it
Thanks a lot!
The feature you want to use is the datatips in debugging.
https://msdn.microsoft.com/en-us/library/ea46xwzd.aspx
We hover over a variable to see its value, and it was different from the debugging watch window.
The feature you want to get in the watch window would be hard now.
This document shared us the general features in the debugging watch window:
https://abhijitjana.net/2010/10/26/10-tips-you-should-know-about-watch-window-while-debugging-in-visual-studio/
If you really want to get this request, one idea is that you could submit a feature request to the product team:
http://visualstudio.uservoice.com/forums/121579-visual-studio.

Can't collapse sections in js files in Visual Studio 2017

I usually use the CTRL+M CTRL+O to collapse sections or regions in my cs files in Visual Studio 2017. This keyboard shortcut is also working nicely in my JSX files. However, it's NOT working in JS files.
Interestingly, VS 2017 is able to see and understand functions, even sections within functions such as if blocks, etc. As you can see in image below, it also offers me those +/- icons to collapse them. Using the mouse, I can collapse them but my keyboard shortcut is not working.
How do I get VS 2017 to collapse everything to definitions in JS files using keyboard shortcuts?
The cause of this behaviour seems to be the use of the arrow-function - if you change that to a regular function-definition, the section will collapse using Ctrl+M Ctrl+O ('Collapse to definitions') like you expect it to.
This will, however, cause you to lose the perks of the arrow-function, which is less than optimal, especially when used in conjunction with promises.
What exactly is causing this, however, I haven't been able to discern, and all attempts of fixing it have so far proven futile.
Here's an example of how your outline should work as expected:
return function (dispatch) { fetch('/api/accounts/members/search', fetchOptionsPost(request))
.then(function(response) {
if(response.ok)
{
...
}
});
Can anyone confirm whether or not this behaviour occurred in VS2015?
Cheers
Edit 1: Ctrl+M Ctrl+L switches all outlines (not just definitions), which seems to include arrow-functions as well. You might have to press it twice, though, because as soon as a single item is collapsed, it expands everything.
Which begs the question whether this is not a bug, but indeed a feature, depending on whether or not you view the arrow-function as a 'definition' or not.

Fields in the XAML editor Property window becoming un-responsive

Edit: I see "Silverlight -" is in front of my question, which I realize may have something to do with the alphabetical order of my tabs... really Visual Studio 2013 should be in front, anyone know if that can be changed?
I've been using the newer Visual Studio 2013 for about a week now, and I've found some quirks with it. The one that seems to happen the most is when I'm in the XAML editor working on something, suddenly if I go over to the property window I can't enter anything. I'm not running/debugging. I can type stuff in the regular XAML code editor window.
Even stranger, one of the times, I could get the cursors to appear in the fields. I typed a bunch of junk and just one character from what I types appeared. Another time I couldn't enter values into the properties, but I could double click on an event in the events window and create a new event handler. Just a minute ago I had the opposite, where I couldn't double click in the events window.
I think VS 2013 introduced async handling of more things, could it be related to that? Or perhaps because I'm using Silverlight? Right now my only workaround is to restart VS, does anyone have any knowledge about this? Anyone else experienced this?
I'm going to submit a bug report, but it would be a while before there's a patch, so I'm wondering if maybe someone understand the problem better and has a workaround? Or maybe just confirm that this exists and that I'm not crazy/my computer's haunted.
Edit:
I should mention another weird thing that happened two nights ago. I thought it was some how my doing, but I never figured out how I could have managed it without noticing. I was working on a piece of code, went to run after changing a few lines, and suddenly I had a ton of compiler errors. I go over to a user control I haven't touched in hours and suddenly the main LayoutRoot grid is completely empty. Luckily I'd committed to source control, but still...
I found an easy way to deal with this problem. It happens a lot after debugging so what I did was I created a batch file on my desktop containing this line taskkill /f /im XDesProc.exe and I run it every time the properties start misbehaving. Its the quickest way to reload the designer's functionality. I submitted this bug to microsoft they claim it will be included in the next update.
Me and another guy are developing a silverlight app and having the same exact problem. I accidentally found where the bug lies and how to mess with it to allow you to type "very briefly". Apparently this has something to do with tooltips. If you hover over anything in the property window when this bug is happening and allow a tooltip to popup while your cursor is blinking in a field, for the duration that the tooltip is up you can resume typing normal. As soon as the tooltip times out and disappears you can't type. So the only way you can edit or search properties is while a mouse tooltip is floating active. Very unusual. Can't seem to find any kind of tooltip settings in the program and the situation is very hard to find on google because search results assume your talking about programming tooltips. As far as I know we have had this issue since before release candidate. We are currently on official update 1 with the same problem persisting.

Visual Studio 2010 Debugging problem Tool tip code inspector

When debugging in VS I step through the code but the when I move my mouse over variables and properties it shows nothing.
For example:
If I hover my mouse over StoreId it should display the value. It doesn't though, however, if I I hover my mouse over myStore it displays the above?
It's like it cant map the properties to the object in run time.
Any ideas what's going wrong?
Thanks
Check that you haven't enabled any optimizations in the build options.
Optimizations can lead to whole variables being removed from compiled code, instructions being executed in a different order than initially expected...
This problem was addressed in the SP1 release of VS2O10, did you install it?

Good Way to Debug Visual Studio Designer Errors

Is there a good way to debug errors in the Visual Studio Designer?
In our project we have tons of UserControls and many complex forms. For the complex ones, the Designer often throws various exceptions which doesn't help much, and I was wondering if there's some nice way to figure out what has gone wrong.
The language is C#, and we're using Visual Studio 2005.
I've been able to debug some control designer issues by running a second instance of VS, then from your first VS instance do a "Debug -> Attach to Process" and pick "devenv".
The first VS instance is where you'll set your breakpoints. Use the second instance to load up the designer to cause the "designer" code to run.
See Debugging Design-Time Controls (MSDN).
It has been a pain in 2005 and still is in 2015. Breakpoints will often not hit, probably because of the assemblies being shadow copied or something by the designer(?). The best you can do is to break manually by introducing a call to Debugger.Break(). You may wrap it into a compiler conditional as so:
#if DEBUG
System.Diagnostics.Debugger.Break();
#endif
int line_to = break; // <- if a simple breakpoint here does not suffice
I have had this happen many times and it is a real pain.
Firstly I'd suggest attempting to follow the stack trace provided by the designer, though I found that often simply lists a bunch of internals stuff that isn't much use.
If that doesn't work then try compiling and determining the exception from there. You really are flying blind which is the problem. You could then try simply running the code and seeing what exception is raised when you run it, that should give you some more information.
A last-gasp approach could be to remove all the non-generated code from the form and gradually re-introduce it to determine the error.
If you're using custom controls you could manually remove the generated code related to the custom controls as well if the previous method still results in an error. You could then re-introduce this step-by-step in the same way to determine which custom control is causing the problem, then go and debug that separately.
Basically as far as I can tell there's no real way around the problem other than to slog it out a bit!
I discovered why sometimes breakpoints are not hit. In the Attach to Process dialog, "Attach to:" type has to be "Select..."'d.
Once I changed to "Managed 4.0, 4.5", breakpoints for a WinRT application were hit. Source: Designer Debugging in WinRT.
Each one is different and they can sometimes be obscure. As a first step, I would do the following:
Use source control and save often. When a designer error occurs, get a list of all changes to the affected controls that have occurred recently and test each one until you find the culprit
Be sure to check out the initialization routines of the controls involved. Very often these errors will occur because of some error or bad dependency that is called through the default constructor for a control (an error that may only manifest itself in VS)
You can run a second instance of VS and attach it to the first instance of VS (Ctrl+Alt+P). In the first instance set the breakpoints, in the second instance run the designer, and the breakpoint will fire. You can step through the code, but Edit-and-Continue will not work.
For Edit-and-Continue to work, set you control library's debug options to run a VS with the command line argument being the solution filename. Then you can simply set the breakpoints and hit F5. It will debug just like user code! As a side note, you can do this will VS and Office add-ins also.
This worked for me for Visual Studio 2022:
I opened a second Visual Studio instance
In the second instance I clicked Debug -> Attach to Process...
I selected DesignToolsServer from the process list
More details: https://learn.microsoft.com/en-us/dotnet/desktop/winforms/controls/walkthrough-debugging-custom-windows-forms-controls-at-design-time?view=netframeworkdesktop-4.8

Resources