Contributor: Ruchi Pakhle
Organization: AsyncAPI Initiative
Project: VS Code Extension Maintainership – Web Extension Compatibility
Duration: May–November 2025
The goal of my Google Summer of Code (GSoC) 2025 project was to extend the AsyncAPI VS Code Preview extension to make it compatible with the VS Code Web environment (vscode.dev, github.dev, and local browser hosts).
This involved refactoring the extension to remove Node.js–dependent modules, modernizing its build pipeline, and enabling it to run natively as a web extension — allowing users to preview AsyncAPI documents directly in their browsers without needing a desktop installation.
- Implemented complete support for VS Code Web mode:
- Replaced Node APIs (
fs,path) with browser-safe utilities (pathUtilsandvscode.workspace.fs). - Removed incompatible dependencies such as
node-fetch,@asyncapi/edavisualiser, and@asyncapi/parser. - Added
"browser"entry and updated build configurations to use@vscode/test-webfor local browser testing. - Verified compatibility using
npm run open-in-browseronlocalhost:8082.
- Replaced Node APIs (
- Feature PR: #286 – Add webmode compatibility
- Cleaned up the build pipeline to support both desktop and web extension builds.
- Added
.vscodeignoreand refined output bundling forvsce package. - Packaged and tested
.vsixinstallation across:- Desktop VS Code
- Browser (
vscode.devandgithub.dev) hosts.
- Reviewed open pull requests and issues, triaging community contributions.
- Managed release readiness and documentation updates.
- Added as maintainer in the CODEOWNERS file for the repository.
→ Maintainer activity PR
- Coordinated and prepared the release version that introduces web compatibility.
- PRs involved in release preparation and updates:
- Drafted updated
README.mdexplaining:- What “web extension compatibility” means.
- How end users can run the extension in browser mode (
vscode.dev,github.dev, or local host).
- Authored a dedicated AsyncAPI blog post explaining the release, rationale, and community impact:
- Deep understanding of VS Code extension architecture and the difference between Node and Web extension hosts.
- Experience with packaging and testing using
@vscode/test-webandvsce. - Enhanced skills in TypeScript, Webpack, and extension lifecycle management.
- Hands-on experience in maintainership, community review, and project communication.
| Category | Link |
|---|---|
| Repository | asyncapi/vs-asyncapi-preview |
| Feature PR – Web Mode | #286 |
| Release PRs | #292, #294 |
| Maintainer Activity | #281 |
| Blog PR | #4484 |
The AsyncAPI VS Code Preview extension can now run fully in the browser (vscode.dev and github.dev), dramatically improving accessibility for open-source contributors, documentation writers, and engineers exploring AsyncAPI files directly from GitHub repositories.
This marks a significant step toward AsyncAPI’s goal of making its ecosystem tools more cloud-native and developer-friendly.
A short demo showcasing the web extension running locally and in browser mode will be included in the AsyncAPI blog post and README update.
(Recording: shows .vsix installation, YAML file preview, and live rendering inside browser-based VS Code.)
Mentors:
Contributor: Ruchi Pakhle
Organization: AsyncAPI Initiative
💡 This project was completed under Google Summer of Code 2025 as part of AsyncAPI’s VS Code Extension Maintainership track.