Angular, Jasmine mock whole module dependiences," is not available!" error - javascript

In my module i have some dependiences:
var app = angular.module('action', ['xeditable']);
Angular-xeditable is a bundle of AngularJS directives that allows you to create editable elements. more: http://vitalets.github.io/angular-xeditable/
End no i my Jasmine test i want to mock all this module.
I was trying like this:
var mocks;
beforeEach(function() {
mocks = jasmine.createSpyObj("mocks", ["xeditable"]);
module("action", function($provide){
$provide.value('xeditable', mocks.xeditable)
});
});
but i still get:
Error: [$injector:nomod] Module 'xeditable' is not available!
I know that there were a lot of questions about it but do not know how to deal, very please help :)

i solved it, just added another beforeEach before load module, like that:
beforeEach(function () {
//mock the xeditable lib:
angular.module("xeditable", []);
});
beforeEach(function() {
module("action");
});

Related

Error when trying to load require module

I've been trying to understand how to set up Stripe for my app but am having problems with the implementation of the module. Normally when using a module i would require it in the top of the file to be able to use it but when i do it in the paymentCtrl file it doesn't work and i get the two errors below: where am i supposed to declare it for me to be able to use it? Well as you see i'm quite new to this and would like to understand how to structure this so that the payments work.
errors:
Unexpected token.
and
Failed to instantiate module paymentController due to:
Error: [$injector:nomod] Module 'paymentController' is not available! You either misspelled the module name or forgot to load it. If registering a module ensure that you specify the dependencies as the second argument.
paymentCtrl:
angular.module('paymentController', [])
var stripe = require('stripe')('sk_test_....');
.controller('paymentCtrl', function($scope) {
});
app.js:
angular.module('userApp', ['appRoutes', 'userControllers', 'userServices', 'ngAnimate', 'mainController', 'authServices', 'managementController', 'paymentController'])
.config(function($httpProvider) {
$httpProvider.interceptors.push('AuthInterceptors');
});
try to move line:
var stripe = require('stripe')('sk_test_....');
above line:
angular.module('paymentController', [])

AngularJS Unit Test: Module 'admin.module' is not available

I'm testing an Angular controller using Karma and Jasmine but I can't seem to load in my module from my main class.
Here's my main class: admin.controller.js
angular.module('admin.module').controller('admin.controller', ['$scope', function ($scope) {
$scope.SaveChanges = function()
{
return true;
}
}]);
Here's my test class: admin.controller.tests.js
describe('admin.controller tests', function () {
beforeEach(module('admin.module'));
var $controller = {};
beforeEach(inject(function (_$controller_) {
$controller = _$controller_;
}));
describe('$scope.SaveChanges', function () {
it('Should return true', function () {
var $scope = {};
var controller = $controller('admin.controller', { $scope: $scope });
expect($scope.SaveChanges()).toBe(true);
});
});
});
My karma.conf.js file points to the following files in my project:
// list of files / patterns to load in the browser
files: [
'../TriAngular/scripts/angular.js',
'../TriAngular/scripts/angular-mocks.js',
'../TriAngular/app/admin/*.js',
'app/admin/*.js'
],
The admin.controller.js file is inside ../TriAngular/app/admin and my admin.controller.test.js is inside 'app/admin'.
I have tried to directly reference the files in my karma config file which has not worked. The full error is:
Module 'admin.module' is not available! You either misspelled the
module name or forgot to load it. If registering a module ensure that
you specify the dependencies as the second argument.
The issue turned out to not be obviously from the exception being shown. I was missing a angular-route.js file which needed to be included as it looked like my admin module was dependent on it.
List of includes in my karma.conf.js file:
// list of files / patterns to load in the browser
files: [
'../TriAngular/scripts/angular.js',
'../TriAngular/scripts/angular-mocks.js',
'../TriAngular/scripts/angular-route.js',
'../TriAngular/app/admin/*.js',
'app/admin/*.js'
],
Try;
beforeEach(function(){
module('admin.module');
}
});
I'm not familiar with Karma, but you also need to register your module as well, I've only ever used Jasmine with resharper so what I do to register files is;
/// <reference path="../scripts/app.js" />
At the top of the file.
Also don't forget to reference your module's dependencies as well.

Error with 'inject' angular and jasmine

I have been trying to find the problem but Im not capable, so
Eco:
Angular and Angular-mocks #1.4.3
Here my karma config file with correct order?
...
files: [
'../../www/lib/angular/angular.js',
'../../www/lib/angular-mocks/angular-mocks.js',
'../../www/js/core/app.js',
'../../www/js/core/**/*.js',
'../../www/js/feature/**/*.js'
],
...
My controller test
describe('HomeCtrl', function () {
beforeEach(function() {
module('app');
});
beforeEach(inject(function() {
}));
})
Error
/Users/rmas/src/node_modules/angular/angular.js:4386:53
forEach#/Users/rmas/src/node_modules/angular/angular.js:336:24
loadModules#/Users/rmas/src/node_modules/angular/angular.js:4346:12
createInjector#/Users/rmas/src/node_modules/angular/angular.js:4272:22
workFn#/Users/rmas/src/node_modules/angular-mocks/angular-mocks.js:2393:60
So I think the problem is angular-mocks ? I have tried with 1.5 version (angular and angular-mocks).
Module is 'app' is not a typing error.
Thanks for your help !
I had a similar problem, the issue was that I was not loading all needed modules, I missed the uiBootstrap module from loading and it was causing that issue as it was a dependency in my app.
Please verify if you have all required modules loaded in the Karma Configuration before trying to inject dependencies.

