Тестирование компонента, который открывает md-диалог

Question

Я пытаюсь написать единичный тест для компонента Angular, который открывает диалоговое окно, но я не могу этого сделать, потому что я не могу запустить закрытие диалога.

Как я могу заставить диалоговое окно md решить из тестового примера?

Я создал репозиторий с основным примером, где проблема может быть воспроизведена, и скопировал центральные биты ниже. Существует index.html, чтобы вручную проверить, работает ли код, тестовый пример, который отображает проблему, и пример того, как тесты записываются в код md.

Repository - 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(); 
}); 

Answer 1

мне удалось решить эту проблему, установив корневой элемент, как проблема, похоже, связана с тем, что элемент, скомпилированный в тесте, не связан с корневым элементом, что угловой материал также добавил диалог ,

Я обновил хранилище GitHub с полным кодом, но важные биты

beforeEach(module(function($provide) { 
    rootElem = angular.element("<div></div>") 
    $provide.value('$rootElement', rootElem); 
})); 

beforeEach(inject(function(_$rootScope_, _$compile_, $mdDialog, _$material_) { 
    ... 
    element = getCompiledElement(); 
    angular.element(window.document.body).append(rootElem); 
    angular.element(rootElem).append(element); 
}));