Testcafe hands on

Recap

// Check version of node to be 8

node -v //v4.1.1

// Move to node 8 using nvm

nvm use 8

node -v //v8.9.1

// Check testcafe is installed as global running

testcafe -v //~0.18.5


// If get "testcafe" command not found, install it global

npm install -g testcafe

Testcafe CLI

// Check available browsers

testcafe -b

// chrome
// firefox
// safari

// Running tests in Chrome

testcafe chrome test.js

// Running in all Browsers

testcafe all test.js

// Running in a remote browser

testcafe remote test.js

Test Structure

fixture(fixtureName) // Javascript
fixture `fixtureName` // Typescript
  • A fixture function is in the global scope
  • Fixtures are kind of categories of tests
  • They must exist
test(testName, function(t) {});
test(testName, async t => {});
  • A test function is in the global scope
  • It first param is the test name, the second is a callback that recieves the test Controller (can be async func)

Fixture util methods

  • The page method loads the page where this category is going to start.
fixture('My Fixture').page('http://www.myexample.com');
  • beforeEach method receives a callback that will run before each test 
fixture('My Fixture').beforeEach(async t => {});
  • afterEach method receives a callback that will run after each test 
fixture('My Fixture').afterEach(async t => {});

Test util methods

  • before method receives a callback that will run before this test 
test('My test', async t => {}).before(async t => {});
  • after method receives a callback that will run after this test 
test('My test', async t => {}).after(async t => {});
  • The page method loads the page where this test is going to start, this will return the function to init.
test.page('http://www.myexample.com')('My Test', async t => {});
  • Tests and Fixtures ships with other helpful methods that allow you to skip or run just the tests you need or are working in
fixture.skip
test.skip

fixture.only
test.only

Selectors

  • Testcafe ships with a very useful method called selector that will help us trying to reach buttons, menus, paragraphs, etc.

  • The following example creates a selector from a css string for an element with 'username' id.

import { Selector } from 'testcafe';

const usernameInput = Selector('#username', {
    visibilityCheck: true
});

Test Controller

Test Actions

Assertions

await t.expect( actual ).eql( expected, message, options );

  • If the TestCafe assertion receives a Selector's DOM node state property or a client function promise as an actual value, TestCafe uses the smart assertion query mechanism: if an assertion did not pass, the test does not fail immediately. The assertion retries to pass multiple times and each time it requests the actual property value. The test fails if the assertion could not complete successfully within a timeout (default 3000ms)

Assertion API

Made with Slides.com