npm-audit-actionをマーケットプレイスに公開してみた

はじめに

CI/CD Advent Calendar 2019 1日目に毎日npm auditを実行して脆弱性対応する取り組みを紹介しました。このときはCircleCI上で実行していたのですが、GitHub Actionsを使ってみたい、自作Actionを開発してみたいと思ってやってみました。

GitHub Actions Advent Calendar 2019 16日目のphp-audit-action(β版）をマーケットプレイスに公開してみたを読んだときは、出だしからnpm auditと書いてあるし、ネタが丸かぶりかとヒヤヒヤしました。記事タイトルを拝借しました。

作ったもの

npm auditを実行するActionを作りました。

リポジトリ、マーケットプレイス

https://github.com/oke-py/npm-audit-action
https://github.com/marketplace/actions/npm-audit-action

仕様

v1.1.0時点では大きく2つの機能があります。いずれもnpm auditを実行して脆弱性があればレポートする点は同じですが、トリガーによって動作が異なります。

Pull Requestがトリガーの場合

脆弱性があれば該当のPRに対してコメントをつけます。また、ジョブ自体は失敗とします。

Pull Request以外がトリガーの場合

Pushやスケジュール実行時に脆弱性があればIssueを作成します。

使い方

こんな感じです。

name:npm auditon:pull_request:push:branches:-master-'releases/*'# on:#   schedule:#     - cron: '0 10 * * *'jobs:scan:name:npm auditruns-on:ubuntu-lateststeps:-uses:actions/checkout@v1-name:install dependenciesrun:npm ci-uses:oke-py/npm-audit-action@v1.1.0with:github_token:${{ secrets.GITHUB_TOKEN }}issue_assignees:oke-pyissue_labels:vulnerability,test

作り方

テンプレートの利用

6日目¹に紹介されていた公式のTypeScriptテンプレート²を利用しました。

npm installのエラー（うろ覚え）

何か宣言が足りないとかでエラーになった気がします。以下のように自分で定義するとエラーが解消されました。

declaremodule'@octokit/graphql'{exporttypeVariables=anyexporttypeGraphQlQueryResponse=any}

GitHub contextの取得

トリガーに応じて動作を変えるため、githubコンテキスト³を利用しました。ユーザーが指定しなくて済むようにaction.ymlでデフォルト値として指定しました。

...inputs:github_context:description:'The`github`context'default:${{ toJson(github) }}required:false...

ローカルでの動作確認

開発中はローカルでActionを実行して動作確認したかったのですが、inputsの渡し方がわかりませんでした。そこでソースコード⁴を読んでみたところ環境変数として指定できることがわかりました。

exportfunctiongetInput(name:string,options?:InputOptions):string{constval:string=process.env[`INPUT_${name.replace(/ /g,'_').toUpperCase()}`]||''if(options&&options.required&&!val){thrownewError(`Input required and not supplied: ${name}`)}returnval.trim()}

INPUT_ISSUE_ASSIGNEES=oke-py INPUT_ISSUE_LABELS=vulnerability,test node lib/main.js

PRコメント

GitHubの操作は@octokit/rest⁵を利用しましたが、単純なコメントをつけることができませんでした⁶。特定のコミット、行に対するコメントのみつけることができました。

To add a regular comment to a pull request timeline, see "Comments."

そこで、axiosを使ってGitHub API⁷を直接たたくようにしました。

テストコード

公式テンプレートからリポジトリを作成するとJestを使うようになっていました。モックの使い方がよくわからず悪戦苦闘しました。一応理解した気はしますが、あまり説明できません。

テストカバレッジの取得

19日目⁸に投稿したのでご参照ください。

pre-commit hookの設定

ソースコードを修正して動作確認したところで、意図した通りに動かないことが多々ありました。主な原因はTypeScriptのトランスパイル忘れでした。pre-commit hookを設定することで回避しました。

#!/bin/sh
npm run all

マーケットプレイスのアイコン設定

action.ymlのbrandingでカラーとFeatherアイコンを指定できました⁹。絵心ないので助かりました。

...branding:icon:'search'color:'orange'

おわりに

CI/CD Advent Calendar 2019 初日にnpm auditネタではじまり、GitHub Actions Advent Calendar 2019 最終日にnpm auditネタで終えることができました。

とりあえず自分が使いたいものはできたかなと思いますが、少しでもユーザーが増えてくれたら嬉しいです。マーケットプレイスに公開して流入はあるのでしょうか・・・？　また、GitHubでスターをもらえたら嬉しいです。