Zenn VSCode Web拡張のプルリクエスト開発ログ

オープンソースとして開いている Zenn VSCode Web 拡張プロジェクトに対してのプルリクエストコードの開発ログやメモ、コントリビューター視点でのアイデアなどを実験的に集積しています。

リポジトリ

ツリービューからドラッグ&ドロップでマークダウンリンクやhttps形式のリンクを編集中のファイルに挿入できる機能。本作成時に多数のチャプターがある場合に、別のチャプターを参照したい場合がよくあるので、編集プロセスがスムーズになる。

本から別の本のチャプターを参照したいときの、リンク条件を調べる。
ユーザー名の文字列が設定として必要になる可能性がある。

機能: ツリービューを開いているときにアクティブファイルが記事ファイルやチャプターファイルなら、ツリービュー上のアイテムをハイライトするようにする機能

背景: チャプターファイルが大量にあると現在開いているファイルが本全体のどこにあるものなのかを確認したい場合がある。また、アクティブファイルとツリービューの視覚的関係性を強固にすることで通常のエクスプローラーのユーザビリティに近づけることができると思う。

状況: config.yaml とチャプター、記事についての監視はできるので、reveal機能のコード自体はほぼ完成、コードクリーンとコメントの整理が必要。実装が思ったよりも難しかった。全体が仕上がったのでPR作成済み。

画像プレビューはカスタムエディタ(WebView)として扱われ、グローバルにアクティブなWebViewの変更を監視するAPIは意図的に公開されていないとのこと。各プラグインごとで WebView のパネル変更を監視する onDidChangeViewState API は提供されている。

したがって、画像ファイルについてはtreeItemのrevelが技術的に困難

画像プレビュー自体を拡張の WebView にすれば監視が可能。

TreeViewItemのrevelはそのままだとView Containerが開かれていない時まで強制的にrevealしてしまうという特徴があるが、View の visible プロパティでその状態を判定して reveal するようにすればよい。

reveal の逆、un-select のための API は存在しないため、本セクションと記事セクションを同時に開いている場合には両方ともハイライトされてしまうことになる。

Hidden comment

動くけど原理が深くまで理解できていない、コード変更量が大きくなりすぎるので、PRとして出すのはやはり難しいかもしれない(適切ではない状態)
MIT ライセンスのコードをどこまで含めていいのか

API Docs に記載されていない最新の context key activeWebViewPanelId を使用するとボタンを配置できる。

設定で機能調整できるようにしたいが設定の読み込みをどこかでマネージメントする仕組みが必要になりそう

設定をどこで読み込ませて、変更時にどのように更新するのかみたいな問題がでてきそう。

ユーザー名文字列を使ってZenn.dev上の実際の記事にアクセスする機能。published されたものだけ飛ぶことができる。