AngularJS - ユニットテストコントローラとサービス

Question

私はAngularJSのユニットテストには全く新しく、髪を引っ張っています。私は現在、単体テストに必要な出力を生成する単純なコントローラをテストしています。

コントローラ：SummaryController

(function(app) { 
 
    'use strict'; 
 

 
    function SummaryController($scope, $stateParams, $state, $interval, $payments, $cashierApp, $window, $banks, $prepaidcards, $flash, $player, $cookies, $rootScope, $filter) { 
 
    // lots of stuff going on here, but I only need this part 
 
    $scope.showQR = $payments.get('paymentoption').content.field_display_qrcode; 
 
    // a basic assignment of a boolean value which I need to check if it is defined 
 
    } 
 
    app.controller('depositStatusCtrl', ['$scope', '$stateParams', '$state', '$interval', '$payments', '$cashierApp', '$window', '$banks', '$prepaidcards', '$flash', '$player', '$cookies', '$rootScope', '$filter', SummaryController]); 
 
})(angular.module('cashierApp'));

スペック（単体テスト）：controller.spec.js

'use strict'; 
 

 
describe('Cashier App: Deposit Status Page', function() { 
 

 
    var service, 
 
    ctrl, 
 
    scope; 
 

 
    beforeEach(module('cashierApp')); 
 

 
    beforeEach(inject(function($rootScope, $controller, SummaryController) { 
 
    scope = $rootScope.$new(); 
 
    mockSummaryCtrl = SummaryController; 
 
    spyOn(mockSummaryCtrl, 'save').andCallThrough(); 
 
    firstController = $controller('depositStatusCtrl', { 
 
     $scope: scope, 
 
     SummaryController: mockSummaryCtrl 
 
    }); 
 
    })); 
 

 
    it('should check if qrcode display is enabled', function() { 
 
    expect(scope.showQR).toBeDefined(); 
 
    // expect(scope.showQR).toBe(true); 
 
    // expect(scope.showQR).toBe(false); 
 
    }); 
 
});

私はウェブ上で見つけられるすべての方法を試しましたが、これを試したのは、hereという例に基づいていました。

これはまったく動作しません。どのように AnglesJSのテストコントローラおよび/またはプロバイダですか？

Error: [$injector:unpr] Unknown provider: SummaryControllerProvider <- SummaryController

EDIT：：私は（私がところで、カルマ・ジャスミンを使用しています）karma startを実行すると、私はいつもの同じエラーを取得します。ここに私karma.conf.jsですあなたが私の依存関係をどのように使うのかを知る必要がある場合に備えて。

