From 8638cd76989f1e4ebc5c8da3556132ce30df8163 Mon Sep 17 00:00:00 2001 From: sneakypete81 Date: Thu, 1 Dec 2016 22:08:31 +0000 Subject: [PATCH] Modify mocha-test-clients to use Karma (#149) --- mocha-client-tests/README.md | 39 ++++++++-- mocha-client-tests/addon/background.js | 4 +- mocha-client-tests/karma.conf.js | 73 +++++++++++++++++++ mocha-client-tests/package.json | 12 +-- mocha-client-tests/tests/background.html | 26 ------- .../tests/lib/background.test.js | 5 +- 6 files changed, 116 insertions(+), 43 deletions(-) create mode 100644 mocha-client-tests/karma.conf.js delete mode 100644 mocha-client-tests/tests/background.html diff --git a/mocha-client-tests/README.md b/mocha-client-tests/README.md index 1d0d376..ee72c2a 100644 --- a/mocha-client-tests/README.md +++ b/mocha-client-tests/README.md @@ -1,17 +1,40 @@ #Mocha client tests for WebExtensions -##Install dependency -`npm install` - will install all dependencies for running PhantomJS outside of addon +##Introduction +This example shows two methods of testing a WebExtension: +* Running tests from within the addon +* Running tests from the commandline using Karma -Than please run `cd ./addon/` and `npm install` to install mocha. It give you possibility to run client test inside of addon with mocha UI. If you don't want to have mocha UI you can install [WebConsole-reporter](https://github.com/eeroan/WebConsole-reporter) +See https://github.com/Standard8/example-webextension for a more complete example of WebExtension test configuration. -##Run with web-ext cli +##Install Dependencies: +``` + npm install +``` +To run tests from within the addon: +``` + cd addon + npm install +``` + +##Testing within the Addon +This gives you the possibility to run client tests inside the addon with the mocha UI. +If you don't want to use the mocha UI, you can install [WebConsole-reporter](https://github.com/eeroan/WebConsole-reporter). + +###Run with web-ext cli Just run `npm run web-ext` (will work with FF dev edition), if you have error with web-ext cli please add path for FF binary file with `--firefox-binary /path/to/firefox-bin` [(web-ext docs)](https://developer.mozilla.org/en-US/Add-ons/WebExtensions/web-ext_command_reference). -When addon will start click on mocha icon in your browser bar to run client tests: +When the addon starts, click on the mocha icon in your browser bar to run the tests: ![addon screenshot](screenshots/addon-button.png "Mocha test addon") -Addon will run test of `./addon/background.js` in `./addon/tests/lib/background-messaging.test.js` -##PhantomJs tests -`npm test` will run simple test of `./addon/background.js` in `./tests/lib/background.test.js` \ No newline at end of file +This will test `./addon/background.js` with `./addon/tests/lib/background-messaging.test.js`. + +##Testing from the Commandline +This uses [Karma](http://karma-runner.github.io) to run tests from the commandline. Just type `npm test` to test `./addon/background.js` with `./tests/lib/background.test.js`. + +###Debug Mode +Use `npm run test:debug` to run Karma in watch mode. Whenever you modify a Javascript file, the tests will automatically rerun. + +You can install [karma-notification-reporter](https://www.npmjs.com/package/karma-notification-reporter) to display test results in a desktop notification. You'll need to add `--reporters=dots,notification` to the `test:debug` command line of +`package.json` to enable it. diff --git a/mocha-client-tests/addon/background.js b/mocha-client-tests/addon/background.js index 1bda77c..c434fcc 100644 --- a/mocha-client-tests/addon/background.js +++ b/mocha-client-tests/addon/background.js @@ -3,7 +3,7 @@ var Background = { if (msg && msg.action && Background.hasOwnProperty(msg.action)) { return Background[msg.action](msg, sender, sendResponse); } else { - console.warning('No handler for message: ' + JSON.stringify(msg)); + console.warn('No handler for message: ' + JSON.stringify(msg)); } }, ping: function(msg, sender, sendResponse) { @@ -12,4 +12,4 @@ var Background = { } }; -chrome.runtime.onMessage.addListener(Background.receiveMessage); \ No newline at end of file +chrome.runtime.onMessage.addListener(Background.receiveMessage); diff --git a/mocha-client-tests/karma.conf.js b/mocha-client-tests/karma.conf.js new file mode 100644 index 0000000..9544b1d --- /dev/null +++ b/mocha-client-tests/karma.conf.js @@ -0,0 +1,73 @@ +module.exports = function(config) { + config.set({ + + // base path that will be used to resolve all patterns (eg. files, exclude) + basePath: '', + + // frameworks to use + // available frameworks: https://npmjs.org/browse/keyword/karma-adapter + frameworks: ['mocha'], + + // list of files / patterns to load in the browser + files: [ + // Test dependencies + 'node_modules/expect.js/index.js', + 'node_modules/sinon-chrome/bundle/sinon-chrome-webextensions.min.js', + + // Source + 'addon/*.js', + + // Tests + 'tests/lib/*.js' + ], + + // The tests below are intended to be run from inside the WebExtension itself, + // not from the Karma test suite. + exclude: [ + 'addon/tests', + ], + + client: { + mocha: { + // change Karma's debug.html to the mocha web reporter + reporter: 'html', + }, + }, + + // preprocess matching files before serving them to the browser + // available preprocessors: https://npmjs.org/browse/keyword/karma-preprocessor + preprocessors: { + }, + + // test results reporter to use + // possible values: 'dots', 'progress' + // available reporters: https://npmjs.org/browse/keyword/karma-reporter + reporters: ['dots'], + + // web server port + port: 9876, + + // enable / disable colors in the output (reporters and logs) + colors: true, + + // level of logging + // possible values: config.LOG_DISABLE || config.LOG_ERROR || + // config.LOG_WARN || config.LOG_INFO || config.LOG_DEBUG + logLevel: config.LOG_INFO, + + // enable/disable watching file and executing tests when any file changes + autoWatch: false, + + // start these browsers + // available browser launchers: https://npmjs.org/browse/keyword/karma-launcher + browsers: ['Firefox'], + + // Continuous Integration mode + // if true, Karma captures browsers, runs the tests and exits + singleRun: true, + + // Concurrency level + // how many browser should be started simultaneous + concurrency: Infinity, + }); +}; diff --git a/mocha-client-tests/package.json b/mocha-client-tests/package.json index eb0adb2..27976d1 100644 --- a/mocha-client-tests/package.json +++ b/mocha-client-tests/package.json @@ -4,18 +4,20 @@ "description": "Example how to run unit tests for WebExtension", "main": "index.js", "scripts": { - "test": "mocha-phantomjs -p ./node_modules/phantomjs-prebuilt/bin/phantomjs -R nyan tests/background.html", + "test": "karma start", + "test:debug": "karma start --no-single-run --auto-watch", "web-ext": "web-ext run -s ./addon" }, "author": "", "license": "MPL-2.0", "devDependencies": { "chai": "^3.5.0", - "chrome-mock": "0.0.9", - "mocha": "^3.1.2", - "mocha-phantomjs": "^4.1.0", - "phantomjs-prebuilt": "^2.1.13", "expect.js": "^0.3.1", + "karma": "^1.3.0", + "karma-firefox-launcher": "^1.0.0", + "karma-mocha": "^1.3.0", + "mocha": "^3.1.2", + "sinon-chrome": "^2.1.2", "web-ext": "^1.6.0" } } diff --git a/mocha-client-tests/tests/background.html b/mocha-client-tests/tests/background.html deleted file mode 100644 index b2993b1..0000000 --- a/mocha-client-tests/tests/background.html +++ /dev/null @@ -1,26 +0,0 @@ - - - - Tests for background - - - - -
- - - - - - - - - - - diff --git a/mocha-client-tests/tests/lib/background.test.js b/mocha-client-tests/tests/lib/background.test.js index bf42c31..0588bb3 100644 --- a/mocha-client-tests/tests/lib/background.test.js +++ b/mocha-client-tests/tests/lib/background.test.js @@ -1,9 +1,10 @@ describe('Background', function() { describe('ping', function() { - it('should return pong in response', function() { + it('should return pong in response', function(done) { Background.ping(false, false, function(response) { expect(response).to.equal('pong'); + done(); }); }); }); -}); \ No newline at end of file +});