Understand GitHub Copilot Chat Window in Visual Studio Code

In the previous article, we learned how to install GitHub Copilot in Visual Studio Code. In this article, we will learn how to use GitHub Copilot Chat in Visual Studio Code. We will first understand various parts of the GitHub Chat window and then we will ask a few ASP.NET Core questions to GitHub Copilot Chat.

In the previous article, I mentioned that Chat is a powerful feature of GitHub Copilot. Chat is where you can ask questions and get AI-powered answers. The chat is not limited to Q-n-A but you can also seek explanation for a piece of code, ask for code refactoring, and even ask for code generation. Considering its important role in the overall GitHub Copilot experience, it would be worthwhile to understand the chat window interface in detail.

You open the GitHub Chat window by clicking the GitHub Copilot icon in VS Code.

Alternatively, you can explicitly pick Open Chat from the associated menu shown below.

Take a look at the following screenshot of the GitHub Copilot Chat window in Visual Studio Code:

Broadly this window is divided into two parts. The bottom part is where you ask questions or give instruction to GitHub Copilot Chat. The top part is where response from GitHub Copilot Chat is displayed. Additionally, there are several features attached to the bottom part that you can use to interact with GitHub Copilot chat.

We will now examine a few of these features with simple examples.

Let's ask a simple question to GitHub Copilot Chat.

Write this question in the chat window and hit Enter or click on the Send button. You will get response in the top part of the window like this:

GitHub Copilot Chat also supports voice interactions. So, you could have asked the above question using voice instead of typing it. I am not going to use voice in my examples but you can give it a try just to see how it works.

Now, create a new ASP.NET Core MVC application in VS Code using C# Dev Kit or using the command line. The following figure shows an MVC project created using the default project template.

Ensure that there no files open in the VS Code editor and ask this question to GitHub Copilot Chat :

You will get a vague response like this :

This happens because GitHub Copilot Chat is unaware about what code you are talking about. This is where you need to supply "context" along with your question.

Now, open HomeController.cs in the VS Code editor. And issue the same prompt again.

Notice that when you open a file in VS Code editor, it's name appears in the chat window like this :

GitHub Copilot Chat uses the current open file as context to answer your question. You can enable / disable it using the toggle button shown in the figure.

Now the same query with context of HomeController.cs will give you a more relevant response like ths :

Now select [ResponseCache] attribute decorated on top of the Error action.

Repeat the same prompt again. This time you will get a response specifically about the selected code.

You can also specify the context using # symbol. For example, instead of opening HomeController.cs and then asking the question, you can simply type the following in the chat window :

There is yet another way to specify the context -- the Add Context button.

Clicking on this button will show many context options. You can select one or more of these options to add context to your question.

There is more to GitHub Copilot Chat -- chat participants and slash-commands. We will learn about them in the next part of this series.

That's it for now! Keep coding!!