本节书摘来自华章出版社《AngularJS深度剖析与最佳实践》一书中的第2章，第2.13节，作者 雪狼 破狼 彭洪伟，更多章节内容可以访问云栖社区“华章计算机”公众号查看

2.13　端到端测试

端到端测试（e2e test），也称为场景测试，它模拟的是用户真实的操作场景：

用户打开地址。在搜索框中输入了abc。然后点击其后的搜索按钮。这时候，他期望看到一个列表，列出所有在标题的任意位置包含了字符串abc的条目，并且每条结果中的abc这三个字母被高亮。所谓端到端，也就是一端是浏览器，另一端是服务器，这个测试贯通了前后端，具有近似于验收测试的价值。端到端测试不是什么新技术，它在前后端分离架构盛行之前就已经被广泛采用了，比如Selenium，而且Selenium也同样可应用于Angular中。Angular的端到端测试工具称为Protractor，事实上，它就是基于Selenium的，在Selenium的基础上，它增加了一些Angular特有的元素选取方式，如根据ng-model选取元素等。我的建议是，除非你所在的开发组织已经把Angular作为唯一的前端选项，否则请使用Selenium中传统的函数，而不要使用Protractor特有的根据ng-model选取元素等函数，这将让你们的测试独立于前端技术栈而被复用。在我的工程实践中，只会使用id、class等少数查阅方式，而不会根据ng-model等进行查阅。并且，由于Angular的特点，被测试程序中可以不用任何id，所以，我们可以完全把id留给测试人员使用。如果写测试的人员有权修改源码，那么他/她可以自由的添加、删除id，而不用担心破坏了程序的逻辑和样式。遵循这个约定，可以让开发与测试的协同更加有效。这里不展开讲解，只把我在种子工程中写的一些代码加上注释供大家自行研究：1）pages/HomePage.js

// 这是一个页面对象，用来封装页面中的元素和操作，以简化规约代码，并提供一定的变更隔离module.exports = function() {    this.title = function() {        // browser对象封装一组用来访问浏览器属性的函数        return browser.getTitle();    };    // 根据id查找元素    this.name = element(by.id('name'));    this.nameEcho = element(by.id('name-echo'));    this.get = function() {        // 控制浏览器访问特定地址        browser.get('http://localhost:5000/#/');    };};

2）demoSpec.js

// 取得页面对象var HomePage = require('./pages/HomePage');describe('e2e范例，如果修改了首页，请修改本测试 >', function () {    var homePage;    // 所有测试语句执行之前，先在浏览器中打开它    beforeEach(function () {        homePage = new HomePage();        homePage.get();    });    it('默认的标题是Showcase', function() {        expect(homePage.title()).toBe('Showcase');    });    it('输入用户名后应该回显', function() {        // 检查初始状态是否符合预期        expect(homePage.nameEcho.getText()).toBe('Hello,');        // 模拟用户输入        homePage.name.sendKeys('test');        // 检查操作后状态是否符合预期        expect(homePage.nameEcho.getText()).toBe('Hello,test');    });});