Howdy developers, testers, and continuous integrators. Do you have a project involving selenium scripts to automate browser tests? Would you like to integrate those tests into your CI/CD pipeline, but aren't sure how to install browsers and webdrivers on your build server? Do you want me to stop asking rhetorical questions?
If you answered yes to any of the previous questions, read on to learn the spells to cast in your .travis.yml
file to make this happen.
A Frustrating Evening
Tonight I was working on my personal browser automation framework, LuluTest (which can be found here, I always welcome contributors). In the early days of LuluTest, I only worried about driving a Chrome browser, and never worried about other browsers.
However, because LuluTest aims to help users of all browsers, I decided it was time to implement support for Firefox (no IE or Safari yet, baby steps). In TDD fashion, I copied some old tests that were using Chrome and ran them with Firefox. Eventually, everything worked locally, and I pushed the changes to Github.
But to my chagrin, TravisCI reported a failed build. I realized it was because there was no Firefox browser or Geckodriver installed on the build server, and I began to weep. My weeping was because I remember the frustration involved in hooking up Chrome and chromedriver in Travis, and I knew it was going to be a long night.
Luckily for you, I've decided to spare everyone else the pain and show you exactly how to get Chrome, Firefox, and their relevant drivers into your build server (assuming you're using TravisCI, though I imagine the steps would be the same for other CI/CD servers).
Overview of what we'll do
Webdrivers are executables that allow us to programatically manipulate a web browser. If you've been writing browser automation tests with Selenium for long, you know that you need to either pass the path of these executables to your Webdriver
instantiations, or have the path in your system PATH variable for the test scripts to work.
This is easy enough when you're writing tests at home on your personal computer, but if we're CI/CD proponents, we want our tests to run in a build server as well. So we'll need to update or .travis.yml
file to install the relevant browsers and drivers. This all seems straightforward enough, but I spent at least an hour getting this right when really it should've taken ten minutes at most. So let me help you save some time.
Chrome and Firefox browsers
First, let's install the Google Chrome and Mozilla Firefox web browsers on our build server. In your .travis.yml
file, in the addons
section, put:
addons:
chrome: stable
firefox: latest
Why are these both slightly different from each other? I have no idea but it drives me crazy.
Luckily for us, this is all we need to do to install the browsers themselves. Installing the drivers is a little bit more involved.
Chromedriver
We're going to use the wget
program to download the chromedriver distro from Google. Then we'll unzip the distro, remove the archive, and make the driver executable.
Installation
Under the install
section of your .travis.yml
file, write:
install:
- wget -N https://chromedriver.storage.googleapis.com/80.0.3987.106/chromedriver_linux64.zip -P ~/
Depending on when you read this article, the version number might not be the most current. Since we used stable
to install the Chrome browser, we need to use the relevant driver as well. First, look up what the current version of Chrome is, then go to https://chromedriver.storage.googleapis.com/ and find the relevant version.
After you've located the version, find the relevant distro (most likely Linux, but maybe you're build server is Windows) and append it to the URL. The pattern for the URL you want to use in your wget
command is https://chromedriver.storage.googleapis.com/[RELEVANT_VERSION]/[RELEVANT_FILE]
Also note the -P ~/
at the end of the line. This downloads the compressed file to our build server's home directory. I do this because I have no earthly idea where the heck TravisCI is installing things, so I always explicitly denote what directory I want things done in.
Unzip and Clean Up
the next line in your install
section should look like this:
- unzip ~/chromedriver_linux64.zip -d ~/
Again, the -d ~/
is ensuring that the files are unzipped to the home directory. Now that we've decompressed, we'll remove the archive. This part isn't exactly necessary, but I do it anyway:
- rm ~/chromedriver_linux64.zip
Finally, let's move the executable to the /usr/local/share/
directory. Altogether, what we've done looks like this:
- wget -N https://chromedriver.storage.googleapis.com/80.0.3987.106/chromedriver_linux64.zip -P ~/
- unzip ~/chromedriver_linux64.zip -d ~/
- rm ~/chromedriver_linux64.zip
- sudo mv -f ~/chromedriver /usr/local/share/
Making the driver accessible
Now that chromedriver is in our share
directory, we need to give it executable permission, then put it in our bin directory. First, we'll use chmod
:
- sudo chmod +x /usr/local/share/chromedriver
And finally, we'll make the chromedriver executable by the build server by making a symbolic link to it in usr/local/bin
:
- sudo ln -s /usr/local/share/chromedriver /usr/local/bin/chromedriver
And that's all she wrote.
Geckodriver
Geckdriver is to Firefox what Chromedriver is to Chrome. Why? I don't know, I'm not a doctor. Anyway, the strategy for getting Geckodriver all hooked up in TravisCI is the same, but there's two tiny little differences.
Installation
The first difference is the pattern of the URL we'll feed to our wget
command. To find the latest version of Geckodriver, go to https://github.com/mozilla/geckodriver and click "releases" under "Downloads in the README. This will automatically link to the current version, which we'll use in our URL. The wget
command is:
- wget -N https://github.com/mozilla/geckodriver/releases/download/v0.26.0/geckodriver-v0.26.0-linux64.tar.gz -P ~/
Note the pattern here is download/[VERSION]/geckodriver-[VERSION]-[RELEVANT OS].[FILE EXTENSION]
. Again, note the use of -P ~/
.
Unzip and Clean Up
This download is a tarball unlike the last installation which was a zip for some reason. Because of this, the second difference is that the command to extract the archive is a little different (but not complicatedly so). Let's also remove the archive afterwards:
- tar -xzf ~/geckodriver-v0.26.0-linux64.tar.gz -C ~/
- rm ~/geckodriver-v0.26.0-linux64.tar.gz
Making the driver accessible
Everything is pretty much the same as last time from here. We'll move geckodriver
, give it execute permission, and put it in /usr/local/bin
:
- sudo mv -f ~/geckodriver /usr/local/share
- sudo chmod +x /usr/local/share/geckodriver
- sudo ln -s /usr/local/share/geckodriver /usr/local/bin/geckodriver
And voila, you should now be able to run your automated browser tests on TravisCI.
Conclusion
This all seems straightforward, but I spent too much time on it, piecing together disparate answers across SO and other parts of the internet. I hope someone out there found this helpful. Altogether, these are the things we added to our .travis.yml
file in this article:
addons:
chrome: stable
firefox: latest
install:
- wget -N https://chromedriver.storage.googleapis.com/80.0.3987.106/chromedriver_linux64.zip -P ~/
- unzip ~/chromedriver_linux64.zip -d ~/
- rm ~/chromedriver_linux64.zip
- sudo mv -f ~/chromedriver /usr/local/share/
- sudo chmod +x /usr/local/share/chromedriver
- sudo ln -s /usr/local/share/chromedriver /usr/local/bin/chromedriver
- wget -N https://github.com/mozilla/geckodriver/releases/download/v0.26.0/geckodriver-v0.26.0-linux64.tar.gz -P ~/
- tar -xzf ~/geckodriver-v0.26.0-linux64.tar.gz -C ~/
- rm ~/geckodriver-v0.26.0-linux64.tar.gz
- sudo mv -f ~/geckodriver /usr/local/share
- sudo chmod +x /usr/local/share/geckodriver
- sudo ln -s /usr/local/share/geckodriver /usr/local/bin/geckodriver
Top comments (0)