Question

我是单元测试的新手，我正在尝试测试包含外部模板的AngularJS指令。

从其他问题来看，我试图使用ngHTML处理器，但显然没有检测到外部模板

业力配置：

process.env.CHROME_BIN = require('puppeteer').executablePath();

module.exports = function(config) {
 config.set({
    files: [
  'node_modules/angular/angular.min.js',
  'node_modules/angular-animate/angular-animate.min.js',
  'node_modules/angular-aria/angular-aria.min.js',
  'node_modules/angular-messages/angular-messages.min.js',
  'node_modules/angular-route/angular-route.min.js',
  'node_modules/angular-mocks/angular-mocks.js',
  'node_modules/angular-material/angular-material.min.js',
  "node_modules/angular-sanitize/angular-sanitize.min.js",
  { pattern: 'src/**/*.module.js' },
  { pattern: 'src/**/*.controller.js' },
  { pattern: 'src/**/*.directive.js' },
  { pattern: 'src/**/*.component.js' },
  { pattern: 'src/**/*.service.js' },
  { pattern: 'src/**/*.js' },
  { pattern: 'src/**/*.test.js' },
  { pattern: 'tests/**/*.spec.js' },
  'src/**/*.html'
],

browsers: ['HeadlessChrome'],

customLaunchers: {
  HeadlessChrome: {
    base: 'ChromeHeadless',
    flags: [
      '--no-sandbox'
    ]
  }
},

frameworks: ['jasmine'],

colors: true,

logLevel: config.LOG_INFO,

autoWatch: false,

reporters: ['progress'],

plugins: [
  'karma-jasmine',
  'karma-chrome-launcher',
  'karma-ng-html2js-preprocessor'
],

singleRun: true,

failOnEmptyTestSuite: false,

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

ngHtml2JsPreprocessor: {
  moduleName: 'topicApp.templates'
},
  });
};

单元测试： describe（'测试消息指令'，（）=> { var compile，rootScope，$ templateCache;

beforeEach(()=>{
    module('topicApp');
});
beforeEach(()=>{
    module('topicApp.templates');
});


beforeEach(inject(function($compile, $rootScope){
    compile = $compile;
    rootScope = $rootScope;
}));

it('Replaces element with the appropiate content', function(){
    rootScope.message =  { 
        message: 'Message 1 Message 1 Message 1 Message 1 Message 1 ',
        sender: 'Ruben Maldonado 1',}
    var element = compile('<message message="message"></message>')(rootScope);
    rootScope.$digest();
    expect(element.html()).toContain('Ruben Maldonado 1');
});

});

因果报错：

06 10 2018 12:41:33.247:INFO [HeadlessChrome 0.0.0 (Windows 10 0.0.0)]: 
Connected on socket 21vNeCa0tkif8q08AAAA with id 53178557
HeadlessChrome 0.0.0 (Windows 10 0.0.0) test message directive Replaces 
element with the appropiate content FAILED
    Error: Unexpected request: GET message/messageListItem.html
    No more request expected
    error properties: Object({ $$passToExceptionHandler: true })
        at createFatalError (node_modules/angular-mocks/angular- 
mocks.js:1569:19)
        at $httpBackend (node_modules/angular-mocks/angular-mocks.js:1616:11)
        at s (node_modules/angular/angular.min.js:108:4)
        at node_modules/angular/angular.min.js:105:243
        at node_modules/angular/angular.min.js:140:44
        at m.$digest (node_modules/angular/angular.min.js:151:185)
        at UserContext.<anonymous> (tests/message/message.spec.js:22:19)
        at <Jasmine>
HeadlessChrome 0.0.0 (Windows 10 0.0.0): Executed 2 of 2 (1 FAILED) (0.084 secs / 0.074 secs)
TOTAL: 1 FAILED, 1 SUCCESS
npm ERR! Test failed.  See above for more details.

模板位于src / message / messageListElelemnt.html文件夹中

预先感谢

具有外部模板的AngularJS指令的单元测试会导致错误

0 个答案: