Getting started with testcafe and Docker

#automated-test, #dev, #docker, #software

testcafe is a javascript tool to perform frontend test (user acceptance test or end-to-end test). It is similar to selenium, even though it is javascript and nodejs a browser is still required to run the tests.

Docker image

The team has created a docker image, so you don’t need to install nodejs in your machine or in your CI, just pull the image:

$ docker pull testcafe/testcafe

First test

This is a template for tests:

import { Selector } from "testcafe"

fixture `Thank you page`
  .page `http://devexpress.github.io/testcafe/example`

test("should say thank you, john doe", async t => {
  await t
    .typeText("#developer-name", "John Doe")
    .click("#submit-button")
    .expect(Selector("#article-header").innerText)
    .eql("Thank you, John Doe!");
})

Save it in a file, for example thankyoupage.test.js, and run with this command:

$ docker run --rm -v $(pwd):/app -w /app testcafe/testcafe firefox thankyoupage.test.js

It will run in a Firefox headless browser (aka, it won’t open Firefox but instead run it in background) and the output is something like:

 Running tests in:
 - Firefox 61.0.0 / Linux 0.0.0

 Thank you page
 ✓ should say thank you, john doe


 1 passed (3s)

When it fails the output is like:

 Running tests in:                                                       [10/10]
 - Firefox 61.0.0 / Linux 0.0.0

 Thank you page
 ✖ should say thank you, john doe

   1) AssertionError: expected 'Thank you, John Doe!' to deeply equal 'Thank
      you, John Smith!'

      Browser: Firefox 61.0.0 / Linux 0.0.0
[ … ]

Take a look assertions.

References