この記事の内容
- こんなものを作ったよーという共有
- 割と簡単にできたのでVSCodeのExtension作成楽しいよーという布教
- 実装について
- 詰まりポイントと解消法
- パッケージした各ファイルの情報がリリース情報のどこに反映されるのか？
- Marketplaceにpublishする時のアクセストークンの権限設定がややこしい
Extensionを作成するために必要な環境準備はすでに分かりやすくまとまった記事がたくさんあったのでそちらを紹介するにとどめます。
できたもの
Javaクラスを開いた状態で Ctrl + 9 を押すとテスティングペアのJavaクラスを開く（なければ作る）という超単純なExtensionです。
EclipseのQuick Junit Pluginのショートカットキーの一つとほぼ同じ動きをします。
当方Eclipseずぶずぶテスト大好きおじさんのため、このショートカットキーがないと生きていけない体だったのですが、VSCodeにはそのようなショートカットキーがないようだったので作ってみようと思いやってみたものです。
どれぐらいでできたの？
だいたい5,6時間ほどで実装からリリースまでできました。
お手軽。
作り方の流れ
大まかな流れだけ記載すると以下のような形です。
- node.jsをインストール
- Extensionのテンプレートを作るコマンドを実行
- テンプレートに合わせて作りたい機能を実装
- 実装した機能をデバッグして確認
- パッケージ化
- Azureアカウントの作成
- publisherIDの作成
- Marketplaceに公開
以下の記事を参考にスムーズに進めることができました。大感謝。
作ってみたい方は参照しながらやってみてください。
実装について
JavaScriptで実装してみました。
VSCodeに対して操作を行うものなのでVSCodeのAPIを利用して実装していきます。
実際のソースコードは以下から参照できます。
処理の流れ
- javaファイルを開いている時のみ動作させたいので処理対象かどうかをチェック
- 開いているファイルのパスをもとにテスティングペアのパスを取得
- テスティングペアが存在していれば開く
- 存在しなければテスティングペアを作る
- 開いているファイルのパッケージをコピー
- 開いているファイルのクラス名から対応するテスティングペアのクラス定義を生成
- テスティングペアを作成できたら開く
- テスティングペアの作成に失敗したらエラーメッセージを表示する
使ってみたAPI
難しい実装ではないので以下のAPIを把握すれば簡単に実装することができました。
vscode.window.activeTextEditor.document
まずはショートカットキーが押された時に開いているファイルの情報を取得する必要がありました。ChatGPTにきいてみるとサクッと上記を教えてくれましたが、activeTextEditorでアクティブなテキストエディタを取得してそのdocumentで開いているファイルの情報が入っているのだなと構造も分かりやすかったです。
documentからはfilePathやuriを取得できました。
1行目の情報はlineAt(0)というような記述で取得することができました。
vscode.workspace.openTextDocument
引数で渡したファイルパスのファイルを開く。
vscode.workspace.showtextDocument
documentを渡すとそのファイルを表示する。
vscode.workspace.fs.writeFile
指定したファイルパスのファイルに指定した内容を書き込む。（ファイルがなければ作成する）
vscode.window.showErrorMessage
エラーメッセージを表示する。
他にもInfoやWarningを表示するものもあるようです。
表示すると右下にメッセージが表示されます。
あとvscode.windowの中身を見るとInputBoxを作成したりするようなものもあり、色々なことができそうでした。
詰まりポイントと解消法
パッケージした各ファイルの情報がリリース情報のどこに反映されるのか？
リリース情報について記載するファイルがいくつかあるのですが、実際にpublishしてみないとどこに反映されるのか分からなかったので、対応関係を記載しておきます。
- DETAILSの内容はREADME.mdの内容
- CHANGELOGの内容はCHANGELOG.mdの内容
- package.jsonのiconに相対パスで128*128の画像を指定してパッケージ中に含めるとアイコンとして表示される
- package.jsonのdescriptionの内容はpublisherIDの下に表示される
- package.jsonのrepositoryにgithubのURLを入れると右側のResourcesにRepositoryやIssues,Licenseが表示される
パッケージしたファイルはすべてGitHubRepositoryに置いてあります。
Marketplaceにpublishする時のアクセストークンの権限設定がややこしい
参考記事ではコマンドでpublishできるようにアクセストークンを発行する手法が紹介されていたのですが、設定が複雑でちょっと面倒だなと感じました。
色々いじってみると、Marketplaceのサイトから直接アップロードしてpublishすることができたので、私はその方法で公開しました。
- Azureのアカウントでログインした状態でVSCodeのMarketplaceを開く
- 右上にあるPublish extensionsをクリックするとExtensionの管理画面が開く
- publishやUpdateを行う
たしかな満足
Marketplaceでの公開はちょっと詰まった部分もあったのですが、publishされると自分のアイコンとExtensionのアイコンが並んで表示されたりして確かな満足感があります。
うれC。
機能改善したいこと
今は src/main/java と src/test/java を固定で対応させるような作りになっていますが、
例えば src/int-test/java というようなフォルダにデータベース接続を行うテストを配置しているような場合にもうまく対応できるような機能改善をしたいなと思っています。
おわり。