This document explains how to test the explorer functionality in the Slingr VS Code extension. The tests are designed to ensure that the explorer correctly displays models from the src/data folder and provides proper navigation and interaction capabilities.
Tests the ExplorerProvider class in isolation using mock data:
- Root Level Items: Tests that the explorer shows the correct root structure
- Data Root Children: Tests that models are properly loaded from the cache
- Model Children: Tests that model fields are displayed correctly
- Tree Item Properties: Tests tree item creation and properties
- Drag and Drop: Tests field reordering functionality
- Cache Integration: Tests cache update event handling
Tests the MetadataCache class functionality:
- Cache Initialization: Tests that the cache initializes without errors
- Data Model Methods: Tests
getDataModels()andgetDataModelClasses()methods - Event Handling: Tests the
onDidUpdateevent - findMetadata Method: Tests the metadata search functionality
- Ensure VS Code is installed
- Install dependencies:
npm install - Compile the extension:
npm run compile
npm test- Open the project in VS Code
- Go to Run and Debug view (Ctrl+Shift+D)
- Select test configuration:
- "Run Extension Tests": Runs all tests
- "Run Explorer Tests Only": Runs only explorer-related tests
- Press F5 to run
# Run all tests
npm run test
# Run with specific pattern
npm run test -- --grep "Explorer"Unit tests use mock data and don't require real files. They test:
- Mock models with
@Modeldecorators - Mock properties with
@Fielddecorators - Mock cache responses
- Correct Tree Structure: Verifies the explorer shows "Data" root with models underneath
- Model Loading: Ensures only data models (from
src/data/) are shown - Field Display: Confirms model fields are properly displayed
- Navigation: Tests that clicking items navigates to the correct code location
- Drag & Drop: Verifies field reordering works correctly
- File Discovery: Ensures cache finds TypeScript files in
src/data/ - Decorator Parsing: Verifies
@Modeland@Fielddecorators are correctly parsed - Data Model Flag: Confirms
isDataModelflag is set correctly - Update Events: Tests that file changes trigger cache updates
-
No models found:
- Check that
src/data/directory exists - Verify model files have
@Modeldecorators - Ensure
tsconfig.jsonis properly configured
- Check that
-
Tests timeout:
- Increase timeout in test configuration
- Check that cache initialization completes
- Verify VS Code test environment is set up correctly
-
Import errors:
- Ensure all dependencies are installed
- Check that compiled JavaScript files exist in
out/directory - Verify TypeScript compilation succeeded
Use the VS Code debugger with the test configurations:
- Set breakpoints in test files or source code
- Use "Run Explorer Tests Only" for focused debugging
- Check the Debug Console for detailed output
- Add unit tests to
explorer.test.ts - Create mock data for new functionality
- Test both success and error cases
- Add tests to
cache.test.ts - Test with both real and mock data
- Verify event handling and performance