Angular Protractor 系统测试环境搭建指南-优快云博客

Angular Protractor 系统测试环境搭建指南

protractor E2E test framework for Angular apps 项目地址: https://gitcode.com/gh_mirrors/pr/protractor

什么是系统测试环境

在开始使用Angular Protractor进行端到端测试前，我们需要先理解什么是"系统测试环境"(System Under Test)。简单来说，这就是你要测试的实际应用系统，它可以是你本地开发环境运行的服务器，也可以是测试环境、预发布环境甚至生产环境的服务器。

Protractor测试环境的特点

Protractor通过真实的浏览器来执行测试，因此它能够测试任何浏览器可以访问的系统。这为测试提供了极大的灵活性：

环境无关性：无论是localhost上的开发服务器、局域网内的测试服务器，还是互联网上的生产环境，Protractor都能测试
真实场景模拟：使用真实浏览器意味着测试更接近用户实际使用场景
配置简单：只需要提供被测系统的URL即可开始测试

特殊场景处理

虽然Protractor使用简单，但在某些特殊场景下需要特别注意：

手动引导启动的应用

如果你的Angular应用采用手动引导(manual bootstrap)方式启动，标准的browser.get方法将无法正常工作。此时应该使用WebDriver原生方法：

browser.driver.get('your_url');

需要注意的是，这种情况下Protractor无法自动判断页面是否完全加载完成，你可能需要添加等待逻辑来避免竞态条件。

使用$timeout轮询的应用

如果你的应用使用$timeout进行轮询操作，Protractor可能无法准确判断页面何时就绪。建议改用$interval替代$timeout，这样Protractor能更好地处理异步操作。

全局测试准备

对于需要在所有测试前执行的准备工作（如用户登录），可以通过配置文件中的onPrepare属性来实现。这个属性可以是一个函数，也可以是一个文件路径。

onPrepare的异步处理

onPrepare可以返回一个Promise对象，Protractor会等待这个Promise解析完成后再继续执行测试。这在准备工作中包含异步操作（如与浏览器交互）时特别有用。如果不使用Promise，Protractor无法保证执行顺序，可能导致测试在准备工作完成前就开始运行。

示例代码：

// 配置文件示例
exports.config = {
  // 其他配置...
  onPrepare: function() {
    return new Promise(function(resolve) {
      // 执行准备工作
      browser.driver.get('http://your-app/login');
      // 登录操作...
      resolve();
    });
  }
};