Элемент mouseover не работает с помощью транспортира

У меня есть директива, которая создает следующую структуру html:

<div class="popover ng-isolate-scope" ng-mouseover="toggle(true)" ng-mouseleave="toggle(false)" popover="" label="hover time!" trigger-class="button" content-class="specialContentClass">  
  <span id="thing" class="popover-trigger button">hover time!</span>
  <div ng-transclude="" ng-show="show" class="popover-content ng-hide">
    <div class="ng-scope">Popover content </div>
  </div>
</div>

Код работает нормально, и содержимое popover отображается правильно, когда вы наводите курсор вручную с помощью браузера.

Я пытаюсь проверить функциональность mouseover с помощью следующего теста транспортира:

 it('should display the popover-content on mouseover', function() {
     browser.get('http://localhost:9000/');
     browser.actions()
     .mouseMove(element(by.css('.popover')).find()).perform();
     expect(element(by.css('.popover-content'))
     .isDisplayed().toBeTruthy());
 });

Тест, кажется, запускается, браузер открывается, но я не вижу всплывающее содержимое, отображаемое перед тем, как браузер закрывается, поэтому я уверен, что бит mousemove не работает по какой-то причине. Затем в терминале выводятся следующие данные:

launcher] 0 instance(s) of WebDriver still running
[launcher] chrome #1 failed 1 test(s)
[launcher] overall: 1 failed spec(s)
[launcher] Process exited with error code 1
ycompu:angular ycompu$

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

Ответы

Ответ 1

Одна из возможных проблем заключается в том, что вам нужно дождаться загрузки angular:

it('should display the popover-content on mouseover', function() {
     browser.get('http://localhost:9000/');
     browser.waitForAngular();

     browser.actions().mouseMove(element(by.css('.popover'))).perform();
     expect(element(by.css('.popover-content')).isDisplayed()).toBeTruthy();
 });

^{Я также удалил вызов find() (не уверен, действительно ли он здесь нужен) и зафиксировал порядок закрытия скобок в последней строке.}

Ответ 2

Используйте browser.waitForAngular() перед вызовом browser.actions().mouseMove("mouseoverelement").perform();... потому что вам нужно дождаться angular нагрузки.

it('mouseover test', function() {
     ....
     ....
     browser.waitForAngular();
     browser.actions().mouseMove(element(by.css('#mouseoverelement'))).perform();
     expect(element(by.css('#mouseoverelement')).isDisplayed()).toBeTruthy();
 });

Ответ 3

Я случайно обнаружил обходной путь к проблеме с наведением мыши на Chrome. Если дважды связать метод mouseMove(), он будет работать.

Код, который не работает в Chrome:

browser.actions.mouseMove(element).click().perform();

Код с обходным путем (который работает):

browser.actions.mouseMove(element).mouseMove(element).click().perform();