motanelu / bcn-js-news-widget

Demo app for my presentation - Crossbrowser testing with Nightwatch, Travis and Saucelabs

bcnjs

Demo application for BarcelonaJS

This repository is part of a proof of concept on how to use Nightwatch together with Saucelabs and express to test frontend applications both locally and on Travis in isolation. It creates a Vuejs widget that can be dropped in any page, connects to a configurable API and displays news.

new NewsWidget({
  'selector': '#widget',
  'api': 'some.url',
  'userId': 1
})

The slides from the presentation are available on SlideShare

Resources:

• Nightwatch
• Saucelabs
• Travis CI

Prerequisites

First install all the dependencies by running

npm install

Create a Saucelabs account, install sauce-connect available via brew for OSX users and export the credentials as environment variables.

brew cask install sauce-connect
export SAUCE_USERNAME="..."
export SAUCE_ACCESS_KEY="..."

Start the tunnel to Saucelabs by calling sauce-connect. Sauce-connect needs to be running for the entire duration of the tests, stopping it will sever the link to Saucelabs.

sc

In a new terminal, run

npm run test