Dockerize your TestCafe tests and integrate with Jenkins

If you are reading this article, you have already chosen Testcafe as your partner in crime (I mean Tests ^^). And why wouldn't you? TestCafe has significant speed of execution, easy setup mechanism, node eco-system, and most importantly no dependency on the web drivers.

Now, you want to dockerize your tests easily and execute them every time dev push some code to the repository. Tell your friend to hold your beer, we are getting started.

Wait, we have a checklist

You need to double-check your system dependencies before we start our journey.

• Of course, you have to install Docker. Installation is dead easy. I assume you have a basic understanding of Docker and Dockerfile.
• Get the Jenkins war file. Just keep it in a folder for now.
• In case you want to try the things out in a sample repository, clone this Testcafe-Starter pack from Github. This pack has different lifecycle hooks like building, linting, and reporting integrated. The reporting partner is Allure, you need to install JDK inside the docker to create the desired reports. So, this pack is ideal to understand how to frame the Docker image with all dependencies.

But, what does Docker images really do?

An image is a blueprint for the bare minimum files needed to run what you want to run (in this case a TestCafe testing suite). the benefits are you can put this ‘image’ anywhere, your local machine, in a CI agent machine, or if you’re wanting to be extra, in an ECS instance; these are your ‘containers’, when you mount your image there, then you are ready to run your tests without any drama; and they are created and torn down super quick.

This blueprint along with the commands needed are stored in the Dockerfile, it’s actually pretty simple, especially in the case of TestCafe, where they have base ‘images’ for you to steal and stick in your Dockerfile. let’s look at how a Dockerfile is built for TestCafe.

Let’s create our Dockerfile

Round of applause for TestCafe team for proving a base image for TestCafe test environment called testscafe/testcafe. This is an official stable release of the TestCafe docker image. If you want the alpha version, it’s called testcafe/testcafe:alpha.

Create a Dockerfile inside your project. For our sample TestCafe-Starter pack, it is stored at docker/Dockerfile.

So let’s work through this, top to bottom. firstly is the base Docker image that contains the meat of what TestCafe needs to run. Then we have changed the privileged to root user. Sometimes you need to be a root user to install some dependencies and apps inside the container. After that, we installed JDK8 using OpenJDK and establish the JAVA_HOME path. This is required specifically for Allure reporting. If you have a different reporter, which does not use Java, you can skip this section from your Dockerfile.

Create and test your Docker Image

Now, you need to create the docker image using the Dockerfile you created earlier. Just hit the below command to create the docker container:

docker build -t testcafe -f docker/Dockerfile .

After the successful execution of the above image, you can check the docker image details using command

docker images -a

Now, you can execute your test cases in interactive mode using the command

docker run -u root -v ${PWD}:/tests -it testcafe/testcafe chromium /tests/**/*.spec.ts

Note that you need root access to trigger the test execution, otherwise it may not find the right spec files.

-v ${PWD}:/tests - maps the TEST_FOLDER directory on the host machine to the /tests directory in the container. You can map any host directory to any container directory.

After a successful test execution, you can stop the docker container using the command:

docker stop $(docker ps -qa --filter ancestor=testcafe)

If these steps do not give you much trouble, you are ready for your next big thing — execution using Jenkins.

Create your Jenkins file

Jenkinsfile is a text file that contains the definition of a Jenkins Pipeline and is checked into source control.

In the Jenkinsfile, you can define multiple stages and steps to achieve smooth test execution. Rather than manually set up the steps in Jenkins, you can easily manage the steps in a text file. You just need to get familiarize yourself with basic Groovy scripting. The Jenkins file for the TestCafe-Starter pack is stored here, in the root of the project.

Basically, we have defined the docker file location and Jenkins will collect the image information from the docker file. Don't forget to mention args ‘ — entrypoint=\’\’’ to execute later stages inside the docker container.

Once the container is ready, Jenkins will check out the latest master branch from the remote repository URL. Then, it will execute a series of node operations as configured in your package.json file. The end section of the Jenkinsfile depicts the report publishing and artifact generation. I have used the HTML-Publisher plugin to host the Allure HTML report.

So, you are now ready to configure TestCafe Jenkins job.

Boot up Jenkins and Configure Test job

As per the checklist, you already have the Jenkins war file. Navigate to the directory and execute below command to host Jenkins in your local server

java -jar jenkins.war --httpPort=9090

If you do not provide a httpPort, it will allocate port 8080 by default.

Once Jenkins is fully up and running, follow the usual procedure to log in as admin and create a new Pipeline job.

In the Pipeline section, provide the definition as Pipeline script from SCM and mention your preferred SCM operator. As my starter pack is managed in Git, I have mentioned Git and provided the master branch to look at. As we kept all the stage definitions in the Jenkinsfile, we need to provide that information in the Script Path section.

Save the configuration and you are now ready to kick start your first JOB.

Execute your first TestCafe job

You are now truly one click away. Press the Build Now button and Jenkins automatically fires up the job. The console section of the job helps you to see the live execution status. As per the Jenkinsfile order, the Docker container will be created first followed by test execution and report generation. If you have Blue Ocean plugins installed, you can monitor the pipeline stages in a much better way:

I hope this will help you to quickly get up and running with Testcafe, Jenkins, and Dockers.

Let me know in the comment section if you are having hiccups in any of the steps. If the article helps, you can clap for free :)