AngularJS + Grunt + Protractor：keepAlive 和观察

Question

我目前正在我的 AngularJS 应用程序和 Grunt 中使用 E2E 测试量角器。 我跟着https://www.npmjs.org/package/grunt-protractor-runner的安装，我有2个问题：

第一：

我想知道，如果可能的话，我的 Karma 单元测试中会有这种行为：

• 启动测试服务器
• 运行所有测试
• 当测试文件或任何其他 html/js 文件更改时，重新运行所有测试

我非常喜欢这种实时观看和自动重新加载的方式，因为它减少了整个套件的启动时间，并使一切变得更快。

但是对于 Protractor，我有一个问题：每次我用 Grunt 开始测试时，测试都会执行，然后一切都关闭了。虽然，我在Gruntfile.js 的量角器配置部分将keepAlive 选项设置为true。有什么想法吗？

第二个：

我无法让它工作，将 Protractor 连接到我的 Angular 应用程序。我是否必须启动 grunt 服务器来提供文件？当我尝试访问我的测试中的某个页面时，例如browser.get('app/index.html'); 或browser.get('#/');，我无法访问该页面。我玩过protractor.conf.js 中的baseUrl 选项（如baseUrl: 'http://localhost:' + (process.env.HTTP_PORT || '8000')）。但在我看来，我必须先启动 grunt 服务器，对吗？我该怎么做？或者还有其他选项可以访问我的 Angular 应用程序吗？我正在使用 sass 和指南针，所以我想，我需要 compass:dist 以某种方式。

更新：

我找到了解决方法。我注册了以下 grunt 任务：

  grunt.registerTask('e2e', [
    'clean:server',
    'concurrent:test',
    'autoprefixer',
    'connect:test',
    'concurrent:server',
    'autoprefixer',
    'protractor',
    'watch'
  ]);

当以grunt e2e 启动时，我的服务器将根据protractor.conf.js 中的baseUrl: 'http://10.0.0.200:9001' 启动，并且我的测试正在运行。测试完成后，watch 任务会监视更改的文件，并在需要时重新运行量角器。

这样做的缺点是，每次watch 启动protractor 任务时，都会产生一个新的 Chrome 实例，并在测试后终止。 有没有办法防止量角器杀死 Chrome 实例？

此外，我想知道为什么在每个教程中总是说“只需运行grunt protractor 并执行您的测试......”。 为什么我需要一个额外的任务来启动我的 grunt 服务器来访问我的 angularjs 应用程序？

这是我的配置文件：

protractor.conf.js

exports.config = {
  capabilities: {
    'browserName': 'chrome'
  },
  chromeOnly: true,
  specs: ['test/e2e/**/*.js'],

  jasmineNodeOpts: {
    showColors: true
  },
  framework: 'jasmine'
};

Gruntfile.js

module.exports = function(grunt) {

  // Load grunt tasks automatically
  require('load-grunt-tasks')(grunt);
  grunt.loadNpmTasks('grunt-protractor-runner');

  grunt.initConfig({
    // ...
    protractor: {
      options: {
        configFile: "protractor.conf.js",
        keepAlive: false,
        noColor: false
      },
      run: {}
    },
    // ...
  });

  // ...

  grunt.registerTask('test:e2e', [
    'clean:server',
    'compass:dist',
    'compass:server',
    'autoprefixer',
    'connect:test',
    'protractor'
  ]);

  // ...
}

谢谢！

Answer 1

老问题的答案....我喜欢 Ruby FileWatcher Gem

gem install filewatcher filewatcher . "protractor my-protractor-conf-file.conf.js"

它适用于各种问题。每当我点击保存时，我都会使用它在我的培训文档上重新运行 AsciiDoctor。

Answer 2

当我尝试做完全相同的事情时遇到了这个问题......对 gulp 来说很新（不确定我是否做对了所有事情）但这对我有用：

我使用gulp-angular-protractor 代替 gulp-protractor 来执行 webdriver 自动启动/停止任务。

下面的示例仅查看“specs”文件夹，但可以轻松更改。如果您不使用“浏览器同步”，请删除它，然后在您想要的端口上预先启动您的本地主机服务器。

var config = require('./config');
var gulp = require('gulp');
var browserSync = require('browser-sync');
var watch = require('gulp-watch');
var angularProtractor = require('gulp-angular-protractor');

gulp.task('e2e', [
    'browserSync',
    'protractor',
    'watch-e2e'
]);

gulp.task('watch-e2e', function () {
    gulp.watch('e2e-tests/**/*.js', ['protractor']);
});

// Setting up the test task
gulp.task('protractor', function(callback) {
    gulp
        .src(['e2e-tests/**/*.js'])
        .pipe(angularProtractor({
            configFile: './karma-e2e.conf.js',
            args: ['--baseUrl', 'http://127.0.0.1:3002'],
            debug: false,
            autoStartStopServer: true
        }))
        .on('error', function(e) {
            console.log(e);
            this.emit('end'); // Prevents task stopping on error
        })
        .on('end', function() {
            // Close browser sync server
            browserSync.exit();
            callback();
        });
});

Answer 3

除了@Always Learning 我认为是正确的答案。

您要做的是持续集成，这是一种做法，每次从事项目的人进行更改和提交时，都会执行整个质量检查（静态代码分析、单元测试、编译/依赖、端到端测试等）

不应该在开发者的环境中执行，应该使用像Jenkins这样的持续集成工具我建议你检查一下，因为它是一个非常有用的工具，它可以运行您需要的所有任务，在出现问题或修复之前的错误时向您发送消息，甚至您可以让他在完成后将最终构建部署到生产环境中

Answer 4

有没有办法防止量角器杀死 Chrome 实例？

我相信您可以使用以下命令暂停浏览器：

browser.pause();

Answer 5

为什么我需要一个额外的任务来启动我的 grunt 服务器来访问我的 angularjs 应用程序？

作为关注点分离 Protractor 不管理 Web 服务器的启动和拆卸以运行测试，这是与 Karma 不同的方法。我想这是因为测试是在服务器端运行的，其中“驱动”网络浏览器从您的测试代码中执行操作。

有没有办法防止量角器杀死 Chrome 实例？

简答NO.
长答案，您可以使用 debug 选项并在代码中设置断点，但这可能不是您要寻找的。您尝试的 keepAlive 选项仅在测试失败时使浏览器保持活动状态，一旦测试结束，它不会使浏览器保持启动状态。

您可能会对这个question 感兴趣。

Answer 6

我想知道，如果可能的话，我的 Karma 单元测试中会有这种行为：

通常，您不会在每次 HTML 更改后运行 E2E 测试。造成这种情况的主要原因是，随着您添加越来越多的测试，运行 E2E 测试可能需要很长时间。因此，要回答这个问题，我不相信有任何内置方法可以支持在同一浏览器中的每次更改后运行 E2E 测试。我建议使用单元测试作为在每次更改后进行测试并手动运行 E2E 测试的机制。

我必须启动 grunt 服务器来提供文件吗？

是的，您需要启动一个服务器来运行您的量角器测试。您不是在启动“grunt 服务器”，而是在启动 Selenium 将使用的 Web 服务器，这是 Protractor 用于其测试的引擎。这是使用 Protractor 和 ng-scenario 的主要区别因素之一。

有没有办法防止量角器杀死 Chrome 实例？

再一次，我不相信 Protractor 应该像这样使用，因为您不需要在每次更改后运行 E2E 测试。不过，要回答这个问题，我不相信。

为什么我需要一个额外的任务来启动我的 grunt 服务器来访问我的 angularjs 应用程序？

关于 Selenium 的答案与上述相同。