Question

使用我的第一个角度应用程序，并编写我的第一个量角器测试以检查登录功能。身份验证使用ng-token-auth，我也使用ui-router。我怀疑问题是测试没有正确捕获重定向，但我尝试了各种解决方法，无法获得任何工作。

这是基本的路由和重定向代码：

angular
  .module('testAngularApp', [
    'ngAnimate',
    'ngCookies',
    'ngResource',
    'ui.router',
    'ngSanitize',
    'ng-token-auth'
  ])
  .config(function ($stateProvider, $urlRouterProvider, $authProvider, $locationProvider) {
    $locationProvider.html5Mode(true).hashPrefix('!');
    $urlRouterProvider.otherwise('/');

    $authProvider.configure({
      apiUrl: 'http://backend.dev'
    });

    $stateProvider
      .state('index', {
        url: "/",
        templateUrl: 'views/main.html',
        controller: 'MainCtrl',
        controllerAs: 'main'
      })
      .state('app', {
        url: '/app',
        abstract: true,
        template: '<ui-view/>',
        resolve: {
          auth: function($auth, $state) {
            return $auth.validateUser().catch(function() {
              $state.go('index');
            });
          }
        }
      })
      .state('app.dashboard', {
        url: '/dashboard',
        templateUrl: 'views/dashboard.html',
        controller: 'DashboardCtrl',
        controllerAs: 'dashboard'
      });
  })
  .run(function($rootScope, $location, $state) {
    $rootScope.$on('auth:login-success', function() {
      $state.go('app.dashboard');
    });
  });

因此，在渲染主页面时，您需要填写登录详细信息，单击按钮，然后使用$ state.go前往应用程序仪表板。我的量角器测试如下：

describe('Budget', function() {
  describe('Authentication', function() {
    beforeEach(function() {
      browser.get('http://localhost:9000');
    });

    it('should log in and redirect to the dashboard', function(done) {
      element(by.model('loginForm.email')).sendKeys('someone@somewhere.com');
      element(by.model('loginForm.password')).sendKeys('password');
      element(by.id('login-button')).click();

      expect($('h3.title').getText()).toEqual('Welcome');
    });
  });
});

相当直截了当。我得到的错误是：

     Timed out waiting for Protractor to synchronize with the page after 11 seconds. Please see https://github.com/angular/protractor/blob/master/docs/faq.md. The following tasks were pending:
- $timeout: function () {
                    return _this.validateUser({
                      config: _this.getSavedConfig()
                    });
                  }

值得注意的是，由于此测试失败，它的工作正常。在弹出的chrome窗口中，登录工作，浏览器重定向，我看到欢迎文本。

我尝试过的事情......

browser.ignoreSynchronization = true;在测试中
browser.wait（... for element ...）
$ location.path而不是$ state.go
将browser.waitForAngular（）添加到测试
可能是我发现并忘记的随机堆栈溢出建议

有什么想法吗？

Answer 1

终于明白了。作为参考，似乎是ng-token-auth在其某些代码中使用$ timeout变量的问题，这会使程序员感到困惑。修正了这个PR：

https://github.com/lynndylanhurley/ng-token-auth/pull/196

并在0.29beta1版本中进行了验证。

Answer 2

我使用ui-router和ng-token-auth遇到了同样的问题，但我终于通过混合使用这些选项解决了问题。试试这个：

it('should log in and redirect to the dashboard', function(done) {
  element(by.model('loginForm.email')).sendKeys('someone@somewhere.com');
  element(by.model('loginForm.password')).sendKeys('password');
  element(by.id('login-button')).click();

  browser.ignoreSynchronization = true;
  browser.waitForAngular();
  browser.sleep(5000);

  $('h3.title').getText().then(function(text){
    expect(text).toEqual('Welcome');
  });

  browser.ignoreSynchronization = false;
});

我认为这可能是因为ng-token-auth中存在错误，但我并非100％确定。

编辑：这是ng-token-auth中的一个错误，修正了最新版本（v0.0.29-beta1）

量角器测试登陆后超时

2 个答案: