测试目的
- 测试模板被设置并从服务端下载下来
- 测试模板分配到了正确的 controller
- 测试模板分配到了正确的 view 或者 include。
模板,是那些可以注入你 AngularJS 应用的,独立的 Html 代码,用来组成 View 的各部分。不管模板是通过 ngView来渲染,还是通过 ngInculde,模板 Html 代码应当能够简单方便的注入页面中。
View 和导入动作是通过 $templateCache 服务提供的缓存机制起作用的。因此如果你想 Mock 模板代码,那么只需要将 Html 添加到模板缓存对应的 templateUrl 缓存 Key 即可。
Midway 测试:
<!-- lang: js -->
//
// test/midway/templates/templatesSpec.js
//
describe("Midway: Testing Templates", function() {
it("should load the template for the videos page properly",
function(done) {
var tester = ngMidwayTester('App');
tester.visit('/videos?123', function() {
var current = tester.inject('$route').current;
var controller = current.controller;
var template = current.templateUrl;
expect(template).to.match(/templates\/views\/videos\/index_tpl\.html/);
tester.destroy();
done();
});
});
});
E2E测试:
<!-- lang: js -->
//
// test/e2e/templates/templatesSpec.js
//
describe("E2E: Testing Templates", function() {
beforeEach(function() {
browser().navigateTo('/');
});
it('should redirect and setup the videos page template on root', function() {
browser().navigateTo('#/');
expect(element('#ng-view').html()).toContain('youtube_listing');
});
it('should load the watched videos template into view', function() {
browser().navigateTo('#/watched-videos');
expect(element('#ng-view').html()).toContain('youtube_listing');
});
it('should load the watched video template into view', function() {
browser().navigateTo('#/videos/123');
expect(element('#ng-view').html()).toContain('profile');
});
it('should redirect back to the index page if anything fails', function() {
browser().navigateTo('#/something/else');
expect(element('#ng-view').html()).toContain('youtube_listing');
});
});