Skip to content
| Marketplace
Sign in
Visual Studio Code>Testing>Test Navigator - Jump to Test/ImplementationNew to Visual Studio Code? Get it now.
Test Navigator - Jump to Test/Implementation

Test Navigator - Jump to Test/Implementation

Harsh Joshi

|
1 install
| (0) | Free
Instantly jump between source files and tests with one keyboard shortcut. Works with any test framework and language.
Installation
Launch VS Code Quick Open (Ctrl+P), paste the following command, and press enter.
Copied to clipboard
More Info

Test Navigator - Jump to Test/Implementation

Stop wasting time searching for test files. Navigate between implementation and test files instantly with a single keyboard shortcut.

The Problem

As developers, we spend 20+ minutes every day using Cmd+P to search for test files:

  • "Where did I put that test file?"
  • "Was it Button.test.tsx or Button.spec.tsx?"
  • "Is it in __tests__ or tests/?"

The Solution

Test Navigator provides instant navigation between source files and their tests with:

  • ✨ One keyboard shortcut: Cmd+Shift+T (Mac) or Ctrl+Shift+T (Windows/Linux)
  • 🎯 Smart pattern matching: Works with any test framework and language
  • 🚀 Zero configuration: Works out of the box
  • 🧠 Intelligent test creation: Auto-generates test files with proper templates

Features

🔥 Instant Jump Navigation

Press Cmd+Shift+T to:

  • Jump from implementation → test file
  • Jump from test file → implementation
  • Create test file if it doesn't exist (with template!)

🌍 Multi-Language Support

Works seamlessly with:

  • JavaScript/TypeScript (Jest, Vitest, Mocha)
  • Python (pytest, unittest)
  • Go (go test)
  • Rust (cargo test)
  • Java (JUnit)
  • Ruby (RSpec)
  • C# (xUnit, NUnit)

🎨 Smart Pattern Recognition

Automatically recognizes common test patterns:

JavaScript/TypeScript:

src/components/Button.tsx ↔ src/components/Button.test.tsx
src/components/Button.tsx ↔ src/components/__tests__/Button.test.tsx
src/utils/helper.ts ↔ tests/utils/helper.spec.ts

Python:

myapp/models/user.py ↔ tests/test_user.py
myapp/models/user.py ↔ myapp/tests/test_user.py

Go:

pkg/auth/service.go ↔ pkg/auth/service_test.go

And many more! See Supported Patterns for the full list.

📊 Status Bar Indicator

Always know your test status at a glance:

  • 🧪 Jump to Test - Test file exists
  • ➕ Create Test - No test file (click to create)
  • 📝 Jump to Implementation - Currently in test file

🎯 Multiple Test Files Support

Working with unit, integration, and e2e tests? No problem:

Button.test.tsx (unit)
Button.integration.test.tsx (integration)
Button.e2e.test.tsx (e2e)

Test Navigator shows all matches and lets you pick which one to open.

✍️ Smart Test Creation

When no test exists, Test Navigator:

  1. Shows multiple location options
  2. Creates the test file with proper template
  3. Opens the file with cursor at the right position

Templates include:

  • Proper imports for your test framework
  • Basic test structure
  • Language-specific conventions

Installation

  1. Open VS Code
  2. Press Cmd+Shift+X to open Extensions
  3. Search for "Test Navigator"
  4. Click Install

Or install from the command line:

code --install-extension Josharsh.test-navigator

Usage

Basic Commands

Command Keybinding Description
Jump to Test/Implementation Cmd+Shift+T / Ctrl+Shift+T Toggle between source and test
Create Test File - Force create a new test file
Open All Tests - Open all related test files
Copy Test Path - Copy test file path to clipboard

Quick Start

  1. Open any source file (e.g., Button.tsx)
  2. Press Cmd+Shift+T (Mac) or Ctrl+Shift+T (Windows/Linux)
  3. If test exists → Opens test file
  4. If no test exists → Shows creation menu
  5. Select location and template
  6. Start writing tests!

Status Bar

Click the status bar indicator to quickly jump or create tests without using keyboard shortcuts.

Configuration

Customize Test Navigator in your settings:

