Using GitHub Copilot Code Completions
1. Accepting Inline Suggestions
| Trigger | Description | Notes |
|---|---|---|
| Inline Suggestion | GitHub Copilot shows code suggestions inline as you type | Available in supported IDEs (VS Code, Jetbrains) |
| Accept Suggestion | Use keyboard shortcut or click to accept suggestion | Default: Tab in VS Code, Ctrl + Alt + ] in JetBrains |
| Dismiss Suggestion | Use keyboard shortcut or click to dismiss suggestion | Default: Esc in VS Code, Ctrl + Alt + [ in JetBrains |
Example: Accepting a Copilot Suggestion
// Typing "const user =" triggers Copilot suggestion
const user = // Copilot suggests:
const user = {
name: "John",
email: "john@example.com",
isActive: true
};
// Press Tab to accept the suggestion
Note: Copilot suggestions are context-aware and improve with usage. The more code you write, the better the suggestions become.
2. Cycling Through Alternative Suggestions
| Key | Action | Description |
|---|---|---|
| Tab | Tab |
Select the next suggestion in the list |
| Shift + Tab | Shift + Tab |
Select the previous suggestion in the list |
| Enter | Enter |
Accept the currently selected suggestion |
| Esc | Esc |
Dismiss the suggestions popup |
Example: Cycling Through Suggestions
// Example of cycling through suggestions in a code editor
function calculateTotal(items) {
let sum = 0;
for (let i = 0; i < items.length; i++) {
sum += items[i].price;
}
return sum;
}
Note: Suggestions cycle through based on context and usage patterns in your project.
3. Using Next Edit Suggestions
| Feature | Description | Usage |
|---|---|---|
| Next Edit Suggestions | AI-powered suggestions for the next logical edit in your code | Triggered automatically when typing; can be accepted with Tab or Ctrl+Shift+> |
Example: Using Next Edit Suggestions
function calculateTotal(items) {
let sum = 0;
for (let i = 0; i < items.length; i++) {
sum += items[i].price;
}
<span class="highlight">return sum;</span>
}
Note: Suggestions appear in a dropdown; use Tab to accept or Ctrl+Shift+> to navigate through options.
4. Generating Code from Comments
| Feature | Description | Usage |
|---|---|---|
| Inline Comments | Generate code based on natural language comments in your code | // TODO: Implement a function to calculate the sum of an array |
| Code Completion | GitHub Copilot suggests code snippets based on comments | // Create a function to filter even numbers from an array |
| Context Awareness | Uses surrounding code context to improve suggestions | // Sort array in descending order |
Example: Generating a Sorting Function
// Sort array in descending order
function sortDescending(arr) {
return arr.sort((a, b) => b - a);
}Example: Filtering Even Numbers
// Create a function to filter even numbers from an array
function filterEven(arr) {
return arr.filter(num => num % 2 === 0);
}
Note: Copilot's suggestions are context-aware and improve with more code in view.
Warning: Ensure generated code aligns with your project's style and security standards.
5. Understanding Completion Ranking Factors
| Factor | Description | Impact |
|---|---|---|
| Contextual Relevance | How well the code snippet matches the surrounding context, including variable names, function signatures, and comments. | High |
| Code Similarity | How closely the completion resembles previously generated or used code patterns in the same project. | Medium |
| Popularity | How frequently a completion is used or preferred by other developers in similar contexts. | Medium |
| Syntax Completeness | Whether the completion aligns with proper syntax and structure of the language being used. | High |
| Recent Usage | How recently the completion was generated or used in the current session or project. | Low |
Note: Completion ranking is influenced by a combination of these factors, with contextual relevance and syntax completeness having the highest impact on suggestion quality.
6. Configuring Suggestion Delay
| Setting | Values | Description |
|---|---|---|
| github.copilot.suggestionDelay | 100 |
Delay in milliseconds before suggesting completions. Default is 100ms. |
| github.copilot.suggestionDelay | 250 |
Increased delay for fewer interruptions, useful in low-latency environments. |
| github.copilot.suggestionDelay | 500 |
Higher delay for minimal distraction, ideal for focused coding sessions. |
Note: Adjusting the suggestion delay can improve focus and reduce cognitive load during intensive coding sessions.
7. Enabling Multi-Line Completions
Note: Multi-line completions are available in GitHub Copilot and some other AI-assisted development tools to help generate longer code blocks or functions.
| Setting | Description | Value |
|---|---|---|
| copilot.inlineSuggestions | Controls whether inline suggestions are enabled | true |
| copilot.multiLine | Enables multi-line code completions | true |
| copilot.maxLineLength | Maximum line length for completions | 120 |
Example: Enabling Multi-Line Completions in VS Code
{
"copilot.multiLine": true,
"copilot.maxLineLength": 120
}Note: Multi-line completions can significantly improve code generation for complex functions or multi-step logic.
8. Disabling Completions Temporarily
| Option | Values | Notes |
|---|---|---|
| github.copilot.disable | true |
Disables Copilot completions entirely |
| github.copilot.enable | false |
Enables Copilot completions |
Note: Disabling Copilot temporarily does not remove the extension, it only stops suggesting completions.
9. Using Ghost Text Navigation
| Feature | Description | Usage |
|---|---|---|
| Ghost Text | Allows navigation through code blocks using keyboard shortcuts | Press Ctrl + Shift + G to activate Ghost Text mode |
| Navigation Keys | Keyboard shortcuts for moving between code blocks | Tab to move forward, Shift + Tab to move backward |
| Jump to Definition | Quickly navigate to the definition of a function or variable | Press Ctrl + Click on any symbol to jump to its definition |
Example: Using Ghost Text Navigation
function calculateTotal(items) {
let total = 0;
for (let i = 0; i < items.length; i++) {
total += items[i].price;
}
return total;
}
// Press Ctrl + Shift + G to activate Ghost Text
// Then use Tab to navigate between code blocks
const cart = [
{ name: "Laptop", price: 999 },
{ name: "Mouse", price: 25 }
];
const sum = calculateTotal(cart);
Note: Ghost Text Navigation works best when using a supported IDE like VS Code or JetBrains IDEs.
10. Understanding Fill-in-the-Middle Completions
| Feature | Description | Usage |
|---|---|---|
| Fill-in-the-Middle | AI suggests code completions in the middle of a function or block based on context | Start typing code and let Copilot suggest completions in the middle of your function |
| Context Awareness | Uses surrounding code to understand the intended logic and suggest relevant completions | Works best when there is sufficient context around the cursor position |
| Code Style | Adapts to the existing code style and patterns in your project | Completions match the coding conventions of your project |
Example: Fill-in-the-Middle Completion
function calculateTotal(items) {
let total = 0;
for (let i = 0; i < items.length; i++) {
total += items[i].price;
}
return total;
}
Note: Fill-in-the-middle completions are most effective when the surrounding code provides enough context for Copilot to understand the intended logic.