Protractor browser.actions().mouseMove() 不显示悬停效果

Question

我是 Protractor 的新手，并尝试为默认关闭的 slider 面板添加​​测试，将鼠标悬停将打开它，然后在 slider 面板上有一个项目列表可供选择。

<div class="slider" [ngClass]="{ closed: state === 1, open: state === 2}" (click)="onClick($event)" (mouseover)="onMouseOver($event)" (mouseleave)="onMouseLeave($event)">

我尝试了多种方法，它们都不起作用。

第一次尝试: (没有悬停效果，即什么都不做)

browser.actions().mouseMove(element(by.css('.slider.closed'))).perform();

第二次尝试: (得到一个错误:指定了一个无效或非法的选择器)

browser.actions().mouseMove(element(by.css('[(mouseover)="onMouseOver($event)"]'))).perform();

第三次尝试: (出现错误:使用定位器未找到元素)

browser.actions().mouseMove(element(by.css('[mouseover="onMouseOver($event)"]'))).perform();

Answer 1

使用 firefox 运行测试时遇到同样的问题
并找出如下解决方案

if (browser.isFirefox) {
 var script = `if(document.createEvent) {
      var evObj = document.createEvent('MouseEvents');
      evObj.initEvent('mouseover', true, false);
      arguments[0].dispatchEvent(evObj); 
    } else if (document.createEventObject) { 
      arguments[0].fireEvent('onmouseover'); 
    }`;
  browser.executeScript(script, elm.getWebElement());
  return elm.click();
} else {
return browser.actions()
  .mouseMove(elm.getWebElement())
  .click()
  .perform();
}

测试:
Protractor :5.1.1
Selenium :3.4.0