@luminati-io/webdriverio8
Version:
Next-gen browser and mobile automation test framework for Node.js
150 lines • 10.4 kB
JavaScript
import { getBrowserObject } from '../../utils/index.js';
/**
*
* Click on an element.
*
* This issues a WebDriver `click` command for the selected element , which generally scrolls to and then clicks the
* selected element when no options are passed. When options object is passed it uses action class instead of webdriver click which
* give added capabilities like passing button type, coordinates etc. By default, when using options a release action
* command is send after performing the click action, pass `option.skipRelease=true` to skip this action.
*
* Note: 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.
*
* <example>
:example.html
<button id="myButton" onclick="document.getElementById('someText').innerHTML='I was clicked'">Click me</button>
<div id="someText">I was not clicked</div>
:click.js
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
})
:example.js
it('should fetch menu links and visit each page', async () => {
const links = await $$('#menu a')
await links.forEach(async (link) => {
await link.click()
})
})
* </example>
*
* <example>
:example.html
<button id="myButton">Click me</button>
:example.js
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)
})
* </example>
*
* <example>
:example.html
<button id="myButton">Click me</button>
:example.js
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)
})
it('should skip sending releaseAction command that cause unexpected alert closure', async () => {
const myButton = await $('#myButton')
await myButton.click({ button: 2, x: 30, y: 40, skipRelease:true }) // skips sending releaseActions
})
* </example>
*
* @alias element.click
* @uses protocol/element, protocol/elementIdClick, protocol/performActions, protocol/positionClick
* @type action
* @param {ClickOptions=} options click options (optional)
* @param {string= | number=} options.button can be one of [0, "left", 1, "middle", 2, "right"] (optional)
* @param {number=} options.x Number (optional)
* @param {number=} options.y Number (optional)
* @param {number=} options.skipRelease Boolean (optional)
*/
export async function click(options) {
if (typeof options === 'undefined') {
return this.elementClick(this.elementId);
}
if (typeof options !== 'object' || Array.isArray(options)) {
throw new TypeError('Options must be an object');
}
let button = (options.button || 0);
const { x: xOffset = 0, y: yOffset = 0, skipRelease = false } = options || {};
if (typeof xOffset !== 'number'
|| typeof yOffset !== 'number'
|| !Number.isInteger(xOffset)
|| !Number.isInteger(yOffset)) {
throw new TypeError('Coordinates must be integers');
}
if (options.button === 'left') {
button = 0;
}
if (options.button === 'middle') {
button = 1;
}
if (options.button === 'right') {
button = 2;
}
if (![0, 1, 2].includes(button)) {
throw new Error('Button type not supported.');
}
if (this.isW3C) {
const browser = getBrowserObject(this);
if (xOffset || yOffset) {
const { width, height } = await browser.getElementRect(this.elementId);
if ((xOffset && xOffset < (-Math.floor(width / 2))) || (xOffset && xOffset > Math.floor(width / 2))) {
throw new Error('xOffset would cause a out of bounds error as it goes outside of element');
}
if ((yOffset && yOffset < (-Math.floor(height / 2))) || (yOffset && yOffset > Math.floor(height / 2))) {
throw new Error('yOffset would cause a out of bounds error as it goes outside of element');
}
}
const clickNested = async () => {
await browser.action('pointer', {
parameters: { pointerType: 'mouse' }
})
.move({
origin: this,
x: xOffset,
y: yOffset
})
.down({ button })
.up({ button })
.perform(skipRelease);
};
try {
await clickNested();
}
catch {
/**
* Workaround, because sometimes browser.action().move() flaky and isn't able to scroll pointer to into view
* Moreover the action with 'nearest' behavior by default where element is aligned at the bottom of its ancestor.
* and could be overlapped. Scroll to center should definitely work even if element was covered with sticky header/footer
*/
await this.scrollIntoView({ block: 'center', inline: 'center' });
await clickNested();
}
return;
}
const { width, height } = await this.getElementSize(this.elementId);
await this.moveToElement(this.elementId, xOffset + (width / 2), yOffset + (height / 2));
return this.positionClick(button);
}
//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoiY2xpY2suanMiLCJzb3VyY2VSb290IjoiIiwic291cmNlcyI6WyIuLi8uLi8uLi9zcmMvY29tbWFuZHMvZWxlbWVudC9jbGljay50cyJdLCJuYW1lcyI6W10sIm1hcHBpbmdzIjoiQUFBQSxPQUFPLEVBQUUsZ0JBQWdCLEVBQUUsTUFBTSxzQkFBc0IsQ0FBQTtBQUl2RDs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7O0dBOEVHO0FBQ0gsTUFBTSxDQUFDLEtBQUssVUFBVSxLQUFLLENBRXZCLE9BQXNCO0lBRXRCLElBQUksT0FBTyxPQUFPLEtBQUssV0FBVyxFQUFFLENBQUM7UUFDakMsT0FBTyxJQUFJLENBQUMsWUFBWSxDQUFDLElBQUksQ0FBQyxTQUFTLENBQUMsQ0FBQTtJQUM1QyxDQUFDO0lBRUQsSUFBSSxPQUFPLE9BQU8sS0FBSyxRQUFRLElBQUksS0FBSyxDQUFDLE9BQU8sQ0FBQyxPQUFPLENBQUMsRUFBRSxDQUFDO1FBQ3hELE1BQU0sSUFBSSxTQUFTLENBQUMsMkJBQTJCLENBQUMsQ0FBQTtJQUNwRCxDQUFDO0lBRUQsSUFBSSxNQUFNLEdBQUcsQ0FBQyxPQUFPLENBQUMsTUFBTSxJQUFJLENBQUMsQ0FBVyxDQUFBO0lBQzVDLE1BQU0sRUFDRixDQUFDLEVBQUUsT0FBTyxHQUFHLENBQUMsRUFDZCxDQUFDLEVBQUUsT0FBTyxHQUFHLENBQUMsRUFDZCxXQUFXLEdBQUcsS0FBSyxFQUN0QixHQUFHLE9BQU8sSUFBSSxFQUFFLENBQUE7SUFFakIsSUFDSSxPQUFPLE9BQU8sS0FBSyxRQUFRO1dBQ3hCLE9BQU8sT0FBTyxLQUFLLFFBQVE7V0FDM0IsQ0FBQyxNQUFNLENBQUMsU0FBUyxDQUFDLE9BQU8sQ0FBQztXQUMxQixDQUFDLE1BQU0sQ0FBQyxTQUFTLENBQUMsT0FBTyxDQUFDLEVBQUUsQ0FBQztRQUNoQyxNQUFNLElBQUksU0FBUyxDQUFDLDhCQUE4QixD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