Skip to main content
The Sonamu Extension integrates with the Naite test framework to provide various development support features.

Naite Key Autocomplete

When typing Naite.t(", Naite.del(", Naite.get(", all Naite keys in the project are autocompleted.

How It Works

The Extension scans all TypeScript files in the workspace and collects keys used in Naite.t() calls. This key list is provided as autocomplete candidates.

Key Navigation

You can quickly jump to definition and reference locations from Naite key strings.

Go to Definition

  • Shortcut: F12
  • Action: Jump to Naite.t("key") location

Go to References

  • Shortcut: Shift+F12
  • Action: Display list of Naite.get("key"), Naite.del("key") locations

Cmd+Click

Cmd+Click behavior depends on VS Code settings and jumps to definition or references:
  • editor.gotoLocation.multipleDefinitions: Behavior when multiple definitions exist
  • editor.gotoLocation.multipleReferences: Behavior when multiple references exist

Key Highlighting

Applies visual decoration to Naite key strings for easy identification in code.

Settings

Enable/disable with sonamu.naite.decoration.enabled, and change style with sonamu.naite.decoration.style:
  • underline (default)
  • bold
  • italic
  • underline bold
  • underline italic
  • none

Hover Information

Hover over a Naite key to display usage information for that key.
Hover Information

Inline Value Display

After running tests, displays recorded values inline next to Naite.t() calls.
Naite.t("result", data);  // → { id: 1, name: "test" }

Settings

  • sonamu.naite.runtimeValue.enabled: Enable/disable feature (default: true)
  • sonamu.naite.runtimeValue.maxLength: Maximum length of displayed value (default: 50)
Long values are automatically truncated.

Naite Trace Viewer

A dedicated viewer to check all values recorded with Naite.t() during test execution in real-time.

Opening

Run Sonamu: Open Naite Trace Viewer from the Command Palette, or it opens automatically when running tests.

Key Features

Grouping by Test Traces are displayed grouped by test suite and case.
Grouping by Test
Trace Information Display Each trace includes the following information:
  • Key name
  • Recorded value (JSON format)
  • File path and line number
  • Recording time
Jump to Code Location Click a trace to jump to that Naite.t() call location.
Search Feature Search by key or value within the Trace viewer.
Follow Mode When selecting a Naite call in code, the Trace Viewer automatically scrolls to that item.

Vitest Setup

To display test case line numbers, set includeTaskLocation: true in vitest.config.ts:
export default defineConfig({
  test: {
    includeTaskLocation: true,
  },
});
Search for Naite keys in Workspace Symbol Search.
  • Shortcut: Cmd+T
  • Usage: Type key name to find all usage locations

Undefined Key Warnings

Displays warnings when Naite.get() or Naite.del() references a key that hasn’t been defined with Naite.t(). Warnings can be viewed in the VS Code Problems panel (Cmd+Shift+M).
Undefined Key Warnings
This feature is useful for quickly finding typos or missing keys.

View Container

The Extension adds a “Naite” View Container to the panel area.
Naite View Container
You can quickly check Trace information from this panel.

Status Bar Messages

Displays notification messages in the status bar when Naite tracker actions occur (key add, delete, etc.). Enable/disable with sonamu.naite.statusBarMessages.enabled setting (default: true).