'use strict'; 
 

 
module.exports = function(config) { 
 

 
    var configuration = { 
 
    autoWatch: true, 
 

 
    frameworks: ['jasmine'], 
 

 
    files: [ 
 
     'node_modules/angular/angular.js', 
 
     'node_modules/angular-mocks/angular-mocks.js', 
 
     'node_modules/angular-ui-router/release/angular-ui-router.js', 
 
     'bower_components/angular-carousel/dist/angular-carousel.js', 
 
     'bower_components/angular-cookies/angular-cookies.js', 
 
     'bower_components/angular-messages/angular-messages.js', 
 
     'bower_components/ngclipboard/src/ngclipboard.js', 
 
     'bower_components/angular-qrcode/angular-qrcode.js', 
 
     'bower_components/angular-sanitize/angular-sanitize.min.js', 
 
     'bower_components/ng-file-upload/ng-file-upload-all.min.js', 
 
     'bower_components/ng-device-detector/ng-device-detector.min.js', 
 
     'bower_components/re-tree/re-tree.min.js', 
 
     'bower_components/angular-timer/dist/angular-timer.min.js', 
 
     'bower_components/angular-touch/angular-touch.min.js', 
 
     'bower_components/highlightjs/highlight.pack.min.js', 
 
     'bower_components/moment/moment.js', 
 
     'src/app/app.js', 
 
     'src/app/core/cashier.core.js', 
 
     'src/app/core/directives/modal/modal.js', 
 
     'src/app/pages/deposit/deposit.js', 
 
     'src/app/pages/withdrawal/withdrawal.js', 
 
     'src/app/paymentoptions/alipaywap/alipaywap.js', 
 
     'src/app/paymentoptions/alipaywap/alipaywap.confirm.js', 
 
     'src/app/paymentoptions/astropay/astropay.js', 
 
     'src/app/paymentoptions/atmotc/atmotc.js', 
 
     'src/app/paymentoptions/atmotc/atmotc.confirm.js', 
 
     'src/app/paymentoptions/banktransfer/banktransfer.js', 
 
     'src/app/paymentoptions/banktransfer/banktransfer.confirm.js', 
 
     'src/app/paymentoptions/bitcoin/bitcoin.js', 
 
     'src/app/paymentoptions/bitcoinwithdrawal/bitcoinwithdrawal.js', 
 
     'src/app/paymentoptions/debitcard/debitcard.js', 
 
     'src/app/paymentoptions/lbtwithdrawal/lbtwithdrawal.js', 
 
     'src/app/paymentoptions/prepaidcard/prepaidcard.js', 
 
     'src/app/paymentoptions/qqpay/qqpay.js', 
 
     'src/app/paymentoptions/unionpay/unionpay.js', 
 
     'src/app/paymentoptions/wcnp/wcnp.js', 
 
     'src/app/paymentoptions/wechat/wechat.js', 
 
     'src/app/pages/deposit/deposit.status/deposit.status.controller.js', 
 
     'src/app/pages/deposit/deposit.status/deposit.status.controller.spec.js' 
 
    ], 
 

 
    reporters: ['progress', 'coverage', 'junit'], 
 

 
    ngHtml2JsPreprocessor: { 
 
     stripPrefix: 'src/', 
 
     moduleName: 'templates' 
 
    }, 
 

 
    // browsers: ['PhantomJS','Chrome'], 
 
    browsers: ['Chrome'], 
 

 
    plugins: [ 
 
     'karma-chrome-launcher', 
 
     'karma-phantomjs-launcher', 
 
     'karma-angular-filesort', 
 
     'karma-jasmine', 
 
     'karma-ng-html2js-preprocessor', 
 
     'karma-junit-reporter', 
 
     'karma-coverage' 
 
    ], 
 

 
    junitReporter: { 
 
     outputFile: 'target/unittest-results.xml', 
 
     suite: '' 
 
    }, 
 

 
    preprocessors: { 
 
     'src/**/*.html': ['ng-html2js'], 
 
     'src/**/*.js': ['coverage'] 
 
    }, 
 

 
    coverageReporter: { 
 
     reporters: [{ 
 
      type: 'cobertura', 
 
      dir: 'target/coverage/' 
 
     }, 
 
     { 
 
      type: 'html', 
 
      dir: 'target/coverage/' 
 
     } 
 
     ] 
 
    } 
 
    }; 
 

 
    // This block is needed to execute Chrome on Travis 
 
    // If you ever plan to use Chrome and Travis, you can keep it 
 
    // If not, you can safely remove it 
 
    // https://github.com/karma-runner/karma/issues/1144#issuecomment-53633076 
 
    if (configuration.browsers[0] === 'Chrome' && process.env.TRAVIS) { 
 
    configuration.customLaunchers = { 
 
     'chrome-travis-ci': { 
 
     base: 'Chrome', 
 
     flags: ['--no-sandbox'] 
 
     } 
 
    }; 
 
    configuration.browsers = ['chrome-travis-ci']; 
 
    } 
 

 
    config.set(configuration); 
 
};

Answer 1

このことから始めるようにしてください。角度のインジェクタがコントローラー、サービス、e.t.cなどの既知の「タイプ」だけで動作するというエラーが発生しない理由は、そして、あなたの例では、今はない、いくつかの機能を取得しようとしました。ただし、コントローラname-depositStatusCtrlによってこの機能を認識します。

beforeEach(inject(function($rootScope, $controller, depositStatusCtrl) { 
    spyOn(depositStatusCtrl, 'save').andCallThrough(); 
    })); 

    it('should check if qrcode display is enabled', function() { 
    expect(depositStatusCtrl).toBeDefined(); 
    });