GitHub のように Azure Repos のリポジトリを Visual Studio Code で開く
Visual Studio Code for Web (vscode.dev) が登場したことにより、気軽に Visual Studio Code がオンライン上で使えるようになった。
しかも、記事の記載にもあるように vscode.dev
を URL の先頭に付加することで、Azure Repos のリポジトリも開けるようになった。
詳しくは、@kkamegawa さんの記事を参照。
が...「GitHub はリポジトリ画面で ". (ピリオド) " を押すだけでエディター画面に遷移してくれるのになぁ」という声が聞こえてきたので、お昼休みの時間を使ってにユーザー スクリプトを書いてみた。
// ==UserScript== // @name New Userscript // @namespace https://azukipochette.hatenablog.com/ // @version 0.1 // @description Launch Visual Studio Code Web from Azure DevOps Repos pages. // @author AzukiPochette // @match https://dev.azure.com/*/_git/* // @icon https://www.google.com/s2/favicons?domain=tampermonkey.net // @grant none // ==/UserScript== (function () { 'use strict'; document.addEventListener('keydown', (e) => { if (e.code == 'Period') { let re = new RegExp('https?://(dev.azure.com/[^?]+)') window.location.href = `https://vscode.dev/${re.exec(document.URL)[1]}` } }); })();
ユーザースクリプトの実行には、使用しているブラウザーに応じた拡張機能が必要となる。
代表的な拡張機能のリンクは以下の通り。(Microsoft Edge + Tempermonkey 向けに実装したが、他の拡張機能でも互換性があるはず)
Microsoft Edge / Google Chrome 向け
Mozilla Firefox 向け
既知の問題
コードを見てもらうと分かるが、以下の問題については対処していない。
- TFVC では実行できない
- 旧バージョンの URL である "<組織名>.visualstudio.com" を使っている場合は動かない
- リポジトリ上でコード編集を動作させた場合、文字として "." すると画面遷移してしまう(機能干渉)*1
Enjoy!
*1:編集時に URL などに編集中だと判断できる明確な特徴がなかったので、諦めた。