Seleniumを用いたWeb自動テスト入門

自動テストとは何か

自動テストとは、繰り返し実行が必要なテストケースを、スクリプトによってコンピュータが自動で実行する手法です。具体的には、ブラウザの起動、リンクのクリック、フォームへの入力、ボタン押下などの一連の操作をプログラムで再現し、得られた結果が期待値と一致するかを検証します。

利点

  • 人的リソースの大幅な削減
  • 高速なテスト実行
  • 夜間や週末など非稼働時間帯での実行が可能
  • 継続的インテグレーション(CI)および継続的デリバリー(CD)との親和性が高い

課題

  • テストスクリプトの開発に時間がかかり、初期コストが高い
  • 要件変更が頻繁なプロジェクトには不向き
  • UIや機能が安定した段階で導入すべき
  • 既存のロジックの検証が中心となるため、新たなバグの発見が難しい
  • テストコード自体にバグが含まれる可能性があり、障害調査の混乱を招く場合がある
  • 不安定なテスト環境やフレームワークの不具合により、誤検出が多くなるリスクがある

自動テスト導入の前提条件

  1. 手動テストでは対応しきれないほどの大規模なリグレッションテストが必要
  2. 仕様変更が少なく、比較的安定した要件を持つ
  3. プロジェクト期間が長期にわたる
  4. 作成したテストスクリプトの再利用が可能
  5. 基本的な手動テストが完了している

代表的な自動テストツール

現在、Webアプリケーションの自動テストにおいて広く使われているツールとして、以下2つが挙げられます。

  • Selenium:オープンソースのブラウザ自動操作フレームワーク。複数のプログラミング言語に対応。
  • UFT/QTP:元HP社製の商用ツール。VBS(Visual Basic Script)を使用し、GUIベースの操作記録が特徴。

Selenium と UFT/QTP の主な違い

項目 Selenium UFT/QTP
ライセンス オープンソース(無料) 商用(有料)
対応言語 Python, Java, C#, JavaScript など VBS(Visual Basic Script)
対応ブラウザ Chrome, Firefox, Safari, Edge, Android ブラウザなど 主にIEとFirefox
対応OS Windows, Linux, macOS Windowsのみ
拡張性 高(サードパーティライブラリと連携可) 低(カスタム拡張が制限される)

Seleniumのセットアップ方法(Python環境)

  1. Python 3.x をインストール(pipとPATH設定を含む)
  2. コマンドラインから pip install selenium を実行
  3. 最新版のGoogle Chromeをインストール
  4. ChromeDriverをダウンロードし、PythonのScriptsディレクトリに配置
    (例:https://chromedriver.storage.googleapis.com/index.html より取得)
  5. 動作確認用のスクリプトを作成
from selenium import webdriver
from selenium.webdriver.chrome.service import Service

# ChromeDriverのパスを指定(必要に応じて)
service = Service(executable_path='C:/path/to/chromedriver.exe')
driver = webdriver.Chrome(service=service)

# ページを開く
driver.get("https://www.baidu.com")

# 後片付け
# driver.quit()

上記コードを実行してChromeが起動し、「百度」ページが表示されれば、正しくセットアップされています。

HTMLの基本構造

WebページはHTML(HyperText Markup Language)によって構成されており、ブラウザがこのマークアップを解釈して画面に表示します。CSSで見た目を、JavaScriptで動作を制御します。

最小構成のHTMLドキュメント

<!DOCTYPE html>
<html lang="ja">
<head>
  <meta charset="UTF-8">
  <title>サンプルページ</title>
</head>
<body>
  <h1>これは見出しです</h1>
  <p>ここに本文が入ります。</p>
</body>
</html>
  • タグ(Tag):<...> で囲まれた要素。例: <div>, <p>
  • テキスト(Text):タグ内の表示文字列。例: 「これは見出しです」
  • 属性(Attribute):タグに付加される情報。代表的なものに以下があります。
    • id:要素の識別子(一意であるべき)
    • class:スタイルやグループ化に使用
    • name:フォーム送信時のパラメータ名

よく使うHTML要素

  • リンク<a href="https://example.com">リンクテキスト</a>
  • レイアウト<div><section> でブロックを構成
  • 表組み<table> 内に <tr>(行)、<td>(セル)を使用
  • フォーム<form> 内に <input>, <button>, <select> などを配置
  • フレーム内埋め込み<iframe src="other.html"></iframe>

Chrome DevToolsによる要素の確認方法

Chromeブラウザで任意のページ(例: https://www.baidu.com)を開き、F12キーを押すことで「DevTools」を起動できます。左上のアイコン(👉)を選択後、ページ上の要素(例: 検索ボックス)をクリックすると、該当するHTMLコードがハイライト表示されます。

例えば、百度の検索ボックスは次のような構造を持っています:

<input id="kw" name="wd" class="s_ipt" type="text" autocomplete="off">

このように、idnameclass といった属性情報をもとに、Selenium側で正確に要素を特定することが可能になります。

タグ: Selenium Python Webテスト 自動化テスト ChromeDriver

7月19日 17:59 投稿