B-but it’s right there, VSCode!

Hello again! It’s me, your favorite – hopefully by now – mediocre blogger/programmer!

So for this week, I was tasked with looking into a bug on Microsoft’s VSCode and see what it is that I can understand from it. Now I must admit, at first this seemed and felt very overwhelming. Primarily because I’ve never seen code written the way the devs at Microsoft write it before. What with the different types and how functions have some weird signature doohickie like so:
function Sequence(sequences: { (...param: any[]): void; }[]): void {
// There is code in here, but it's too much to paste
// You can find it here
}

Evidently, this was TypeScript, a language written made by Microsoft, they call it a ‘super-set of JavaScript’. I’ve heard it here and there once or twice, but never actually got the chance to take a look at it and study it. So you can imagine how overwhelming this might have been for me. Like “BOOM, HERE IS SOMETHING YOU’VE NEVER SEEN BEFORE. LEARN IT!” Anywho, on to the actual bug!

So the bug I tried to fix is bug#16834. The bug made it so that if a user tried to search for a file inside of a path that had { } (curly braces) around the folder name, it could not be found. Actually, that’s not 100% true, it COULD be found, but only if you don’t put the absolute path to the file. What I mean is that if you had ./{hello}/hello.txt, it would not find your file. But if you had ./hello.txt, it would find the file you’re looking for. Honestly, don’t ask me WHY someone would have such a folder name, but hey, it’s a bug, so we gotta fix it! Or at least try…

Wrapping my head around it

Now reproducing the bug is was no big deal, it was quite simple, actually. The one who reported the bug gave clear instructions!

See now recreating the bug, no problem, but understanding what causes it is another issue all on its own. How do I deal with this issue? Simple: See what happens when a user tries to search for a file. See what actions the program takes in order to try and find the file in the given folder.

With my Developer Tools opened, my break-point set, I was ready to kick this bug’s butt!

defb8650637b8ccbf44b940f303fdad5.png

I’m not sure you’ve used the chrome Developer Tools before, but if you look on the white screen that has that line highlighted, you’ll notice the little blue dot to the left. That is a break-point I set for that specific element on VSCode. Now my thinking behind it is this, “Whenever I click enter and try to search for the file, that message box at the bottom on the left panel tells me whether or not the file was found. So clearly, it must get it’s information from somewhere. If I’m to put a break-point there and trace where it got its message from using the call-stack, perhaps I could find where the problem is coming from!”  So off I went! I put the break-point and pressed enter. But note one thing,  the break-point I set was one that would be triggered on ‘attribute modification.’ The reason for this is simply because I want the program to stop when this item gets modified (ie. the message changes to tell me if the file was found or not). So I set said break-point and pressed enter! Then the following happened

31b20990f476490b1aa7b374d84232b3.png

This is the call stack of events that happened that cause the code to reach to the point it’s currently at (the message box changing). Yea I know, trust me. This gave me a headache as well as I took a glance. It seems like a lot at first, but in all honesty, it really isn’t. Now the reason I say it isn’t a lot is simply because only bits and pieces of these files are actually used in all of those calls. If you look to your right, it even tells you what lines are being used to on said call. So a simple step back, and a deep breath is all it took to realize ‘I CAN DO THIS!’

So about 30 minutes of me looking through those calls, I came to realize that I might be looking at the wrong thing. I realized this after noting that every call in this stack is related to the changing of the message, none of them seem to actually point me in the direction I want. Where is the code that tells that little message box what to display? I don’t know. But I haven’t given up, no I haven’t!

I’m still looking into it and still leaning. But I just thought I’d take this time to blog my experience with this bug so far. I think I may be on the right track, but I’m just missing a few things, or I may be wrong all together, haha. But so far, this has been very interesting. Getting to see TypeScript in use for the first time, trying to decipher it, learning how an ace company like Microsoft writes code, it’s all a massive pleasure for me.

 

Conclusion

No, I haven’t been able to fix the bug or even find where it starts, YET! Key word there, ‘YET’. But believe me, with time, dedication and hard work, I will be sure to find it eventually and report back.

I’d like to thank you for taking the time to read this far. If you have any questions, please don’t hesitate to leave them in the comments section!

One thought on “B-but it’s right there, VSCode!

  1. Pingback: Looking for bugs – Yuriy Kartuzov

Leave a Reply

Fill in your details below or click an icon to log in:

WordPress.com Logo

You are commenting using your WordPress.com account. Log Out /  Change )

Google photo

You are commenting using your Google account. Log Out /  Change )

Twitter picture

You are commenting using your Twitter account. Log Out /  Change )

Facebook photo

You are commenting using your Facebook account. Log Out /  Change )

Connecting to %s