docker-seleniumでE2Eテスト環境構築 【Python】

★★★ Live配信告知 ★★★ぜひお申込みください!
◆◇世界一わかりみの深いクラウドネイティブ on Azure◆◇
8/4(木) 19:00~ 第17回:コンテナをサーバーレスでラクラク実行 〜 Azure Container InstancesとDocker CLIで実現 〜 今回は、コンテナをサーバーレスで実行するテクノロジとDocker CLIとの連携を紹介します。
◆◇PS Live◆◇
8/5(金) 12:00~ 第18回:アウトプットはイイぞ 〜サイオステクノロジーLT大会〜 エンジニア初級者向けから、個人ネタまで、エンジニア脳を体感できるプログラムです。

こんにちは。サイオステクノロジーの木村です。

今回は docker-selenium を使用してE2Eテスト環境を構築する方法について簡単にご紹介します。
Webブラウザを操作するテストスクリプトの作成には Python を使用します。

docker-selenium とは

Selenium

Webアプリケーションのブラウザの操作を自動化し、Webアプリケーションのテストを実施するためのフレームワーク

docker-selenium

SeleniumをDocker 環境で動かせるイメージのこと。詳細はこちら
複数のブラウザで並行して自動テストを実行する SeleniumGrid を構築するための Grid Hub や Grid Node のイメージもありますが、今回は、以下の Chrome がインストールされた Standalone イメージを使用します。
selenium/standalone-chrome-debug
※ -debug というイメージには VNC サーバも付いているため、画面を確認することができます。

ディレクトリ構成・ファイルの作成

以下の構成で、ディレクトリ・ファイルを作成します。


root
 ├── docker-compose.yml
 └── test-app
     ├── Dockerfile
     └── src
          └── testapp.py

docker-compose.yml


version: '3'
services:
  selenium:
    container_name: selenium-chrome
    image: selenium/standalone-chrome-debug:3.141.59-20210929
    ports:
      - 4444:4444
      - 5900:5900
    shm_size: "2gb"
  test-app:
    container_name: test-app
    build: ./test-app
    volumes:
      - ./test-app:/opt/app
    tty: true

4444ポート:Selenium サーバに接続するポート

5900ポート:VNC サーバに接続するポート

Dockerfile

Python を使用したテストスクリプトを動かす環境を作成するため、以下のように Dockerfile を作成します。


FROM python:3.8

ENV PYTHONIOENCODING utf-8

WORKDIR /opt/app

RUN pip install selenium

テストスクリプト(testapp.py)

testapp.py というファイル名でテストスクリプトを作成します。
以下のスクリプトでは、当ブログサイトにアクセスして、「docker」で記事を検索し、検索結果よりタイトルを取得し出力します。また、検索結果の画面キャプチャも取得します。


from selenium import webdriver
from selenium.webdriver.common.by import By
from selenium.webdriver.common.keys import Keys
import os

if __name__ == '__main__':
    # Selenium サーバへ接続
    driver = webdriver.Remote(
        command_executor="http://selenium:4444/wd/hub",
        options=webdriver.ChromeOptions()
    )
    driver.implicitly_wait(10) #seconds

    # 当ブログサイトにアクセス
    driver.get("https://tech-lab.sios.jp/")

    # 検索ボックスに docker と入力して検索
    driver.find_element(By.NAME, "s").send_keys("docker" + Keys.RETURN)

    # 検索結果取得
    result_elems = driver.find_elements(By.CLASS_NAME, "entry-title.mh-posts-list-title")

    # 検索結果よりタイトルを出力
    for elem in result_elems:
        print(elem.text)

    # 検索結果の画面キャプチャを取得し保存
    FILENAME = os.path.join(os.path.dirname(os.path.abspath(__file__)), "img1.png") #ファイル名
    w = driver.execute_script("return document.body.scrollWidth;")
    h = driver.execute_script("return document.body.scrollHeight;")
    driver.set_window_size(w,h)
    driver.save_screenshot(FILENAME)

    driver.quit()

動作確認

docker-compose.yml が配置されているディレクトリに移動し、以下のコマンドでビルドを実行します。

docker-compose build

以下のコマンドで、コンテナを起動します。

docker-compose up -d

以下のコマンドで、テストスクリプト実行環境のコンテナに入ります。

docker exec -it test-app /bin/bash

以下のコマンドで、テストスクリプトを実行します。

python ./src/testapp.py

テストスクリプトが実行され、検索結果のタイトルが出力されます。

また、img1.pngの名称で画面のキャプチャのファイルが保存されます。





ご覧いただきありがとうございます。
ブログの最新情報はSNSでも発信しております。
ぜひTwitterのフォロー&Facebookページにいいねをお願い致します!



>> 雑誌等の執筆依頼を受付しております。
   ご希望の方はお気軽にお問い合わせください!


ご覧いただきありがとうございます! この投稿はお役に立ちましたか?

役に立った 役に立たなかった

1人がこの投稿は役に立ったと言っています。

Be the first to comment

Leave a Reply

Your email address will not be published.


*