Skip to content

Commit

Permalink
spring-cloudgh-648 Provide infrastructure for local E2E/Unit Testing …
Browse files Browse the repository at this point in the history
…against SauceLabs

- Update Readme
- Add support for SauceLabs-based E2E testing
- Add support for SauceLabs-based Unit testing
- Add support for BrowserStack-based E2E testing
- Add support for BrowserStack-based Unit testing

In order to run the tests, developers must provide SauceLabs credentials, e.g.:

$ export SAUCE_USERNAME=your-username
$ export SAUCE_ACCESS_KEY=your-access-key

and BrowserStack credentials, e.g.:

$ export BROWSER_STACK_USERNAME=your-username
$ export BROWSER_STACK_ACCESS_KEY=your-access-key

Important, for E2E tests, developers should refrain from using `localhost`. Instead, add `dataflow.local` to your local DNS hosts file.
  • Loading branch information
ghillert authored and oodamien committed Apr 16, 2018
1 parent 04760df commit 4c06fdf
Show file tree
Hide file tree
Showing 10 changed files with 329 additions and 3 deletions.
67 changes: 65 additions & 2 deletions README.md
Original file line number Diff line number Diff line change
Expand Up @@ -60,15 +60,78 @@ The following instructions can be used to do this:
* **pom.xml** Maven config file
* ui/**package.json** Node dependencies

# Running Tests
# Running Tests - Locally

## Unit Tests

$ ng test --browsers PhantomJS --single-run
```bash
$ ng test --single-run
```

## E2E Tests

```bash
$ npm run e2e
```

# Running Tests - SauceLabs

Before you can run tests using SauceLabs, please setup your username and password:

```bash
$ export SAUCE_USERNAME=your-username
$ export SAUCE_ACCESS_KEY=your-access-key
```

## Unit Tests

```bash
$ npm run test-saucelabs-local
```

## E2E Tests

For E2E tests, developers should refrain from using `localhost`. Instead, add `dataflow.local` to your local DNS hosts file.

```bash
$ npm run e2e-saucelabs-local
```

## Thank You

![SauceLabs Logo](master-ui-assets/images/saucelabs-logo-600x315.png)

Cross-browser Testing provided by [SauceLabs](https://saucelabs.com).

# Running Tests - BrowserStack

Before you can run tests using BrowserStack, please setup your username and password:

```bash
$ export BROWSER_STACK_USERNAME=your-username
$ export BROWSER_STACK_ACCESS_KEY=your-access-key
```

## Unit Tests

```bash
$ npm run test-browserstack-local
```

## E2E Tests

For E2E tests, developers should refrain from using `localhost`. Instead, add `dataflow.local` to your local DNS hosts file.

```bash
$ npm run e2e-browserstack-local
```

## Big Thanks

![BrowserStack Logo](master-ui-assets/images/browserstack-logo-600x315.png)


Cross-browser Testing Platform provided by [BrowserStack](https://browserstack.com).

# Development

Expand Down
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
2 changes: 1 addition & 1 deletion ui/e2e/streams/streams.po.ts
Original file line number Diff line number Diff line change
Expand Up @@ -13,7 +13,7 @@ export class StreamsPage {
*/
navigateTo() {
browser.waitForAngularEnabled(false);
return browser.get('#/streams/definitions', 60000);
return browser.get('#/streams');
}

