Today, we will see how we can click on an element based on position. For that, we have a position argument where we can pass in the position of the element we will click. Have discussed what the click command does in the previous article
Click Positions
Valid positions are:
- topLeft
- top
- topRight
- left
- center (default)
- right
- bottomLeft
- bottom
- bottomRight
Example: Click using Position Argument
For example purpose, we are going to use our traditional https://www.programsbuzz.com/.
it('visit the site, perform various clicks',()=>{
cy.visit('https://www.programsbuzz.com/')
cy.wait(5000)
cy.contains("Start Learning").click('left', { force: true })
})
See the dotted red circle on Start Learning button, we can see here the start learning button has been clicked on the position of the left side.
describe('The Click Command',() => {
it('visit the site, perform various clicks',()=>{
cy.visit('https://www.programsbuzz.com/')
cy.wait(5000)
cy.contains("Start Learning").click('right', { force: true })
})
})
This time dotted red is on the right side, we can see here when the position argument is given as right, the pointer clicked is on the right side.
So here, the position argument plays the part of clicking the element or button based on the position provided as the argument within the click command.
- Log in to post comments