ダイアログを開く Angular コンポーネントの単体テストを作成しようとしていますが、ダイアログを閉じることをトリガーできないため、作成できません。
md ダイアログをテスト ケースから解決するにはどうすればよいですか?
問題を再現できる基本的な例を含むリポジトリを作成し、以下の中心的なビットをコピーしました。コードが機能していることを手動で確認するための index.html、問題を表示するテスト ケース、および md コードでのテストの記述方法の例があります。
リポジトリ - https://github.com/gseabrook/md-dialog-test-issue
コンポーネントは非常に基本的です
angular
.module('test', ['ngMaterial'])
.component('dialogTest', {
template: '<button ng-click="showDialog()">Show Dialog</button>',
controller: function($scope, $mdDialog) {
var self = this;
$scope.showDialog = function() {
self.dialogOpen = true;
var confirm = $mdDialog.confirm()
.title('Dialog title')
.ok('OK')
.cancel('Cancel');
$mdDialog.show(confirm).then(function(result) {
self.dialogOpen = false;
}, function() {
self.dialogOpen = false;
});
}
}
});
また、テストも非常に簡単です
it("should open then close the dialog", function() {
var controller = element.controller("dialogTest");
expect(controller.dialogOpen).toEqual(undefined);
expect(element.find('button').length).toEqual(1);
element.find('button').triggerHandler('click');
expect(controller.dialogOpen).toBeTruthy();
rootScope.$apply();
material.flushInterimElement();
element.find('button').eq(2).triggerHandler('click');
rootScope.$apply();
material.flushInterimElement();
expect(controller.dialogOpen).toBeFalsy();
});