个人中心
gpt4 book ai didi

javascript - Karma 未按预期运行 Angular 测试

转载 作者：太空宇宙 更新时间：2023-11-04 16:08:04 25 4
gpt4 key购买 nike

我是 Karma 新手，因此错误可能非常基本。

这是我的 karma.conf.js 文件 

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/angular-mocks/angular-mocks.js',
      'bower_components/angular-resource/angular-resource.js',
      'app/index.js',
      'app/heroDetail.js',
      'app/*.js',
      'test/*.js',
      'app/**/*.js',
      '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: {
    },


    // 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 simultaneous
    concurrency: Infinity
  })
}

在 app 目录 中，我的 js 和 html 文件驻留在其中。

enter image description here

index.html 看起来像:

<!doctype html>
<html lang="en">
<head>
  <meta charset="UTF-8">
  <title>Example - example-heroComponentSimple-production</title>

  <script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.5.7/angular.min.js"></script>

  <script src="index.js"></script>
  <script src="heroDetail.js"></script>

</head>
<body ng-app="heroApp">
  <!-- components match only elements -->
<div ng-controller="MainCtrl as ctrl">
  <b>Hero</b><br>
  <hero-detail hero="ctrl.hero"></hero-detail>
</div>
</body>
</html>

和 index.js 看起来像:

(function(angular) {
  'use strict';
    angular.module('heroApp', []).controller('MainCtrl', function MainCtrl() {
        this.hero = {
            name: 'Miles Bronson'
        };
    });
})(window.angular);

现在在我尝试过的测试规范文件中:

describe('MainController',function(){
    var $rootScope,
        $scope,
        controller;
    beforeEach(function(){
        module('heroApp');

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

    it('should initialize name of the hero',function(){
        expect($scope.hero.name).toEqual('Miles Bronson'); 
    });

    it('should not pass',function(){
        expect($scope.hero.name).toEqual('Milesl Bronsonkk'); 
    });
});

现在，当我执行 karma start karma.conf.js 时，它会显示 

$ karma start karma.conf.js
18 01 2017 19:58:51.928:WARN [karma]: No captured browser, open http://localhost:9876/
18 01 2017 19:58:51.943:INFO [karma]: Karma v1.4.0 server started at http://0.0.0.0:9876/
18 01 2017 19:58:51.943:INFO [launcher]: Launching browser Chrome with unlimited concurrency
18 01 2017 19:58:51.953:INFO [launcher]: Starting browser Chrome
18 01 2017 19:58:54.145:INFO [Chrome 55.0.2883 (Windows 8.1 0.0.0)]: Connected on socket oOKBdNiWr9pVmcqnAAAA with id 12481546
Chrome 55.0.2883 (Windows 8.1 0.0.0) MainController should initialize name of the hero FAILED
        TypeError: Cannot read property 'name' of undefined
            at Object.<anonymous> (test/controllers/main-controller-spec.js:45:27)
Chrome 55.0.2883 (Windows 8.1 0.0.0) MainController should not pass FAILED
        TypeError: Cannot read property 'name' of undefined
            at Object.<anonymous> (test/controllers/main-controller-spec.js:49:27)
Chrome 55.0.2883 (Windows 8.1 0.0.0): Executed 2 of 2 (2 FAILED) ERROR (0.052 secs / 0.038 secs)

但是第二个应该失败，而第一个应该通过？为什么会出现这种意外行为？

我做错了什么？

chrome浏览器也没有多大帮助......

enter image description here

请帮忙!

最佳答案

我认为您可能遇到了嵌套问题，并且描述了太多...

看起来你想要更多类似这样的东西，其中 beforeEach 在每次测试之前触发:

describe('MainController',function(){
    var $rootScope,
        $scope,
        controller;
    beforeEach(function(){
        module('heroApp');

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

    it('should initialize name of the hero',function(){
        expect($scope.hero.name).toEqual('Miles Bronson'); 
    });

    it('should not pass',function(){
        expect($scope.hero.name).toEqual('Milesl Bronsonkk'); 
    });
});

此外，您并没有真正在 Controller 中使用全局范围...我认为您的测试在设置和断言方面可以简单得多。像这样的东西:

describe('TestMainController',function(){
    beforeEach(module('heroApp'));

    var $controller;

    beforeEach(inject(function(_$controller_){
      $controller = _$controller_;
    }));

    it('should initialize name of the hero',function(){
      var controller = $controller('MainController');
      expect(controller.hero.name).toEqual('Miles Bronson'); 
    });

    it('should not pass',function(){
      var controller = $controller('MainController');
      expect(controller.hero.name).toEqual('Milesl Bronsonkk'); 
    });
});

这是一个 plunkr: https://plnkr.co/edit/IAs4iYL69E8Nm5uvQDw1?p=preview

关于javascript - Karma 未按预期运行 Angular 测试，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/41720079/

25 4 0
文章推荐： python - 通过其相邻值推导 html 元素
文章推荐： javascript - 如何在 Safari 中显示保存文件对话框？
文章推荐： asp.net - asp :ListBox 的 IE 7 中的最小宽度
文章推荐： css - 移动优化基于表格的网站？
太空宇宙
个人简介

我是一名优秀的程序员,十分优秀！

滴滴打车优惠券免费领取
滴滴打车优惠券
Copyright 2021 - 2024 cfsdn All Rights Reserved 蜀ICP备2022000587号
广告合作:1813099741@qq.com 6ren.com