Tôi nhận được lỗi sau khi thử nghiệm ứng dụng góc cạnh.Không thể tìm thấy góc biến trong spec.js Sử dụng Webpack + Karma + Jasmine để kiểm tra đơn vị AngularJS
Can't find variable: angular in spec/abc.spec.js
Ứng dụng của tôi đang chạy tốt với webpack. Ngoài ra nghiệp chướng cho thành công trên
expect(true).toBe(true);
Sau đây là bộ xương của tôi:
abc.ts
var angular = require('angular');
var angular_mocks = require('angular-mocks');
var specs = require('../spec/abc.spec.js');
var myApp = angular.module('myApp',[]);
myApp.controller('MyController', function($scope) {
$scope.spices = [{"name":"pasilla", "spiciness":"mild"},
{"name":"jalapeno", "spiciness":"hot hot hot!"},
{"name":"habanero", "spiciness":"LAVA HOT!!"}];
$scope.spice = "habanero";
});
abc.spec.js
describe('myController function', function() {
describe('myController', function() {
var $scope;
beforeEach(angular.mock.module('myApp'));
beforeEach(inject(function ($rootScope, $controller) {
$scope = $rootScope.$new();
$controller('MyController', {$scope: $scope});
}));
it('should create "spices" model with 3 spices', function() {
expect($scope.spices.length).toBe(3);
});
it('should set the default value of spice', function() {
expect($scope.spice).toBe('habanero');
});
it('should set the default value of spice', function() {
expect(angular).toBeDefined();
});
});
});
nghiệp. config. js
// Karma configuration
// Generated on Wed Dec 21 2016 19:28:26 GMT+0530 (India Standard Time)
var webConfig = require('./karma.conf')
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: [
'spec/*.js'
],
// list of files to exclude
exclude: [
'src/bundle.js'
],
webpack: webConfig,
webpackMiddleware: {
stats: 'errors-only'
},
// preprocess matching files before serving them to the browser
// available preprocessors: https://npmjs.org/browse/keyword/karma-preprocessor
preprocessors: {
'src/*.js': ['coverage', 'webpack']
},
// test results reporter to use
// possible values: 'dots', 'progress'
// available reporters: https://npmjs.org/browse/keyword/karma-reporter
reporters: ['progress','coverage'],
coverageReporter: {
type : 'html',
dir : 'coverage/'
},
// 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: ['PhantomJS'],
// 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
})
}
webpack.config.js
var webConfig = {
entry: './src/abc',
output:{
path: 'src',
filename:'bundle.js'
},
resolve: {
root: ['src', "node_modules"],
extensions: ['', '.ts', '.js']
},
modules: {
loaders: [
{
test:/\.ts?$/,
loader:'ts-loader'
}
]
}
}
module.exports = webConfig;
tsconfig.js
{
"compilerOptions": {
"target": "es5",
"module": "amd",
"moduleResolution": "node",
"removeComments": true,
"preserveConstEnums": true,
"sourceMap": true
},
"exclude": [
"typings",
"node_modules"
]
}
LỖI:
C:\Users\namankheterpal\IdeaProjects\ngwk>karma start
webpack: bundle is now VALID.
22 12 2016 13:55:36.125:WARN [karma]: No captured browser, open http://localhost:9876/
22 12 2016 13:55:36.137:INFO [karma]: Karma v1.3.0 server started at http://localhost:9876/
22 12 2016 13:55:36.138:INFO [launcher]: Launching browser PhantomJS with unlimited concurrency
22 12 2016 13:55:36.151:INFO [launcher]: Starting browser PhantomJS
22 12 2016 13:55:37.906:INFO [PhantomJS 2.1.1 (Windows 8 0.0.0)]: Connected on socket /#GxGMuAyLHkfyOc9NAAAA with id 40162084
PhantomJS 2.1.1 (Windows 8 0.0.0) myController function myController encountered a declaration exception FAILED
ReferenceError: Can't find variable: angular in spec/abc.spec.js (line 6)
spec/abc.spec.js:6:23
spec/abc.spec.js:3:11
global [email protected]/abc.spec.js:1:9
PhantomJS 2.1.1 (Windows 8 0.0.0): Executed 1 of 1 (1 FAILED) ERROR (0.006 secs/0.001 secs)
Reffrence https://github.com/webpack/karma-webpack
Vui lòng cho tôi biết nếu tôi thiếu điều gì đó và nếu có bất kỳ thông tin nào khác được yêu cầu.
Xin cảm ơn trước.
Tôi đã thử nhưng không có trợ giúp. Tôi cũng đã bao gồm các tệp này trong abc.js, do đó được đóng gói bởi webpack tôi đoán. –
bao gồm chúng riêng lẻ –
Tôi đã thử bao gồm cả góc cạnh và mock-mocks ở đây nhưng không thể tìm thấy mã của tôi. Các tệp của tôi có dạng chữ. wespack ts-loader được sử dụng cho transpiling. lý do tại sao tôi đã sử dụng webpack-karma. Có cách nào để trực tiếp đưa các tệp .ts vào đây để nghiệp có thể thực thi chúng không. –