testing - 如何为 karma e2e 设置 jasmine 以测试 Angular 应用程序？

Question

我尝试使用 karma 和 jasmine 与 yeoman 创建 e2e 测试。在我的 karma-e2e.conf.js 中，我添加了 Jasmine :

files = [
   JASMINE,
   JASMINE_ADAPTER,
   ANGULAR_SCENARIO,
   ANGULAR_SCENARIO_ADAPTER,
   'test/e2e/**/*.js'
];

需要异步测试，所以我需要使用runs、waits、waitsFor ( https://github.com/pivotal/jasmine/wiki/Asynchronous-specs )

但是如果我尝试使用它:

it('test', function () {
    runs(function () {
        ...
    });
});

Scenatio 测试运行器返回这个:

TypeError: Cannot call method 'runs' of null
    at runs (http://localhost:8080/adapter/lib/jasmine.js:562:32)
    at Object.<anonymous> (http://localhost:8080/base/test/e2e/eduUser.js:42:3)
    at Object.angular.scenario.SpecRunner.run   (http://localhost:8080/adapter/lib/angular-scenario.js:27057:15)
    at Object.run (http://localhost:8080/adapter/lib/angular-scenario.js:10169:18)

不知道问题出在哪里。你能帮帮我吗？

Answer 1

使用 Karma 的 Angular e2e 测试不会也不能使用 JASMINE 适配器。相反，您有 ANGULAR_SCENARIO_ADAPTER，它与编写 Jasmine 测试有相似的感觉。

适配器的API中的所有命令无论如何都是异步的。例如 element('#nav-items').count() 不返回数字，它返回一个 Future 对象。 Future 对象被放置在一个队列中，并随着运行者的进行异步执行。引用API docs :

expect(future).{matcher}:

[...] All API statements return a future object, which get a value assigned after they are executed.

如果您需要运行自己的异步测试代码，您可以扩展适配器的 DSL，这比听起来容易。这个想法是你返回你自己的Future，它可以被一个匹配器评估，比如toBe()。在 the e2e-tests.js Gist from Vojta 中有一些关于如何执行此操作的示例.请记住在测试代码成功时调用 done(null, myRetrunValue);(myRetrunValue 是匹配器评估的值)。或者 done('Your own error message'); 如果你想让测试失败。

更新:回答下面的问题。要模拟登录，首先将名为 login 的函数添加到 dsl:

angular.scenario.dsl('login', function() {
  return function(selector) {
    
    // @param {DOMWindow} appWindow The window object of the iframe (the application)
    // @param {jQuery} $document jQuery wrapped document of the application
    // @param {function(error, value)} done Callback that should be called when done
    //                                      (will basically call the next item in the queuue)
    return this.addFutureAction('Logging in', function(appWindow, $document, done) {

      // You can do normal jQuery/jqLite stuff here on $document, just call done() when your asynchronous tasks have completed
      
      // Create some kind of listener to handle when your login is complete
      $document.one('loginComplete', function(e){
        done(null, true);
      }).one('loginError', function(e){
        done('Login error', false);
      });
      
      // Simulate the button click
      var loginButton = $document.find(selector || 'button.login');
      loginButton.click();
    })
  };
});

然后调用:

beforeEach( function()
{
    expect( login('button.login') ).toBeTruthy();
});