I currently have a setup where Angular and Laravel are used together in an application. In this setup, Laravel functions as an API that serves JSON data to the Angular frontend. The initial page that loads the Angular app, index.php, is served by Laravel before Angular takes control.
I've been facing challenges getting started with Karma and Jasmine testing. Whenever I try to run tests using karma start or karma start karma.conf.js from the root directory of my project, I encounter the following error:
ReferenceError: module is not definedHere is the full output:
INFO [karma]: Karma v0.12.28 server started at http://localhost:9876/
INFO [launcher]: Starting browser Chrome
WARN [watcher]: Pattern "/Users/raph/coding/webroot/digitalocean/rugapp/public/rugapp/*.js" does not match any file.
INFO [Chrome 39.0.2171 (Mac OS X 10.9.5)]: Connected on socket 3OCUMp_xhrGtlGHwiosO with id 7897120
Chrome 39.0.2171 (Mac OS X 10.9.5) hello world encountered a declaration exception FAILED
ReferenceError: module is not defined
at Suite.<anonymous> (/Users/raph/coding/webroot/digitalocean/rugapp/tests/js/test.js:3:16)
at jasmineInterface.describe (/Users/raph/coding/webroot/digitalocean/rugapp/node_modules/karma-jasmine/lib/boot.js:59:18)
at /Users/raph/coding/webroot/digitalocean/rugapp/tests/js/test.js:1:1
Chrome 39.0.2171 (Mac OS X 10.9.5): Executed 2 of 2 (1 FAILED) (0.005 secs / 0.003 secs)
Despite the error, the Chrome browser launches with the desired content displayed.
The contents of my karma.conf.js file are detailed below:
// Karma configuration
// Generated on Mon Dec 22 2014 18:13:09 GMT-0500 (EST)
module.exports = function(config) {
config.set({
// base path that will be used to resolve all patterns (eg. files, exclude)
basePath: 'public/rugapp/',
// frameworks to use
// available frameworks: https://npmjs.org/browse/keyword/karma-adapter
frameworks: ['jasmine'],
// list of files / patterns to load in the browser
files: [
'*.html',
'**/*.js',
'../../tests/js/test.js',
'../../tests/js/angular/angular-mocks.js'
],
// list of files to exclude
exclude: [
],
// 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: ['progress'],
// 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 whenever any file changes
autoWatch: true,
// start these browsers
// available browser launchers: https://npmjs.org/browse/keyword/karma-launcher
browsers: ['Chrome'],
// Continuous Integration mode
// if true, Karma captures browsers, runs the tests and exits
singleRun: false
});
};
Here's the content of my package.json file:
{
"devDependencies": {
"gulp": "^3.8.8",
"karma": "^0.12.28",
"karma-chrome-launcher": "^0.1.7",
"karma-jasmine": "^0.3.2",
"laravel-elixir": "*"
}
}
test.js
describe("hello world", function() {
var CreateInvoiceController;
beforeEach(module("MobileAngularUiExamples"));
beforeEach(inject(function($controller) {
CreateInvoiceController = $controller("CreateInvoiceController");
}));
describe("CreateInvoiceController", function() {
it("Should say hello", function() {
expect(CreateInvoiceController.message).toBe("Hello");
});
});
});
describe("true", function() {
it("Should be true", function() {
expect(true).toBeTruthy();
});
});
If you have any insights or suggestions, they would be greatly appreciated.