Skip to content

Commit 4258d37

Browse files
author
DavertMik
committed
implemented clickXY action
1 parent 514cc75 commit 4258d37

File tree

5 files changed

+237
-0
lines changed

5 files changed

+237
-0
lines changed

‎lib/helper/Playwright.js‎

Lines changed: 43 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -1945,6 +1945,49 @@ class Playwright extends Helper {
19451945
return proceedClick.call(this, locator, context, { button: 'right' })
19461946
}
19471947

1948+
/**
1949+
* Performs click at specific coordinates.
1950+
* If locator is provided, the coordinates are relative to the element.
1951+
* If locator is not provided, the coordinates are global page coordinates.
1952+
*
1953+
* ```js
1954+
* // Click at global coordinates (100, 200)
1955+
* I.clickXY(100, 200);
1956+
*
1957+
* // Click at coordinates (50, 30) relative to element
1958+
* I.clickXY('#someElement', 50, 30);
1959+
* ```
1960+
*
1961+
* @param {CodeceptJS.LocatorOrString|number} locator Element to click on or X coordinate if no element.
1962+
* @param {number} [x] X coordinate relative to element, or Y coordinate if locator is a number.
1963+
* @param {number} [y] Y coordinate relative to element.
1964+
* @returns {Promise<void>}
1965+
*/
1966+
async clickXY(locator, x, y) {
1967+
// If locator is a number, treat it as global X coordinate
1968+
if (typeof locator === 'number') {
1969+
const globalX = locator
1970+
const globalY = x
1971+
await this.page.mouse.click(globalX, globalY)
1972+
return this._waitForAction()
1973+
}
1974+
1975+
// Locator is provided, click relative to element
1976+
const el = await this._locateElement(locator)
1977+
assertElementExists(el, locator, 'Element to click')
1978+
1979+
const box = await el.boundingBox()
1980+
if (!box) {
1981+
throw new Error(`Element ${locator} is not visible or has no bounding box`)
1982+
}
1983+
1984+
const absoluteX = box.x + x
1985+
const absoluteY = box.y + y
1986+
1987+
await this.page.mouse.click(absoluteX, absoluteY)
1988+
return this._waitForAction()
1989+
}
1990+
19481991
/**
19491992
*
19501993
* [Additional options](https://playwright.dev/docs/api/class-elementhandle#element-handle-check) for check available as 3rd argument.

‎lib/helper/Puppeteer.js‎

Lines changed: 43 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -1300,6 +1300,49 @@ class Puppeteer extends Helper {
13001300
return proceedClick.call(this, locator, context, { button: 'right' })
13011301
}
13021302

1303+
/**
1304+
* Performs click at specific coordinates.
1305+
* If locator is provided, the coordinates are relative to the element.
1306+
* If locator is not provided, the coordinates are global page coordinates.
1307+
*
1308+
* ```js
1309+
* // Click at global coordinates (100, 200)
1310+
* I.clickXY(100, 200);
1311+
*
1312+
* // Click at coordinates (50, 30) relative to element
1313+
* I.clickXY('#someElement', 50, 30);
1314+
* ```
1315+
*
1316+
* @param {CodeceptJS.LocatorOrString|number} locator Element to click on or X coordinate if no element.
1317+
* @param {number} [x] X coordinate relative to element, or Y coordinate if locator is a number.
1318+
* @param {number} [y] Y coordinate relative to element.
1319+
* @returns {Promise<void>}
1320+
*/
1321+
async clickXY(locator, x, y) {
1322+
// If locator is a number, treat it as global X coordinate
1323+
if (typeof locator === 'number') {
1324+
const globalX = locator
1325+
const globalY = x
1326+
await this.page.mouse.click(globalX, globalY)
1327+
return this._waitForAction()
1328+
}
1329+
1330+
// Locator is provided, click relative to element
1331+
const els = await this._locate(locator)
1332+
assertElementExists(els, locator, 'Element to click')
1333+
1334+
const box = await els[0].boundingBox()
1335+
if (!box) {
1336+
throw new Error(`Element ${locator} is not visible or has no bounding box`)
1337+
}
1338+
1339+
const absoluteX = box.x + x
1340+
const absoluteY = box.y + y
1341+
1342+
await this.page.mouse.click(absoluteX, absoluteY)
1343+
return this._waitForAction()
1344+
}
1345+
13031346
/**
13041347
* {{> checkOption }}
13051348
*/

‎lib/helper/WebDriver.js‎

Lines changed: 69 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -1097,6 +1097,75 @@ class WebDriver extends Helper {
10971097
await this.browser.buttonDown(2)
10981098
}
10991099

