使用量角器等待离子加载对话框

Question

有类似的问题（链接如下），但没有一个能解决这个问题。我正在为 Ionic Project 编写量角器测试。我需要在 Ionic Loading 对话框出现和消失时执行测试。

我创建了一个包含应用程序的基本骨架和需要进行的测试的存储库。解决这个问题，你就解决了问题（我在下面描述问题）：https://github.com/TmanTman/StackoverflowQ。只需在 conf.js 中为您的系统调整 Chrome 的路径即可。

为了模拟异步离子加载对话框，我只需将其添加到控制器中的空白离子项目中：

$interval( function() {
        $ionicLoading.show({
            template: 'Async ionicLoading',
            duration: 5000
        });
      }, 5000 , 1);
    })

我需要让量角器等待对话框出现，做一些测试，等待对话框消失，然后再做一些测试。我在测试文件中的最新尝试是：

it('should only test when ionicLoading appears', function() {
  browser.wait(function(){
    return element(by.css('.loading-container.visible.active')).isPresent();
  }, 10000);
  var ionicLoadingText = element(by.css('.loading-container.visible.active')).getText();
  expect(ionicLoadingText).toEqual('Async IonicLoading');
})



it('should only test once ionicLoading disappears', function() {
  browser.wait(function() {
    var deferred = protractor.promise.defer();
    var q = element(by.css('.loading-container.visible.active')).isPresent()
      q.then( function (isPresent) {
        deferred.fulfill(!isPresent);
      });
      return deferred.promise;
    });
  expect(1).toEqual(1);
})

我试图避免使用同步睡眠功能，因为我的代码是高度异步的。我尝试了无数种变化，但我无法让它发挥作用。我用于信息的链接包括：

• Protractor blocking wait
• Asynchronous Testing with Protractor's ControlFlow
• Protractor wait for isElementPresent and click on waited element fails

Answer 1

问题有两个方面：

1) 据我所知，$ionicLoading 方法的持续时间属性是通过超时函数实现的。量角器不适用于 $timeout。因此，可以使用 $interval 调用隐藏 $ionicLoading 对话框，而不是使用持续时间属性（改编问题中的代码）：

$interval( function() {
      $ionicLoading.show({
          template: 'Async IonicLoading'
      });
      $interval( function() {
        $ionicLoading.hide();
      }, 5000, 1)
  }, 5000 , 1);

2) 检测异步变化的代码如下：

it('should only test when ionicLoading appears', function() {
    browser.wait(function() {
      var deferred = protractor.promise.defer();
      var q = element(by.css('.loading-container.visible.active')).isPresent()
      q.then( function (isPresent) {
          deferred.fulfill(isPresent);
      });
      return deferred.promise;
    }, 10000);
      var ionicLoadingText = element(by.css('.loading-container.visible.active')).getText();
      expect(ionicLoadingText).toEqual('Async IonicLoading');
    })

    it('should only test once ionicLoading disappears', function() {
      browser.wait(function() {
        var deferred = protractor.promise.defer();
        var q = element(by.css('.loading-container.visible.active')).isPresent()
          q.then( function (isPresent) {
            deferred.fulfill(!isPresent);
          });
          return deferred.promise;
        }, 10000);
      expect(1).toEqual(1);
    })

然后两个测试都通过了。