Cypress 一些鼠标事件

一、鼠标悬停事件（mouseover）

cy.get('button').trigger('mouseover')

这是官方给出的api，实时没有生效。尝试了各种方法，直到看到这个贴子 https://github.com/cypress-io/cypress/issues/10
有人给出了解决方案（右击操作）：

cy.get('button').rightclick()

 

二、鼠标长按事件

cy.get('button').trigger('mousedown')
cy.wait(1000)
cy.get('button').trigger('mouseleave')

三、鼠标拖拽事件

cy.get('[data-cy=draggable]')
  .trigger('mousedown', { which: 1, pageX: 600, pageY: 100 })
  .trigger('mousemove', { which: 1, pageX: 600, pageY: 600 })
  .trigger('mouseup')

四、实战
我们要获取 bing页面，Office标签里的元素，需要将鼠标悬停到 Office控件上

下面是代码实现

/// 

describe('My First Test Suite', function() {
    
    it('My First Test', function() {
        cy.visit('https://cn.bing.com/')
        cy.get('#office').trigger('mouseover')
        cy.wait(3000)
        cy.get('#office').rightclick()
        cy.wait(3000)
    })
})