Laravel dusk with browserstack to run tests on multiple devices and browsers

Question

I am using this ("browserstack/browserstack-local": "^1.1") package to run dusk tests on BrowserStack. Now the requirement is to run tests on multiple and different devices with different browsers. Currently, I am following this approach to run tests.

private function browserStackCaps($local_identifier)
{
    return [
        'project' => config('app.name'),
        'browserstack.local' => 'true',
        'browser' => env('BROWSER'),
        'device' => env('DEVICE'),
        'acceptSslCert' => true,
        'resolution' => '1920x1080'
    ];
}

The drawback of this approach is I have to change the device name and browser name in the .env file every time I need to run tests on a different device/browser. Is there any way I can run tests on the provided array? The array that contains devices and browser information.

Answer 1

I know this is old, but I found this page while searching for a solution. I ended up building one myself that would probably meet your use-case. The biggest hurdle that I had was $this->browse() in a normal Dusk test was using a single instance of Laravel\Dusk\Browser and the new capabilities were not being pulled in. This implementation adds a function called performTest to the DuskTestCase.php file. This function loops through a set of capabilities and instantiates a new instance of Laravel\Dusk\Browser for each test. This function works similarly to the existing browse function in Laravel Dusk. You call performTest by passing it a callable that accepts a single parameter which is an instance of Laravel\Dusk\Browser

Dusk Test Case

<?php

namespace Tests;

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

abstract class DuskTestCase extends BaseTestCase
{
    use CreatesApplication;
    protected array $capabilities;

    private const BROWSERS = [
        'ios_14_iphone_xs_safari' => [
            "os_version" => "14",
            "device" => "iPhone XS",
            "real_mobile" => "true",
            "browserstack.local" => "true",
            'acceptSslCerts' => 'true'                
        ],
        'mac_osx_catalina_safari' => [
            "os" => "OS X",
            "os_version" => "Catalina",
            "browser" => "Safari",
            "browser_version" => "13.0",
            "browserstack.local" => "true",
            "browserstack.selenium_version" => "3.14.0",
            "resolution" => "1920x1080",
            'acceptSslCerts' => 'true',
        ]
    ];



    /**
     * Create the RemoteWebDriver instance.
     *
     * @return \Facebook\WebDriver\Remote\RemoteWebDriver
     */
    protected function driver()
    {
        $browserStackConnectionUrl = config('browserstack.connection_url');
        return RemoteWebDriver::create(
            $browserStackConnectionUrl, $this->capabilities
        );
    }

    protected function performTest(Callable $test){
        foreach(self::BROWSERS as $browserName => $capabilitySet){
            try {
                $this->capabilities = $capabilitySet;
                $browser = $this->newBrowser($this->driver());
                $test($browser);
                $browser->quit();
                fprintf(STDOUT, "\e[0;32m√ {$browserName}\r\n");
            }
            catch(\Exception $exception){
                fprintf(STDOUT, "\e[0;31mX {$browserName}\r\n");
                throw $exception;
            }
        }
    }


}

Example Test

<?php

namespace Tests\Browser;

use Tests\DuskTestCase;
use Laravel\Dusk\Browser;

class ExampleTest extends DuskTestCase
{
    public function testExample()
    {
        $this->performTest(function(Browser $browser){
            $browser->visit('/')
                ->assertDontSee('Foobar');
        });
    }
}

config/browserstack.php

<?php

return [
    'connection_url' => env('BROWSERSTACK_CONNECTION_URL')
];

Answer 2

you can implement this at your end. Fetch the list of Browsers and Devices you want to execute your tests on using the REST API and use the same.

REST API to be used:

curl -u "username:password"
https://api.browserstack.com/automate/browsers.json

Read more on this here: https://www.browserstack.com/docs/automate/api-reference/selenium/browser#get-browser-list