beforeEachでテストする前の共通動作をまとめる【TestCafe】

12014 ワード
JavaScript TypeScript Test TestCafe tech テキストリンク

概要

このファイルのテストは最初の動作が全部一緒だからまとめたい！
って思った時に使用したのがbeforeEachオプション。

beforeEachについて詳しい説明はこちら

最初の動作全部一緒ってどゆこと？？

beforeEachを使う前
fixture `My fixture`
    
test("マイページを見るができる,  async (t) => {
// 管理者でログインしてマイページへ移動する処理
  await t.useRole(admin).click("#mypage");
  #中略
});
test("マイページでプロフィールを編集できる,  async (t) => {
// 管理者でログインしてマイページへ移動する処理
  await t.useRole(admin).click("#mypage");
  #以下省略(プロフィールを編集する処理)
});
test("マイページからツイート出来る,  async (t) => {
// 管理者でログインしてマイページへ移動する処理
  await t.useRole(admin).click("#mypage");
   #以下省略(ツイートする処理)
});

例えば上記のコードでは3つのテストを実装しているのですが、
テストする時の条件として(テスト内容は適当)

  • 管理者ユーザーでログインすること
  • マイページに移動すること
    つまり、

管理者でログインしてマイページへ移動する処理

// 管理者でログインしてマイページへ移動する処理
  await t.useRole(admin).click("#mypage");

コードではこの部分が、共通の動作となっています。

これ何度も書くのだるくね？って時に使ったのがbeforeEachです。

beforeEachを使用すると以下のようになります。

beforeEachを使用後
fixture `My fixture`.beforeEach(async (t) => {
  // 管理者でログインしてマイページへ移動する処理
  await t.useRole(admin).click("#mypage");
});
    
test("マイページを見るができる,  async (t) => {
  #中略
});
test("マイページでプロフィールを編集できる,  async (t) => {
   #以下省略(プロフィールを編集する処理)
});
test("マイページからツイート出来る,  async (t) => {
   #以下省略(ツイートする処理)
});

こうすることで,このファイルで書いたテストは事前に、

管理者でログインしてマイページへ移動する処理が組み込まれます。

使用前と使用後の動作は同じですが
コード量が減って見た目がだいぶスッキリしますし、
処理をまとめることで、ロールを変更したいとなった時も１箇所の修正で済むので手間もかかりません。

このテストだけbeforeEachを辞めたい。

テストファイルに20個のテストシナリオを実装している。
そのうちの19個はbeforeEachを使いたい。
でも、一つだけbeforeEachに定義した処理を除外したい。

という場面もあると思います。(僕はありました。)

例：今は**管理者でログインしてマイページへ移動する処理**を共通処理しているが、このテストだけは、**一般ユーザーでログインしてマイページへ移動する処理**に変えたい。

という場合。

こちらはtest.beforeオプションを使う。

test.before が指定された場合は、
対応する fixture.beforeEach をオーバーライドし、後者は実行されない。

test.before使用後
fixture `My fixture`.beforeEach(async (t) => {
  // 管理者でログインしてマイページへ移動する処理
  await t.useRole(admin).click("#mypage");
});

test
    .before( async t => {
        await t
            .useRole(general)
            .click('#mypage');
    })
    ("一般ユーザーがマイページからツイート出来る,  async (t) => {
   #以下省略(ツイートする処理)
});

こんな感じにすると、beforeEachの処理ではなく、beforeオプションの処理が優先されて、
このテストだけは管理者ではなく、
一般ユーザーでログインしてその後のテストを行ってくれます。

まとめ

TestCafeの日本語のドキュメントが少ない。。。
公式ドキュメントがしっかりしているからなんとか進められてます。笑

VSCodeでSwaggerのAPIドキュメント書いてサクッとモックを動かしてみる
AWS Lightsail ContainersにGitHub Actionsでデプロイする。