ちょっと話題の記事

GitHub上でのコードレビューに使えそうなChrome拡張をいくつか試してみた

GitHub上でソースコードのレビューをする際に役に立ちそうなChrome拡張をいくつか試してみました。
2018.04.26

この記事は公開されてから1年以上経過しています。情報が古い可能性がありますので、ご注意ください。

コードレビューをGitHub上で行うことが多いです。が、差分が大きい場合辛い気持ちになったり、レビュー自体の精度が落ちることがあります。

根本解決としてはそもそも大きいPRを作るべきではない、というところに行きつきますが、とりあえずツールの力である程度解決できないかと思い、GitHub上でのコードレビューに使えそうなChrome拡張をいくつか試してみたので紹介します。

本記事で紹介しているツールは以下となります。

動作確認はGoogle Chrome バージョン: 65.0.3325.181にて行いました。

Pretty Pull Requests

This extension applies various tweaks to the github pull-request code review pages.

Pretty Pull Requests

差分画面の拡張ツールです。フィルタリングやファイルの一覧表示ができます。

できること

  • 指定した正規表現にマッチしたファイルのウィンドウ開閉
  • 増分/減分の表示切り替え
  • 差分のあるファイルの一覧表示
  • 一覧からウィンドウを開閉
  • 一覧から指定したファイルにジャンプ

動作イメージ

触ってみた感想

正規表現でのウィンドウ開閉はなかなか便利かもしれないと思いました。巨大なPRに対して、とりあえずテストを省いて差分をみたい、などといった場合に有用なのではないかと思います。

GitHub diff files filter

A userscript that adds filters that toggle diff & PR files by extension

GitHub diff files filter

差分画面の拡張ツールです。拡張子によるフィルタリングができます。

できること

  • 差分のあるファイルを拡張子でフィルタリングできる

動作イメージ

触ってみた感想

画面のあるアプリケーションの初期のPRでは、サーバーサイドとフロントと画像ファイルと・・・などがまとめてコミットされがちですが、レビュアーが自分の得意な領域に絞ってレビューを行いたい場合などに使えるような気がします。

OctoLinker

OctoLinker is a browser extension for Chrome, Firefox and Opera which allows you to navigate through code on GitHub more efficiently.

OctoLinker

コードから直接参照先に遷移できます。

できること

  • GitHub上のコードで何かを参照している時、参照先にGitHub上で直接遷移できる

サポートされている言語はこちらを参照ください。

動作イメージ

触ってみた感想

ソースコードのレビューは差分のみで完結できないケースが多々あります。参照先のコードによって、修正されたコードが正しいのかどうかを判断する必要があるからです。

参照先のコードを探す手間のせいでGitHub上でのコードレビューを諦め、IDEなどでのレビューをすることがありますが、このような場合に役に立ちそうです。

GitHub code review

This extension adds hot keys and hierarchical file view to GitHub pull request pages.

GitHub code review

ファイルツリーの表示およびキーボードショートカットによるジャンプができます。

できること

  • ファイルツリーを表示し、そこからみたいファイルをフォーカスできる
  • キーボードショートカットでファイル間のジャンプができる
  • キーボードショートカットでコメント間のジャンプができる

動作イメージ

触ってみた感想

ショートカット+ファイルツリーです。コメント間のジャンプがレビューされる側としては嬉しいのではないでしょうか。

Lazy Reviewer

Lazy Reviewer adds information on pull request diffs to PR section on GitHub and GitLab. It also allows you to sort all PRs by the amount of changes.

Lazy Reviewer

PR一覧から差分の量を確認したり、ソートできます。

できること

  • PR一覧で差分の量を確認できる
  • 差分でPRをソートできる

動作イメージ

触ってみた感想

他のツールと違いレビューそのものに役立つツールではありません。

個人的にはPRを開いてから巨大な差分を確認すると心が折れるので、あらかじめ差分の量を確認することで勇気と覚悟を持ってレビューに着手できるかも、と思いました。 また、隙間の時間で差分の少ないものからレビューしたい時などにも有効かもしれません。

まとめ

最後に本記事で紹介した各ツールでできることをまとめました。

  • Pretty Pull Requests
    • 指定した正規表現にマッチしたファイルのウィンドウ開閉
    • 増分/減分の表示切り替え
    • 差分のあるファイルの一覧表示
    • 一覧からウィンドウを開閉
    • 一覧から指定したファイルにジャンプ
  • GitHub diff files filter
    • 差分のあるファイルを拡張子でフィルタリングできる
  • OctoLinker
    • GitHub上のコードで何かを参照している時、参照先にGitHub上で直接遷移できる
  • GitHub code review
    • ファイルツリーを表示し、そこからみたいファイルをフォーカスできる
    • キーボードショートカットでファイル間のジャンプができる
    • キーボードショートカットでコメント間のジャンプができる
  • Lazy Reviewer
    • PR一覧で差分の量を確認できる
    • 差分でPRをソートできる

最初にやりたかったのは、「巨大なプルリクに含まれるテストコードを除いてレビューしたい」だったのですが、Pretty Pull Requestsで解決できそうです。

私からは以上です。