8

我正在尝试使用 Protractor 和 Cucumber 为我的 Web 应用程序创建一个包含 E2E 测试的存储库。我从这个存储库开始：https ://github.com/spektrakel-blog/angular-protractor-cucumber

当我强制量角器将应用程序视为常规网页时，测试运行良好。测试运行程序正在与应用程序交互并期待一些结果。问题是，我想让 Protractor 检测 Angular，以便在检查“然后”断言之前等待区域稳定。

这是我的量角器.conf.js：

exports.config = {
  allScriptsTimeout: 30000,
  capabilities: {
    browserName: 'chrome',
    chromeOptions: {
      args: ['--no-sandbox']
    }
  },
  directConnect: true,
  baseUrl: 'http://<ci-server-address>/',

  specs: [
    './e2e/features/*.feature'
  ],

  framework: 'custom',
  frameworkPath: require.resolve('protractor-cucumber-framework'),

  cucumberOpts: {
    require: ['./e2e/steps/**/*.ts'],
    strict: true,
    format: [
      'json:reports/summary.json'
    ],
    dryRun: false,
    compiler: []
  },

  onPrepare() {
    browser.ignoreSynchronization = true;
    require('ts-node').register({
      project: 'e2e/tsconfig.e2e.json'
    });
  }
};

简而言之-测试使用以下配置运行，但是当我删除时browser.ignoreSynchronization = true;，我收到以下错误：Timed out waiting for asynchronous Angular tasks to finish after 30 seconds. This may be because the current page is not an Angular application..

到目前为止我尝试过的事情（没有改进）：

  • 添加ng-app到<body>标签
  • 检查window.getAllAngularRootElements()-app-root正确返回
  • 检查window.getAllAngularTestabilities()- 返回一个Testability对象
  • 在 Chrome 上启动测试（有或没有沙箱）
  • 在 Firefox 上启动测试
  • 尝试部署我们的应用程序的 CI 服务器和本地环境ng serve

我正在使用最新版本的 Protractor、Cucumber、Chai 和 TypeScript。任何帮助将非常感激。非常感谢您！

4

5 回答 5

6

对我来说，这听起来像是一个潜在的区域问题。Angular 依赖于ZoneJS (ngZone)。在使用任何异步 JavaScript 函数（如 、 等）时遇到此错误并不setTimeout()少见setInterval()……

原因是 ZoneJS 猴子修补了这些功能，并且它在 Angular 区域的上下文之外这样做。此时，当 Protractor 尝试连接到您的应用程序时，它不再在 Angular Zone 中运行，因此 Protractor 将挂起并最终因您遇到的错误而超时。

如果我是你，我会看看你的应用程序是否有 ZoneJS 猴子修补的任何异步函数。此外，一般来说，在您的代码中查找在您的应用程序区域上下文之外运行的任何内容。

这里有一篇关于ZoneJS的好文章，不仅可以帮助你理解ZoneJS，还列出了猴子补丁的函数Understanding ZoneJS

于 2018-07-17T23:10:09.597 回答
1

验证您的应用是否真正稳定：

  constructor(zone:NgZone)
  {
    zone.onStable.subscribe(()=> window.console.info('onStable'));
    zone.onUnstable.subscribe(()=> window.console.info('onUnstable'));
    zone.onMicrotaskEmpty.subscribe(()=> window.console.info('onMicrotaskEmpty'));
  }
于 2018-07-22T00:48:25.573 回答
0

尝试以下选项

// CSS Selector for the element housing the angular app - this defaults to
// body, but is necessary if ng-app is on a descendant of <body>.
rootElement: 'body',

// The timeout in milliseconds for each script run on the browser. This should
// be longer than the maximum time your application needs to stabilize between
// tasks.
allScriptsTimeout: 3600 * 1000,

// How long to wait for a page to load.
getPageTimeout: 3600 * 1000,

如果您的角度页面需要更多时间来加载页面，请尝试使用以下代码禁用动画

    var disableNgAnimate = function () {
        angular.module('disableNgAnimate', []).run(['$animate', function ($animate) {
            $animate.enabled(false);
        }]);
    };
    browser.addMockModule('disableNgAnimate', disableNgAnimate);

希望以上解决方案对您有所帮助。browser.ignoreSynchronization = true;已弃用尝试使用browser.waitForAngularEnabled(true);参考此处获取更多输入

于 2018-07-19T11:39:30.977 回答
0

protractor/globals 已从 v4.0.9 中删除，现在我们可以直接从 protractor 命名空间中简单地导入量角器助手，这更清洁。

例子：

import {browser} from 'protractor';
于 2018-07-24T08:18:34.893 回答
-1

尝试baseUrl: 'http://<ci-server-address>/',在量角器 conf.js 中删除

于 2018-05-15T07:41:07.550 回答