Filip/playwright
1
0
Fork 0
Code Issues Pull requests Actions Packages Projects Releases Wiki Activity

chore: reuse waitForSelectorOrXPath between browsers (#81)

Browse source
This commit is contained in:
Dmitry Gozman 2019-11-26 07:55:34 -08:00 committed by Pavel Feldman
parent cefebb3938
commit 0db3101013
4 changed files with 88 additions and 153 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

68
src/chromium/DOMWorld.ts
View file

@ -24,7 +24,7 @@ import { helper } from '../helper';
import { ElementHandle, JSHandle } from './JSHandle'; import { ElementHandle, JSHandle } from './JSHandle';
import { LifecycleWatcher } from './LifecycleWatcher'; import { LifecycleWatcher } from './LifecycleWatcher';
import { TimeoutSettings } from '../TimeoutSettings'; import { TimeoutSettings } from '../TimeoutSettings';
import { WaitTask, WaitTaskParams } from '../waitTask'; import { WaitTask, WaitTaskParams, waitForSelectorOrXPath } from '../waitTask';
const readFileAsync = helper.promisify(fs.readFile); const readFileAsync = helper.promisify(fs.readFile);
@ -284,12 +284,24 @@ export class DOMWorld {
} }
} }
waitForSelector(selector: string, options: { visible?: boolean; hidden?: boolean; timeout?: number; } | undefined): Promise<ElementHandle | null> { async waitForSelector(selector: string, options: { visible?: boolean; hidden?: boolean; timeout?: number; } | undefined): Promise<ElementHandle | null> {
return this._waitForSelectorOrXPath(selector, false, options); const params = waitForSelectorOrXPath(selector, false /* isXPath */, { timeout: this._timeoutSettings.timeout(), ...options });
const handle = await this._scheduleWaitTask(params);
if (!handle.asElement()) {
await handle.dispose();
return null;
}
return handle.asElement();
} }
waitForXPath(xpath: string, options: { visible?: boolean; hidden?: boolean; timeout?: number; } | undefined): Promise<ElementHandle | null> { async waitForXPath(xpath: string, options: { visible?: boolean, hidden?: boolean, timeout?: number } = {}): Promise<ElementHandle | null> {
return this._waitForSelectorOrXPath(xpath, true, options); const params = waitForSelectorOrXPath(xpath, true /* isXPath */, { timeout: this._timeoutSettings.timeout(), ...options });
const handle = await this._scheduleWaitTask(params);
if (!handle.asElement()) {
await handle.dispose();
return null;
}
return handle.asElement();
} }
waitForFunction(pageFunction: Function | string, options: { polling?: string | number; timeout?: number; } = {}, ...args): Promise<JSHandle> { waitForFunction(pageFunction: Function | string, options: { polling?: string | number; timeout?: number; } = {}, ...args): Promise<JSHandle> {
@ -318,51 +330,5 @@ export class DOMWorld {
async title(): Promise<string> { async title(): Promise<string> {
return this.evaluate(() => document.title); return this.evaluate(() => document.title);
} }
async _waitForSelectorOrXPath(
selectorOrXPath: string,
isXPath: boolean,
options: { visible?: boolean; hidden?: boolean; timeout?: number; } = {}): Promise<ElementHandle | null> {
const {
visible: waitForVisible = false,
hidden: waitForHidden = false,
timeout = this._timeoutSettings.timeout(),
} = options;
const polling = waitForVisible || waitForHidden ? 'raf' : 'mutation';
const title = `${isXPath ? 'XPath' : 'selector'} "${selectorOrXPath}"${waitForHidden ? ' to be hidden' : ''}`;
const params: WaitTaskParams = {
predicateBody: predicate,
title,
polling,
timeout,
args: [selectorOrXPath, isXPath, waitForVisible, waitForHidden]
};
const handle = await this._scheduleWaitTask(params);
if (!handle.asElement()) {
await handle.dispose();
return null;
}
return handle.asElement();
function predicate(selectorOrXPath: string, isXPath: boolean, waitForVisible: boolean, waitForHidden: boolean): (Node | boolean) | null {
const node = isXPath
? document.evaluate(selectorOrXPath, document, null, XPathResult.FIRST_ORDERED_NODE_TYPE, null).singleNodeValue
: document.querySelector(selectorOrXPath);
if (!node)
return waitForHidden;
if (!waitForVisible && !waitForHidden)
return node;
const element = (node.nodeType === Node.TEXT_NODE ? node.parentElement : node) as Element;
const style = window.getComputedStyle(element);
const isVisible = style && style.visibility !== 'hidden' && hasVisibleBoundingBox();
const success = (waitForVisible === isVisible || waitForHidden === !isVisible);
return success ? node : null;
function hasVisibleBoundingBox(): boolean {
const rect = element.getBoundingClientRect();
return !!(rect.top || rect.bottom || rect.width || rect.height);
}
}
}
} }

66
src/firefox/DOMWorld.ts
View file

@ -20,7 +20,7 @@ import * as util from 'util';
import * as types from '../types'; import * as types from '../types';
import {ElementHandle, JSHandle} from './JSHandle'; import {ElementHandle, JSHandle} from './JSHandle';
import { ExecutionContext } from './ExecutionContext'; import { ExecutionContext } from './ExecutionContext';
import { WaitTaskParams, WaitTask } from '../waitTask'; import { WaitTaskParams, WaitTask, waitForSelectorOrXPath } from '../waitTask';
const readFileAsync = util.promisify(fs.readFile); const readFileAsync = util.promisify(fs.readFile);
@ -238,12 +238,24 @@ export class DOMWorld {
} }
} }
waitForSelector(selector: string, options: { timeout?: number; visible?: boolean; hidden?: boolean; } | undefined): Promise<ElementHandle> { async waitForSelector(selector: string, options: { visible?: boolean; hidden?: boolean; timeout?: number; } | undefined): Promise<ElementHandle | null> {
return this._waitForSelectorOrXPath(selector, false, options); const params = waitForSelectorOrXPath(selector, false /* isXPath */, { timeout: this._timeoutSettings.timeout(), ...options });
const handle = await this._scheduleWaitTask(params);
if (!handle.asElement()) {
await handle.dispose();
return null;
}
return handle.asElement();
} }
waitForXPath(xpath: string, options: { timeout?: number; visible?: boolean; hidden?: boolean; } | undefined): Promise<ElementHandle> { async waitForXPath(xpath: string, options: { visible?: boolean, hidden?: boolean, timeout?: number } = {}): Promise<ElementHandle | null> {
return this._waitForSelectorOrXPath(xpath, true, options); const params = waitForSelectorOrXPath(xpath, true /* isXPath */, { timeout: this._timeoutSettings.timeout(), ...options });
const handle = await this._scheduleWaitTask(params);
if (!handle.asElement()) {
await handle.dispose();
return null;
}
return handle.asElement();
} }
waitForFunction(pageFunction: Function | string, options: { polling?: string | number; timeout?: number; } | undefined = {}, ...args): Promise<JSHandle> { waitForFunction(pageFunction: Function | string, options: { polling?: string | number; timeout?: number; } | undefined = {}, ...args): Promise<JSHandle> {
@ -265,50 +277,6 @@ export class DOMWorld {
return this.evaluate(() => document.title); return this.evaluate(() => document.title);
} }
async _waitForSelectorOrXPath(selectorOrXPath: string, isXPath: boolean, options: { timeout?: number; visible?: boolean; hidden?: boolean; } | undefined = {}): Promise<ElementHandle> {
const {
visible: waitForVisible = false,
hidden: waitForHidden = false,
timeout = this._timeoutSettings.timeout(),
} = options;
const polling = waitForVisible || waitForHidden ? 'raf' : 'mutation';
const title = `${isXPath ? 'XPath' : 'selector'} "${selectorOrXPath}"${waitForHidden ? ' to be hidden' : ''}`;
const params: WaitTaskParams = {
predicateBody: predicate,
title,
polling,
timeout,
args: [selectorOrXPath, isXPath, waitForVisible, waitForHidden]
};
const handle = await this._scheduleWaitTask(params);
if (!handle.asElement()) {
await handle.dispose();
return null;
}
return handle.asElement();
function predicate(selectorOrXPath: string, isXPath: boolean, waitForVisible: boolean, waitForHidden: boolean): (Node | boolean) | null {
const node = isXPath
? document.evaluate(selectorOrXPath, document, null, XPathResult.FIRST_ORDERED_NODE_TYPE, null).singleNodeValue
: document.querySelector(selectorOrXPath);
if (!node)
return waitForHidden;
if (!waitForVisible && !waitForHidden)
return node;
const element: Element = node.nodeType === Node.TEXT_NODE ? node.parentElement : node as Element;
const style = window.getComputedStyle(element);
const isVisible = style && style.visibility !== 'hidden' && hasVisibleBoundingBox();
const success = (waitForVisible === isVisible || waitForHidden === !isVisible);
return success ? node : null;
function hasVisibleBoundingBox(): boolean {
const rect = element.getBoundingClientRect();
return !!(rect.top || rect.bottom || rect.width || rect.height);
}
}
}
private _scheduleWaitTask(params: WaitTaskParams): Promise<JSHandle> { private _scheduleWaitTask(params: WaitTaskParams): Promise<JSHandle> {
const task = new WaitTask(params, () => this._waitTasks.delete(task)); const task = new WaitTask(params, () => this._waitTasks.delete(task));
this._waitTasks.add(task); this._waitTasks.add(task);

37
src/waitTask.ts
View file

@ -104,6 +104,43 @@ export class WaitTask<Handle extends types.Handle> {
} }
} }
export function waitForSelectorOrXPath(
selectorOrXPath: string,
isXPath: boolean,
options: { visible?: boolean, hidden?: boolean, timeout: number }): WaitTaskParams {
const { visible: waitForVisible = false, hidden: waitForHidden = false, timeout } = options;
const polling = waitForVisible || waitForHidden ? 'raf' : 'mutation';
const title = `${isXPath ? 'XPath' : 'selector'} "${selectorOrXPath}"${waitForHidden ? ' to be hidden' : ''}`;
const params: WaitTaskParams = {
predicateBody: predicate,
title,
polling,
timeout,
args: [selectorOrXPath, isXPath, waitForVisible, waitForHidden]
};
return params;
function predicate(selectorOrXPath: string, isXPath: boolean, waitForVisible: boolean, waitForHidden: boolean): (Node | boolean) | null {
const node = isXPath
? document.evaluate(selectorOrXPath, document, null, XPathResult.FIRST_ORDERED_NODE_TYPE, null).singleNodeValue
: document.querySelector(selectorOrXPath);
if (!node)
return waitForHidden;
if (!waitForVisible && !waitForHidden)
return node;
const element = (node.nodeType === Node.TEXT_NODE ? node.parentElement : node) as Element;
const style = window.getComputedStyle(element);
const isVisible = style && style.visibility !== 'hidden' && hasVisibleBoundingBox();
const success = (waitForVisible === isVisible || waitForHidden === !isVisible);
return success ? node : null;
function hasVisibleBoundingBox(): boolean {
const rect = element.getBoundingClientRect();
return !!(rect.top || rect.bottom || rect.width || rect.height);
}
}
}
async function waitForPredicatePageFunction(predicateBody: string, polling: string | number, timeout: number, ...args): Promise<any> { async function waitForPredicatePageFunction(predicateBody: string, polling: string | number, timeout: number, ...args): Promise<any> {
const predicate = new Function('...args', predicateBody); const predicate = new Function('...args', predicateBody);
let timedOut = false; let timedOut = false;

70
src/webkit/FrameManager.ts
View file

@ -29,7 +29,7 @@ import { NetworkManager, NetworkManagerEvents, Request, Response } from './Netwo
import { Page } from './Page'; import { Page } from './Page';
import { Protocol } from './protocol'; import { Protocol } from './protocol';
import { MultiClickOptions, ClickOptions, SelectOption } from '../input'; import { MultiClickOptions, ClickOptions, SelectOption } from '../input';
import { WaitTask, WaitTaskParams } from '../waitTask'; import { WaitTask, WaitTaskParams, waitForSelectorOrXPath } from '../waitTask';
const readFileAsync = helper.promisify(fs.readFile); const readFileAsync = helper.promisify(fs.readFile);
@ -291,12 +291,24 @@ export class Frame {
return watchDog.waitForNavigation(); return watchDog.waitForNavigation();
} }
waitForSelector(selector: string, options: { visible?: boolean; hidden?: boolean; timeout?: number; } | undefined): Promise<ElementHandle | null> { async waitForSelector(selector: string, options: { visible?: boolean; hidden?: boolean; timeout?: number; } | undefined): Promise<ElementHandle | null> {
return this._waitForSelectorOrXPath(selector, false, options); const params = waitForSelectorOrXPath(selector, false /* isXPath */, { timeout: this._frameManager._timeoutSettings.timeout(), ...options });
const handle = await this._scheduleWaitTask(params);
if (!handle.asElement()) {
await handle.dispose();
return null;
}
return handle.asElement();
} }
waitForXPath(xpath: string, options: { visible?: boolean; hidden?: boolean; timeout?: number; } | undefined): Promise<ElementHandle | null> { async waitForXPath(xpath: string, options: { visible?: boolean, hidden?: boolean, timeout?: number } = {}): Promise<ElementHandle | null> {
return this._waitForSelectorOrXPath(xpath, true, options); const params = waitForSelectorOrXPath(xpath, true /* isXPath */, { timeout: this._frameManager._timeoutSettings.timeout(), ...options });
const handle = await this._scheduleWaitTask(params);
if (!handle.asElement()) {
await handle.dispose();
return null;
}
return handle.asElement();
} }
waitForFunction(pageFunction: Function | string, options: { polling?: string | number; timeout?: number; } | undefined = {}, ...args): Promise<JSHandle> { waitForFunction(pageFunction: Function | string, options: { polling?: string | number; timeout?: number; } | undefined = {}, ...args): Promise<JSHandle> {
@ -609,54 +621,6 @@ export class Frame {
return this.evaluate(() => document.title); return this.evaluate(() => document.title);
} }
async _waitForSelectorOrXPath(selectorOrXPath: string, isXPath: boolean, options: { visible?: boolean; hidden?: boolean; timeout?: number; } | undefined = {}): Promise<ElementHandle | null> {
const {
visible: waitForVisible = false,
hidden: waitForHidden = false,
timeout = this._frameManager._timeoutSettings.timeout(),
} = options;
const polling = waitForVisible || waitForHidden ? 'raf' : 'mutation';
const title = `${isXPath ? 'XPath' : 'selector'} "${selectorOrXPath}"${waitForHidden ? ' to be hidden' : ''}`;
const params: WaitTaskParams = {
predicateBody: predicate,
title,
polling,
timeout,
args: [selectorOrXPath, isXPath, waitForVisible, waitForHidden]
};
const handle = await this._scheduleWaitTask(params);
if (!handle.asElement()) {
await handle.dispose();
return null;
}
return handle.asElement();
/**
*/
function predicate(selectorOrXPath: string, isXPath: boolean, waitForVisible: boolean, waitForHidden: boolean): (Node | boolean) | null {
const node = isXPath
? document.evaluate(selectorOrXPath, document, null, XPathResult.FIRST_ORDERED_NODE_TYPE, null).singleNodeValue
: document.querySelector(selectorOrXPath);
if (!node)
return waitForHidden;
if (!waitForVisible && !waitForHidden)
return node;
const element: Element = (node.nodeType === Node.TEXT_NODE ? node.parentElement : node) as Element;
const style = window.getComputedStyle(element);
const isVisible = style && style.visibility !== 'hidden' && hasVisibleBoundingBox();
const success = (waitForVisible === isVisible || waitForHidden === !isVisible);
return success ? node : null;
/**
*/
function hasVisibleBoundingBox(): boolean {
const rect = element.getBoundingClientRect();
return !!(rect.top || rect.bottom || rect.width || rect.height);
}
}
}
_navigated(framePayload: Protocol.Page.Frame) { _navigated(framePayload: Protocol.Page.Frame) {
this._name = framePayload.name; this._name = framePayload.name;
// TODO(lushnikov): remove this once requestInterception has loaderId exposed. // TODO(lushnikov): remove this once requestInterception has loaderId exposed.