Long, Long time ago... 

Meet Tom

Tests

Fronted

Backend

Mailer

Tests

Fronted

Backend

Mailer

Functional testing

Fronted

Backend

Mailer

Be like Tom

Use functional tests

Features

• Run backend and all services
• Open any browser and run tests
• Run remote browser (browsestack)
• Make sure that user see what he supposed to see

Let's start

module.exports = {
  'Login to system': function (browser) {
    return browser.page.doctor().navigate()
      .waitForElementVisible('body', 1000)
      .setValue('@login', 'm.kozminski@klara.com')
      .setValue('@password', 'testtest')
      .click('@submit')
      .waitForElementVisible('@issue', 500000);
  },

  'Open issue': function (browser) {
    return browser.page.doctor()
      .click('@issue')
      .waitForElementVisible('@timeline', 500000);
  },

  'Send message': function (browser) {
    browser
      .setValue('.public-DraftEditor-content', 'This is test')
      .waitForElementVisible('button.button[type=submit]', 50000)
      .click('button.button[type=submit]')
      .pause(1000)
      .assert.containsText('.timeline', 'This is test')
      .end()
  }  
};

module.exports = {
  url: 'http://localhost:8080/doctor-client.html',
  elements: {
    login: {
      selector: 'input[type=text]',
    },
    password: {
      selector: 'input[type=password]',
    },
    submit: {
      selector: 'button[type=submit]',
    },
    issueList: {
      selector: '.issues-list',
    },
    issue: {
      selector: '.issue',
    },
    timeline: {
      selector: '<Timeline />',
    },
    patientLink: {
      selector: 'a[label=Patient]'
    },
    editor: {
      selector: '.editor',
    }
  },
};

Working with functional tests

Manual

Automated

CI

# ======= Setup ========

npm run test-setup

# ======== start Backend ======

rails s
postgres
redis-server

# ======= start fronted =======

npm start

# ======= Run tests ==========

nightwatch
nightwatch --test test/integration/some_test.js --testcase "Login"

npm run test-integration

./bin/integration.rb

CI

• Works by default on master
• Can be one time enabled on any branch
  • Add [full test] to commit message

Browsers

Chrome
Firefox
Safari

Mobile support

   browser.resizeWindow(1000, 800);

TO DO

CSS
E-mail
Screenshot

Be like Tom

Text