1100+
/**
1101+
* Performs click at specific coordinates.
1102+
* If locator is provided, the coordinates are relative to the element's top-left corner.
1103+
* If locator is not provided, the coordinates are relative to the body element.
1104+
*
1105+
* ```js
1106+
* // Click at coordinates (100, 200) relative to body
1107+
* I.clickXY(100, 200);
1108+
*
1109+
* // Click at coordinates (50, 30) relative to element's top-left corner
1110+
* I.clickXY('#someElement', 50, 30);
1111+
* ```
1112+
*
1113+
* @param {CodeceptJS.LocatorOrString|number} locator Element to click on or X coordinate if no element.
1114+
* @param {number} [x] X coordinate relative to element's top-left, or Y coordinate if locator is a number.
1115+
* @param {number} [y] Y coordinate relative to element's top-left.
1116+
* @returns {Promise<void>}
1117+
*/
1118+
async clickXY(locator, x, y) {
1119+
// If locator is a number, treat it as X coordinate and use body as base
1120+
if (typeof locator === 'number') {
1121+
const globalX = locator
1122+
const globalY = x
1123+
locator = '//body'
1124+
x = globalX
1125+
y = globalY
1126+
}
1127+
1128+
// Locate the base element
1129+
const res = await this._locate(withStrictLocator(locator), true)
1130+
assertElementExists(res, locator, 'Element to click')
1131+
const el = usingFirstElement(res)
1132+
1133+
// Get element position and size to calculate top-left corner
1134+
const location = await el.getLocation()
1135+
const size = await el.getSize()
1136+
1137+
// WebDriver clicks at center by default, so we need to offset from center to top-left
1138+
// then add our desired x, y coordinates
1139+
const offsetX = -(size.width / 2) + x
1140+
const offsetY = -(size.height / 2) + y
1141+
1142+
if (this.browser.isW3C) {
1143+
// Use performActions for W3C WebDriver
1144+
return this.browser.performActions([
1145+
{
1146+
type: 'pointer',
1147+
id: 'pointer1',
1148+
parameters: { pointerType: 'mouse' },
1149+
actions: [
1150+
{
1151+
type: 'pointerMove',
1152+
origin: el,
1153+
duration: 0,
1154+
x: Math.round(offsetX),
1155+
y: Math.round(offsetY),
1156+
},
1157+
{ type: 'pointerDown', button: 0 },
1158+
{ type: 'pointerUp', button: 0 },
1159+
],
1160+
},
1161+
])
1162+
}
1163+
1164+
// Fallback for non-W3C browsers
1165+
await el.moveTo({ xOffset: Math.round(offsetX), yOffset: Math.round(offsetY) })
1166+
return el.click()
1167+
}
1168+
11001169
/**
11011170
* {{> forceRightClick }}
11021171
*

‎test/data/app/view/form/click_coordinates.php‎

Lines changed: 60 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,60 @@
1+
<html>
2+
<head>
3+
<style>
4+
body {
5+
margin: 0;
6+
padding: 20px;
7+
}
8+
#clickArea {
9+
width: 400px;
10+
height: 300px;
11+
background-color: #f0f0f0;
12+
border: 2px solid #333;
13+
position: relative;
14+
margin: 20px 0;
15+
}
16+
#output {
17+
font-family: monospace;
18+
margin-top: 20px;
19+
}
20+
</style>
21+
<script>
22+
let lastClickX = 0;
23+
let lastClickY = 0;
24+
25+
function handleClick(event) {
26+
const rect = event.currentTarget.getBoundingClientRect();
27+
lastClickX = event.clientX - rect.left;
28+
lastClickY = event.clientY - rect.top;
29+
30+
document.getElementById('output').innerHTML =
31+
'Clicked at: X=' + Math.round(lastClickX) + ', Y=' + Math.round(lastClickY);
32+
}
33+
34+
function handleGlobalClick(event) {
35+
lastClickX = event.clientX;
36+
lastClickY = event.clientY;
37+
38+
document.getElementById('globalOutput').innerHTML =
39+
'Global click at: X=' + Math.round(lastClickX) + ', Y=' + Math.round(lastClickY);
40+
}
41+
42+
window.addEventListener('load', function() {
43+
document.getElementById('clickArea').addEventListener('click', handleClick);
44+
document.body.addEventListener('click', handleGlobalClick);
45+
});
46+
</script>
47+
</head>
48+
<body>
49+
50+
<h1>Click Coordinates Test</h1>
51+
52+
<div id="clickArea">
53+
Click inside this area
54+
</div>
55+
56+
<div id="output">No clicks yet</div>
57+
<div id="globalOutput">No global clicks yet</div>
58+
59+
</body>
60+
</html>

‎test/helper/webapi.js‎

Lines changed: 22 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -350,6 +350,28 @@ export function tests() {
350350
})
351351
})
352352

353+
describe('#clickXY', () => {
354+
it('should click at global coordinates', async () => {
355+
await I.amOnPage('/form/click_coordinates')
356+
await I.dontSee('Global click at:')
357+
await I.clickXY(100, 50)
358+
await I.see('Global click at: X=100, Y=50')
359+
})
360+
361+
it('should click at coordinates relative to element', async () => {
362+
await I.amOnPage('/form/click_coordinates')
363+
await I.dontSee('Clicked at:')
364+
await I.clickXY('#clickArea', 50, 30)
365+
await I.see('Clicked at: X=50, Y=30')
366+
})
367+
368+
it('should click at different relative coordinates', async () => {
369+
await I.amOnPage('/form/click_coordinates')
370+
await I.clickXY('#clickArea', 100, 75)
371+
await I.see('Clicked at: X=100, Y=75')
372+
})
373+
})
374+
353375
describe('#checkOption', () => {
354376
it('should check option by css', async () => {
355377
await I.amOnPage('/form/checkbox')

0 commit comments

Comments
 (0)