Docker 內 Laravel 8 瀏覽器測試 dusk 安裝配置指南

本指南運行環境系 MacBook 上的 Docker 內,相關容器配置如下:

version: '3'
services:
  mysql:
    image: mariadb:10.2
    restart: always
    volumes:
      - '~/Documents/Datas/laravel/mysql:/var/lib/mysql'
    ports:
      - '127.0.0.1:23306:3306'
    environment:
      MYSQL_ALLOW_EMPTY_PASSWORD: 'yes'
      MYSQL_DATABASE: 'puppy'
  laravel:
    image: ycheung/laravel-dev
    restart: always
    ports:
      - '8081:80'
      - '9001:9001'
    volumes:
      - '~/Documents/laravel:/var/www/html'
    depends_on:
      - mysql
      - mailhog
  mailhog:
    image: mailhog/mailhog
    ports:
      - "1025:1025"
      - "8025:8025"
  selenium-hub:
    image: selenium/hub
    container_name: selenium-hub
    ports:
      - "4444:4444"
  chrome:
    image: selenium/node-chrome
    volumes:
      - '/dev/shm:/dev/shm'
    depends_on:
      - selenium-hub
    environment:
      - HUB_HOST=selenium-hub
      - HUB_PORT=4444
      - JAVA_OPTS=-Dwebdriver.chrome.whitelistedIps=
docker-compose.yml
  1. composer 安裝 Laravel Dusk
composer require --dev laravel/dusk
composer install dusk

2. 執行安裝腳本,生成測試目錄 tests/Browser 和示例測試文件

php artisan dusk:install
tests folder

3. 編輯 .env 文件,設置 APP_URL=http://laravel ,URL地址是服務名(service  name)。

.env file

4. 編輯 tests/DuskTestCase.php 文件, selenium_server_url地址是 http://selenium-hub:4444/wd/hub

tests/DuskTestCase.php file

5. 如果遇到錯誤 Facebook\WebDriver\Exception\UnknownErrorException: Session [xxx] was terminated due to BROWSER_TIMEOUT ,將connection_timeout_in_msrequest_timeout_in_ms 的值改大些,比如9000。(optional)

<?php

namespace Tests;

use Facebook\WebDriver\Chrome\ChromeOptions;
use Facebook\WebDriver\Remote\DesiredCapabilities;
use Facebook\WebDriver\Remote\RemoteWebDriver;
use Laravel\Dusk\TestCase as BaseTestCase;

abstract class DuskTestCase extends BaseTestCase
{
    use CreatesApplication;

    /**
     * Prepare for Dusk test execution.
     *
     * @beforeClass
     * @return void
     */
    public static function prepare()
    {
        if (!static::runningInSail()) {
            static::startChromeDriver();
        }
    }

    /**
     * Create the RemoteWebDriver instance.
     *
     * @return \Facebook\WebDriver\Remote\RemoteWebDriver
     */
    protected function driver()
    {
        $options = (new ChromeOptions)->addArguments(collect([
            '--window-size=1920,1080',
        ])->unless($this->hasHeadlessDisabled(), function ($items) {
            return $items->merge([
                '--disable-gpu',
                '--headless',
            ]);
        })->all());

        return RemoteWebDriver::create(
            $_ENV['DUSK_DRIVER_URL'] ?? 'http://selenium-hub:4444/wd/hub',
            DesiredCapabilities::chrome()->setCapability(
                ChromeOptions::CAPABILITY, $options
            ), 90000, 90000
        );
    }

    /**
     * Determine whether the Dusk command has disabled headless mode.
     *
     * @return bool
     */
    protected function hasHeadlessDisabled()
    {
        return isset($_SERVER['DUSK_HEADLESS_DISABLED']) ||
            isset($_ENV['DUSK_HEADLESS_DISABLED']);
    }
tests/DuskTestCase.php

6. 運行示例測試任務。

php artisan dusk
exec php artisan dusk
Y Cheung
Blogger, Backend Developer & Traveler.
Shanghai