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 testcafeTestcafe 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.jsTest 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.onlySelectors
- 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
-
A test controller object t exposes methods of test API. That is why it is passed to each function that is expected to contain server-side test code (like test, beforeEach or afterEach).
-
Use the test controller to call test actions, handle browser dialogs, use the wait function or execute assertions.
Test Actions
Assertions
- TestCafe assertions start with the expect method exposed by test controller. This method accepts the actual value. You can pass a value, a Selector's DOM node state property or a client function promise. TestCafe automatically waits for node state properties to obtain a value and for client functions to execute. See Smart Assertion Query Mechanism for details.
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
Testcafe hands on
By Cesar Guerrero Rincon
