You signed in with another tab or window. Reload to refresh your session.You signed out in another tab or window. Reload to refresh your session.You switched accounts on another tab or window. Reload to refresh your session.Dismiss alert
Use Copilot Edits to start an AI-powered code editing session where you can quickly iterate on code changes by using natural language. Based on your prompts, Copilot Edits proposes code changes across multiple files in your workspace. These edits are applied directly in the editor, so you can quickly review them in-place, with the full context of the surrounding code.
14
14
@@ -23,11 +23,11 @@ The following video shows how you can use Copilot Edits to modify a basic Expres
23
23
> [!NOTE]
24
24
> The Copilot Edits feature is currently in preview. You can provide feedback and report problems in [our issues](https://github.com/microsoft/vscode-copilot-release/issues).
25
25
26
-
## Edit with Copilot
26
+
## Get started with Copilot Edits
27
27
28
-
Adding new features, fixing bugs, or refactoring existing code is often an incremental process. With Copilot Edits, you start an edit session where you can pull in multiple relevant files, and iterate over your code changes by sending chat prompts.
28
+
You use the Copilot Edits view to start an edit session. Making code changes is often an iterative process and consists of multiple steps before you're satisfied with the result. An edit session consists of a sequence of requests (or turns) to Copilot Edits for making code edits. An edit session can go on for as long as you like, and you can send as many requests as you need to get the code to where you want it.
29
29
30
-
There are different ways to start an edit session:
30
+
There are different ways to get started open the Copilot Edits view:
31
31
32
32
* Use the `kb(workbench.action.chat.openEditSession)` keyboard shortcut
33
33
@@ -37,7 +37,11 @@ There are different ways to start an edit session:
37
37
38
38
* Use the **View: Toggle Copilot Edits** or **Copilot Edits: Focus on Copilot Edits View** command in the Command Palette (`kb(workbench.action.showCommands)`)
39
39
40
-
When you first open the Copilot Edits view or start a new edit session, a welcome message is presented. The Copilot Edits view has an input field to enter your prompt, and a list of files you want to work on (_working set_).
40
+
* Move a previous [chat conversation to Copilot](#send-a-chat-request-to-copilot-edits) Edits by selecting **Edit with Copilot** in the Chat view
41
+
42
+
43
+
44
+
When you first open the Copilot Edits view or start a new edit session, a welcome message is presented.
41
45
42
46
43
47
@@ -50,20 +54,32 @@ The first step when you start an edit session is to add the relevant files you w
50
54
51
55
52
56
53
-
Copilot Edits automatically adds the open editor to the working set. If you have multiple [editor groups](/docs/getstarted/userinterface.md#editor-groups), the open editor for each group is added to the working set. To add all open editors, select **Add Files...**, and then choose **Open Editors** from the Files Quick Pick.
57
+
Copilot Edits automatically adds the active editor to the working set. If you have multiple [editor groups](/docs/getstarted/userinterface.md#editor-groups), the active editor for each group is added to the working set. To add all open editors, select **Add Files...**, and then choose **Open Editors** from the Files Quick Pick.
54
58
55
-
You can add files to the working set by selecting the **Add Files...** button or the <iclass="codicon codicon-attach"></i> icon (`kb(workbench.action.chat.attachContext)`), and then choosing the files in the Quick Pick.
59
+
You have many options to add files to the working set:
56
60
57
-
> [!TIP]
58
-
> To quickly select multiple items from a Quick Pick, use the `kbstyle(Up)` and `kbstyle(Down)` keys to navigate the list, use the `kbstyle(Right)` key to add the item as context, and then repeat this for other items.
61
+
* Select **Add Files...** or use the <iclass="codicon codicon-attach"></i> icon (`kb(workbench.action.chat.attachContext)`), and then select files in the Quick Pick.
62
+
63
+
> [!TIP]
64
+
> To quickly select multiple items from a Quick Pick, use the `kbstyle(Up)` and `kbstyle(Down)` keys to navigate the list, use the `kbstyle(Right)` key to add the item as context, and then repeat this for other items.
65
+
66
+
59
67
60
-
68
+
* Drag and drop editor tabs, or files or folders from the Explorer view, Search view, or editor breadcrumb onto the Copilot Edits view.
61
69
62
-
You can also add files to the working set by dragging and dropping files or editor tabs onto the Copilot Edits view.
70
+
When you drop a folder onto the Copilot Edits view, all files in that folder are added to the working set.
63
71
64
-
To help Copilot Edits provide better code suggestions, you can add relevant context to your prompt, such as `#selection`or `#terminalSelection`. Reference context by typing the `#` symbol, or by using the Attach Context control (`kb(workbench.action.chat.attachContext)`).
72
+
* Right-click on a file in the Explorer view or Search view and select **Add File to Copilot Edits**.
65
73
66
-
You can also add file references in your prompt by using `#` as an IntelliSense trigger for file suggestions. If Copilot decides to make changes to the files you mentioned in your prompt, they are added automatically to your working set.
74
+
* Select a suggested file. When you add one or more files to the working set, Copilot Edits proposes other relevant files based on the Git history.
75
+
76
+
<videosrc="images/copilot-edits/working-set-suggested-files.mp4"title="Add suggested files to Copilot Edits working set."autoplayloopcontrolsmuted></video>
77
+
78
+
If you don't want to see these suggestions, you can disable them with the `setting(github.copilot.chat.edits.suggestRelatedFilesFromGitHistory)` setting.
79
+
80
+
To further help Copilot Edits provide better code suggestions, you can also add relevant context to your prompt, such as `#selection` or `#terminalSelection`. Reference context by typing the `#` symbol, or by using the <iclass="codicon codicon-attach"></i> icon (`kb(workbench.action.chat.attachContext)`).
81
+
82
+
You can also add file or symbol references in your prompt by using `#` as an IntelliSense trigger for file or symbol suggestions. If Copilot decides to make changes to the files you mentioned in your prompt, they are added automatically to your working set.
67
83
68
84
## Request code edits
69
85
@@ -72,14 +88,18 @@ After you've added the relevant files, enter a chat prompt using natural languag
72
88
> [!TIP]
73
89
> Be specific and precise about the changes you want Copilot Edits to make. If you have a larger task, decompose it in smaller tasks and iterate often to steer Copilot in the right direction.
74
90
75
-
In response to your prompt, Copilot Edits determines which files in your working set to change and adds a short description of the change. Notice that Copilot Edits opens editor tabs for the affected files, where the edits start to stream into. Changes are presented inline in the code, showing the before and after situation. Use the **View Changes** control to view all edits in a multi-file diff view.
91
+
In response to your prompt, Copilot Edits lists the files that are edited and provides a short description of the change. In addition, the suggested edits are applied to your code. As the edits stream in, Copilot Edits opens editor tabs for the affected files.
76
92
77
-
93
+
<videosrc="images/copilot-edits/copilot-edits-streaming-edits.mp4"title="Screen capture showing the edits from Copilot Edits stream into the open editor."loopcontrolsmuted></video>
78
94
79
95
When Copilot Edits generates edits for your project, it visually indicates which files in the working set are edited. Select a file in the working set to open it and view the proposed edits in the editor.
80
96
81
97
82
98
99
+
You can further iterate and send more requests in your edit session. If you're not entirely happy with the edits, you can ask follow-up question, such as "don't include the phone number", or "use jest instead of vitest". Or you can incrementally edit your code further. For example, when building a web app, use a series of prompts such as "add a navigation bar", "add a theme switcher", "store order items in JSON format in MongoDB".
100
+
101
+
## Save generated edits
102
+
83
103
Copilot Edits shows the generated edits in-place in your code but doesn't automatically save the changes to disk (notice the dirty indicator in the editor tab). As part of reviewing the edits, you might depend on automated tasks that are triggered by a file change, such as a build or test task. You can save the individual files or select **Save All** (`kb(chatEditing.saveAllFiles)`) in the working set to save the edits to disk.
84
104
85
105
@@ -89,23 +109,25 @@ When you save a file that contains AI-generated changes, a confirmation dialog i
89
109
> [!NOTE]
90
110
> Saving the files doesn't mean that you automatically accept the changes. After saving the files, you can still accept or discard the generated edits.
91
111
92
-
You can further iterate and send more requests in your edit session. If you're not entirely happy with the edits, you can ask follow-up question, such as "don't include the phone number", or "use jest instead of vitest". Or you can incrementally edit your code further. For example, when building a web app, use a series of prompts such as "add a navigation bar", "add a theme switcher", "store order items in JSON format in MongoDB".
93
-
94
112
## Accept or discard edits
95
113
96
-
Copilot Edits shows the generated edits in-place in your code and provides you with a code review flow, where you can accept or discard each of the AI-generated edits. When you accept the AI-generated edits, the file changes are confirmed in the working set and saved to disk. If you discard the edits, the files are restored to their previously accepted state.
114
+
Copilot Edits gives you a code review flow, where you can accept or discard each of the AI-generated edits. When you accept the AI-generated edits, the file changes are confirmed in the working set. If you discard the edits, the files are restored to their previously accepted state.
115
+
116
+
You can navigate between the different edits across your project by using the editor overlay controls. Use the **Accept** and **Discard** controls to accept or reject all changes for a given file.
97
117
98
-
To accept or discard edits generated by Copilot Edits:
118
+
119
+
120
+
For more fine-grained control over which edit you want to accept or reject within a file, hover over the code edit and select the **Undo** control to reject a change.
121
+
122
+
Alternatively, you can also accept or discard the changes from the working set:
99
123
100
124
* Select **Accept** (`kb(chatEditing.acceptAllFiles)`) or **Discard** (`kb(chatEditing.discardAllFiles)`) in the working set title bar to accept or discard all edits in the working set
101
125
102
126
* Select the **Accept** or **Discard** icon on an individual file in the working set to limit the action to that specific file
103
127
104
128
105
129
106
-
As you're reviewing edits for a file, you can use the up (`kb(chatEditor.action.navigatePrevious)`) and down (`kb(chatEditor.action.navigateNext)`) controls to quickly navigate to the previous or next edit in the file. You can then use the **Accept Chat Edit** and **Reject Chat Edit** controls for individual edits in a file.
107
-
108
-
130
+
## Undo edits
109
131
110
132
As you're sending requests to make edits to your code, you might want to roll back some of these changes, for example because you want to use another implementation strategy.
111
133
@@ -122,13 +144,13 @@ You can also use the **Undo Edits (Delete)** control when hovering over a reques
122
144
123
145
## Send a chat request to Copilot Edits
124
146
125
-
Copilot Chat is great for asking questions and exploring ideas and code suggestions about your project or technology topics in general. When you're ready to transition to Copilot Edits and apply code changes, it might be useful to also transfer the attached context from your chat conversation.
147
+
Copilot Chat is great for asking questions and exploring ideas and code suggestions about your project or technology topics in general. Once you're ready to apply the suggested code changes, you can transfer your chat session over to Copilot Edits. The advantage of doing this is that you can let Copilot Edits apply all the changes across your project, instead of having to apply each code block individually from the Chat view.
126
148
127
-
In the Chat view, you can enter a chat prompt and directly send it to Copilot Edits, while keeping the attached context. Select the **Send** button options menu, and then select the **Send to Copilot Edits** option (or press `kb(workbench.action.chat.sendToChatEditing)`).
149
+
In the Chat view, select the **Edit with Copilot** button at the bottom of the chat conversation to apply the suggested code changes with Copilot Edits. If you have multiple chat requests in the chat session, you can select which requests you want to transfer to Copilot Edits.
128
150
129
-
151
+
130
152
131
-
Notice that the Copilot Edits view opens, and that your prompt and the attached context are transferred over from the Chat view and immediately submitted.
153
+
After moving a chat request to Copilot Edits, the chat request is removed from the chat conversation in the Chat view.
0 commit comments