From 9311c740c40a562d54845fe7028b34fd3555c9fb Mon Sep 17 00:00:00 2001 From: Stuart Colville Date: Thu, 9 Jul 2015 18:28:11 +0100 Subject: [PATCH] Add initial Saucelabs test setup --- karma.conf.js | 46 ++------------------------ karma.conf.sauce.js | 38 ++++++++++++++++++++++ karma.config.shared.js | 48 ++++++++++++++++++++++++++++ package.json | 2 ++ public/js/views/complete-payment.jsx | 12 +++++-- tasks/karma.js | 6 ++-- tests/test.complete-payment.jsx | 17 ++++++---- 7 files changed, 114 insertions(+), 55 deletions(-) create mode 100644 karma.conf.sauce.js create mode 100644 karma.config.shared.js diff --git a/karma.conf.js b/karma.conf.js index 045db95..2d6a8f5 100644 --- a/karma.conf.js +++ b/karma.conf.js @@ -1,49 +1,7 @@ 'use strict'; -var RewirePlugin = require('rewire-webpack'); -var webpackConfig = require('./webpack.config.js'); - -// Remove the bits from the shared config -// that we don't want for tests. -delete webpackConfig.output; -delete webpackConfig.entry; - -// Add this just for testing: -webpackConfig.plugins = [ - new RewirePlugin(), -]; - +var karmaConfig = require('./karma.config.shared'); module.exports = function (config) { - config.set({ - basePath: '', - browsers: ['Firefox'], - colors: true, - singleRun: true, - frameworks: [ - 'mocha', - 'chai', - 'sinon', - ], - files: [ - 'tests/test-loader.js', - ], - preprocessors: { - 'tests/test-loader.js': ['webpack', 'sourcemap'], - }, - reporters: ['mocha'], - webpack: webpackConfig, - webpackServer: { - noInfo: true, - }, - plugins: [ - 'karma-sinon', - 'karma-mocha', - 'karma-mocha-reporter', - 'karma-chai', - 'karma-firefox-launcher', - 'karma-sourcemap-loader', - 'karma-webpack', - ], - }); + config.set(karmaConfig); }; diff --git a/karma.conf.sauce.js b/karma.conf.sauce.js new file mode 100644 index 0000000..da99899 --- /dev/null +++ b/karma.conf.sauce.js @@ -0,0 +1,38 @@ +'use strict'; + +var defaults = require('lodash.defaults'); +var karmaConfig = require('./karma.config.shared'); +var browsers = require('mozilla-payments-saucelabs-browsers'); + + +module.exports = function (config) { + + if (!process.env.SAUCE_USERNAME || !process.env.SAUCE_ACCESS_KEY) { + console.log('Make sure the SAUCE_USERNAME and ' + + 'SAUCE_ACCESS_KEY environment variables are set.'); + throw new Error('Missing SAUCE_USERNAME and SAUCE_ACCESS_KEY env vars'); + } + + karmaConfig.plugins.push('karma-sauce-launcher'); + karmaConfig.reporters.push('saucelabs'); + + config.set(defaults({ + // Increase timeout in case connection in CI is slow + browserDisconnectTimeout: 10000, + browserDisconnectTolerance: 2, + browserNoActivityTimeout: 30000, + captureTimeout: 120000, + customLaunchers: browsers, + browsers: Object.keys(browsers), + port: 9876, + sauceLabs: { + testName: 'Payments UI Unit Tests', + recordScreenshots: false, + connectOptions: { + username: process.env.SAUCE_USERNAME, + accessKey: process.env.SAUCE_ACCESS_KEY, + tunnelIdentifier: 'autoGeneratedTunnelID', + }, + }, + }, karmaConfig)); +}; diff --git a/karma.config.shared.js b/karma.config.shared.js new file mode 100644 index 0000000..56669ac --- /dev/null +++ b/karma.config.shared.js @@ -0,0 +1,48 @@ +'use strict'; + +/* This is the shared karma config */ + +var RewirePlugin = require('rewire-webpack'); +var webpackConfig = require('./webpack.config.js'); + +// Remove the bits from the shared config +// that we don't want for tests. +delete webpackConfig.output; +delete webpackConfig.entry; + +// Add this just for testing: +webpackConfig.plugins = [ + new RewirePlugin(), +]; + +module.exports = { + basePath: '', + browsers: ['Firefox'], + colors: true, + frameworks: [ + 'mocha', + 'chai', + 'sinon', + ], + files: [ + 'tests/test-loader.js', + ], + preprocessors: { + 'tests/test-loader.js': ['webpack', 'sourcemap'], + }, + reporters: ['mocha'], + plugins: [ + 'karma-sinon', + 'karma-mocha', + 'karma-mocha-reporter', + 'karma-chai', + 'karma-firefox-launcher', + 'karma-sourcemap-loader', + 'karma-webpack', + ], + singleRun: true, + webpack: webpackConfig, + webpackServer: { + noInfo: true, + }, +}; diff --git a/package.json b/package.json index 0edc026..d6eb5ed 100644 --- a/package.json +++ b/package.json @@ -45,6 +45,7 @@ "karma-firefox-launcher": "0.1.6", "karma-mocha": "0.2.0", "karma-mocha-reporter": "1.0.2", + "karma-sauce-launcher": "0.2.14", "karma-sinon": "1.0.4", "karma-sourcemap-loader": "0.3.5", "karma-webpack": "1.5.1", @@ -52,6 +53,7 @@ "load-grunt-tasks": "3.1.0", "lodash.defaults": "3.1.2", "mocha": "2.2.5", + "mozilla-payments-saucelabs-browsers": "0.0.1", "node-libs-browser": "0.5.0", "payment-icons": "0.0.6", "rewire": "2.3.4", diff --git a/public/js/views/complete-payment.jsx b/public/js/views/complete-payment.jsx index 5e49d8b..0c61b08 100644 --- a/public/js/views/complete-payment.jsx +++ b/public/js/views/complete-payment.jsx @@ -16,6 +16,13 @@ module.exports = React.createClass({ propTypes: { productId: React.PropTypes.string.isRequired, userEmail: React.PropTypes.string.isRequired, + win: React.PropTypes.object, + }, + + getDefaultProps: function() { + return { + win: window, + }; }, componentDidMount: function() { @@ -24,14 +31,15 @@ module.exports = React.createClass({ handleClick: function(e) { e.preventDefault(); - if (window.parent !== window) { + var win = this.props.win; + if (win.parent !== window) { // Note: the targetOrigin is wide open. // Nothing sensitive should be sent whilst // that's the case. console.log('Telling parent to close modal.'); // Stringifying the object is necessary for // IE9 support. - window.parent.postMessage(JSON.stringify({ + win.parent.postMessage(JSON.stringify({ event: 'purchase-completed', }), '*'); } else { diff --git a/tasks/karma.js b/tasks/karma.js index afae363..7a65bb1 100644 --- a/tasks/karma.js +++ b/tasks/karma.js @@ -2,7 +2,7 @@ var grunt = require('grunt'); module.exports = { options: { - logLevel: grunt.option('log-level') || 'ERROR', + logLevel: grunt.option('log-level') || 'INFO', }, dev: { configFile: 'karma.conf.js', @@ -10,6 +10,8 @@ module.exports = { }, run: { configFile: 'karma.conf.js', - singleRun: true + }, + sauce: { + configFile: 'karma.conf.sauce.js', }, }; diff --git a/tests/test.complete-payment.jsx b/tests/test.complete-payment.jsx index 23dd746..8f5166e 100644 --- a/tests/test.complete-payment.jsx +++ b/tests/test.complete-payment.jsx @@ -11,21 +11,24 @@ var helpers = require('./helpers'); describe('CompletePayment', function() { beforeEach(function() { + this.sandbox = sinon.sandbox.create(); this.email = 'buyer@somewhere.org'; - + this.win = { + parent: { + postMessage: this.sandbox.stub(), + }, + }; React = require('react'); TestUtils = require('react/lib/ReactTestUtils'); - this.CompletePayment = TestUtils.renderIntoDocument( + userEmail={this.email} + win={this.win} /> ); - - sinon.stub(window.parent, 'postMessage'); }); afterEach(function() { - window.parent.postMessage.restore(); + this.sandbox.restore(); }); it('should show where the receipt was emailed', function() { @@ -42,7 +45,7 @@ describe('CompletePayment', function() { TestUtils.Simulate.click(this.button, event); assert.equal(event.preventDefault.callCount, 1); - assert.ok(window.parent.postMessage.calledWith( + assert.ok(this.win.parent.postMessage.calledWith( JSON.stringify({event: 'purchase-completed'}), '*')); });