Skip to content

Commit 832ef17

Browse files
spboyerCopilot
andauthored
AZD VS Code Extension Updates & Improvements (#6425)
* Add side panel view with My Project and Help and Feedback sections * Implement My Project section with project structure * Add Environments section with details and variables * Remove Environments from My Project view * feat(vscode): Add extensions view and enhanced environment management - Add new Extensions view with tree data provider for managing azd extensions - Implement extension commands: install, uninstall, and upgrade - Add ExtensionProvider service for interacting with azd extension APIs - Add environment variables tree node for displaying env vars in workspace - Enhance environment tree views with toggle visibility and .env file viewing - Add inline actions to environment view (view .env, select environment) - Add navigation buttons to view titles (new environment, install extension) - Improve tree view type checking with isTreeViewModel utility - Update telemetry IDs for new extension and environment operations - Refactor command handlers to support both workspace and environment tree views * feat(vscode): Update Help and Feedback link from Resources to AZD Blog Posts - Rename 'Resources' link to 'AZD Blog Posts' in Help and Feedback view - Update URL to point to Azure SDK blog filtered by azure-developer-cli tag - Update command title to 'Open AZD Blog Posts' * feat(vscode): Add 'Show in Azure Portal' command for services - Added new command to open Azure resources directly in the Azure Portal - Created OpenInPortalStep wizard step to handle portal URL opening - Enhanced RevealStep with improved resource tree navigation and error handling - Added debug logging throughout wizard steps for better diagnostics - Improved error handling in PickResourceStep and PickResourceGroupStep - Updated command registration and package.json with new command - Added localized command title in package.nls.json - Modified reveal.ts to support both TreeViewModel and direct service item inputs - Enhanced RevealStep to activate required Azure extensions and refresh tree before reveal - Added fallback mechanisms when automatic reveal fails (copy ID, open in portal options) * feat(vscode): Integrate environment commands with standalone Environments view - Extended environment commands to support both workspace and standalone views - Added refresh functionality to Environments view after environment operations - Connected env-refresh, env-edit, env-delete, and revealResourceGroup commands to standalone environments - Updated reveal.ts to handle EnvironmentTreeItem for resource group navigation - Modified env.ts to accept EnvironmentTreeItem in all environment operations - Added view refresh commands after env operations (delete, new, select, refresh) - Removed automatic env-select on click for non-default environments - Fixed ESLint warnings with naming-convention for Azure provider types - Added comment explaining focusGroup limitation in RevealStep - Improved regex patterns in RevealStep for better linting compliance This unifies the experience across both the workspace environments and the standalone environments view, ensuring users can perform the same operations from either location. * test(vscode): Add comprehensive unit tests for new features Added unit tests for: - OpenInPortalStep: Tests portal URL construction for various Azure resource types * Web Apps, Storage Accounts, Cosmos DB, Container Apps, Resource Groups * Error handling for missing resource IDs * Priority configuration - RevealStep: Tests Azure resource reveal functionality * Extension activation for different Azure providers * Resource group pre-expansion logic * Multi-attempt reveal with fallback * Error handling and user notifications * Tree refresh mechanisms - EnvironmentsTreeDataProvider: Tests standalone environments view * Environment listing and hierarchy * Default environment marking * Environment variable visibility toggling * Tree refresh events * Integration with environment providers - ExtensionsTreeDataProvider: Tests extensions management view * Extension listing and display * Version information * Tree item creation * Refresh functionality All tests use proper mocking with sinon, follow established patterns, and provide comprehensive coverage of success and error paths. * feat(vscode): add test dependencies and improve command handling - Add sinon and @types/sinon for test mocking - Remove unused telemetryId parameter from registerActivityCommand - Add documentation for telemetry tracking in commands - Fix isAzdCommand to handle undefined input - Add TEST_COVERAGE.md documentation * Update ext/vscode/src/views/environments/EnvironmentsTreeDataProvider.ts Co-authored-by: Copilot <175728472+Copilot@users.noreply.github.com> * Remove debug consol logs, update for proper logging * Update ext/vscode/src/views/environments/EnvironmentsTreeDataProvider.ts Co-authored-by: Copilot <175728472+Copilot@users.noreply.github.com> * Update ext/vscode/src/commands/env.ts Co-authored-by: Copilot <175728472+Copilot@users.noreply.github.com> * Update ext/vscode/ext/vscode/package-lock.json Co-authored-by: Copilot <175728472+Copilot@users.noreply.github.com> * Update ext/vscode/src/commands/azureWorkspace/wizard/PickResourceStep.ts Co-authored-by: Copilot <175728472+Copilot@users.noreply.github.com> * fix build/test ts error * fix build/tests failing * fix linting errors * feat: Add enhanced azure.yaml editing support with IntelliSense Implements comprehensive language support for azure.yaml configuration files: - Auto-completion for host types, lifecycle hooks, and properties with snippets - Hover documentation with examples and Microsoft Learn links - Quick fixes for missing folders, properties, and invalid configurations - Add new service refactoring with interactive wizard - Enhanced validation diagnostics Includes 28 new test cases (all passing) covering completion, hover, code actions, and diagnostics. Updated README.md, FEATURE_IDEAS.md, and cspell dictionary. * feat: Add enhanced azure.yaml editing support with IntelliSense Implements comprehensive language support for azure.yaml configuration files: - Auto-completion for host types, lifecycle hooks, and properties with snippets - Hover documentation with examples and Microsoft Learn links - Quick fixes for missing folders, properties, and invalid configurations - Add new service refactoring with interactive wizard - Enhanced validation diagnostics Includes 28 new test cases (all passing) covering completion, hover, code actions, and diagnostics. Updated README.md, FEATURE_IDEAS.md, and cspell dictionary. * fix build error/linting * add copilot instructions specific to the extension * feat: Implement 'Add Service' command for azure.yaml file with user prompts * fix: Remove unnecessary blank lines in addService command and tests * feat(views): Add Template Tools section with Azure template discovery and initialization Add a new Template Tools view panel that helps users discover and initialize Azure Developer CLI templates: Features: - Dynamic Quick Start section (visible only when no azure.yaml exists) - Initialize from existing code - Create minimal project - Browse template gallery - Browse templates by 6 predefined categories (AI/ML, Web Apps, APIs, Containers, Databases, Starters) - AI Templates section with direct access to aka.ms/aiapps templates - Search functionality with QuickPick UI for filtering templates - Template items with inline actions: - Click template name to view README - Hover actions: Initialize (rocket icon), View on GitHub (github icon) - Context menu with all actions Implementation: - AzureDevTemplateProvider service for fetching/caching templates from awesome-azd JSON feed (1-hour cache) - TemplateToolsTreeDataProvider with FileSystemWatcher for azure.yaml changes - Template comm Add a new Template Tools view panel that helps users discover and initialize Azure Developer CLI temp) - Features: - Dynamic Quick Start section (visible only when no azure.yaml exists) - Initialize ft test coverage (11 n - Initialize from existing code - Create minined between Environmen - Create minimal projecs and seamlessly integrates with exi- Browse temit workflows. * feat: Add comprehensive azure.yaml validation to prevent error pop-ups Fixes #5691 Implements friendly azure.yaml/azure.yml validation within the extension to catch errors before they cause unfriendly error dialog pop-ups. Changes: - Enhanced diagnostic provider with comprehensive validation - Improved error handling in AzureDevShowProvider - Added 17 new test cases (all passing) - Updated README.md and TESTING_GUIDE.md with validation features - All lint, tests, and cspell checks passing Key features: - Empty file detection with helpful guidance - YAML parsing errors with user-friendly messages - Missing required properties validation - Invalid service properties detection - Directs users to Problems panel instead of showing pop-ups * Address PR review feedback from @bwateratmsft - Remove all console.log/console.error statements, replace with ext.outputChannel.appendLog where appropriate - Add category to new commands in package.json - Remove redundant CI test step from copilot-instructions.md - Delete unnecessary TEST_COVERAGE.md file - Delete duplicate ext/vscode/package-lock.json - Update README.md Getting Started with extension install command option - Update minimum AZD version requirement to 1.8.0 * Address PR feedback: Remove duplicate YAML functionality * Add missing words to cspell dictionary * Address PR feedback: cleanup and improvements - Remove Playwright e2e testing infrastructure - Update extension icon - Add copyright header requirement to Copilot instructions - Convert unit tests from assert to Chai assertions - Merge azureYamlValidation.test.ts into azureYamlDiagnostics.test.ts - Update .vscodeignore and .gitignore * update icon to svg * revert icon to png due to build issue : Error: SVGs can't be used as icons: resources/icon.svg * update activity icon to svg * Address PR feedback for VS Code extension views - Rename WorkspaceViewExtensionResolve to ExtensionsViewResolve (correct view ID) - Remove fragile caching test from azureDevTemplateProvider.test.ts - Add copyright headers to view providers - Add vscode.l10n.t() for user-visible strings in HelpAndFeedbackTreeDataProvider - Rename toggle commands to toggleEnvVarVisibility for clarity - Make Help and Feedback view collapsed by default - Use specific context values for templates to avoid conflicts - Consolidate duplicate environment menu entries using regex alternation - Add NLS strings to package.nls.json for new commands - Fix refresh command registration (define command, remove @1) - Restore telemetryId parameter in registerActivityCommand - Remove redundant azureWorkspace.refresh from refreshEnvironment - Add comments explaining hard-coded delays in RevealStep.ts --------- Co-authored-by: Copilot <175728472+Copilot@users.noreply.github.com>
1 parent 89795b2 commit 832ef17

File tree

69 files changed

+5677
-116
lines changed

Some content is hidden

Large Commits have some content hidden by default. Use the searchbox below for content that may be hidden.

69 files changed

+5677
-116
lines changed

.vscode/settings.json

Lines changed: 5 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -1,4 +1,8 @@
11
{
22
"cSpell.import": ["cspell.yaml"],
3-
"go.testFlags": ["-timeout", "30m"]
3+
"go.testFlags": [
4+
"-timeout",
5+
"30m"
6+
],
7+
"aspire.enableSettingsFileCreationPromptOnStartup": false
48
}
Lines changed: 196 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,196 @@
1+
# Azure Developer CLI VS Code Extension - Copilot Instructions
2+
3+
## Project Overview
4+
This is the official Visual Studio Code extension for the Azure Developer CLI (azd). It provides an integrated development experience for building, deploying, and managing Azure applications.
5+
6+
## Core Development Principles
7+
8+
### Documentation
9+
- **Always keep the [README.md](../README.md) up to date** with any changes to:
10+
- Features and functionality
11+
- Commands and usage
12+
- Configuration options
13+
- Installation instructions
14+
- Prerequisites
15+
- Known issues or limitations
16+
17+
### Code Quality & Testing
18+
Before submitting any changes or pushing code, **always run the following checks** to avoid pipeline failures:
19+
20+
1. **Linting**: `npm run lint`
21+
- Ensures code follows TypeScript and ESLint standards
22+
- Fix any linting errors before committing
23+
24+
2. **Spell Check**: `npx cspell "src/**/*.ts" --config .vscode/cspell.yaml`
25+
- Checks for spelling errors in source code
26+
- Add technical terms to `.vscode/cspell-dictionary.txt` if needed
27+
28+
3. **Unit Tests**: `npm run unit-test`
29+
- Runs fast unit tests without full VS Code integration
30+
- All tests must pass before committing
31+
- **IMPORTANT**: If you modify existing code, ensure related tests still pass
32+
- **IMPORTANT**: If you add new functionality, add corresponding unit tests
33+
34+
### Pre-Commit Checklist
35+
✅ Run `npm run lint` and fix all issues
36+
✅ Run `npx cspell "src/**/*.ts" --config .vscode/cspell.yaml` and fix spelling errors
37+
✅ Run `npm run unit-test` and ensure all tests pass
38+
✅ Update [README.md](../README.md) if functionality changed
39+
✅ Verify merge conflicts are resolved (no `<<<<<<<`, `=======`, `>>>>>>>` markers)
40+
41+
## Code Style & Conventions
42+
43+
### File Organization
44+
- Extension entry point: `src/extension.ts`
45+
- Commands: `src/commands/`
46+
- Language features: `src/language/` (IntelliSense, diagnostics, etc.)
47+
- Views & tree providers: `src/views/`
48+
- Utilities: `src/utils/`
49+
- Tests: `src/test/`
50+
51+
### Naming Conventions
52+
- Use PascalCase for classes and interfaces
53+
- Use camelCase for functions, methods, and variables
54+
- Use descriptive names that clearly indicate purpose
55+
- Prefix private members with underscore if needed for clarity
56+
57+
### Copyright Headers
58+
All TypeScript source files MUST include the Microsoft copyright header at the very top of the file:
59+
```typescript
60+
// Copyright (c) Microsoft Corporation. All rights reserved.
61+
// Licensed under the MIT License.
62+
```
63+
64+
### TypeScript Guidelines
65+
- Use explicit types where possible, avoid `any`
66+
- Leverage VS Code API types from `vscode` module
67+
- Use `async/await` for asynchronous operations
68+
- Handle errors gracefully with try/catch blocks
69+
70+
### Azure YAML Language Features
71+
When working on `azure.yaml` language support in `src/language/`:
72+
- Use YAML parser from `yaml` package
73+
- Provide helpful diagnostics with clear error messages
74+
- Use `vscode.l10n.t()` for all user-facing strings
75+
- Test with various `azure.yaml` configurations
76+
77+
### Testing
78+
- Write unit tests for new features in `src/test/suite/unit/`
79+
- Use Mocha for test framework
80+
- Use Chai for assertions
81+
- Mock VS Code APIs when necessary using Sinon
82+
- Keep tests focused and isolated
83+
84+
## Common Tasks
85+
86+
### Adding a New Command
87+
1. Create command handler in `src/commands/`
88+
2. Register in `src/commands/registerCommands.ts`
89+
3. Add to `package.json` contributions
90+
4. Add localized strings to `package.nls.json`
91+
5. Update README.md with new command documentation
92+
6. Add tests for the command
93+
94+
### Adding Language Features
95+
1. Create provider in `src/language/`
96+
2. Register in `src/language/languageFeatures.ts`
97+
3. Test with various `azure.yaml` files
98+
4. Add diagnostics tests in `src/test/suite/unit/`
99+
100+
### Debugging the Extension
101+
- Press F5 to launch Extension Development Host
102+
- Set breakpoints in TypeScript source
103+
- Use Debug Console for logging
104+
- Check Output > Azure Developer CLI for extension logs
105+
106+
## VS Code Extension APIs
107+
- Follow [VS Code Extension API](https://code.visualstudio.com/api) best practices
108+
- Use `@microsoft/vscode-azext-utils` for Azure extension utilities
109+
- Integrate with Azure Resources API via `@microsoft/vscode-azureresources-api`
110+
- Use localization with `vscode.l10n.t()` for all user-facing text
111+
112+
## Performance Best Practices
113+
114+
### Activation & Startup
115+
- **Minimize activation time**: Keep `activate()` function lightweight
116+
- Use **lazy activation events** - be specific with `activationEvents` in package.json
117+
- Avoid synchronous file I/O during activation
118+
- Defer expensive operations until they're actually needed
119+
- Use `ExtensionContext.subscriptions` for proper cleanup
120+
121+
### Memory Management
122+
- **Dispose resources properly**: Always dispose of subscriptions, watchers, and providers
123+
- Use `vscode.Disposable` pattern for all resources that need cleanup
124+
- Avoid memory leaks by unsubscribing from events when no longer needed
125+
- Clear caches and collections when they grow too large
126+
- Use weak references where appropriate
127+
128+
### Asynchronous Operations
129+
- **Never block the main thread**: Use async/await for all I/O operations
130+
- Use `Promise.all()` for parallel operations when possible
131+
- Implement proper cancellation using `CancellationToken`
132+
- Debounce frequent operations (e.g., text document changes)
133+
- Use background workers for CPU-intensive tasks
134+
135+
### Tree Views & Data Providers
136+
- Implement efficient `getChildren()` - return only visible items
137+
- Cache tree data when appropriate to avoid redundant queries
138+
- Use `vscode.EventEmitter` efficiently - only fire events when data actually changes
139+
- Implement `getTreeItem()` to be synchronous and fast
140+
- Use `collapsibleState` wisely to control initial expansion
141+
142+
### Language Features
143+
- **Debounce document change events** (see `documentDebounce.ts`)
144+
- Use incremental parsing when possible
145+
- Cache parsed ASTs or syntax trees
146+
- Limit diagnostic computation to visible range when feasible
147+
- Return early from providers when results aren't needed
148+
149+
### File System Operations
150+
- Use `vscode.workspace.fs` API for better performance
151+
- Batch file operations when possible
152+
- Use `FileSystemWatcher` instead of polling
153+
- Avoid recursive directory scans in large workspaces
154+
- Cache file system queries with appropriate invalidation
155+
156+
### Commands & UI
157+
- Keep command handlers fast and responsive
158+
- Show progress indicators for long-running operations
159+
- Use `withProgress()` for operations that take >1 second
160+
- Provide cancellation support for long operations
161+
- Avoid multiple sequential `showQuickPick` or `showInputBox` calls
162+
163+
### Extension Size & Bundle
164+
- Minimize extension bundle size - exclude unnecessary dependencies
165+
- Use webpack to bundle and tree-shake code
166+
- Lazy load large dependencies only when needed
167+
- Consider code splitting for rarely-used features
168+
- Optimize images and assets
169+
170+
### Best Practices from This Codebase
171+
- Use `documentDebounce()` utility for text change events (1000ms delay)
172+
- Leverage `Lazy<T>` and `AsyncLazy<T>` for deferred initialization
173+
- Implement proper `vscode.Disposable` cleanup in all providers
174+
- Use telemetry to measure and track performance metrics
175+
- Follow the patterns in `src/views/` for efficient tree providers
176+
177+
### User Interface Best Practices
178+
- All user-facing strings shown in the UI, error messages, etc. must use `vscode.l10n.t()`
179+
- All user-facing strings in package.json must be extracted into package.nls.json
180+
- Instead of `vscode.window.showQuickPick`, use `IActionContext.ui.showQuickPick`
181+
- Instead of `vscode.window.showInputBox`, use `IActionContext.ui.showInputBox`
182+
- The same applies for `showWarningMessage`, `showOpenDialog`, and `showWorkspaceFolderPick`
183+
- FileSystemWatchers are a scarce resource on some systems - consolidate into shared watchers when possible
184+
185+
## Build & Package
186+
- Development build: `npm run dev-build`
187+
- Production build: `npm run build`
188+
- Watch mode: `npm run watch`
189+
- Package extension: `npm run package`
190+
- CI build: `npm run ci-build`
191+
- CI package: `npm run ci-package`
192+
193+
## Additional Resources
194+
- [Azure Developer CLI Documentation](https://learn.microsoft.com/azure/developer/azure-developer-cli/)
195+
- [VS Code Extension API](https://code.visualstudio.com/api)
196+
- [Contributing Guide](../CONTRIBUTING.md)

ext/vscode/.gitignore

Lines changed: 3 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -110,3 +110,6 @@ node_modules
110110
package.nls.*.json
111111
*.vsix
112112
*.zip
113+
114+
# Source maps
115+
*.js.map

ext/vscode/.vscode/cspell-dictionary.txt

Lines changed: 28 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -13,3 +13,31 @@ containerapp
1313
staticwebapp
1414
devcenter
1515
processutils
16+
azurecontainerapps
17+
azurefunctions
18+
azurestorage
19+
eastus
20+
mystorageaccount
21+
mycosmosdb
22+
azext
23+
prerestore
24+
postrestore
25+
preprovision
26+
postprovision
27+
predeploy
28+
postdeploy
29+
invalidhost
30+
unknownkeyword
31+
aicollection
32+
webapps
33+
reactjs
34+
azuresql
35+
azuredb
36+
retval
37+
LOCALAPPDATA
38+
ellismg
39+
networkidle
40+
qbsearch
41+
mystorageacct
42+
aiapps
43+
itemprop

ext/vscode/.vscodeignore

Lines changed: 3 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -1,8 +1,11 @@
11
.azure-pipelines
22
.eslintignore
33
eslint.config.mjs
4+
.github/**
45
.vscode/**
56
.vscode-test/**
7+
FEATURE_IDEAS.md
8+
TESTING_GUIDE.md
69
node_modules/**
710
!node_modules/vscode-nls
811
out/**

ext/vscode/AGENTS.md

Lines changed: 69 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,69 @@
1+
# Agent Development Guide
2+
3+
A file for [guiding coding agents](https://agents.md/).
4+
5+
## Commands
6+
7+
- **Install dependencies:** `npm install`
8+
- **Build:** `npm run build`
9+
- **Lint:** `npm run lint`
10+
- **Spell Check:** `npx cspell "src/**/*.ts" --config .vscode/cspell.yaml`
11+
- **Unit Tests:** `npm run unit-test`
12+
- **Watch mode:** `npm run watch`
13+
- **Package extension:** `npm run package`
14+
15+
## Directory Structure
16+
17+
- Extension entry point: `src/extension.ts`
18+
- Commands: `src/commands/`
19+
- Language features: `src/language/` (IntelliSense, diagnostics, etc.)
20+
- Views & tree providers: `src/views/`
21+
- Utilities: `src/utils/`
22+
- Tests: `src/test/`
23+
- Constants: `src/constants/`
24+
- Services: `src/services/`
25+
26+
## Pre-Commit Checklist
27+
28+
**IMPORTANT**: Always run these checks before committing to avoid pipeline failures:
29+
30+
1. Run `npm run lint` and fix all issues
31+
2. Run `npx cspell "src/**/*.ts" --config .vscode/cspell.yaml` and fix spelling errors
32+
3. Run `npm run unit-test` and ensure all tests pass
33+
4. Update README.md if functionality changed
34+
5. Verify no merge conflict markers in code
35+
36+
**Testing Requirements**:
37+
- If you modify existing code, ensure related tests still pass
38+
- If you add new functionality, add corresponding unit tests
39+
- Add new words to `.vscode/cspell-dictionary.txt` if cspell flags valid technical terms
40+
41+
## Code Conventions
42+
43+
### Copyright Headers
44+
All TypeScript source files MUST include the Microsoft copyright header:
45+
```typescript
46+
// Copyright (c) Microsoft Corporation. All rights reserved.
47+
// Licensed under the MIT License.
48+
```
49+
50+
### Localization
51+
- All user-facing strings shown in the UI, error messages, etc. must use `vscode.l10n.t()`
52+
- All user-facing strings in package.json must be extracted into package.nls.json
53+
54+
### UI Best Practices
55+
- Instead of `vscode.window.showQuickPick`, use `IActionContext.ui.showQuickPick`
56+
- Instead of `vscode.window.showInputBox`, use `IActionContext.ui.showInputBox`
57+
- Same for `showWarningMessage`, `showOpenDialog`, and `showWorkspaceFolderPick`
58+
59+
### Resource Management
60+
- FileSystemWatchers are a scarce resource on some systems - use the shared `FileSystemWatcherService`
61+
- Dispose resources properly using `vscode.Disposable` pattern
62+
- Use `ExtensionContext.subscriptions` for cleanup
63+
64+
### Testing
65+
- Use Mocha for test framework
66+
- Use Chai for assertions
67+
- Mock VS Code APIs using Sinon
68+
- Keep tests focused and isolated
69+
- Use `UserCancelledError` from `@microsoft/vscode-azext-utils` for testing user cancellation scenarios

0 commit comments

Comments
 (0)