TypeError：未定義はオブジェクトではありません（AboutCtrl.awesomeThin gsを評価しています）

-2

ユニットテストを設定しようとしていますapp/scripts/controllers/about.js（AboutCtrl.awesomeThingsの評価）：私は以下のエラーが表示されます。TypeError：未定義はオブジェクトではありません（AboutCtrl.awesomeThin gsを評価しています）

ユニットテストを設定しようとしていますapp/scripts/controllers/about.js（AboutCtrl.awesomeThingsの評価）：私は以下のエラーが表示されます。

C:\xampp\htdocs\angulargulp>gulp test 
    [16:46:06] Using gulpfile C:\xampp\htdocs\angulargulp\gulpfile.js 
    [16:46:06] Starting 'start:server:test'... 
    [16:46:06] Finished 'start:server:test' after 153 ms 
    [16:46:06] Starting 'test'... 
    [16:46:07] Server started http://localhost:9001 
    [16:46:07] LiveReload started on port 35729 
    [16:46:07] Starting Karma server... 
    WARN `start` method is deprecated since 0.13. It will be removed in 0.14. Please 
     use 
     server = new Server(config, [done]) 
     server.start() 
    instead. 
    02 09 2016 16:46:08.118:WARN [karma]: No captured browser, open http://localhost 
    :8080/ 
    02 09 2016 16:46:08.129:INFO [karma]: Karma v0.13.22 server started at http://lo 
    calhost:8080/ 
    02 09 2016 16:46:08.151:INFO [launcher]: Starting browser PhantomJS 
    02 09 2016 16:46:09.618:INFO [PhantomJS 2.1.1 (Windows 7 0.0.0)]: Connected on s 
    ocket /#-mjfYbbHTxf_x72hAAAA with id 48131270 
    PhantomJS 2.1.1 (Windows 7 0.0.0) Controller: AboutCtrl should attach a list of 
    awesomeThings to the scope FAILED 
      C:/xampp/htdocs/angulargulp/app/bower_components/angular/angular.js:4641 
    :53 
      [email protected]:/xampp/htdocs/angulargulp/app/bower_components/angular/angular 
    .js:321:24 
      [email protected]:/xampp/htdocs/angulargulp/app/bower_components/angular/ang 
    ular.js:4601:12 
      [email protected]:/xampp/htdocs/angulargulp/app/bower_components/angular/ 
    angular.js:4523:30 
      [email protected]:/xampp/htdocs/angulargulp/app/bower_components/angular-mocks/an 
    gular-mocks.js:3074:60 
      TypeError: undefined is not an object (evaluating 'AboutCtrl.awesomeThin 
    gs') in C:/xampp/htdocs/angulargulp/test/spec/controllers/about.js (line 23) 
      C:/xampp/htdocs/angulargulp/test/spec/controllers/about.js:23:21 
    PhantomJS 2.1.1 (Windows 7 0.0.0): Executed 1 of 1 (1 FAILED) (0 secs/0.01 sec 
    PhantomJS 2.1.1 (Windows 7 0.0.0): Executed 1 of 1 (1 FAILED) ERROR (0.006 secs 
    /0.01 secs)

マイkarma.conf.jsが

// Generated on 2016-08-19 using generator-angular 0.15.1 
'use strict'; 

var gulp = require('gulp'); 
var $ = require('gulp-load-plugins')(); 
var openURL = require('open'); 
var lazypipe = require('lazypipe'); 
var rimraf = require('rimraf'); 
var wiredep = require('wiredep').stream; 
var runSequence = require('run-sequence'); 
var sass = require('gulp-sass'); 
var historyApiFallback = require('connect-history-api-fallback'); 
var browserSync = require("browser-sync").create(); 
var yeoman = { 
    app: require('./bower.json').appPath || 'app', 
    dist: 'dist' 
}; 

var paths = { 
    scripts: [yeoman.app + '/scripts/**/*.js'], 
    styles: [yeoman.app + '/styles/**/*.scss'], 
    test: ['test/spec/**/*.js'], 
    testRequire: [ 
    //yeoman.app + '/bower_components/jquery/jquery.js', 
    yeoman.app + '/bower_components/angular/angular.js', 
    yeoman.app + '/bower_components/angular-route/angular-route.js', 
    yeoman.app + '/bower_components/angular-mocks/angular-mocks.js', 
    //yeoman.app + '/bower_components/angular-resource/angular-resource.js', 
    yeoman.app + '/bower_components/angular-cookies/angular-cookies.js', 
    //yeoman.app + '/bower_components/angular-sanitize/angular-sanitize.js', 
    'test/mock/**/*.js', 
    'test/spec/**/*.js', 
    'test/spec/**/*.js' 
    ], 
    karma: 'test/karma.conf.js', 
    views: { 
    main: yeoman.app + '/index.html', 
    files: [yeoman.app + '/views/**/*.html'] 
    } 
}; 

//////////////////////// 
// Reusable pipelines // 
//////////////////////// 

var lintScripts = lazypipe() 
    .pipe($.jshint, '.jshintrc') 
    .pipe($.jshint.reporter, 'jshint-stylish'); 

var styles = lazypipe() 
    .pipe($.sass, { 
    outputStyle: 'expanded', 
    precision: 10 
    }) 
    .pipe($.autoprefixer, 'last 1 version') 
    .pipe(gulp.dest, '.tmp/styles'); 

/////////// 
// Tasks // 
/////////// 

gulp.task('styles', function() { 
    return gulp.src(paths.styles) 
    .pipe(styles()); 
}); 

gulp.task('lint:scripts', function() { 
    return gulp.src(paths.scripts) 
    .pipe(lintScripts()); 
}); 

gulp.task('clean:tmp', function (cb) { 
    rimraf('./.tmp', cb); 
}); 

gulp.task('start:client', ['start:server', 'styles'], function() { 
    openURL('http://dev.go.com'); 
}); 

gulp.task('start:server', ['sass'], function() { 
    return browserSync.init(null, { 
     open: 'external', 
     host: 'dev.go.com', 
     livereload: true, 
     // Change this to '0.0.0.0' to access the server from outside. 
     port: 9000, 
     server: { 
     baseDir: "app", 
     middleware: [ historyApiFallback() ] 

     }, 
     notify: false, 
     ghostMode: { 
      clicks: true, 
      location: true, 
      forms: true, 
      scroll: false 
     } 
    }); 
}); 

/*gulp.task('start:server', function() { 
    $.connect.server({ 
    root: [yeoman.app, '.tmp'], 
    livereload: true, 
    // Change this to '0.0.0.0' to access the server from outside. 
    port: 9000 
    }); 

});*/ 

gulp.task('start:server:test', function() { 
    $.connect.server({ 
    root: ['test', yeoman.app, '.tmp'], 
    livereload: true, 
    port: 9001 
    }); 
}); 





gulp.task('watch', function() { 

    $.watch(paths.styles) 
    .pipe($.plumber()) 
    .pipe(styles()) 
    .pipe($.connect.reload()); 

    $.watch(paths.views.files) 
    .pipe($.plumber()) 
    .pipe($.connect.reload()); 

    $.watch(paths.scripts) 
    .pipe($.plumber()) 
    .pipe(lintScripts()) 
    .pipe($.connect.reload()); 

    $.watch(paths.test) 
    .pipe($.plumber()) 
    .pipe(lintScripts()); 

    gulp.watch('bower.json', ['bower']); 


    gulp.task('watch', ['sass', 'browser-sync'], function() { 
    gulp.watch(yeoman.app + '/styles/**/*.scss', ['sass']); 

}) 



}); 

gulp.task('serve', function (cb) { 
    runSequence('clean:tmp', 
    ['lint:scripts'], 
    ['start:client'], 
    'watch', cb); 
}); 

gulp.task('serve:prod', function() { 
    $.connect.server({ 
    root: [yeoman.dist], 
    livereload: true, 
    port: 9000 
    }); 
}); 

gulp.task('test', ['start:server:test'], function() { 
    var testToFiles = paths.testRequire.concat(paths.scripts, paths.test); 
    return gulp.src(testToFiles) 
    .pipe($.karma({ 
     configFile: paths.karma, 
     action: 'watch' 
    })); 
}); 

// inject bower components 
gulp.task('bower', function() { 
    return gulp.src(paths.views.main) 
    .pipe(wiredep({ 
     directory: yeoman.app + '/bower_components', 
     ignorePath: '..' 
    })) 
    .pipe(gulp.dest(yeoman.app + '/views')); 
}); 

/////////// 


// inject sass components 
gulp.task('sass', function() { 
    return gulp.src(yeoman.app + '/styles/**/*.scss') 
     .pipe(sass({sourcemap: true, style: 'compressed', trace: true})) 
     //.pipe(prefix('last 2 versions', '> 1%', 'ie 8', 'Android 2', 'Firefox ESR')) 
     .pipe(gulp.dest('app/styles/')) 
}); 

/////////// 




// Build // 
/////////// 

gulp.task('clean:dist', function (cb) { 
    rimraf('./dist', cb); 
}); 

gulp.task('client:build', ['html', 'styles'], function() { 
    var jsFilter = $.filter('**/*.js'); 
    var cssFilter = $.filter('**/*.css'); 

    return gulp.src(paths.views.main) 
    .pipe($.useref({searchPath: [yeoman.app, '.tmp']})) 
    .pipe(jsFilter) 
    .pipe($.ngAnnotate()) 
    .pipe($.uglify()) 
    .pipe(jsFilter.restore()) 
    .pipe(cssFilter) 
    .pipe($.minifyCss({cache: true})) 
    .pipe(cssFilter.restore()) 
    .pipe($.rev()) 
    .pipe($.revReplace()) 
    .pipe(gulp.dest(yeoman.dist)); 
}); 

gulp.task('html', function() { 
    return gulp.src(yeoman.app + '/views/**/*') 
    .pipe(gulp.dest(yeoman.dist + '/views')); 
}); 

gulp.task('images', function() { 
    return gulp.src(yeoman.app + '/images/**/*') 
    .pipe($.cache($.imagemin({ 
     optimizationLevel: 5, 
     progressive: true, 
     interlaced: true 
    }))) 
    .pipe(gulp.dest(yeoman.dist + '/images')); 
}); 

gulp.task('copy:extras', function() { 
    return gulp.src(yeoman.app + '/*/.*', { dot: true }) 
    .pipe(gulp.dest(yeoman.dist)); 
}); 

gulp.task('copy:fonts', function() { 
    return gulp.src(yeoman.app + '/fonts/**/*') 
    .pipe(gulp.dest(yeoman.dist + '/fonts')); 
}); 

gulp.task('build', ['clean:dist'], function() { 
    runSequence(['images', 'copy:extras', 'copy:fonts', 'client:build']); 
}); 

gulp.task('default', ['build']);

マイapp.jsファイルファイル：

'use strict'; 

/** 
* @ngdoc overview 
* @name angulargulpApp 
* @description 
* # angulargulpApp 
* 
* Main module of the application. 
*/ 
angular 
    .module('angulargulpApp', [ 

    // 'ngMessages', 
    //'ngResource', 

    'ngRoute', 
    'ngMock', 
    'ngAnimate', 
    'ngCookies' 
    //'ngSanitize', 
    //'ngTouch' 
    ]) 
    .config(function ($routeProvider,$locationProvider) { 
    $locationProvider.html5Mode({ 
     enabled: true, 
     requireBase: false 
    }); 

    $routeProvider 
     .when('/', { 
     templateUrl: 'views/main.html', 
     controller: 'MainCtrl', 
     controllerAs: 'main' 
     }) 
     .when('/about', { 
     templateUrl: 'views/about.html', 
     controller: 'AboutCtrl', 
     controllerAs: 'about' 
     }) 
     .otherwise({ 
     redirectTo: '/' 
     }); 

    });

私のコントローラファイル：

'use strict'; 

/** 
* @ngdoc function 
* @name angulargulpApp.controller:AboutCtrl 
* @description 
* # AboutCtrl 
* Controller of the angulargulpApp 
*/ 
angular.module('angulargulpApp') 
    .controller('AboutCtrl', function ($scope,$sce,$rootScope) { 
    this.awesomeThings = [ 
     'HTML5 Boilerplate', 
     'AngularJS', 
     'Karma' 
    ]; 

    //console.log('--------------------------------------'+$scope.awesomeThings.length) 

    $scope.open = function() { 
     var lt="-37.866963" 
     var lg="144.980615" 
     //var data = $sce.trustAsResourceUrl("http://maps.google.com/maps?f=q&amp;geocode=&amp;ie=UTF8&amp;ll=-37.866963,144.980615&amp;spn=0.006223,0.019484&amp;output=embed"); 
     //var data = $sce.trustAsResourceUrl("http://maps.google.com/maps?f=q&amp;geocode=&amp;ie=UTF8&amp;ll="+lt+","+lg+"&amp;spn=0.006223,0.019484&amp;output=embed"); 

    var frame= '<iframe id="myUrl" onmouseover="gmap=true" onmouseout="gmap=false" class="iframeBorder" width="505" height="350" frameborder="0" scrolling="no" marginheight="0" marginwidth="0" src="http://maps.google.com/maps?f=q&amp;geocode=&amp;ie=UTF8&amp;ll='+lt+','+lg+'&amp;spn=0.006223,0.019484&amp;output=embed"></iframe>' 
    $('#googleMap').html(frame) 

    } 
    $scope.z = 0; 
    $scope.sum = function() { 
     $scope.z = $scope.x + $scope.y; 
    }; 

    });

マイspecファイルは次のとおりです。

describe('Controller: AboutCtrl', function() { 

    // load the controller's module 
    beforeEach(module('angulargulpApp')); 

    var AboutCtrl, 
     scope; 



    // Initialize the controller and a mock scope 
    beforeEach(inject(function ($controller, $rootScope) { 
    scope = $rootScope.$new(); 
    AboutCtrl = $controller('AboutCtrl', { 
     $scope: scope 
     // place here mocked dependencies 
    }); 
    })); 

    it('should attach a list of awesomeThings to the scope', function() { 
    expect(AboutCtrl.awesomeThings.length).toBe(3); 
    }); 
});

出典

2016-09-02 Amit Chandra

[MCVE]を作成し、あなたの質問を編集することを学びます。 – reformed

更新された回答を確認 –

コントローラテストスタイルJhon papaのユニットテストはまあまあです。

コントローラーの作成中にnew scopeを$rootScope.$new()に渡す必要はありません。

scope:{}を渡すことができます。は、this以外何もありません。 vm is {}

これを行うための正しい方法は次のとおりです。

beforeEach(inject(function ($controller, $rootScope) { 
    scope = {}; 
    AboutCtrl = $controller('AboutCtrl', scope); 
    }));

出典

2016-09-02 12:02:44

問題解決のための解決方法があれば、それを受け入れてupvoteを忘れないでください –

あなたの素早いレスポンスのために、ありがとうございました。あなたの提案に従って。私の更新仕様ファイル –

を見てください。なぜ 'this'と' $ scope'を混在させるのですか？ –

TypeError：未定義はオブジェクトではありません（AboutCtrl.awesomeThin gsを評価しています）

答えて

関連する問題