API Flow Navigator — Universal Code & API Tracer
A local, read-only VS Code extension for discovering API requests and candidate
backend routes. No server, API key, application execution, or telemetry.
Start
- Install the VSIX using Extensions → … → Install from VSIX.
- Open a trusted source workspace. The initial index starts automatically.
- Open API Flow Navigator in the Activity Bar.
- Put the cursor on a detected API line and run API Flow: Trace API.
- Run API Flow: Show Complete Flow to inspect candidate request → route links.
Without a selected API it displays the whole index. Click a node to open source;
drag to pan, use zoom/fit, or filter by endpoint, method or framework.
- Use API Flow: Inspect Request for available static metadata, and
API Flow: Show API Issues for diagnostics.
Example: axios.get('/api/students/12') is compatible with
router.get('/api/students/:id', listStudents). Matching considers method and path
segments. It remains probable, since service identity and runtime routing
cannot be proven. Multiple candidates are ambiguous. Dynamic URL expressions
remain unresolved, without inventing a URL. An absent match is informational:
the backend might live outside this workspace.
Implemented detection capabilities
All adapters use bounded source-text patterns, not compiler-grade semantics.
They tolerate incomplete files and require no language runtime. Each has a test.
| Adapter |
Recognized syntax |
| JavaScript / TypeScript |
fetch, axios/common named clients, Express app/router methods, Nest method decorators, Next App Router exported HTTP functions |
| PHP |
Laravel Route methods, Symfony Route attributes (unknown method) |
| Python |
FastAPI/Flask verb decorators, Django path/re_path (unknown method), requests/httpx |
| Java |
Spring verb Mapping annotations, JAX-RS Path (unknown method), Spring client calls |
| C# |
ASP.NET Http attributes, Map methods, named HttpClient async calls |
| Go |
Gin verb routes, net/http HandleFunc (unknown method), Get/Post/Head |
| Dart |
Named Dio/http client verb calls |
| Kotlin |
Ktor literal verb blocks, Retrofit verb annotations |
| Swift |
URL(string:) references (HTTP method unknown) |
| Ruby |
Rails literal verb route declarations |
| Rust |
Actix verb attributes, Axum route with verb handler |
| C/C++ |
cpp-httplib named server/client verb calls |
| HTML / Vue / Svelte |
form action/method, script HTTP calls |
| SQL |
Query table references, not HTTP routes |
| GraphQL |
Named operations, not HTTP endpoints |
| Other text languages |
Generic fetch and recognizable named HTTP client calls |
Literal single-file Express app.use('/prefix', router) is applied when unique.
The graph includes same-file declared handlers, lexical function calls, and literal
SQL query calls with operation/table labels. These links remain probable; they do
not prove runtime dispatch. Full cross-file
controller → service → model → database resolution is not implemented; the UI
shows indexed API candidates and the same-file lexical evidence available.
Limits and release status
This is a working initial release, not fulfillment of every advanced semantic
feature in the original specification. In particular: configuration-file framework
inference, language-service symbols, cross-file import/reference resolution,
controller prefixes, Rails resources, Laravel route groups, Axios instance baseURL,
Next Pages API dispatch, Django includes, inferred payload schemas,
provable duplicate-route diagnostics, and complete
service/database graphs remain future work. Declared TypeScript response types and named request body expressions are shown
when recognizable; header values are intentionally omitted. Unknown fields display
“Not statically available.” SQL/GraphQL entries are syntax references.
Matching ignores query strings and absolute URL origins when comparing paths;
therefore no cross-service match is called confirmed. Unsupported dynamic prefixes
may cause unresolved candidates. Source pattern matching can include comments or
string examples; always review evidence. Security warnings are focused heuristics,
not an audit. Values in credential-like URL parameters are redacted in index/UI.
Settings
Settings under apiFlow: autoIndex, diagnostics, generic, include, exclude,
maxBytes (512000), maxFiles (10000), adapters, and customRules.
A custom rule such as { "callee": "sdk.send", "kind": "request", "method": "POST" }
recognizes a literal URL in the first argument without executing a user regex. The folder scope is the open
multi-root workspace; generated/dependency directories are excluded by default.
The Refresh command rescans explicitly. Background file and unsaved document
updates are debounced. The initial scan supports cancellation. Analysis does not
read application files outside workspace roots, execute shell commands, call APIs,
or modify application source. Webviews use CSP, restricted resources and node-ID
message validation. Untrusted workspaces cannot activate the extension.
Build, test and package
Requires Node.js 22+ and npm for development only.
npm ci
npm run typecheck
npm run lint
npm test
npm run package
code --install-extension api-flow-navigator-0.1.0.vsix
Use F5 with the included Run Extension debug configuration to launch an Extension
Development Host. Test opening multiple folders, editing an unsaved API call,
creating/deleting source files, cancelling a scan, filtering the sidebar, and
clicking graph nodes. Run npm run test:host to launch an isolated VS Code test profile (set VSCODE_CLI
if the CLI is not at the default location). Automated tests cover extraction, fixtures, matching,
redaction, positions, index replacement/deletion and configured limits. The separate Extension Host test verifies activation, scan, navigation, unsaved
updates and opening the flow command. Visual appearance and pointer interaction
still require manual review.
The publisher is configured as hamzadev, matching the owner-provided Marketplace
publisher. Before publishing, add your repository metadata and review the MIT
license choice, then:
npx vsce login hamzadev
npx vsce publish
The extension identifier is hamzadev.api-flow-navigator. Upload the generated
VSIX under the hamzadev publisher. Repository metadata still requires owner configuration.
