Skip to main content
Home
  • Tutorials
    • Quality Assurance
    • Software Development
    • Machine Learning
    • Data Science
  • About Us
  • Contact
programsbuzz facebook programsbuzz twitter programsbuzz linkedin
  • Log in

Main navigation

  • Tutorials
    • Quality Assurance
    • Software Development
    • Machine Learning
    • Data Science
  • About Us
  • Contact

Cypress rightclick Command

Profile picture for user arilio666
Written by arilio666 on 02/08/2022 - 11:09

Right-click command performs the right-click operation on the provided element. Note that it does not open up the right-click context menu native to the browser.

Instead, this one is used to test the element functionality when it has right-click and operations done.

Syntax

.rightclick()
.rightclick(options)
.rightclick(position)
.rightclick(position, options)
.rightclick(x, y)
.rightclick(x, y, options)

Arguments Used In Right Click

  • Options: Can pass in objects to change the default behavior of .rightclick() Here is the list of some of the options that cypress can use with the right-click command:
  • altKey: Activates alt key in windows and options key in mac. Default is false.
  • waitForAnimations: Waits for the animations to finish before right-clicking. Default is waitForAnimations.
  • animationDistanceThreshold: Used to consider the distance between the pixels and the element and that mist exceeds overtime. Default is animationDistanceThreshold.
  • timeout: Used to input time to wait for the right click to resolve before timing out. Default is defaultCommandTimeout.
  • ctrlKey: This activates the control key. Default is false.
  • log: Displays the record in command log in output. Default is true.
  • Force: Forces right clickability. Default is false.
  • MetaKey: Used to activate windows key in windows and command key in mac. Default is false.
  • Multiple: This is used to clock on multiple elements serially. Default is false.
  • ScrollBehaviour: This is used to viewport position where an element should be scrolled before the command execution. Default is ScrollBehaviour.
  • ShiftKey: This activates the sift key. Default is false.
  • Position: Various arguments based on the positions can also be passed onto where the right click command should perform. Here are some of the positions topLeft, top, top right, left, center, right, bottomLeft, bottom, and bottomRight.
  • X and Y: Can mention the pixel distances coordinates on where it should be right-clicked on.

Right click command correct use

y.get('.btn').rightclick() 
  • right clicks the btn element.
cy.focused().rightclick() 
  • right clicks with more focus.
cy.contains('Welcome').rightclick() 
  • right clicks text containing 'Welcome.'

Wrong use

cy.rightclick()
cy.window().rightclick()

Example

describe('The RightClick Command',() => {
    it('visit the site, perform various clicks',()=>{
        cy.visit('https://www.programsbuzz.com/')
        cy.contains('Start Learning').rightclick()
    })
})

This one right-clicks the text containing 'Start Learning.'

describe('The RightClick Command',() => {
    it('visit the site, perform various clicks',()=>{
        cy.visit('https://www.programsbuzz.com/')
        cy.get('page-img').rightclick('bottomLeft')
    })
})

Right clicks the bottomLeft element after getting the entire page.

describe('The RightClick Command',() => {
    it('visit the site, perform various clicks',()=>{
        cy.visit('https://www.programsbuzz.com/')
        cy.get('#id').rightclick(10, 100)
    })
})

Right clicks on the provided id after getting the id with coordinates of CSS px distance.

describe('The RightClick Command',() => {
    it('visit the site, perform various clicks',()=>{
        cy.visit('https://www.programsbuzz.com/')
        cy.get('#id').as('id')
        cy.get('@id').rightclick('topRight', {force: true})
    })
})

Aliases the element and uses the same alias to right click on the element present on the top right of the page with force.

describe('The RightClick Command',() => {
    it('visit the site, perform various clicks',()=>{
        cy.visit('https://www.programsbuzz.com/')
        cy.get('#id').rightclick({multiple: true})
    })
})

Right clicks on the id element, which is present everywhere.

describe('The RightClick Command',() => {
    it('visit the site, perform various clicks',()=>{
        cy.visit('https://www.programsbuzz.com/')
        cy.get('#id').rightclick({shiftKey: true})
    })
})

Activates the shift key and rightclicks along with it. Identical syntaxes go for other keypress arguments.

Related Content
Cypress Tutorial
Cypress Double-click using dblclick Command
Cypress Force a Click
Tags
Cypress
  • Log in or register to post comments

Choose Your Technology

  1. Agile
  2. Apache Groovy
  3. Apache Hadoop
  4. Apache HBase
  5. Apache Spark
  6. Appium
  7. AutoIt
  8. AWS
  9. Behat
  10. Cucumber Java
  11. Cypress
  12. DBMS
  13. Drupal
  14. GitHub
  15. GitLab
  16. GoLang
  17. Gradle
  18. HTML
  19. ISTQB Foundation
  20. Java
  21. JavaScript
  22. JMeter
  23. JUnit
  24. Karate
  25. Kotlin
  26. LoadRunner
  27. matplotlib
  28. MongoDB
  29. MS SQL Server
  30. MySQL
  31. Nightwatch JS
  32. PactumJS
  33. PHP
  34. Playwright
  35. Playwright Java
  36. Playwright Python
  37. Postman
  38. Project Management
  39. Protractor
  40. PyDev
  41. Python
  42. Python NumPy
  43. Python Pandas
  44. Python Seaborn
  45. R Language
  46. REST Assured
  47. Ruby
  48. Selenide
© Copyright By iVagus Services Pvt. Ltd. 2023. All Rights Reserved.

Footer

  • Cookie Policy
  • Privacy Policy
  • Terms of Use