/**
Expand Down
45 changes: 45 additions & 0 deletions ui/karma-browserstack.conf.js
Original file line number Diff line number Diff line change
@@ -0,0 +1,45 @@
// Karma configuration file, see link for more information
// https://karma-runner.github.io/1.0/config/configuration-file.html

module.exports = function (config) {

const customLaunchers = {
'bs_chrome': {
base: 'BrowserStack',
browser: 'firefox',
browser_version: '59',
os: 'Windows',
os_version: '10'
}
};

config.set({
basePath: '',
frameworks: ['jasmine', '@angular/cli'],

plugins: [
require('karma-jasmine'),
require('karma-browserstack-launcher'),
require('karma-jasmine-html-reporter'),
require('@angular/cli/plugins/karma')
],
client:{
clearContext: false // leave Jasmine Spec Runner output visible in browser
},
angularCli: {
environment: 'dev'
},
browserStack: {
name: 'Data Flow Dashboard Unit Tests'
},
captureTimeout: 120000,
customLaunchers: customLaunchers,
browsers: Object.keys(customLaunchers),
singleRun: true,

reporters: ['progress', 'BrowserStack'],
colors: true,
logLevel: config.LOG_DEBUG,
browserNoActivityTimeout: 1000000
});
};
59 changes: 59 additions & 0 deletions ui/karma-saucelabs.conf.js
Original file line number Diff line number Diff line change
@@ -0,0 +1,59 @@
// Karma configuration file, see link for more information
// https://karma-runner.github.io/1.0/config/configuration-file.html

module.exports = function (config) {

const customLaunchers = {
'SL_Edge': {
base: 'SauceLabs',
browserName: 'MicrosoftEdge',
//version: '48.0',
platform: 'Windows 10',
timeout: 360,
idleTimeout: 5000,
maxDuration: 1800,
commandTimeout: 600
},
'SL_Chrome': {
base: 'SauceLabs',
browserName: 'chrome',
version: '64.0',
'chromedriverVersion':'2.35',
timeout: 360,
idleTimeout: 5000,
maxDuration: 1800,
commandTimeout: 600
}
};

config.set({
basePath: '',
frameworks: ['jasmine', '@angular/cli'],

plugins: [
require('karma-jasmine'),
require('karma-sauce-launcher'),
require('karma-jasmine-html-reporter'),
require('@angular/cli/plugins/karma')
],
client:{
clearContext: false // leave Jasmine Spec Runner output visible in browser
},
angularCli: {
environment: 'dev'
},
sauceLabs: {
testName: 'Data Flow Dashboard Unit Tests'
},
captureTimeout: 1000000,
browserDisconnectTimeout: 1000000,
concurrency: 1,
customLaunchers: customLaunchers,
browsers: Object.keys(customLaunchers),
singleRun: true,
reporters: ['progress', 'saucelabs'],
colors: true,
logLevel: config.LOG_DEBUG,
browserNoActivityTimeout: 1000000
});
};
7 changes: 7 additions & 0 deletions ui/package.json
Original file line number Diff line number Diff line change
Expand Up @@ -7,8 +7,12 @@
"start": "ng serve --proxy-config proxy.conf.json",
"build": "ng build",
"test": "ng test",
"test-saucelabs-local": "ng test --config karma-saucelabs.conf.js",
"test-browserstack-local": "ng test --config karma-browserstack.conf.js",
"lint": "ng lint",
"e2e": "ng e2e --proxy-config proxy.conf.json",
"e2e-saucelabs-local": "ng e2e --proxy-config proxy.conf.json --host dataflow.local --config protractor-saucelabs.conf.js -prod",
"e2e-browserstack-local": "ng e2e --proxy-config proxy.conf.json --host dataflow.local --config protractor-browserstack.conf.js -prod",
"install": "napa pivotal-cf/pivotal-ui:pivotal-ui-git-clone",
"doc": "./node_modules/.bin/compodoc -p tsconfig.json -n \"Spring Cloud Data Flow Dashboard Documentation\"",
"mavenbuild": "node ./node_modules/@angular/cli/bin/ng test --code-coverage true --watch false --browsers ChromeHeadless && node ./node_modules/@angular/cli/bin/ng build --prod --output-path ./../src/main/resources/public/dashboard --base-href /dashboard/",
Expand Down Expand Up @@ -57,6 +61,8 @@
"jasmine-spec-reporter": "4.2.1",
"karma": "2.0.0",
"karma-chrome-launcher": "2.2.0",
"karma-sauce-launcher": "1.2.0",
"karma-browserstack-launcher": "1.3.0",
"karma-coverage-istanbul-reporter": "1.4.2",
"karma-jasmine": "1.1.1",
"karma-jasmine-html-reporter": "0.2.2",
Expand All @@ -66,6 +72,7 @@
"typescript": "2.5.3",
"@compodoc/compodoc": "1.0.4",
"@types/d3": "4.12.0",
"browserstack-local": "1.3.0",
"napa": "2.3.0",
"webpack-bundle-analyzer": "2.9.0"
},
Expand Down
78 changes: 78 additions & 0 deletions ui/protractor-browserstack.conf.js
Original file line number Diff line number Diff line change
@@ -0,0 +1,78 @@
// Protractor configuration file, see link for more information
// https://github.com/angular/protractor/blob/master/lib/config.ts

const { SpecReporter } = require('jasmine-spec-reporter');
const browserstack = require('browserstack-local');

exports.config = {
jasmineNodeOpts: {
defaultTimeoutInterval: 5000000
},
seleniumAddress: 'http://hub-cloud.browserstack.com/wd/hub',
commonCapabilities: {
name: 'Data Flow Dashboard E2E Tests',
'browserstack.user': process.env.BROWSER_STACK_USERNAME,
'browserstack.key': process.env.BROWSER_STACK_ACCESS_KEY,
'browserstack.local': true,
'browserstack.debug': true
},
multiCapabilities: [
{
os: 'Windows',
os_version: '10',
browserName: 'Chrome',
browser_version: '62.0',
resolution: '1024x768'
},
{
os: 'Windows',
os_version: '10',
browserName: 'Edge',
browser_version: '16.0'
}
],

allScriptsTimeout: 160000,
specs: [
'./e2e/**/*.e2e-spec.ts'
],
directConnect: false,
baseUrl: 'http://localhost:4200/',
framework: 'jasmine',
// Code to start browserstack local before start of test
beforeLaunch: function(){
console.log("Connecting local");
return new Promise(function(resolve, reject){
exports.bs_local = new browserstack.Local();
exports.bs_local.start({'key': exports.config.commonCapabilities['browserstack.key'] }, function(error) {
if (error) return reject(error);
console.log('Connected. Now testing...');

resolve();
});
});
},

