🎯 Test Coverage Explorer
Visualize your code coverage with Microsoft-style highlighting! 🚀
Transform your testing workflow with interactive coverage visualization directly in VS Code. Beautiful tree views, Microsoft-style coverage decorations, and real-time updates for Go and JavaScript/TypeScript projects.
✨ Key Features
- 🌳 Hierarchical Tree View - Navigate coverage data like your file explorer
- 🎨 Microsoft-Style Highlighting - Exact color matching with golang/vscode-go
- ⚡ Real-time Updates - Auto-refresh when coverage files change
- 🎯 Smart Highlighting - Visual coverage indicators with hit counts
- 🔧 Multi-format Support - Go coverage.out and JavaScript LCOV formats
🚀 Supported Languages
| Language |
Format |
File Pattern |
Example |
| Go |
coverage.out |
**/coverage.out |
coverage.out |
| JavaScript/TypeScript |
LCOV |
**/lcov.info |
coverage/lcov.info |
| JavaScript/TypeScript |
JSON |
**/coverage.json |
coverage/coverage.json |
📦 Quick Start
1. Install Extension
code --install-extension wmejia.test-coverage-explorer
2. Generate Coverage
# Go
go test -coverprofile=coverage.out ./...
# JavaScript with Jest
npm test -- --coverage
# JavaScript with NYC
nyc npm test
3. Explore Coverage
Open VS Code and look for the "TEST COVERAGE" panel in Explorer sidebar.
🎨 Color Customization
Personalize your coverage colors in VS Code settings:
{
"testCoverage.colors.covered": "rgba(76, 175, 80, 0.2)",
"testCoverage.colors.uncovered": "rgba(244, 67, 54, 0.2)",
"testCoverage.colors.partial": "rgba(255, 152, 0, 0.2)"
}
Popular Themes:
- Subtle: Use 0.1 alpha for light highlighting
- High Contrast: Use solid hex colors like
#4CAF5050
- Dark Theme: Use brighter colors with lower alpha
⚙️ Configuration
| Setting |
Default |
Description |
testCoverage.coverageFiles |
["**/coverage.out", "**/lcov.info", "**/coverage.json"] |
Coverage file patterns |
testCoverage.showInlineCoverage |
true |
Show coverage decorations |
testCoverage.showHitCounts |
true |
Show execution counts |
testCoverage.colors.covered |
rgba(76, 175, 80, 0.2) |
Covered lines color |
testCoverage.colors.uncovered |
rgba(244, 67, 54, 0.2) |
Uncovered lines color |
🎮 Commands
- Refresh Coverage - Manual refresh
- Run All Tests - Execute tests and refresh
- Toggle Highlights - Show/hide decorations
- Toggle Hit Counts - Show/hide execution counts
📊 Coverage Indicators
- 🟢 Green (≥80%) - Excellent coverage
- 🟡 Yellow (50-79%) - Good coverage
- 🔴 Red (<50%) - Needs improvement
- ⚪ Gray (0%) - No coverage
💡 Tips
- Enable auto-refresh for real-time feedback
- Customize colors to match your theme
- Use hit counts to identify hot paths
- Focus on critical code rather than 100% coverage
🐛 Troubleshooting
Coverage not showing?
- Verify coverage files exist in workspace
- Check file patterns in settings
- Look for errors in Developer Console
Colors not updating?
- Settings update automatically
- Try "Refresh Coverage" command if needed
📋 Requirements
- VS Code 1.60.0+
- Coverage files in supported formats
🤝 Contributing
Contributions welcome! See our GitHub repository for guidelines.
📄 License
MIT License - see LICENSE file.
👨💻 Author
William Mejia - @wmejia
Happy testing! 🎯
