VSCode拡張機能の右クリックメニュー項目を設定で非表示にできるようにする #TypeScript

はじめに

拡張機能を開発する人向けの記事です
拡張機能で追加している右クリックメニューを、設定で非表示にできるようにします

概要

やり方の概要は以下。

メニューの表示条件 (when clause) に独自のコンテキストキーを指定する
bool型の設定値を用意する
起動時と設定変更時に設定値を読む
設定値に合わせて独自のコンテキストキーの値を変更する
この例は独自コンテキストを true にする場合
```
vscode.commands.executeCommand('setContext', '(独自のコンテキストキー)', true);
```

when clause に独自のコンテキストキーを指定する

package.json のメニュー項目を記載している箇所のwhen句で、独自のコンテキストキーが true の場合に表示するように指定する。

独自のコンテキストキーは任意の文字列でよいが、他の拡張機能や標準のコンテキストキーとかぶらないユニークな文字列にしたほうがよい。
作成した拡張機能では、(拡張機能名).(コンテキスト名) にした。

bool型の設定値を用意する

package.json の contribution - configuration - properties に bool型の設定値を用意する。

この値が true の時にはメニュー項目を表示、false なら非表示になるようにする。

起動時と設定変更時に設定値を読む

起動時は activate メソッドが呼び出されたとき。
設定変更時はイベントハンドラを登録する。

import { commands, ConfigurationChangeEvent, ExtensionContext, workspace } from 'vscode';

export function activate(context: ExtensionContext) {
    /* (中略) */

    // 設定値に合わせてカスタムコンテキストキーの値を更新する
    updateContextState();

    // 設定変更時のイベントハンドラを登録
    context.subscriptions.push(
        workspace.onDidChangeConfiguration((event) => this.onDidChangeConfiguration(event))
    );
}

// 設定変更時のイベントハンドラ
function onDidChangeConfiguration(event: ConfigurationChangeEvent): void {
    for (const service of this.contextServices) {
        // 設定値に合わせてカスタムコンテキストキーの値を更新する
        updateContextState();
    }
}

// 設定値に合わせてカスタムコンテキストキーの値を更新する
function updateContextState() {
    let state = <boolean>workspace.getConfiguration("markdowntable.showMenu").get("format");
    commands.executeCommand('setContext', "markdowntable.contextkey.config.showMenu", state);
}

設定値に合わせて独自のコンテキストキーの値を変更する

上の例で書いてしまいましたが、
設定の読み込みは workspace.getConfiguration(セクション名).get(項目名) で行います。

    let state = <boolean>workspace.getConfiguration("markdowntable.showMenu").get("format");

セクション名には設定項目キーの . より前部分を指定します。項目名には設定項目キーの . より後部分を指定します。
設定項目キーが markdowntable.showMenu.format なら、セクション名はmarkdowntable.showMenu で、項目名は format です。

独自のコンテキストキーの値を変更するには commands.executeCommand で setContext を実行します。

    commands.executeCommand('setContext', "markdowntable.contextkey.config.showMenu", state);

第二引数にコンテキストキーを指定し、第三引数に値を指定します。

参考

自作の拡張機能ですが、設定でメニューを非表示にできるようにしています。

マーケットプレイスに公開しています。