メール受信を含むE2Eテストの自動化をAutifyで実現する

カスタマーサクセスエンジニアとしてAutifyに入社して最初の1週間が経ちました。カスタマーサクセスという職種は特にプロダクト知識・ドメイン知識が重要なので、毎日少しでも多くのことを身につけねば、とキャッチアップに勤しんでおります。

そのキャッチアップも兼ねて、今回、拙作である個人開発Webサービス・Pixelaのとあるユースケースに対するE2Eテストの自動化をおこないましたので、その方法などをメモがてら残しておきます。

対象となるユースケース

Pixela は、基本的には無料でご利用いただける Web API サービスです。

と同時に、Patreonを通じての支援も受け付けており、支援登録してくれた方（パトロン・Pixelaサポーター）にはレジストレーションコードを発行、そのレジストレーションコードが設定されたユーザーに対しては一部の機能を限定解除する、という仕様があります。

このあたりの流れを、「個人Webサービスシステム構成事典」にも掲載の図を用いて示すと、以下の図中の赤線・赤文字の部分が該当します。

f:id:a-know:20210321174035p:plain

パトロン登録時に Patreon から発火されるWebhookを Pixela が受け、ユーザーに対してメールを送信するようになっています。

実はここの部分のテストが、ユニットテストすらも腰が重くてずっと書けていない状態でした。そのため、以下のような方法・手順で人力で確認することを時々実施することで担保している、というありさまでした。

自分の持っている別メールアドレスで Patreon にユーザー登録をし、そのユーザーで Pixela に対して支援登録をした結果、メールが受信できることを確認する。
メール送信まわりに影響がありそうな変更を Pixela に対して実施したタイミングで、上記のオペレーション（パトロン解除 -> パトロン再登録）を再度おこない、メールが問題なく受信できることを確認する。

とはいえ、「メール送信まわりに影響がありそうな変更」という判断も曖昧かつどこまで信用できるかも微妙で、また、自分は何もしていなくても（むしろ何もしていないからこそ）それまで動いていたものがある日突然壊れる、ということも、往々にして起こり得るものです。

そんな、「壊れやすい部分」「壊れた場合に極めて気が付きにくい部分」そして「対象システムにとって重要な部分」という三拍子そろったこのシナリオを、今回の自動E2Eテストの対象としました。

Autify の特長のうちのひとつとして、「ブラウザ操作をノーコードで記録できる」というものがあります。ブラウザ操作の記録には、Chrome Extention である「Autify Recorder」を用います。

文字だけで書いてもなかなかイメージしづらいと思いますので、ぜひ以下のページに掲載の動画も見てみてください。

ね、簡単でしょ？

そして、このツールでレコーディングする対象となる操作......今回のユースケースをテストできる最短経路の手順を書き出してみます。

...こんなかんじでしょうか。ここで、いくつかのハードルがあることに気が付きます。それは以下の2点でした。

Patreon の動作確認用のアカウントは、僕個人のGmailアドレスで登録されています。そこへのメール受信をAutifyによる自動テスト内で確認するとなると、テストシナリオのなかで僕のGmailアカウントにログインしなければいけないのか...？

もちろんそういったやり方もあるとは思いますが、その方法はGmailアカウントへのログイン情報をAutifyに登録することになりますので、それはちょっと違う気がしますね。今回はそれとは少し違うアプローチである、Autifyの「メールテスト」機能を使います。

上記の機能は、以下のスクリーンショットのように、

f:id:a-know:20210321174806p:plain

ということができるスグレモノになっています。今回はこの機能を使って、

事前にAutify管理画面で固定メールアドレスを発行しておく
Patreon の動作確認用のアカウントの登録メールアドレスを、Autifyで発行した固定メールアドレスにあらかじめ変更しておく
- メールアドレス変更の過程でメールアドレス確認のためのメールがPatreonから送信されるが、Autifyでのメール受信やメール本文の確認はAutify管理画面からできる。
- こんな↓かんじ