概要
AWSマネジメントコンソールで、S3を開いて、EC2開いて、VPC開いて、IAM開いて、次またEC2開いて、、、、
マウスの移動が煩わしい！！ショートカットキーが欲しい！！！！という切なる思いで作りました。
3行まとめ
- Chrome拡張機能の「ScriptAutoRunner」を使ってます。
- 左Ctrl ＋ m を押すと、左上の「サービス」をクリックするという挙動です。
- ただそれだけです。
手順
Chrome拡張を入れる
ScriptAutoRunnerをChromeにインストールします。
Chrome拡張にカミナリマークのアイコンができるので、それをクリックし、歯車をクリック
左上の
</>ボタンを押すと、入力フォームができます
タイトル入れます。
適当にshortcut keyとかにしておきます
このスクリプトを埋め込むターゲットのhostnameを入れます。
今回は、AWSのマネジメントコンソールの全ページに反映したいので、console.aws.amazon.comと入力します。
埋め込むスクリプトの挙動を考えます。
AWSマネージメントコンソールのサービスというボタンがクリックされると、メニューが展開されるのでこれをクリックできるような挙動にしたいと思います。
なんとなくですが、左Ctrl + mで開けるようにします（メニューだから m という安易な考え）
このbutton要素スクリプト書きます
document.addEventListener('keydown',(event) => {
if(event.ctrlKey && event.key === 'm') {
let targetBtn;
const btns = document.getElementsByTagName('button');
btns.forEach(btn => {
if (btn.attributes['data-testid'] && btn.attributes['data-testid'].value === 'aws-services-list-button') targetBtn = btn;
});
targetBtn.click();
}
});
8. 書けたら、テキストボックスの左のプラグのようになっている部分をクリックして、反映されるようにします。
このプラグのON/OFFは、Chromeの右上のアイコンからでも操作可能です。
通電された感じですね
9. AWSマネジメントコンソールを開いて動作確認
左Ctrl + m を押すことで、開閉ができるようになったと思います。
メニューを開くと、検索窓にフォーカスがあたっているので、そのまま入力し、矢印キーで選択後、ページ遷移できます。
まとめ
AWSマネジメントコンソールにショートカットキーがなかったので、作ってみました。
個人的にはだいぶ便利になった！という感覚があります。
もしかしたらgithubのようにあるのかもしれませんが探せなかったです。あるよ！という方、教えていただけるととても喜びます。
追記
マネコンはすぐUI変更されるので動かなくなるかもですが、その際は、Scriptを適宜変更してあげてください。
2020/11/30
今日見てみたらマネコンが変わっていました。
ページを開くと自動で検索フォームにフォーカスが当たる様になっていますね！
（そしてこのスクリプトは動かなくなった・・）
ショートカットキーが割り当てられている部分も見受けられますし、今後に期待ですね！