{
  // Patterns that identify test files
  "testNavigator.testFilePatterns": [
    ".test.",
    ".spec.",
    "_test.",
    "Test."
  ],

  // Where to create new test files
  "testNavigator.preferredTestLocation": "ask", // "ask" | "sameDirectory" | "testsSubfolder" | "testsRoot"

  // Show status bar indicator
  "testNavigator.enableStatusBar": true,

  // Auto-open test file after creation
  "testNavigator.autoOpenOnCreate": true,

  // Custom test patterns (advanced)
  "testNavigator.customPatterns": [
    {
      "source": "src/**/*.ts",
      "test": "tests/**/*.spec.ts"
    }
  ]
}

Supported Patterns

JavaScript/TypeScript

✅ Same directory:

  • src/Button.tsx ↔ src/Button.test.tsx
  • src/Button.tsx ↔ src/Button.spec.tsx

✅ Nested __tests__:

  • src/components/Button.tsx ↔ src/components/__tests__/Button.test.tsx

✅ Parallel tests/ directory:

  • src/components/Button.tsx ↔ tests/components/Button.test.tsx

✅ Root __tests__:

  • src/components/Button.tsx ↔ __tests__/components/Button.test.tsx

Python

✅ Root tests:

  • myapp/user.py ↔ tests/test_user.py

✅ Module tests:

  • myapp/models/user.py ↔ myapp/tests/test_user.py

✅ Parallel structure:

  • src/utils/helper.py ↔ tests/utils/test_helper.py

Go

✅ Same directory:

  • pkg/auth/service.go ↔ pkg/auth/service_test.go

Rust

✅ Tests directory:

  • src/parser.rs ↔ tests/parser_test.rs

Java

✅ Maven/Gradle structure:

  • src/main/java/com/app/User.java ↔ src/test/java/com/app/UserTest.java

Ruby

✅ RSpec:

  • lib/user.rb ↔ spec/user_spec.rb
  • app/models/user.rb ↔ spec/models/user_spec.rb

C#

✅ Standard structure:

  • src/Services/UserService.cs ↔ tests/Services/UserServiceTests.cs
  • MyApp/User.cs ↔ MyApp.Tests/UserTests.cs

Tips & Tricks

Tip 1: Use with TDD

Keep Cmd+Shift+T at your fingertips when doing TDD. Switch between test and implementation in milliseconds.

Tip 2: Multiple Test Files

Create separate test files for unit, integration, and e2e tests. Test Navigator will find them all.

Tip 3: Custom Patterns

Have a unique project structure? Add custom patterns in settings to make Test Navigator work with your setup.

Tip 4: Status Bar Quick Access

Prefer clicking? The status bar indicator is always one click away from your test files.

FAQ

Q: Does this work with my test framework? A: Yes! Test Navigator is framework-agnostic. It works with Jest, Vitest, Mocha, pytest, RSpec, JUnit, and any other test framework.

Q: Can I customize the test file templates? A: Currently, Test Navigator provides sensible defaults for each language. Custom templates are planned for a future release.

Q: What if my project has a unique structure? A: Use the customPatterns setting to define your own source-to-test mappings.

Q: Does this work in Cursor? A: Yes! Test Navigator works perfectly in both VS Code and Cursor.

Q: The extension can't find my tests. What should I do? A: Check your testFilePatterns setting and add any custom patterns your project uses.

Known Issues

  • Custom template support is not yet available (coming soon)
  • Some edge cases with symlinked directories may not work correctly

Roadmap

  • [ ] Custom test templates
  • [ ] Project-specific configuration files
  • [ ] Test framework detection and optimal template selection
  • [ ] Run tests directly from status bar
  • [ ] Test coverage indicators

Contributing

Found a bug or have a feature request? Please open an issue.

Release Notes

See CHANGELOG.md for detailed release notes.

License

MIT License - see LICENSE file for details.


Made with ❤️ by Harsh Joshi

If this extension saves you time, consider giving it a ⭐ on the VS Code Marketplace!

  • Contact us
  • Jobs
  • Privacy
  • Manage cookies
  • Terms of use
  • Trademarks
© 2025 Microsoft