Why is my directives module not being included in my Angular app module?

Just learning Angular and I'm encountering a few issues with module resolution. In js/directives/directives.js I have the following directive scoped to a directives module:
angular.module("directives").directive("selectList", function() {
return {
restrict: 'E',
link: function() {
// do stuff
}
}
});
On my webpage:
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.4.4/angular.js"></script>
<script>
angular.module("editUserApp", ["directives"])
.controller("editUserController", ['$http', '$scope', function($http, $scope) {
// do stuff here
}]
);
</script>
The error I'm getting is as follows:
Error: [$injector:modulerr] Failed to instantiate module editUserApp due to:
[$injector:modulerr] Failed to instantiate module directives due to:
[$injector:nomod] Module 'directives' is not available! You either misspelled the module name or forgot to load it. If registering a module ensure that you specify the dependencies as the second argument.
Now, obviously, editUserApp cannot know where directives is, all by itself, so how do I tell it to fetch the directives.js file? Do I have to include it in a script tag (which doesn't seem very scalable)?
I need some way to import directives to my angular app. How can I do this?
You need to include your js/directives/directives.js file into your html and remove the directives dependency on your App module.
your code should be :
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.4.4/angular.js"></script>
<script>
angular.module("editUserApp", [])
.controller("editUserController", ['$http','directives', '$scope', function($http, $scope,directives) {
// do stuff here
}]
);
</script>
You need
angular.module("directives" ,[])
in your first block
angular.module("directives")
tries to find an existing module called directives
If you are looking for a way to import these files on a as needed basis, you might want to look at http://requirejs.org/ or http://browserify.org/ or similar tools.

Setting up Jasmine/karma for angular

I am lightly following this guide - http://paislee.io/testing-angularjs-with-grunt-karma-and-jasmine/ - and having a few issues as follows:
Error: [$injector:modulerr] Failed to instantiate module myApp due to:
Error: [$injector:modulerr] Failed to instantiate module ngRoute due to:
Error: [$injector:nomod] Module 'ngRoute' is not available! You either misspelled the module name or forgot to load it. If registering a module ensure that you specify the dependencies as the second argument.
I installed everything as it told me to and found another pretty basic example of setting up a test(this is my first time implementing so I'm starting small), the test looks like so
describe('Unit: MainCtrl', function() {
// Load the module with MainCtrl
beforeEach(module('myApp'));
var ctrl, scope;
// inject the $controller and $rootScope services
// in the beforeEach block
beforeEach(inject(function($controller, $rootScope) {
// Create a new scope that's a child of the $rootScope
scope = $rootScope.$new();
// Create the controller
ctrl = $controller('MainCtrl', {
$scope: scope
});
}));
it('should create $scope.greeting when calling sayHello',
function() {
expect(scope.greeting).toBeUndefined();
scope.sayHello();
expect(scope.greeting).toEqual("Hello Ari");
});
})
And in the controller it's just
$scope.name = "Ari";
$scope.sayHello = function() {
$scope.greeting = "Hello " + $scope.name;
}
(this is from http://www.ng-newsletter.com/advent2013/#!/day/19 )
I have my app set up and controllers in separate folders, using a regular ng-route structure, I'm thinking this maybe is the issue? I'm using grunt karma for this - here is the task just incase it's helpful.
karma: {
unit: {
options: {
frameworks: ['jasmine'],
singleRun: true,
browsers: ['PhantomJS'],
files: [
'app/bower_components/angular/angular.js',
'app/bower_components/angular-mocks/angular-mocks.js',
'app/scripts/**/*.js'
]
}
}
}
I could use some help, this is my first time attempting this, I would LOVE to get some automated testing in place. Thanks for reading!!
You need to include ngRoute in your files list in the karma conf. The error message says as much.
karma: {
unit: {
options: {
frameworks: ['jasmine'],
singleRun: true,
browsers: ['PhantomJS'],
files: [
'app/bower_components/angular/angular.js',
'app/bower_components/angular-mocks/angular-mocks.js',
'app/bower_components/angular-mocks/angular-route.js',
'app/scripts/**/*.js'
]
}
}
}
You have not included ngroute module, as there is some dependency on this module.
There should be a bower component
'app/bower_components/angular-route/angular-route.js',
Install this bower component and add this line to karma config.
Check for other module too.

Categories

Resources