読者です 読者をやめる 読者になる 読者になる

SideCI Blog

自動コードレビューサービスSideCIを提供している株式会社アクトキャットのコーポレートブログです。



SideCI上でESLintの自動修正が行えるようになりました ほか

SideCI Update JavaScript

こんにちは。今週のアップデート情報です。

SideCI上でESLintの自動修正が行えるようになりました。

ESLint経由で指摘したもののうち、修正可能な指摘を自動修正したPull Requestを生成することができます。 この機能を既存のワークフローに組み込むことによって「Pull Requestに対するESLintの指摘を修正するPull RequestをSideCIから作成し、それをマージする」ことでローカルで修正せずともコード指摘を反映できるようになります。

この自動修正の対象は 該当Pull Request内のコミットで変更があったファイル になります。差分箇所のみではない点をご留意下さい。

設定方法

SideCI上の 解析ツール選択 からESLintを有効にしておきます。また、 GitHub上にコメントを行わない オプションは 外して おきます。

alt="ESLint setting" ESLintの設定

実行方法

1. SideCI上から

SideCIの Pull Requestに対するESLintの指摘 から ESLintの指摘を自動修正する をクリックすると、ESLintの指摘を自動修正するPull Requestが生成されます。

alt="Pull Request image"

2. GitHubのPull Requestから

GitHubのPull Requestにコメントされるリンクから実行します。

ESLintの指摘が1件以上あるPull Request に対してコメントされる形で修正リンクが付記されます。 Auto Correct by SideCIボタンをクリックすると、Pull Request生成が実行されます。

alt="Auto Correct button" 自動修正ボタン

自動修正されたPull Requestをマージする

自動修正のPull Requestが生成されます。 alt="auto correct Pull Request" 自動修正されたPull Request

また、修正元のPull Requestに自動生成されたPull Requestについてのコメントが付与されます。 alt="comment about auto correct Pull Request" 修正元へのコメント

生成されたPull Requestをレビューの上、マージしてください。

RuboCopの自動修正実行前に差分プレビューが表示されるようになりました

RuboCopでも上記の自動修正が行えますが、SideCI上でPull Request生成前に 自動修正を実行した場合に生成されるPull Requestのコード差分を確認 できるようになりました。

「自動修正でどんな内容のPull Requestが作られるのか」「変なコードに書き換えられないか」などの確認が事前にできるようになるので便利です。

alt="confirmation image" 差分プレビューイメージ

設定方法は特に不要で、実行方法はESLint同様に「RuboCopの指摘を自動修正する」を行うと、実行時にSideCI側で差分プレビューが表示されます。

ぜひご利用頂ければ幸いです!