click
Click on an element.
Note: This issues a WebDriver click
command for the selected element, which generally scrolls to and then clicks the
selected element. However, if you have fixed-position elements (such as a fixed header or footer) that cover up the
selected element after it is scrolled within the viewport, the click will be issued at the given coordinates, but will
be received by your fixed (overlaying) element. In these cased the following error is thrown:
Element is not clickable at point (x, x). Other element would receive the click: ..."
To work around this, try to find the overlaying element and remove it via execute
command so it doesn't interfere
the click. You also can try to scroll to the element yourself using scroll
with an offset appropriate for your
scenario.
Usage
$(selector).click({ button, x, y })
Parameters
Name | Type | Details |
---|---|---|
options optional | ClickOptions | click options (optional) |
options.button optional | string , number | can be one of [0, "left", 1, "middle", 2, "right"] (optional) |
options.x optional | number | Number (optional) |
options.y optional | number | Number (optional) |
Examples
- Asynchronous Mode
- Synchronous Mode
<button id="myButton" onclick="document.getElementById('someText').innerHTML='I was clicked'">Click me</button>
<div id="someText">I was not clicked</div>
it('should demonstrate the click command', async () => {
const myButton = await $('#myButton')
await myButton.click()
const myText = await $('#someText')
const text = await myText.getText()
assert(text === 'I was clicked') // true
})
it('should fetch menu links and visit each page', async () => {
const links = await $$('#menu a')
await links.forEach(async (link) => {
await link.click()
})
})
<button id="myButton">Click me</button>
it('should demonstrate a click using an offset', async () => {
const myButton = await $('#myButton')
await myButton.click({ x: 30 }) // clicks 30 horizontal pixels away from location of the button (from center point of element)
})
<button id="myButton">Click me</button>
it('should demonstrate a right click passed as string', async () => {
const myButton = await $('#myButton')
await myButton.click({ button: 'right' }) // opens the contextmenu at the location of the button
})
it('should demonstrate a right click passed as number while adding an offset', async () => {
const myButton = await $('#myButton')
await myButton.click({ button: 2, x: 30, y: 40 }) // opens the contextmenu 30 horizontal and 40 vertical pixels away from location of the button (from the center of element)
})
<button id="myButton" onclick="document.getElementById('someText').innerHTML='I was clicked'">Click me</button>
<div id="someText">I was not clicked</div>
it('should demonstrate the click command', () => {
const myButton = $('#myButton')
myButton.click()
const myText = $('#someText')
const text = myText.getText()
assert(text === 'I was clicked') // true
})
it('should fetch menu links and visit each page', () => {
const links = $$('#menu a')
links.forEach(async (link) => {
link.click()
})
})
<button id="myButton">Click me</button>
it('should demonstrate a click using an offset', () => {
const myButton = $('#myButton')
myButton.click({ x: 30 }) // clicks 30 horizontal pixels away from location of the button (from center point of element)
})
<button id="myButton">Click me</button>
it('should demonstrate a right click passed as string', () => {
const myButton = $('#myButton')
myButton.click({ button: 'right' }) // opens the contextmenu at the location of the button
})
it('should demonstrate a right click passed as number while adding an offset', () => {
const myButton = $('#myButton')
myButton.click({ button: 2, x: 30, y: 40 }) // opens the contextmenu 30 horizontal and 40 vertical pixels away from location of the button (from the center of element)
})
caution
Synchronous Mode will depcrecated with Node.js v16. With an update to the underlying Chromium version it became technically impossible to provide the same synchronous behavior. We recommend to start transition to asynchronous command execution. For more information, see our RFC.