how to include module in angualar js to remove error module not found?

Ad

I am make simple app to display only header using angular js .here is my code http://plnkr.co/edit/dplJ6sf4kgiwJ5pXu4GE?p=preview It is showing only "home" header I make same code in computer and install karma and everything ..

my issue is I am not able to test it's controller .I am getting this error

 Failed to instantiate module app.home due to:
        Error: [$injector:nomod] Module 'app.home' 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.4.8/$injector/nomod?p0=app.home
            at /Users/naveenkumar/Documents/ionic_work/SimpleDemo/bower_components/angular/angular.js:68:12

I make karma.conf.js like that

// Karma configuration
// Generated on Fri Dec 18 2015 19:53:32 GMT+0530 (IST)

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: ['jasmine'],


    // list of files / patterns to load in the browser
    files: [

        'bower_components/angular/angular.js' ,
        'bower_components/jquery/dist/jquery.js' ,

        'bower_components/angular-mocks/angular-mocks.js' ,
        'bower_components/angular-resource/angular-resource.js' ,

        'app/**/.js',
        'app/**/*.html',
      'test/**.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: {
        'app/**/*.html':['ng-html2js']
    },

      ngHtml2JsPreprocessor:{
          moduleName:'templates'

    },

    // 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,

    // Concurrency level
    // how many browser should be started simultanous
    concurrency: Infinity
  })
}

I do testing like this

describe('check value',function(){

    var controller,
        $scope,
        $rootScope;
    beforeEach(function(){
        module('app.home')

        inject(function($injector){
            $rootScope=$injector.get('$rootScope');
            $scope=$rootScope.$new();
            controller=$injector.get('$controller')('homecntrl',{$scope:$scope});

        })

    })



    //it('check   value after click',function(){
    //    controller.clickbtn();
    //    expect(controller.message).toEqual('test');
    //})

    it('check  init',function(){
        expect(controller.message).toBeUndefined();
    })
    it('check fine',function(){
        expect(true).toBeTruthy();
    })


})
Ad

Answer

Ad

The problem was two fold in your index.html file.

The first problem was that you imported your controller before you imported your modules in the HTML file. The second problem arose where the Karma version you imported did not match the angular version you were using.

Modules imported before controller

<script src="controller/home.controller.js"></script>
<script src="router/router.js"></script>
<script src="app.js"></script>

Karma set to Angular version 1.4.8, but Angular is version 1.2.16

<script data-require="angular.js" data-semver="1.2.16" src="https://ajax.googleapis.com/ajax/libs/angularjs/1.4.8/angular.min.js"></script>

When importing the scripts for an Angular app, you must have module dependencies imported before the module themselves and finally all controllers, directives and services must be imported after the module they are attributed to. 'app' is dependant on 'app.home' so 'app.home' is imported before 'app'. 'homeCntrl' is attributed to the module 'app' so 'app' is imported before 'homeCntrl'.

Rearrange to be as follows:

<script src="router/router.js"></script>
<script src="app.js"></script>
<script src="controller/home.controller.js"></script>

And finally update your version of Karma to match the version of Angular you're using.

<script data-require="angular.js" data-semver="1.2.16" src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.16/angular.min.js"></script>

plunkr:

http://plnkr.co/edit/xzvhXHPoUdulOM9clOkQ?p=preview

Ad
source: stackoverflow.com
Ad