Actions in Cypress

Actions

Once you’ve identified the DOM element or elements you want to interact with, you can then send actions to those elements. Our first test used click to interact with a DOM element on the page and send it an action. Cypress provides basically any action you’d want:

• Click actions: click, dblclick, rightclick
• Form actions: check, clear, select, submit, type, uncheck
• Focus actions: blur, focus
• Scroll actions: scrollIntoView, scrollTo
• Send a generic event: trigger

All of these are basically the names of their associated actions. The ones that might not be forthcoming are type, which places text into a text field, and clear, which clears a text field. You use all of them by chaining onto a set of commands that yields DOM elements.

Cypress Has No Hover
The missing action here is hover. Cypress does not have a hover command. It so much doesn’t have a hover command that if you try cy.hover(), you will get a runtime error and a link to a page explaining why Cypress doesn’t have a hover command.

https://docs.cypress.io/api/commands/hover.html

There isn’t a hover command because it’s apparently difficult or impossible to implement one in a way that would activate the css :hover pseudo-selector. The recommended workaround is to trigger a mouseover event, as in cy.get("#element").trigger("mouseover"). There’s are other possible workarounds in the Cypress docs.

https://github.com/cypress-io/cypress-example-recipes/tree/master/examples/testing-dom__hover-hidden-elements