// Code to stop browserstack local after end of test
afterLaunch: function() {
return new Promise(function(resolve, reject){
exports.bs_local.stop(resolve);
});
},
jasmineNodeOpts: {
showColors: true,
defaultTimeoutInterval: 30000,
print: function() {}
},
onPrepare() {
require('ts-node').register({
project: 'e2e/tsconfig.e2e.json'
});
jasmine.getEnv().addReporter(new SpecReporter({ spec: { displayStacktrace: true } }));
}
};

// Code to support common capabilities
exports.config.multiCapabilities.forEach(function(caps){
for(var i in exports.config.commonCapabilities) caps[i] = caps[i] || exports.config.commonCapabilities[i];
});
73 changes: 73 additions & 0 deletions ui/protractor-saucelabs.conf.js
Original file line number Diff line number Diff line change
@@ -0,0 +1,73 @@
// Protractor configuration file, see link for more information
// https://github.com/angular/protractor/blob/master/lib/config.ts

const { SpecReporter } = require('jasmine-spec-reporter');

exports.config = {
jasmineNodeOpts: {
defaultTimeoutInterval: 5000000
},
sauceUser: process.env.SAUCE_USERNAME,
sauceKey: process.env.SAUCE_ACCESS_KEY,
multiCapabilities: [
{
name: 'E2E Safari/Mac',
browserName: 'safari',
platform: 'macOS 10.13',
},
{
name: 'E2E Edge/Win10',
browserName: 'MicrosoftEdge',
platform: 'Windows 10',
}
],

allScriptsTimeout: 160000,
specs: [
'./e2e/**/*.e2e-spec.ts'
],
directConnect: false,
baseUrl: 'http://localhost:4200/',
framework: 'jasmine',
beforeLaunch: function() {
const q = require('q');
const deferred = q.defer();
startSauceConnect(deferred);
return deferred.promise;
},
jasmineNodeOpts: {
showColors: true,
defaultTimeoutInterval: 30000,
print: function() {}
},
onPrepare() {
require('ts-node').register({
project: 'e2e/tsconfig.e2e.json'
});
jasmine.getEnv().addReporter(new SpecReporter({ spec: { displayStacktrace: true } }));
}
};

function startSauceConnect(deferred) {
var sauceConnectLauncher = require('sauce-connect-launcher');
console.log('Launching Sauce Connect...')
sauceConnectLauncher(
{
username: process.env.SAUCE_USERNAME,
accessKey: process.env.SAUCE_ACCESS_KEY,
// verbose: true,
// logger: console.log,
// tunnelIdentifier: 'npm-build',
// doctor: false
}, function (err, sauceConnectProcess) {
if (err) {
console.error('Error', err.message);
}
deferred.resolve();
console.log("Sauce Connect ready");
// sauceConnectProcess.close(function () {
// console.log("Closed Sauce Connect process");
// })
}
);
};

0 comments on commit 4c06fdf

Please sign in to comment.