Skip to content
| Marketplace
Sign in
Visual Studio Code>Other>Tiny Owl KitNew to Visual Studio Code? Get it now.
Tiny Owl Kit

Tiny Owl Kit

Tiny Owl Kit

|
1 install
| (0) | Free
See your Tiny Owl Kit project's errors and incidents right in the editor
Installation
Launch VS Code Quick Open (Ctrl+P), paste the following command, and press enter.
Copied to clipboard
More Info

Tiny Owl Kit — VS Code Extension

See your Tiny Owl Kit project's errors, warnings, and recent events right in the editor, without leaving VS Code.

Status: Published on the VS Code Marketplace and Open VSX — status bar indicator, sidebar tree view, and an in-editor master-detail workbench (Monitor + Logs + Traces tabs) are all functional, sharing a single poll/cache source; keyboard/a11y-polished; CI covers lint/typecheck/test/audit/secret-scan/.vsix inspection. See task 017 plan-v2.

Requirements

  • A Tiny Owl Kit backend with READ_KEY_ENABLED=true (currently a dogfood-only flag).
  • A read key minted for your project via npm run readkey:mint in tiny-owl-backend (there is no in-product UI to generate one yet).

Features

  • Status bar — live error/warning counts for the active project over the selected time window, with a throttled spike notification and key-expiry warnings. Clicking it opens the in-editor workbench, never the browser.
  • Sidebar view — a dedicated "Tiny Owl Kit" activity-bar container with a "Recent Events" tree. Primary actions live in the view toolbar (and the ⋯ overflow menu); you do not need the Command Palette for day-to-day use. Clicking an event reveals it in the workbench's Logs tab.
  • In-editor workbench (Tiny Owl: Show Dashboard) — a hardened, strict-CSP master-detail panel: a Monitor tab (severity counts, error rate, severity mix, error-spike indicator), a Logs tab (filterable/searchable event list
    • a detail pane with message/severity/timestamp/trace id), and a Traces tab that reconstructs a traceId's end-to-end flow as an oldest-first timeline (e.g. a checkout: cart.created → payment.authorized → order.confirmed, or the exact step that failed) — reachable via "View flow" on any event that has a trace id, or by pasting one directly. context/ requestMeta only appear when the project owner opted in server-side, and stay hidden behind a per-field "Reveal" even then. The browser only opens via the explicit "Open in Web ↗" action.
  • Copy for AI — turns an event into a redacted, prompt-ready Markdown block. For context-enabled projects it includes the redacted context by default; IP/user-agent (requestMeta) is never included unless you explicitly tick "include IP/user-agent (PII)" for that copy. Prefer the leanest possible clipboard content? Tiny Owl: Copy for AI (summary only) always omits context.

Sidebar controls

Open the owl icon in the activity bar → Recent Events. The view title bar exposes:

Toolbar icon Action
+ Add Project
swap Switch Project
history Change Time Window
dashboard Show Dashboard (in-editor)
refresh Refresh

The view ⋯ menu also has Open Web Dashboard, Remove Project, and Open Settings (poll interval, dashboard base URL). Command Palette entries remain available under the Tiny Owl category.

Commands

Command Description
Tiny Owl: Add Project Paste a read key + project id to start tracking a project. The key is verified against the backend before being stored.
Tiny Owl: Remove Project Stop tracking a project and delete its stored read key.
Tiny Owl: Switch Project Change which added project is shown for the current workspace.
Tiny Owl: Change Time Window Change the look-back window (24h / 7d / 14d / 30d) used for stats.
Tiny Owl: Refresh Refresh the "Recent Events" sidebar view.
Tiny Owl: Open Web Dashboard Open the full web dashboard in the browser (deep-links to the active project).
Tiny Owl: Show Dashboard Open the in-editor master-detail workbench (Monitor + Logs + Traces tabs).
Tiny Owl: Copy for AI Copy a redacted, prompt-ready Markdown block for a selected event (includes context by default when the project has it enabled).
Tiny Owl: Copy for AI (summary only) Same, but always omits context — the leanest possible clipboard content.
Tiny Owl: Open Settings Open this extension's settings in the VS Code Settings UI.

"Open in Web Dashboard" (event context menu) deep-links to that specific event/trace in the browser — the only path that leaves the editor for a single event.

Security

  • Read keys are stored only in VS Code's SecretStorage (OS keychain) — never in settings, workspaceState, or logs.
  • Read keys are read-only and project-scoped; they cannot write events or access any other project.
  • All API responses are treated as untrusted display data.
  • See SECURITY.md for the full threat model, including how context/requestMeta rendering and Copy-for-AI are contained, and how to report a vulnerability.
  • The master list is fully keyboard-navigable (Tab between rows, Enter/Space to open the detail pane).

CI

Every push/PR runs type-check, lint, a repo-specific secret scan (towl_<type>_<hex> and a few other high-signal shapes, excluding the intentional test fixtures in src/test/**), the extension test suite, npm audit, and a .vsix packaging + inspection step (see .github/workflows/ci.yml).

Release

Releases are fully automated and version-driven, mirroring the SDKs:

  1. Bump version in package.json and update CHANGELOG.md.
  2. Merge to main → release.yml checks whether v<version> is already tagged and whether that version is already live on the Marketplace and on Open VSX.
  3. For anything still missing, it runs the full CI suite, packages the .vsix, tags v<version>, and publishes to whichever registry (or both) doesn't have that version yet.

No manual vsce publish / ovsx publish is needed. The workflow is idempotent — re-running it (e.g. via workflow_dispatch) after a partial failure only retries the registry that didn't succeed.

Setup requirements (one-time, done by a maintainer):

  • VSCE_PAT repo secret — an Azure DevOps PAT scoped to Marketplace ▸ Manage, for the tinyowlkit publisher.
  • OVSX_PAT repo secret — an Open VSX access token for the tinyowlkit namespace.

Development

npm install
npm run watch   # esbuild + tsc in watch mode

Press F5 in VS Code to launch an Extension Development Host.

Following extension guidelines

Ensure that you've read through the extensions guidelines and follow the best practices for creating your extension.

  • Extension Guidelines

Working with Markdown

You can author your README using Visual Studio Code. Here are some useful editor keyboard shortcuts:

  • Split the editor (Cmd+\ on macOS or Ctrl+\ on Windows and Linux).
  • Toggle preview (Shift+Cmd+V on macOS or Shift+Ctrl+V on Windows and Linux).
  • Press Ctrl+Space (Windows, Linux, macOS) to see a list of Markdown snippets.

For more information

  • Visual Studio Code's Markdown Support
  • Markdown Syntax Reference

Enjoy!

  • Contact us
  • Jobs
  • Privacy
  • Manage cookies
  • Terms of use
  • Trademarks
  • Your Privacy Choices
  • Consumer Health Privacy
© 2026 Microsoft