2015-08-14 20 views
0

我只是試圖開始單元測試Angular代碼,並試圖使用Karma和Jasmine進行測試。我已經通過幾個不同的教程進行了檢查並模擬了他們的代碼,但是每次我的測試中$ scope都是未定義的。我一直在這一整天工作,已經閱讀了每一個相關的Stackoverflow問題(一對夫婦似乎相關但沒有得到答案),不斷縮小問題的範圍,使事情變得簡單和簡單等。我正要將我的頭髮拉出來。如果有人能幫助我,我將非常感激!

karma.config.js:

// Karma configuration 
// Generated on Tue Aug 11 2015 11:40:35 GMT-0500 (Central Daylight Time) 

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: [ 
     'Scripts/angular-min.js', 
     'Scripts/angular-mocks.js', 
     'Scripts/angular-route-min.js', 
     'Scripts/angular-resource.min.js', 
     'Scripts/hr-module.js', 
     'Scripts/jquery-1.8.2.js', 
     'Scripts/Employee/*.js' 

    ], 


    // list of files to exclude 
    exclude: [ 
     'Scripts/_references.js', 
     'Scripts/jquery-1.8.2.intellisense.js' 
    ], 


    // 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 
    }) 
} 

簡單controller.js:

(function() { 
    'use strict'; 

    angular.module('hrModule').controller('SimpleController', ['$scope', function ($scope) {   
     $scope.greeting = "hello world";   
    }]); 


}()); 

測試簡單的控制器:

'use strict'; 

describe('SimpleController', function() { 

    beforeEach(angular.mock.module('hrModule')); 

    var $controller, 
     scope, 
     SimpleController; 


    beforeEach(angular.mock.inject(function ($rootScope, _$controller_) { 
     scope = $rootScope.$new(); 
     $controller = _$controller_; 
     SimpleController = $controller('SimpleController', { $scope: scope }); 
    })); 


    it('says hello world', function() { 
     expect(scope).toBeDefined(); 
    });  

}); 

我不斷收到($注射器:modulerr)錯誤,當我運行它,並且說「期望undefined被定義」。如果有人在這裏看到任何問題,請告訴我!謝謝!

+1

當你在控制檯上的modulerr鏈接上單擊**時,它說了什麼?還有你加載了腳本聲明模塊'angular.module('hrModule',[...])'? – PSL

+0

是的,hr-module.js文件實際上是創建hrModule的文件(我應該提到或包含代碼)。並且在Windows上,我無法點擊控制檯中的任何內容。但是在那個錯誤之後有大量的編碼數據,所以我假設這可能是如果我能夠顯示的信息,但我無法讀取它。如果那裏有我缺少的良好信息,我可以在另一個安裝程序上嘗試代碼,看看我能否看到它。 – LeftOnTheMoon

+1

什麼意思是「在窗戶上」。我正在談論瀏覽器控制檯。或者只需從瀏覽器中複製粘貼該網址並點擊即可。也可以嘗試使用非縮小的angularjs開發,這會給你更詳細的信息。如果您按照控制檯中的錯誤鏈接,通常會導致這些錯誤很容易識別。 – PSL

回答

1

謝謝你,PSL在這方面與我一起工作。我真的很感激你回來繼續提供提示。

但是,解決方案比這更普通。這是我從Nuget(最新版本,1.4.x)獲取的angular.js文件與我從教程鏈接(1.3.3)下載的angular-mock.js腳本之間的不兼容性。出於某種原因,這導致了令我莫名其妙的模塊化錯誤,但我在用相同的文件重新構建一個較小的測試項目以在瀏覽器中測試它時發現了它。

因此,如果其他人得到這樣的錯誤,打開你的角庫文件,並確保它們都共享相同的版本號!

+0

其實,對不起,我相信這是使用最新版本的Jasmine和舊版本的angular-mock.js的問題。無論哪種方式,抓住angular-mock.js v1.4.4應該糾正這個問題。 – LeftOnTheMoon

相關問題