GitHub Actionsのローカルでの動作確認(Ver.コロナに負けるな)

#対象者
- GitHub Actionsのworkflowのymlファイルは触りたくない
- GitHub Actionsの動作をpushせずに確認したい

※全てに対応できるかは不明です。
※東京都 新型コロナウィルス感染症対策サイトのOBP Builderの動かし方に特化して記載しています。

#きっかけ
[東京都 新型コロナウィルス感染症対策サイト](https://stopcovid19.metro.tokyo.lg.jp/)がオープンソースによって開発されていることを知り、私も少しだけ参加しています。

FacebookやTwitterにシェアする機能があるのですが、投稿埋め込み用の画像をGitHub Actionsを使って作成しています。

大まかな動作は以下の通りです。

- stagingブランチにpush
- OBP Builderというワークフローが自動的に動作
- Seleniumでスクリーンショットを取得
- 取得した画像をnew_ogpというブランチにCommit&Push

オープンソースの共同開発に不慣れな私はForkしているとはいえstagingにpushするのも怖くて仕方ありません。

**なんとかpushせずに確認したい。**

#方法

##環境構築
以下が完璧でした。
[Qiita|東京都 新型コロナウイルス対策サイトへの貢献方法を解説](https://qiita.com/FPC_COMMUNITY/items/b9cc072813dc2231b2b2)

##ChromeDriverをダウンロード
SeleniumからChromeDriverを動かしてスクリーンショットを取得しているので、ChromeDriverが必要です。
###Chromeのバージョン確認
Chromeはインストールされている前提ですが、Chromeで「chrome://settings/help」を開いてChromeのバージョンを確認します。

###公式サイトからダウンロード
以下からバージョンに合うものをダウンロードしてください。
http://chromedriver.chromium.org/downloads

###ソースの修正
####chromedriverダウンロードパス指定
gitリポジトリ内の以下のソースにchromedriverのダウンロードパスを明記します。
`/tmp`にダウンロードした場合は以下のように修正してください。

```python:ui-test/ogp_screenshot.py
driver = webdriver.Chrome(options=options)
```
↓

```python:ui-test/ogp_screenshot.py
driver = webdriver.Chrome(executable_path="/tmp/chromedriver", options=options)
```

###実行
今回実行したいOGP Builderは`.github/workflows/ogp_builder.yml`になります。
他のworkflowも同じディレクトリにまとまっています。

job単位に色々書いてありますが、動作に当たる部分は`run:`から始まるものです。
今回はこの部分を動させたい。
staging環境にする必要はなく、developmentでも、そこから派生したブランチでも動作すると思います。


```yml:.github/workflows/ogp_builder.yml
      - run: yarn install --frozen-lockfile
      - run: yarn run test
      - run: yarn run generate:deploy
      - run: pip install selenium
      - run: (python -m http.server --directory ./dist 8000 &)  ; python ./ui-test/ogp_screenshot.py
```

単純にコマンドを叩いていけばいいようです。

```
$ yarn install --frozen-lockfile
$ yarn run test
$ yarn run generate:deploy
$ pip install selenium
$ (python -m http.server --directory ./dist 8000 &)  ; python ./ui-test/ogp_screenshot.py
```

####環境によっては以下かも。
私の環境(macOS 10.15.3)では、以前seleniumをpip3で入れていたりして、上記ではうまく動作しませんでした。
GitHub Actionsの動作環境は`runs-on: `で指定するようです。
今回は`runs-on: windows-latest`が指定されているので、コマンドの違いは致し方なし。

以下の変更で動作しました。
`pip`→`pip3`
`python`→`python3`

また、httpサーバはこのままだとバックグラウンドで動き続け面倒なので、別ウィンドウで立ち上げておくのが良さそうです。

httpサーバ立ち上げまで

```
$ yarn install --frozen-lockfile
$ yarn run test
$ yarn run generate:deploy
$ pip3 install selenium
$ python3 -m http.server --directory ./dist 8000;
```

最新化とスクリーンショットの撮影(別ウィンドウ)


```
$ yarn run generate:deploy
$ python3 ./ui-test/ogp_screenshot.py
```


###実行結果確認
seleniumが動いて、GETのログが出てきます。

```
127.0.0.1 - - [20/Mar/2020 19:13:52] "GET /?dummy?ogp=true HTTP/1.1" 200 -
<省略>
127.0.0.1 - - [20/Mar/2020 19:15:16] "GET /sw.js HTTP/1.1" 304 -
```

ogpディレクトリができて、中に画像が格納されていればOKです。

```
$ ls ogp
_?dummy.png
agency.png
attributes-of-confirmed-cases.png
details-of-confirmed-cases.png
en
ja
ja-basic
ko
number-of-confirmed-cases.png
number-of-reports-to-covid19-consultation-desk.png
number-of-reports-to-covid19-telephone-advisory-center.png
number-of-tested.png
predicted-number-of-toei-subway-passengers.png
zh-cn
zh-tw
```

###後始末
GitHub Actionsでは作成したフォルダなどは削除されるようですが、ローカル環境では削除されないので、作成したogpディレクトリが残り、次回実行した時にそのまま実行すると、エラーが出ます。

```
FileExistsError: [Errno 17] File exists: 'ogp'
```

なので、実行結果の確認ができたら、生成したディレクトリは削除しておきます。

```
$ rm -r ogp
```

以上で動作確認は完了です。

#まとめ
- pushしなくても、トリガーとして登録されているブランチでなくても実行できる。
- workflowのymlのrunをコマンドラインで実行すればよい。
- 作成したフォルダは削除しておく。
- 環境の違いで動作が異なる場合がある。`runs-on:`で指定。
- GitHubの使い方に慣れて、GitHub Actionsをちゃんと使えばいい話。