自動テストチュートリアル

Playwright、Seleniumなどの自動テストツールを学ぼう

関数(Function)

📦 よく使う処理をひとまとめにする
「このコード、さっきも書いたな…」をなくす魔法の箱

プログラミングを進めていくと、テストデータの作成など**「このコード、さっきも書いたな…」**と、同じ処理を何度もコピー&ペーストする場面に必ず出会います。

そんな繰り返しをなくし、よく使う処理をひとつの便利な道具としてまとめておける仕組みが**「関数」**です。

これは、プログラミングの重要な原則 DRY (Don't Repeat Yourself - 同じことを繰り返すな) を実現するための、最も基本的で大切なテクニックとなります。

💡 呼び方いろいろ
Seleniumで自動テストを書く際にはRuby言語を使いますが、Rubyでは関数のことを「メソッド」と呼びます。

現場では人によって「関数」「メソッド」「処理」など呼び方がさまざまですが、文脈から意味をつかめるとスムーズに会話ができるようになります。

書き方と具体例

ここまでの課題の中で、実はすでに何度か関数を使っていたことにお気づきでしょうか?

これまで「便利な道具」として紹介してきた処理は、実際には関数として用意されていたものでした。

例えば…
・日付を入力する際に使った getTomorrowMDY()
・ブラウザタブを切り替える際に使った switchWindow()

これらはそれぞれ関数helper関数と呼ばれるものです。ここでは、この2つを例に関数について説明します。

この課題で関数を作成したり、編集することはありませんが、関数の使い方は最終課題でも必要となる知識なので覚えておいてください。

関数の例

使い方

await page.locator("{カレンダーのセレクタ}").fill(getTomorrowMDY());

定義元

📁 lib/modules/utils.ts:27
export const getTomorrowMDY = (): string => {
  const date = new Date();
  date.setDate(date.getDate() + 1);

  const year = date.getFullYear();
  const month = date.getMonth() + 1;
  const day = date.getDate();

  return `${month}/${day}/${year}`;
};

helper関数の例

await の後に helpers と付いてるのが特徴です。

使い方

await helpers().tab.switchWindow(切り替えたいタブの番号);

定義元

📁 lib/helpers/tab-helper.ts:9
switchWindow = async (index: number): Promise<void> => {
  await this.waitForWindowCount(index);
  await page.context().pages()[index].bringToFront();
  store.page = page.context().pages()[index];
};
実は、裏側ではこんなプログラムが動いていました ✨

使用するときの注意点

関数を利用するには、あらかじめ import が必要です。

実はこれまでの課題でもファイルの先頭に必ず import を記述していました。

import の意味

from で指定したファイルに定義されている関数の中から
{ } 内に記載した関数だけを、このファイル内で使う
これを記述しないと、テストファイルで関数を呼び出すことはできません。

関数を使う場合

import { getTomorrowMDY } from "@modules/utils";

helper 関数を使う場合

import { page, helpers } from "lib/playwright";

「関数」と「ヘルパー関数」の違い

⚠️ ここは少しややこしいので、理解が難しければ読み飛ばしても問題ありません。

今回の課題では例として utils の関数を関数の例として取り上げましたが、厳密には次のように整理できます。

種類 役割
関数 その画面専用の処理
helper関数 複数の画面で共通して使う処理
utils関数 機能に依存しない、プログラムレベルの便利処理
ただし、これはあくまでこの課題用の Playwright 基盤のルールであって、実際の現場では違う意味で使われることもあります。なので覚える必要はありません。

このタブで覚えてほしいこと

細かい分類を覚える必要はありません。
「関数とは、プログラミングの処理をひとまとめにしたもの」

自動テストでの使い方

例えば「ユーザーサインアップ」をテストする場合、本来であれば以下のような手順をそれぞれコードに書く必要があります。

1️⃣ サインアップ画面に遷移する
2️⃣ ユーザー名を入力する
3️⃣ メールアドレスを入力する
4️⃣ パスワードを入力する
5️⃣ 登録ボタンを押下する

このように毎回登場する一連の処理は、サインアップ関数としてまとめておくことが多いです。

❌ 関数なし(5行)
await page.goto('/signup');
await page.fill('#name', 'Taro');
await page.fill('#email', '...');
await page.fill('#password', '...');
await page.click('#submit');
✅ 関数あり(1行)
await signup('Taro', 'email', 'pass');
シンプル!✨

既存のコードを読むことが大事

実際の現場ではこうした「毎回やるような処理」は、すでに関数として用意されているケースがほとんどです。

そのため、自分で一から書くよりも、まずは既にあるソースコードを読んで理解することが大事です。

関数の存在や使い方を把握できれば、効率的にテストを書けるようになります。