Angular $ timeoutがエンドツーエンドのテストをブロックするのはなぜですか？

Question

私は、ユーザに通知メッセージを表示するために使用されるディレクティブを作成しました。私はメッセージが5秒間画面上にとどまることを確認するために$タイムアウトを使用してい

$scope.$watch($messaging.isUpdated, function() { 
    $scope.messages = $messaging.getMessages(); 
    if ($scope.messages.length > 0) { 
     $timeout(function() { 
      for (var i = 0; i < $scope.messages.length; i++) { 
       if (i + 1 < $scope.messages.length) { 
        $messaging.removeMessage($scope.messages[i]); 
       } else { 
        $messaging.removeMessage($scope.messages[i]); 
       } 
      } 
     }, 5000); 
    } 
}); 

：私はこれを書いた通知を表示します。

ここで、通知が表示されるようにエンドツーエンドテストを作成します。 通知メッセージが表示されても、通知メッセージと同様にエンドツーエンドもタイムアウトしてしまうという問題があります。これにより、正しい通知が表示されているかどうかを確認することができなくなります。 。

これは私のテストコードは次のとおりです。

it('submit update Center', function() { 
    input('center.Name').enter('New Name'); 
    input('center.Department').enter('New Department'); 
    input('center.Contact').enter('New contact'); 
    input('center.Street').enter('New street'); 
    input('center.City').enter('New city'); 
    input('center.Country').enter('New Country'); 
    element('button#center_button').click(); 

    expect(element('.feedback').count()).toBe(1); 
    expect(element('.feedback:first').attr('class')).toMatch(/success/); 

    expect(element('.error.tooltip').count()).toBe(0); 
}); 

私はジャバスクリプトのsetTimeout（）を使用しないようにしたいとして、この問題に対する別の（角）ソリューションがあります願っていたいです。

Answer 1

Bad news、pal。これはAngularJsの既知の問題です。ディスカッションhereとここには何らかの形で関連したissueがあります。

$timeoutサービスをロールアップし、setTimeoutと電話をかけて$applyを手渡して回避することができます（これは、先ほどの説明からの示唆です）。それは本当に醜いですが、それは本当に簡単です。簡単な例：

app.service('myTimeout', function($rootScope) { 
    return function(fn, delay) { 
    return setTimeout(function() { 
     fn(); 
     $rootScope.$apply(); 
    }, delay); 
    }; 
}); 

（注）この1は角度$timeoutと互換性がありませんが、あなたが必要な場合は、あなたの機能を拡張することができます。あなたについて

Answer 2

小さなノートでは/ else文

$scope.$watch($messaging.isUpdated, function() { 
$scope.messages = $messaging.getMessages(); 
if ($scope.messages.length > 0) { 
    $timeout(function() { 
     for (var i = 0; i < $scope.messages.length; i++) { 
      if (i + 1 < $scope.messages.length) { 
       $messaging.removeMessage($scope.messages[i]); 
      } else { /**** unnecessay else here *****/ 
       $messaging.removeMessage($scope.messages[i]); 
      } 
     } 
    }, 5000); 
}});