タブ移動・切替・選択をキーボードでサクサク行いたい人のためのTips

[ppgm]

キーボードだけでタブ移動・切替・選択をしたい人のためのTipsというか自分の設定を晒します。
こんな情報誰も求めてないだろうなーと思いつつ、たま～に似た思想の人を見かけると共有したくなるのでここに置いておきます。

『おれはこうしてるゼ！』みたいな情報があれば是非教えてほしいです

目次

1. タブの切替
2. タブの移動
3. タブの選択
4. おまけ（タブの削除）
5. まとめ

=======================================================================

1. タブの切替

アクティブなタブを切り替える方法です。状況に応じて3つの方法で切り替えます。

1.1 UI上の隣接するタブに切り替え

ショートカットで「一つ前のタブに戻る/進む」を割り当てる。
これは新規タブを開いた直後や、タブエリアやウィンドウパネルで目的のタブを探してアクティブタブに近い時に使えます。
比較的タブ数が少なければこれだけで済みがちです。

ただしこれには欠点があり、切り替える際に必ずタブがアクティブになるので2つ隣のタブを開く時に1つ隣のタブが重たくアクティブになる度ロードするようなページだったりすると一瞬UIが固まるのでプチストレスになります。
それが気にならなければ一番直感的で良いでしょう。

これの上位互換として3つ隣・5つ隣のタブに移動するコマンドチェインも仕込んでいます。

UI上で10つくらい隣のタブにドゴドゴっと移動できるので結構気に入っています。
更に、このコマンドチェインを使うと上記のUIが固まるデメリットが起こりません。ページの各種通信処理が始まる前にタブを切り替えてしまうからだと想像しています。

1.2 直前に使用したタブに切り替え
これはタブサイクリングを「最近使用した順にタブを循環する 」にチェックを入れることで実現します。
2,3個のタブを行ったり来たりするようなシチュエーションではこれをよく使います。

1.3 つべこべ言わずに切り替え
たくさん開いてたり、幾つかのワークスペースやウィンドウで開いている時、もしくはさっき閉じたのか開いたのか思い出せな…ぁぁあめんどくさい！！
という時はクイックコマンドで切り替えます。それっぽいキーワードを入れれば上に上がってきてくれますね。
「開いているタブ」を一番上に持ってきておくとすぐにタブ一覧が見れて良いです。

クイックコマンドは標準だとやたらと狭いのでCSSで大きくするのもいいと思います。
縦に大きくすると下の方にマウスオーバーした時勝手にスクロールされたり中途半端に表示されなかったりVivaldiとの死闘は未だ継続中ですのでお好みでどうぞ。横に広げるだけでも大分開放感があって宜しいです。

=======================================================================

2. タブの移動

タブ自体の位置を移動させる方法です。

2.1 隣に移動

これは「アクティブタブを後ろ/前へ移動」のショートカットを割り当てます。

スタックするのは面倒くさいけどなんとなくタブの位置を整理したいときなどに使います。
そういえば設定していませんでしたが、タブ切り替えで紹介したコマンドチェインのタブ移動版を作ってもいいなと思います。

2.2 ギャザータブ（タブ寄せ）

これは関連タブをスタックするとタブ位置が移動するというVivaldiの仕様（ではない気もするが）を利用した裏技的なTipsです。
コマンドチェインで「タブをスタック」「遅延」「タブのスタック解除」をすることで関連タブが一箇所に集まってきます。

気づいたら同じドメインのタブが増えていたりした時に使うと良いと思います。
すでににスタックされているタブに対しては効きません。
いつの間にか実装された仕様なのでいつの間にかできなくなるかもしれませんがその時はそういうことだと思ってください。

=======================================================================

3. タブの選択

タブを選択状態にする方法です。
これが一番難所というかスマートな方法が見つかってないので良い方法教えてほしいところです。一応自分がやっていること書いておきます。

3.1 単一のタブを選択
「タブバーにフォーカス」にショートカットを割り当て矢印キーで移動することで実現します。
するとタブが点線で囲まれ任意のタブを選択できるようになります。
「タブの選択解除」もショートカット割り当てしておくことでタブバーからフォーカスを外せます。

この状態でCtrl+wなど通常タブ操作に使うキー操作を行ってもいいですし、Windowsであればアプリケーションキー（Menuキー）という影の薄いキーを押すことでコンテキストメニューを表示できます。ここから任意の操作を行うことも出来ます。MacとLinuxは知りませんがKarabinerみたいなアプリ使えばなんとかなるんじゃないでしょうか(ﾊﾅﾎｼﾞﾎｼﾞ)。WindowsでもThinkPadなどアプリケーションキーが存在しないPCもありますがAutoHotKeyとかPowerToysのキーボードマネージャーなどで設定するといいんじゃないでしょうか(ﾊﾅﾎｼﾞﾎｼﾞ)。
実際便利なんで設定しておくといいと思います。

3.2 複数タブの選択


基本は隣接タブを選択することのみ考えます。
コマンドチェインで「タブバーへフォーカス」と「直前/次のタブを選択」を登録します。こうすることで現在のタブと隣接するタブを選択することができるようになります。
これをぽちぽち連打するとその分タブが選択されます。

23/07/28 追記
3.3 スタック内のタブを全て選択
スタック内で「現在のタブを選択」を実行するとスタック内全てのタブが選択されます。
右クリックでコンテキストメニューを出す分にはいいのですが、前述のMenuキーなどを使う場合は「タブバーにフォーカス」を実行することで選択されたタブを対象にできます。

23/07/28 追記
3.4 全てのタブを選択
全てのタブを選択するコマンドチェインを書きました。
たまに全部のタブをリロードしたい場面などがあるのでそういう時に使っています。

新しいワークスペース作成＋まるごと移動みたいな使い方もいいかもしれません。
ニッチなニーズに使えそうだと思います。

=======================================================================

4. おまけ（タブの削除）

クイックコマンドからタブを削除します。

これにはjs mod を使用します。
手前味噌ですが、私が捨て置いたスクリプトをお使いくださいませ。
これを使うとクイックコマンドのタブにハイライトが当たった状態でAlt + Deleteを押すとタブを削除できます。
タブを切り替えるついでにズコズコ不要タブを整理できて便利です。

5. まとめ

何となく書こうと思ったらちょっとした記事になってしまいました。
誰得駄文失礼しました。

[ppgm]

リンクのjsと一緒に下のcssも使うと閉じたタブがわかりやすくて良いです。

/* Closed tabs */
.strikethrough-text {
    text-decoration: line-through;
    opacity: 0.3;
}