VS code debugging note

Here I'm going to share experience of debugging vs code. I pick issue #26956 for example(not sure if I can fix it).

Issue:

#26956 : Can't find files starting with `./` on MacOS.

Steps:

1. Open vs code development.

2. Try if issue exist.

3. Find the relative code for issue.

4. Modify code to fix the bug.

5. Try if issue fixed.

6. Test error.

7. Pull request to repository.

Let's begin:

1. Open vs code. In terminal, go to vs code directory. Open vs code using this command:

./scripts/code.sh

 2. Try issue. Press 'cmd+p', type './' in the search box. It seems like this:

    Yes. The issue is exist. We can start debugging it.

3. Find relative code:

To find the code, we can use a tool called "Toggle Develop Tool". Press 'cmd+shift+p', type: 'developer:toggle develop tools'. It should pull down a list. Click the first one shown as below:

The interface of the develop tool is like this:

Then, I find the element for file search bar. Expand all code in 'Elements' tab in 'Toggle Developer Tools', Press 'cmd+p' to let the file search bar out. In elements code, move the mouse through the codes and observe if file search bar is highlight. If so, that means that is the element for file search bar.

That is the element code for search bar. Right click the code, go to the bottom, click 'attribute modification'

This can track action of the element. It will pause when action is triggered and show source code relative to that action.
Press 'cmd+p" to trigger the search bar, then the program pause.

We can use the buttons below to break actions in smaller step to look exactly the relative function.

Use the third and forth button to track the action. Try to find the relative function relative to search files. Or more quickly, we can click the function directory in 'Call Stack' list and read the code.

When I going through, I found this part of code:

I suspect this is the part holding the pattern of file searching bar.

And I found a function about file pattern:

So I jump to that function:

Here I made my try...

The search value at this moment is './'. So I try to remove './' from searchValue by this:

searchValue = searchValue.replace('./, '');

But it doesn't work.

I think the program automatically add current path in search string. And there's function to make string removing the wildcard. So removing './' from string.

4. What I learned:

In this lab, I got used to the developer tool. I learned some of the feature of it. For example, I know how to set break point to program. I also learned how to track the process when the program is running.