fix(clicking): handle negative area results in computeQuadArea (#3413)

This patch fixes a case in which computeQuadArea calculates the area size correctly, but returns the area as a negative number.
This occurs when DOM.getContentQuads returns quads in a specific order.

E.g. the array: [ { x: 463, y: 68.5 },{ x: 437, y: 68.5 },{ x: 437, y: 94.5 },{ x: 463, y: 94.5 } ] will receive area size of -676.
This commit is contained in:
Zeev Rosental 2018-10-25 21:41:37 +03:00 committed by Andrey Lushnikov
parent fae441cd42
commit 81edbbb58e
3 changed files with 27 additions and 1 deletions

View File

@ -626,7 +626,7 @@ function computeQuadArea(quad) {
const p2 = quad[(i + 1) % quad.length];
area += (p1.x * p2.y - p2.x * p1.y) / 2;
}
return area;
return Math.abs(area);
}
helper.tracePublicAPI(ElementHandle);

View File

@ -0,0 +1,21 @@
<!DOCTYPE html>
<html>
<head>
<title>Rotated button test</title>
</head>
<body>
<script src="mouse-helper.js"></script>
<button onclick="clicked();">Click target</button>
<style>
button {
transform: rotateY(180deg);
}
</style>
<script>
window.result = 'Was not clicked';
function clicked() {
result = 'Clicked';
}
</script>
</body>
</html>

View File

@ -312,6 +312,11 @@ module.exports.addTests = function({testRunner, expect}) {
await page.click('button');
expect(await page.evaluate(() => window.result)).toBe('Clicked');
});
it('should click a rotated button', async({page, server}) => {
await page.goto(server.PREFIX + '/input/rotatedButton.html');
await page.click('button');
expect(await page.evaluate(() => result)).toBe('Clicked');
});
it('should select the text with mouse', async({page, server}) => {
await page.goto(server.PREFIX + '/input/textarea.html');
await page.focus('textarea');