Set up a browser automated test environment that can run Selenium + Pytest with Docker Compose

Summary

When trying to perform an automatic browser test with Selenium and Pytest, it is troublesome to build an environment until the test is executed. If you put in a browser, put in a webdriver that matches the browser version, put in Python, put in Pytest, and so on, it may take several hours just to install.

Therefore, this time, we will use Docker Compose to simplify the startup of the execution environment for Selenium and Pytest. Please refer to it when you want an instant browser test execution environment or when you want to unify the execution environment within the project.

System configuration

Launch the following two containers with Docker Compose and connect them remotely. --chrome (Chrome + Selenium execution environment) --pytest (Pytest execution environment)

Use selenium / standalone-chrome-debug for the chrome container. This is an image provided by the Selenium official, and as the name implies, Chrome + Selenium can be executed standalone. (Internally, 1 node Chrome is connected to Selenium Grid Hub)

The pytest container is built by writing a Dockerfile by yourself based on Docker official python image.

file organization

Local working directory

docker-pytest
├── Dockerfile_pytest
├── docker-compose.yml
├── screenshots
└── tests
    └── test_google.py

pytest container internal directory

/
└── docker-pytest
    ├── screenshots
    └── tests
        └── test_google.py

Contents of each file

docker-compose.yml

docker-compose.yml

version: "3"

services:
  chrome:
    image: selenium/standalone-chrome-debug:4.0.0-alpha-7-prerelease-20200826
    container_name: chrome
    volumes:
      - /dev/shm:/dev/shm
    ports:
      - 4444:4444
      - 5900:5900

  pytest:
    build:
      context: ./
      dockerfile: Dockerfile_pytest
    container_name: pytest
    volumes:
      - ./screenshots:/docker-pytest/screenshots/
    tty: true

The description of the chrome container is the docker command described in selenium / standalone-chrome-debug in YAML format.

The pytest container uses Bind Mount. You have the local docker-pytest / screenshots directory mounted in the / docker-pytest / screenshots directory of the pytest container. Now you can locally browse the screenshots saved when you run pytest inside the pytest container.

Dockerfile_pytest

Since the date and time are used in the test script, only the time zone is changed.

FROM python:3

RUN pip install --upgrade pip && \
    pip install selenium pytest

ENV TZ "Asia/Tokyo"

WORKDIR /docker-pytest
COPY ./tests/ /docker-pytest/tests

test_google.py

The point is how to specify the driver. You can resolve the name with the container name by docker-compose. To connect to Selenium Grid Hub with chrome container / 4444 port, connect to http: // chrome: 4444 / wd / hub.

test_google.py

import os
from datetime import datetime

from selenium import webdriver


class TestGoogle:
    @classmethod
    def setup_class(cls):
        cls.driver = webdriver.Remote(
            command_executor="http://chrome:4444/wd/hub",
            options=webdriver.ChromeOptions(),
        )

    def test_access_google(self):
        """
Access the Google top page.

Google top page(https://www.google.com/)To access.
Take a screenshot when accessing
The file name is the date and time when the test was run(YYMMDD_hhmmss.png)And.
Success or failure is judged by "whether the current URL of the browser is the Google top page".
        """

        driver = TestGoogle.driver

        file_name = datetime.now().strftime("%y%m%d_%H%M%S.png ")
        screenshot_path = os.path.join("/docker-pytest/screenshots/", file_name)

        driver.get("https://www.google.com/")
        driver.get_screenshot_as_file(screenshot_path)

        assert driver.current_url == "https://www.google.com/"

    @classmethod
    def teardown_class(cls):
        cls.driver.quit()

How to use

1. Move locally into the docker-pytest folder
2. Run docker-compose up -d --build
3. Execute docker-compose exec pytest bash to connect to the pytest container
4. Run pytest tests
5. If screenshots are generated in the local docker-pytest / screenshots folder, you're done!

• Execute docker-compose down when you want to quit

Confirmation of execution

The Docker image distributed by Selenium official has a normal version and a debug version, If you use the debug version, you can check the screen of the test execution on the GUI by connecting to VNC.

The connection destination is vnc: // localhost: 5900. See the article below for how to connect. VNC connection to Docker's selenium / standalone-chrome-debug container

Future outlook

This time, I used selenium / standalone-chrome-debug which is a 1-node Selenium Grid Hub, but if this is made into multiple nodes, multi-browser test can be executed. For details, refer to the following. SeleniumHQ/docker-selenium#selenium-grid-hub-and-nodes

Reference material

--Books -You can learn the basics in just one day! Docker / Kubernetes Super Introduction ――Because I was a beginner of Docker, it was very helpful. Good book. --Docker-compose.yml, an article that I referred to when writing a Dockerfile -Compose File Version 3 Reference -How to keep docker-compose up container running -How to change the time zone of Docker container