Key Tracer — VSCode Extension
✨ Effortlessly find and copy the full path of JSON keys with a simple hover!
✨ Features
- 🔍 Shows the full path of JSON keys when hovering over them
- 📋 One-click copy of the full path to clipboard
- ⚙️ Customizable path delimiter (default: '.')
- 🎯 Accurate path finding for nested JSON structures
- 🧪 Comprehensive test coverage
📥 Installation
- Open the Extensions view in Visual Studio Code (
Cmd+Shift+X
or Ctrl+Shift+X
).
- Search for Key Tracer and click Install.
- Once installed, the extension is ready to use!
🚀 Usage
- Open any JSON file in VS Code.
- Hover over any JSON key to see its full path.
- Click on the "Copy Path" link in the hover to copy the path to your clipboard.
💡 Example
For a JSON file like this:
{
"parent": {
"child": {
"target": "value"
}
}
}
When you hover over the "target" key, you'll see:
Full Path: parent.child.target
[Copy Path]
Clicking "Copy Path" will copy parent.child.target
to your clipboard.
⚙️ Configuration
You can customize the delimiter used in the path:
- Open VS Code Settings (
Cmd+,
or Ctrl+,
).
- Search for "Key Tracer".
- Modify the "Delimiter" setting to use your preferred separator (default: '.').
🛠️ Development
Project Structure
key-tracer/
├── src/
│ ├── extension.ts # Main extension code
│ └── test/ # Test files
│ ├── mock/ # VS Code API mocks
│ └── suite/ # Test suites
├── package.json # Extension manifest
└── tsconfig.json # TypeScript configuration
Testing
The extension uses Mocha for testing with a custom VS Code API mock. Tests are located in src/test/suite/
.
To run tests:
npm test
Building
npm run compile # Compile the extension
npm run watch # Watch mode for development
npm run lint # Run ESLint
📜 License
This project is licensed under the MIT License. See the LICENSE file for more details.