I'm relatively new to unit testing but was now tasked to write tests for a existing code base that I know quite well.
Sadly I'm unable to achieve any progress what so ever nor find really helpful documentation.
The main component of the code base is a service to retrieve data from an api but I'm unable to get an instance of the module the service belongs to:
TypeError: module is not a function in /home/faebser/workspace/GridSense-CMS-App/dev/test/unit/api.test.js (line 13)
karma config: http://sprunge.us/ObSP?js
tests: http://sprunge.us/AJWL?js
karma output: http://sprunge.us/WYHI?bash
What is the problem? why am I not able to get a instance of the module?
UPDATE1:
I'm managed to load my module by reinstalling the same version of angular and angular mocks. But now I run into the following error:
minErr/<#/home/faebser/workspace/GridSense-CMS-App/dev/bower_components/angular/angular.js:63:12
loadModules/<#/home/faebser/workspace/GridSense-CMS-App/dev/bower_components/angular/angular.js:4138:15
forEach#/home/faebser/workspace/GridSense-CMS-App/dev/bower_components/angular/angular.js:323:11
loadModules#/home/faebser/workspace/GridSense-CMS-App/dev/bower_components/angular/angular.js:4099:5
createInjector#/home/faebser/workspace/GridSense-CMS-App/dev/bower_components/angular/angular.js:4025:11
workFn#/home/faebser/workspace/GridSense-CMS-App/dev/bower_components/angular-mocks/angular-mocks.js:2425:44
I managed to track the error down to the following:
"[$injector:modulerr] Failed to instantiate module ui.router due to:[$injector:nomod] Module 'ui.router' 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.http://errors.angularjs.org/1.3.15/$injector/nomod?p0=ui.routerminErr/<#http://localhost:9876/base/bower_components/angular/angular.js:63:12module/<#http://localhost:9876/base/bower_components/angular/angular.js:1774:1ensure#http://localhost:9876/base/bower_components/angular/angular.js:1698:38module#http://localhost:9876/base/bower_components/angular/angular.js:1772:1loadModules/<#http://localhost:9876/base/bower_components/angular/angular.js:4115:22forEach#http://localhost:9876/base/bower_components/angular/angular.js:323:11loadModules#http://localhost:9876/base/bower_components/angular/angular.js:4099:5loadModules/<#http://localhost:9876/base/bower_components/angular/angular.js:4116:40forEach#http://localho"
Okay, simply forgot to add ui-router to karma-config.
It's looks like angular-mock is not loaded.
Checks well your path. For the moment, for karma it's look like :
-dev
|-test/
|-js/
|-bower_components/
|-karma.conf
Because in karma.conf, you have :
base: '',
Okay, I managed to get this to work.
The main problem was the strange error messages that angular gave me:
minErr/<#/home/faebser/workspace/GridSense-CMS-App/dev/bower_components/angular/angular.js:63:12
loadModules/<#/home/faebser/workspace/GridSense-CMS-App/dev/bower_components/angular/angular.js:4138:15
forEach#/home/faebser/workspace/GridSense-CMS-App/dev/bower_components/angular/angular.js:323:11
loadModules#/home/faebser/workspace/GridSense-CMS-App/dev/bower_components/angular/angular.js:4099:5
createInjector#/home/faebser/workspace/GridSense-CMS-App/dev/bower_components/angular/angular.js:4025:11
workFn#/home/faebser/workspace/GridSense-CMS-App/dev/bower_components/angular-mocks/angular-mocks.js:2425:44
To work around this I used the karma debug window and set a breakpoint at angular.js:63 in function minErr(module, ErrorConstructor):
return new ErrorConstructor(message);
that way you can see the arguments and the compiled error message. In the end i just forgot to add a few dependencies in the karma config file.
Related
I'm developing a web app with angular-meteor (Angular1). This uses webpack as a module bundler. Ever since I started I have found it impossible to inject npm/bower modules to my app module.
I constantly get errors such as:
Error: [$injector:nomod] Module xxx 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 usually follow official docs which consist of:
Downloading the npm module
Including the scripts in my index.html
Adding the module to my app module
But this always gives the error above.
I then try different techniques such as importing the module at the top of the page using:
import exampleModule from 'angular-example-module';
and adding exampleModule to my list of modules but nothing seems to work.
I used angular without webpack before and never had this problem. Am I missing something? Is there a particular procedure I don't know about?
Found the answer in case anyone else had the same question.
You must import the module in the main javascript file like so:
import moduleVariable from '<path-to-module>';
and then include the moduleVariable in the dependencies of your application module.
Website runs without any problems in production (files minified and concatenated), but when a page is sent to prerender.js or phantom.js for snapshot generation, I get an error:
Uncaught Error: [$injector:modulerr] Failed to instantiate module
myApp to: Error: [$injector:modulerr] Failed to instantiate module
myApp due to: Error: [$injector:nomod] Module 'myApp' 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.
https://www.mydomain.io/app/vendor.7240ef6a.js:4
https://www.mydomain.io/app/vendor.7240ef6a.js:3 in d
https://www.mydomain.io/app/vendor.7240ef6a.js:4 in m
https://www.mydomain.io/app/vendor.7240ef6a.js:4 in db
https://www.mydomain.io/app/vendor.7240ef6a.js:3 in g
https://www.mydomain.io/app/vendor.7240ef6a.js:3 in ea
https://www.mydomain.io/app/vendor.7240ef6a.js:3 in da
https://www.mydomain.io/app/vendor.7240ef6a.js:8
https://www.mydomain.io/app/vendor.7240ef6a.js:2 in j
https://www.mydomain.io/app/vendor.7240ef6a.js:2 in fireWith
https://www.mydomain.io/app/vendor.7240ef6a.js:2 in ready
https://www.mydomain.io/app/vendor.7240ef6a.js:1 in g
I have to files: vendor.js and app.js. I have exactly the same structure on my another project (just the files are different) and it works well with the same prerender.js server.
I managed to track the problem down to jquery.js. But I get stuck at that point. Seems like prerender/phanatom.js load files in different way. A also used window.prerenderReady = true/false to no avail.
I am using generator-angular-fullstack with Angular v1.5.8 and jQuery v2.2.4
In index.html jquery is included before angular. I wonder if there are any ways to get more detailed information on what causes the problem.
I've seen this happen before if your files are being loaded in the <body>. Loading scripts in the <body> makes them load asynchronously where it's possible that the scripts load in the incorrect order. Most newer browsers handle that nicely but PhantomJS (v2.1.1) will execute the script as soon as it's loaded, no matter the ordering.
I'd suggest trying to load those scripts in the <head>.
Using Karma to test Angular getting error:
Error: [$injector:modulerr] Failed to instantiate module ngMock due to:
Error: [$injector:unpr] Unknown provider: $$rAFProvider
Angular mock, Angular versions error?
I've heard solutions detailing changing of angular-mock version or angular version--which seems like a bad idea since I'd like to test on the same version as the app starts with.
Anyone else have an error like this?
Please check your angular version.
Your angular version and angular-mock version must be same.
To download angular-mock go the below link and replace the X.Y.Z with your angular version and save it
http://ajax.googleapis.com/ajax/libs/angularjs/X.Y.Z/angular-mocks.js
for example my angular version is 1.2.9
This work for me .
This issue was resolved by making sure the rails asset pipeline, which provides the angular-related assets in my case, was correctly serving assets during testing.
i am trying to run this
example
i got a error mesasge like this
Error: [$injector:nomod] Module 'MyApp' 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. http://errors.angularjs.org/1.2.14/$injector/nomod?p0=MyApp
return new Error(message);
anyone suggest how can i implement event handling in angularjs with websockets.
You have to create a module to use it... so you have to have this piece of code
angular.module('MyApp', [/*dependencies or empty array*/])
somewhere in your script - somewhere means before any other angular.module('MyApp').whatever... code
I always give up on testing because I find it is more work than actually writing code that works well, but I'm working on a project I hope to open-source, so am committed to writing tests this time.
I have this angular app, and when I define it I include the dependencies
var app = angular.module('app', [
'ngResource',
'ngSanitize',
'ngRoute',
'ui.ace'
]);
When I try to test a controller, I start with
beforeEach(angular.mock.module('app'));
beforeEach(angular.mock.inject(function($rootScope,$controller){
scope = $rootScope.$new();
$controller('FileSystemCtrl',{$scope:scope});
})
);
When I run jasmine, I get
Failed to instantiate module app due to:
Failed to instantiate module ui.ace due to:
Module 'ui.ace' is not available!
I don't want to have to list all the dependencies every time I mock or instantiate 'app' in a test, as that would mean when I add a new dependency, I'd have to go back and change all the already existing test.
This seems very inefficient to me.
Can somebody explain why I'm getting this error, and how to get around it?
If you're not using a test runner such as Karma, I'd highly recommend using that. Here's the link. What karma allows you to do is to define all of your required files in one main configuration file so you can maintain it in one central location. Plus there's a jasmine plugin for karma.