fix(input): clicking an element should take into account frame position (#971)

This commit is contained in:
JoelEinbinder 2017-10-09 13:23:36 -07:00 committed by GitHub
parent a7672acb85
commit 52f92c9891
2 changed files with 31 additions and 10 deletions

View File

@ -44,22 +44,22 @@ class ElementHandle extends JSHandle {
* @return {!Promise<{x: number, y: number}>}
*/
async _visibleCenter() {
const {center, error} = await this.executionContext().evaluate(element => {
const error = await this.executionContext().evaluate(element => {
if (!element.ownerDocument.contains(element))
return {center: null, error: 'Node is detached from document'};
return 'Node is detached from document';
if (element.nodeType !== HTMLElement.ELEMENT_NODE)
return {center: null, error: 'Node is not of type HTMLElement'};
return 'Node is not of type HTMLElement';
element.scrollIntoViewIfNeeded();
const rect = element.getBoundingClientRect();
const center = {
x: (Math.max(rect.left, 0) + Math.min(rect.right, window.innerWidth)) / 2,
y: (Math.max(rect.top, 0) + Math.min(rect.bottom, window.innerHeight)) / 2
};
return {center, error: null};
}, this);
if (error)
throw new Error(error);
return center;
const {model} = await this._client.send('DOM.getBoxModel', {
objectId: this._remoteObject.objectId
});
return {
x: (model.content[0] + model.content[4]) / 2,
y: (model.content[1] + model.content[5]) / 2
};
}
async hover() {

View File

@ -1696,6 +1696,27 @@ describe('Page', function() {
await button.tap();
expect(await page.evaluate(() => getResult())).toEqual(['Touchstart: 0', 'Touchend: 0']);
}));
it('should click the button inside an iframe', SX(async function() {
await page.goto(EMPTY_PAGE);
await page.setContent('<div style="width:100px;height:100px">spacer</div>');
const FrameUtils = require('./frame-utils');
await FrameUtils.attachFrame(page, 'button-test', PREFIX + '/input/button.html');
const frame = page.frames()[1];
const button = await frame.$('button');
await button.click();
expect(await frame.evaluate(() => window.result)).toBe('Clicked');
}));
it('should click the button with deviceScaleFactor set', SX(async function() {
await page.setViewport({width: 400, height: 400, deviceScaleFactor: 5});
expect(await page.evaluate(() => window.devicePixelRatio)).toBe(5);
await page.setContent('<div style="width:100px;height:100px">spacer</div>');
const FrameUtils = require('./frame-utils');
await FrameUtils.attachFrame(page, 'button-test', PREFIX + '/input/button.html');
const frame = page.frames()[1];
const button = await frame.$('button');
await button.click();
expect(await frame.evaluate(() => window.result)).toBe('Clicked');
}));
function dimensions() {
const rect = document.querySelector('textarea').getBoundingClientRect();
return {