diff --git a/docs/src/api/params.md b/docs/src/api/params.md index 11180aee28..a62988ac7b 100644 --- a/docs/src/api/params.md +++ b/docs/src/api/params.md @@ -897,49 +897,9 @@ For example, `article` that has `text=Playwright` matches `
Playwri Note that outer and inner locators must belong to the same frame. Inner locator must not contain [FrameLocator]s. -## locator-option-left-of -- `leftOf` <[Locator]> - -Matches elements that are to the left of any element matching the inner locator, at any vertical position. Inner locator is queried against the same root as the outer one. More details in [layout selectors](../selectors.md#selecting-elements-based-on-layout) guide. - -Note that outer and inner locators must belong to the same frame. Inner locator must not contain [FrameLocator]s. - -## locator-option-right-of -- `rightOf` <[Locator]> - -Matches elements that are to the right of any element matching the inner locator, at any vertical position. Inner locator is queried against the same root as the outer one. More details in [layout selectors](../selectors.md#selecting-elements-based-on-layout) guide. - -Note that outer and inner locators must belong to the same frame. Inner locator must not contain [FrameLocator]s. - -## locator-option-above -- `above` <[Locator]> - -Matches elements that are above any of the elements matching the inner locator, at any horizontal position. Inner locator is queried against the same root as the outer one. More details in [layout selectors](../selectors.md#selecting-elements-based-on-layout) guide. - -Note that outer and inner locators must belong to the same frame. Inner locator must not contain [FrameLocator]s. - -## locator-option-below -- `below` <[Locator]> - -Matches elements that are below any of the elements matching the inner locator, at any horizontal position. Inner locator is queried against the same root as the outer one. More details in [layout selectors](../selectors.md#selecting-elements-based-on-layout) guide. - -Note that outer and inner locators must belong to the same frame. Inner locator must not contain [FrameLocator]s. - -## locator-option-near -- `near` <[Locator]> - -Matches elements that are near (<= 50 css pixels) any of the elements matching the inner locator. Inner locator is queried against the same root as the outer one. More details in [layout selectors](../selectors.md#selecting-elements-based-on-layout) guide. - -Note that outer and inner locators must belong to the same frame. Inner locator must not contain [FrameLocator]s. - ## locator-options-list - %%-locator-option-has-text-%% - %%-locator-option-has-%% -- %%-locator-option-left-of-%% -- %%-locator-option-right-of-%% -- %%-locator-option-above-%% -- %%-locator-option-below-%% -- %%-locator-option-near-%% ## screenshot-option-animations - `animations` <[ScreenshotAnimations]<"disabled"|"allow">> diff --git a/packages/playwright-core/src/client/locator.ts b/packages/playwright-core/src/client/locator.ts index 0337c98174..04ec6ca5f9 100644 --- a/packages/playwright-core/src/client/locator.ts +++ b/packages/playwright-core/src/client/locator.ts @@ -29,11 +29,6 @@ import { escapeWithQuotes } from '../utils/isomorphic/stringUtils'; export type LocatorOptions = { hasText?: string | RegExp; has?: Locator; - leftOf?: Locator; - rightOf?: Locator; - above?: Locator; - below?: Locator; - near?: Locator; }; export class Locator implements api.Locator { @@ -52,14 +47,11 @@ export class Locator implements api.Locator { this._selector += ` >> :scope:has-text(${escapeWithQuotes(text, '"')})`; } - for (const inner of ['has', 'leftOf', 'rightOf', 'above', 'below', 'near'] as const) { - const locator = options?.[inner]; - if (!locator) - continue; + if (options?.has) { + const locator = options.has; if (locator._frame !== frame) - throw new Error(`Inner "${inner}" locator must belong to the same frame.`); - const engineName = inner === 'leftOf' ? 'left-of' : (inner === 'rightOf' ? 'right-of' : inner); - this._selector += ` >> ${engineName}=` + JSON.stringify(locator._selector); + throw new Error(`Inner "has" locator must belong to the same frame.`); + this._selector += ` >> has=` + JSON.stringify(locator._selector); } } diff --git a/packages/playwright-core/src/server/injected/injectedScript.ts b/packages/playwright-core/src/server/injected/injectedScript.ts index 64442dfe29..6aa6ac1e52 100644 --- a/packages/playwright-core/src/server/injected/injectedScript.ts +++ b/packages/playwright-core/src/server/injected/injectedScript.ts @@ -104,11 +104,6 @@ export class InjectedScript { this._engines.set('visible', this._createVisibleEngine()); this._engines.set('control', this._createControlEngine()); this._engines.set('has', this._createHasEngine()); - this._engines.set('left-of', { queryAll: () => [] }); - this._engines.set('right-of', { queryAll: () => [] }); - this._engines.set('above', { queryAll: () => [] }); - this._engines.set('below', { queryAll: () => [] }); - this._engines.set('near', { queryAll: () => [] }); for (const { name, engine } of customEngines) this._engines.set(name, engine); diff --git a/packages/playwright-core/src/server/selectors.ts b/packages/playwright-core/src/server/selectors.ts index 611edc6490..8a63d90e10 100644 --- a/packages/playwright-core/src/server/selectors.ts +++ b/packages/playwright-core/src/server/selectors.ts @@ -46,7 +46,6 @@ export class Selectors { 'data-test-id', 'data-test-id:light', 'data-test', 'data-test:light', 'nth', 'visible', 'control', 'has', - 'left-of', 'right-of', 'above', 'below', 'near', 'role', ]); this._builtinEnginesInMainWorld = new Set([ diff --git a/packages/playwright-core/types/types.d.ts b/packages/playwright-core/types/types.d.ts index e5850f2fac..b0996602f6 100644 --- a/packages/playwright-core/types/types.d.ts +++ b/packages/playwright-core/types/types.d.ts @@ -2621,24 +2621,6 @@ export interface Page { * @param options */ locator(selector: string, options?: { - /** - * Matches elements that are above any of the elements matching the inner locator, at any horizontal position. Inner - * locator is queried against the same root as the outer one. More details in - * [layout selectors](https://playwright.dev/docs/selectors#selecting-elements-based-on-layout) guide. - * - * Note that outer and inner locators must belong to the same frame. Inner locator must not contain [FrameLocator]s. - */ - above?: Locator; - - /** - * Matches elements that are below any of the elements matching the inner locator, at any horizontal position. Inner - * locator is queried against the same root as the outer one. More details in - * [layout selectors](https://playwright.dev/docs/selectors#selecting-elements-based-on-layout) guide. - * - * Note that outer and inner locators must belong to the same frame. Inner locator must not contain [FrameLocator]s. - */ - below?: Locator; - /** * Matches elements containing an element that matches an inner locator. Inner locator is queried against the outer one. * For example, `article` that has `text=Playwright` matches `
Playwright
`. @@ -2653,33 +2635,6 @@ export interface Page { * `
Playwright
`. */ hasText?: string|RegExp; - - /** - * Matches elements that are to the left of any element matching the inner locator, at any vertical position. Inner locator - * is queried against the same root as the outer one. More details in - * [layout selectors](https://playwright.dev/docs/selectors#selecting-elements-based-on-layout) guide. - * - * Note that outer and inner locators must belong to the same frame. Inner locator must not contain [FrameLocator]s. - */ - leftOf?: Locator; - - /** - * Matches elements that are near (<= 50 css pixels) any of the elements matching the inner locator. Inner locator is - * queried against the same root as the outer one. More details in - * [layout selectors](https://playwright.dev/docs/selectors#selecting-elements-based-on-layout) guide. - * - * Note that outer and inner locators must belong to the same frame. Inner locator must not contain [FrameLocator]s. - */ - near?: Locator; - - /** - * Matches elements that are to the right of any element matching the inner locator, at any vertical position. Inner - * locator is queried against the same root as the outer one. More details in - * [layout selectors](https://playwright.dev/docs/selectors#selecting-elements-based-on-layout) guide. - * - * Note that outer and inner locators must belong to the same frame. Inner locator must not contain [FrameLocator]s. - */ - rightOf?: Locator; }): Locator; /** @@ -5492,24 +5447,6 @@ export interface Frame { * @param options */ locator(selector: string, options?: { - /** - * Matches elements that are above any of the elements matching the inner locator, at any horizontal position. Inner - * locator is queried against the same root as the outer one. More details in - * [layout selectors](https://playwright.dev/docs/selectors#selecting-elements-based-on-layout) guide. - * - * Note that outer and inner locators must belong to the same frame. Inner locator must not contain [FrameLocator]s. - */ - above?: Locator; - - /** - * Matches elements that are below any of the elements matching the inner locator, at any horizontal position. Inner - * locator is queried against the same root as the outer one. More details in - * [layout selectors](https://playwright.dev/docs/selectors#selecting-elements-based-on-layout) guide. - * - * Note that outer and inner locators must belong to the same frame. Inner locator must not contain [FrameLocator]s. - */ - below?: Locator; - /** * Matches elements containing an element that matches an inner locator. Inner locator is queried against the outer one. * For example, `article` that has `text=Playwright` matches `
Playwright
`. @@ -5524,33 +5461,6 @@ export interface Frame { * `
Playwright
`. */ hasText?: string|RegExp; - - /** - * Matches elements that are to the left of any element matching the inner locator, at any vertical position. Inner locator - * is queried against the same root as the outer one. More details in - * [layout selectors](https://playwright.dev/docs/selectors#selecting-elements-based-on-layout) guide. - * - * Note that outer and inner locators must belong to the same frame. Inner locator must not contain [FrameLocator]s. - */ - leftOf?: Locator; - - /** - * Matches elements that are near (<= 50 css pixels) any of the elements matching the inner locator. Inner locator is - * queried against the same root as the outer one. More details in - * [layout selectors](https://playwright.dev/docs/selectors#selecting-elements-based-on-layout) guide. - * - * Note that outer and inner locators must belong to the same frame. Inner locator must not contain [FrameLocator]s. - */ - near?: Locator; - - /** - * Matches elements that are to the right of any element matching the inner locator, at any vertical position. Inner - * locator is queried against the same root as the outer one. More details in - * [layout selectors](https://playwright.dev/docs/selectors#selecting-elements-based-on-layout) guide. - * - * Note that outer and inner locators must belong to the same frame. Inner locator must not contain [FrameLocator]s. - */ - rightOf?: Locator; }): Locator; /** @@ -9272,24 +9182,6 @@ export interface Locator { * @param options */ filter(options?: { - /** - * Matches elements that are above any of the elements matching the inner locator, at any horizontal position. Inner - * locator is queried against the same root as the outer one. More details in - * [layout selectors](https://playwright.dev/docs/selectors#selecting-elements-based-on-layout) guide. - * - * Note that outer and inner locators must belong to the same frame. Inner locator must not contain [FrameLocator]s. - */ - above?: Locator; - - /** - * Matches elements that are below any of the elements matching the inner locator, at any horizontal position. Inner - * locator is queried against the same root as the outer one. More details in - * [layout selectors](https://playwright.dev/docs/selectors#selecting-elements-based-on-layout) guide. - * - * Note that outer and inner locators must belong to the same frame. Inner locator must not contain [FrameLocator]s. - */ - below?: Locator; - /** * Matches elements containing an element that matches an inner locator. Inner locator is queried against the outer one. * For example, `article` that has `text=Playwright` matches `
Playwright
`. @@ -9304,33 +9196,6 @@ export interface Locator { * `
Playwright
`. */ hasText?: string|RegExp; - - /** - * Matches elements that are to the left of any element matching the inner locator, at any vertical position. Inner locator - * is queried against the same root as the outer one. More details in - * [layout selectors](https://playwright.dev/docs/selectors#selecting-elements-based-on-layout) guide. - * - * Note that outer and inner locators must belong to the same frame. Inner locator must not contain [FrameLocator]s. - */ - leftOf?: Locator; - - /** - * Matches elements that are near (<= 50 css pixels) any of the elements matching the inner locator. Inner locator is - * queried against the same root as the outer one. More details in - * [layout selectors](https://playwright.dev/docs/selectors#selecting-elements-based-on-layout) guide. - * - * Note that outer and inner locators must belong to the same frame. Inner locator must not contain [FrameLocator]s. - */ - near?: Locator; - - /** - * Matches elements that are to the right of any element matching the inner locator, at any vertical position. Inner - * locator is queried against the same root as the outer one. More details in - * [layout selectors](https://playwright.dev/docs/selectors#selecting-elements-based-on-layout) guide. - * - * Note that outer and inner locators must belong to the same frame. Inner locator must not contain [FrameLocator]s. - */ - rightOf?: Locator; }): Locator; /** @@ -9578,24 +9443,6 @@ export interface Locator { * @param options */ locator(selector: string, options?: { - /** - * Matches elements that are above any of the elements matching the inner locator, at any horizontal position. Inner - * locator is queried against the same root as the outer one. More details in - * [layout selectors](https://playwright.dev/docs/selectors#selecting-elements-based-on-layout) guide. - * - * Note that outer and inner locators must belong to the same frame. Inner locator must not contain [FrameLocator]s. - */ - above?: Locator; - - /** - * Matches elements that are below any of the elements matching the inner locator, at any horizontal position. Inner - * locator is queried against the same root as the outer one. More details in - * [layout selectors](https://playwright.dev/docs/selectors#selecting-elements-based-on-layout) guide. - * - * Note that outer and inner locators must belong to the same frame. Inner locator must not contain [FrameLocator]s. - */ - below?: Locator; - /** * Matches elements containing an element that matches an inner locator. Inner locator is queried against the outer one. * For example, `article` that has `text=Playwright` matches `
Playwright
`. @@ -9610,33 +9457,6 @@ export interface Locator { * `
Playwright
`. */ hasText?: string|RegExp; - - /** - * Matches elements that are to the left of any element matching the inner locator, at any vertical position. Inner locator - * is queried against the same root as the outer one. More details in - * [layout selectors](https://playwright.dev/docs/selectors#selecting-elements-based-on-layout) guide. - * - * Note that outer and inner locators must belong to the same frame. Inner locator must not contain [FrameLocator]s. - */ - leftOf?: Locator; - - /** - * Matches elements that are near (<= 50 css pixels) any of the elements matching the inner locator. Inner locator is - * queried against the same root as the outer one. More details in - * [layout selectors](https://playwright.dev/docs/selectors#selecting-elements-based-on-layout) guide. - * - * Note that outer and inner locators must belong to the same frame. Inner locator must not contain [FrameLocator]s. - */ - near?: Locator; - - /** - * Matches elements that are to the right of any element matching the inner locator, at any vertical position. Inner - * locator is queried against the same root as the outer one. More details in - * [layout selectors](https://playwright.dev/docs/selectors#selecting-elements-based-on-layout) guide. - * - * Note that outer and inner locators must belong to the same frame. Inner locator must not contain [FrameLocator]s. - */ - rightOf?: Locator; }): Locator; /** @@ -14108,24 +13928,6 @@ export interface FrameLocator { * @param options */ locator(selector: string, options?: { - /** - * Matches elements that are above any of the elements matching the inner locator, at any horizontal position. Inner - * locator is queried against the same root as the outer one. More details in - * [layout selectors](https://playwright.dev/docs/selectors#selecting-elements-based-on-layout) guide. - * - * Note that outer and inner locators must belong to the same frame. Inner locator must not contain [FrameLocator]s. - */ - above?: Locator; - - /** - * Matches elements that are below any of the elements matching the inner locator, at any horizontal position. Inner - * locator is queried against the same root as the outer one. More details in - * [layout selectors](https://playwright.dev/docs/selectors#selecting-elements-based-on-layout) guide. - * - * Note that outer and inner locators must belong to the same frame. Inner locator must not contain [FrameLocator]s. - */ - below?: Locator; - /** * Matches elements containing an element that matches an inner locator. Inner locator is queried against the outer one. * For example, `article` that has `text=Playwright` matches `
Playwright
`. @@ -14140,33 +13942,6 @@ export interface FrameLocator { * `
Playwright
`. */ hasText?: string|RegExp; - - /** - * Matches elements that are to the left of any element matching the inner locator, at any vertical position. Inner locator - * is queried against the same root as the outer one. More details in - * [layout selectors](https://playwright.dev/docs/selectors#selecting-elements-based-on-layout) guide. - * - * Note that outer and inner locators must belong to the same frame. Inner locator must not contain [FrameLocator]s. - */ - leftOf?: Locator; - - /** - * Matches elements that are near (<= 50 css pixels) any of the elements matching the inner locator. Inner locator is - * queried against the same root as the outer one. More details in - * [layout selectors](https://playwright.dev/docs/selectors#selecting-elements-based-on-layout) guide. - * - * Note that outer and inner locators must belong to the same frame. Inner locator must not contain [FrameLocator]s. - */ - near?: Locator; - - /** - * Matches elements that are to the right of any element matching the inner locator, at any vertical position. Inner - * locator is queried against the same root as the outer one. More details in - * [layout selectors](https://playwright.dev/docs/selectors#selecting-elements-based-on-layout) guide. - * - * Note that outer and inner locators must belong to the same frame. Inner locator must not contain [FrameLocator]s. - */ - rightOf?: Locator; }): Locator; /** diff --git a/tests/config/experimental.d.ts b/tests/config/experimental.d.ts index e7eef54717..3d60ed8af9 100644 --- a/tests/config/experimental.d.ts +++ b/tests/config/experimental.d.ts @@ -2623,24 +2623,6 @@ export interface Page { * @param options */ locator(selector: string, options?: { - /** - * Matches elements that are above any of the elements matching the inner locator, at any horizontal position. Inner - * locator is queried against the same root as the outer one. More details in - * [layout selectors](https://playwright.dev/docs/selectors#selecting-elements-based-on-layout) guide. - * - * Note that outer and inner locators must belong to the same frame. Inner locator must not contain [FrameLocator]s. - */ - above?: Locator; - - /** - * Matches elements that are below any of the elements matching the inner locator, at any horizontal position. Inner - * locator is queried against the same root as the outer one. More details in - * [layout selectors](https://playwright.dev/docs/selectors#selecting-elements-based-on-layout) guide. - * - * Note that outer and inner locators must belong to the same frame. Inner locator must not contain [FrameLocator]s. - */ - below?: Locator; - /** * Matches elements containing an element that matches an inner locator. Inner locator is queried against the outer one. * For example, `article` that has `text=Playwright` matches `
Playwright
`. @@ -2655,33 +2637,6 @@ export interface Page { * `
Playwright
`. */ hasText?: string|RegExp; - - /** - * Matches elements that are to the left of any element matching the inner locator, at any vertical position. Inner locator - * is queried against the same root as the outer one. More details in - * [layout selectors](https://playwright.dev/docs/selectors#selecting-elements-based-on-layout) guide. - * - * Note that outer and inner locators must belong to the same frame. Inner locator must not contain [FrameLocator]s. - */ - leftOf?: Locator; - - /** - * Matches elements that are near (<= 50 css pixels) any of the elements matching the inner locator. Inner locator is - * queried against the same root as the outer one. More details in - * [layout selectors](https://playwright.dev/docs/selectors#selecting-elements-based-on-layout) guide. - * - * Note that outer and inner locators must belong to the same frame. Inner locator must not contain [FrameLocator]s. - */ - near?: Locator; - - /** - * Matches elements that are to the right of any element matching the inner locator, at any vertical position. Inner - * locator is queried against the same root as the outer one. More details in - * [layout selectors](https://playwright.dev/docs/selectors#selecting-elements-based-on-layout) guide. - * - * Note that outer and inner locators must belong to the same frame. Inner locator must not contain [FrameLocator]s. - */ - rightOf?: Locator; }): Locator; /** @@ -5494,24 +5449,6 @@ export interface Frame { * @param options */ locator(selector: string, options?: { - /** - * Matches elements that are above any of the elements matching the inner locator, at any horizontal position. Inner - * locator is queried against the same root as the outer one. More details in - * [layout selectors](https://playwright.dev/docs/selectors#selecting-elements-based-on-layout) guide. - * - * Note that outer and inner locators must belong to the same frame. Inner locator must not contain [FrameLocator]s. - */ - above?: Locator; - - /** - * Matches elements that are below any of the elements matching the inner locator, at any horizontal position. Inner - * locator is queried against the same root as the outer one. More details in - * [layout selectors](https://playwright.dev/docs/selectors#selecting-elements-based-on-layout) guide. - * - * Note that outer and inner locators must belong to the same frame. Inner locator must not contain [FrameLocator]s. - */ - below?: Locator; - /** * Matches elements containing an element that matches an inner locator. Inner locator is queried against the outer one. * For example, `article` that has `text=Playwright` matches `
Playwright
`. @@ -5526,33 +5463,6 @@ export interface Frame { * `
Playwright
`. */ hasText?: string|RegExp; - - /** - * Matches elements that are to the left of any element matching the inner locator, at any vertical position. Inner locator - * is queried against the same root as the outer one. More details in - * [layout selectors](https://playwright.dev/docs/selectors#selecting-elements-based-on-layout) guide. - * - * Note that outer and inner locators must belong to the same frame. Inner locator must not contain [FrameLocator]s. - */ - leftOf?: Locator; - - /** - * Matches elements that are near (<= 50 css pixels) any of the elements matching the inner locator. Inner locator is - * queried against the same root as the outer one. More details in - * [layout selectors](https://playwright.dev/docs/selectors#selecting-elements-based-on-layout) guide. - * - * Note that outer and inner locators must belong to the same frame. Inner locator must not contain [FrameLocator]s. - */ - near?: Locator; - - /** - * Matches elements that are to the right of any element matching the inner locator, at any vertical position. Inner - * locator is queried against the same root as the outer one. More details in - * [layout selectors](https://playwright.dev/docs/selectors#selecting-elements-based-on-layout) guide. - * - * Note that outer and inner locators must belong to the same frame. Inner locator must not contain [FrameLocator]s. - */ - rightOf?: Locator; }): Locator; /** @@ -9274,24 +9184,6 @@ export interface Locator { * @param options */ filter(options?: { - /** - * Matches elements that are above any of the elements matching the inner locator, at any horizontal position. Inner - * locator is queried against the same root as the outer one. More details in - * [layout selectors](https://playwright.dev/docs/selectors#selecting-elements-based-on-layout) guide. - * - * Note that outer and inner locators must belong to the same frame. Inner locator must not contain [FrameLocator]s. - */ - above?: Locator; - - /** - * Matches elements that are below any of the elements matching the inner locator, at any horizontal position. Inner - * locator is queried against the same root as the outer one. More details in - * [layout selectors](https://playwright.dev/docs/selectors#selecting-elements-based-on-layout) guide. - * - * Note that outer and inner locators must belong to the same frame. Inner locator must not contain [FrameLocator]s. - */ - below?: Locator; - /** * Matches elements containing an element that matches an inner locator. Inner locator is queried against the outer one. * For example, `article` that has `text=Playwright` matches `
Playwright
`. @@ -9306,33 +9198,6 @@ export interface Locator { * `
Playwright
`. */ hasText?: string|RegExp; - - /** - * Matches elements that are to the left of any element matching the inner locator, at any vertical position. Inner locator - * is queried against the same root as the outer one. More details in - * [layout selectors](https://playwright.dev/docs/selectors#selecting-elements-based-on-layout) guide. - * - * Note that outer and inner locators must belong to the same frame. Inner locator must not contain [FrameLocator]s. - */ - leftOf?: Locator; - - /** - * Matches elements that are near (<= 50 css pixels) any of the elements matching the inner locator. Inner locator is - * queried against the same root as the outer one. More details in - * [layout selectors](https://playwright.dev/docs/selectors#selecting-elements-based-on-layout) guide. - * - * Note that outer and inner locators must belong to the same frame. Inner locator must not contain [FrameLocator]s. - */ - near?: Locator; - - /** - * Matches elements that are to the right of any element matching the inner locator, at any vertical position. Inner - * locator is queried against the same root as the outer one. More details in - * [layout selectors](https://playwright.dev/docs/selectors#selecting-elements-based-on-layout) guide. - * - * Note that outer and inner locators must belong to the same frame. Inner locator must not contain [FrameLocator]s. - */ - rightOf?: Locator; }): Locator; /** @@ -9580,24 +9445,6 @@ export interface Locator { * @param options */ locator(selector: string, options?: { - /** - * Matches elements that are above any of the elements matching the inner locator, at any horizontal position. Inner - * locator is queried against the same root as the outer one. More details in - * [layout selectors](https://playwright.dev/docs/selectors#selecting-elements-based-on-layout) guide. - * - * Note that outer and inner locators must belong to the same frame. Inner locator must not contain [FrameLocator]s. - */ - above?: Locator; - - /** - * Matches elements that are below any of the elements matching the inner locator, at any horizontal position. Inner - * locator is queried against the same root as the outer one. More details in - * [layout selectors](https://playwright.dev/docs/selectors#selecting-elements-based-on-layout) guide. - * - * Note that outer and inner locators must belong to the same frame. Inner locator must not contain [FrameLocator]s. - */ - below?: Locator; - /** * Matches elements containing an element that matches an inner locator. Inner locator is queried against the outer one. * For example, `article` that has `text=Playwright` matches `
Playwright
`. @@ -9612,33 +9459,6 @@ export interface Locator { * `
Playwright
`. */ hasText?: string|RegExp; - - /** - * Matches elements that are to the left of any element matching the inner locator, at any vertical position. Inner locator - * is queried against the same root as the outer one. More details in - * [layout selectors](https://playwright.dev/docs/selectors#selecting-elements-based-on-layout) guide. - * - * Note that outer and inner locators must belong to the same frame. Inner locator must not contain [FrameLocator]s. - */ - leftOf?: Locator; - - /** - * Matches elements that are near (<= 50 css pixels) any of the elements matching the inner locator. Inner locator is - * queried against the same root as the outer one. More details in - * [layout selectors](https://playwright.dev/docs/selectors#selecting-elements-based-on-layout) guide. - * - * Note that outer and inner locators must belong to the same frame. Inner locator must not contain [FrameLocator]s. - */ - near?: Locator; - - /** - * Matches elements that are to the right of any element matching the inner locator, at any vertical position. Inner - * locator is queried against the same root as the outer one. More details in - * [layout selectors](https://playwright.dev/docs/selectors#selecting-elements-based-on-layout) guide. - * - * Note that outer and inner locators must belong to the same frame. Inner locator must not contain [FrameLocator]s. - */ - rightOf?: Locator; }): Locator; /** @@ -14110,24 +13930,6 @@ export interface FrameLocator { * @param options */ locator(selector: string, options?: { - /** - * Matches elements that are above any of the elements matching the inner locator, at any horizontal position. Inner - * locator is queried against the same root as the outer one. More details in - * [layout selectors](https://playwright.dev/docs/selectors#selecting-elements-based-on-layout) guide. - * - * Note that outer and inner locators must belong to the same frame. Inner locator must not contain [FrameLocator]s. - */ - above?: Locator; - - /** - * Matches elements that are below any of the elements matching the inner locator, at any horizontal position. Inner - * locator is queried against the same root as the outer one. More details in - * [layout selectors](https://playwright.dev/docs/selectors#selecting-elements-based-on-layout) guide. - * - * Note that outer and inner locators must belong to the same frame. Inner locator must not contain [FrameLocator]s. - */ - below?: Locator; - /** * Matches elements containing an element that matches an inner locator. Inner locator is queried against the outer one. * For example, `article` that has `text=Playwright` matches `
Playwright
`. @@ -14142,33 +13944,6 @@ export interface FrameLocator { * `
Playwright
`. */ hasText?: string|RegExp; - - /** - * Matches elements that are to the left of any element matching the inner locator, at any vertical position. Inner locator - * is queried against the same root as the outer one. More details in - * [layout selectors](https://playwright.dev/docs/selectors#selecting-elements-based-on-layout) guide. - * - * Note that outer and inner locators must belong to the same frame. Inner locator must not contain [FrameLocator]s. - */ - leftOf?: Locator; - - /** - * Matches elements that are near (<= 50 css pixels) any of the elements matching the inner locator. Inner locator is - * queried against the same root as the outer one. More details in - * [layout selectors](https://playwright.dev/docs/selectors#selecting-elements-based-on-layout) guide. - * - * Note that outer and inner locators must belong to the same frame. Inner locator must not contain [FrameLocator]s. - */ - near?: Locator; - - /** - * Matches elements that are to the right of any element matching the inner locator, at any vertical position. Inner - * locator is queried against the same root as the outer one. More details in - * [layout selectors](https://playwright.dev/docs/selectors#selecting-elements-based-on-layout) guide. - * - * Note that outer and inner locators must belong to the same frame. Inner locator must not contain [FrameLocator]s. - */ - rightOf?: Locator; }): Locator; /** diff --git a/tests/page/locator-query.spec.ts b/tests/page/locator-query.spec.ts index 9abc953e5b..720b2e6dd9 100644 --- a/tests/page/locator-query.spec.ts +++ b/tests/page/locator-query.spec.ts @@ -144,7 +144,7 @@ it('should support locator.filter', async ({ page, trace }) => { it('should enforce same frame for has/leftOf/rightOf/above/below/near', async ({ page, server }) => { await page.goto(server.PREFIX + '/frames/two-frames.html'); const child = page.frames()[1]; - for (const option of ['has', 'leftOf', 'rightOf', 'above', 'below', 'near']) { + for (const option of ['has']) { let error; try { page.locator('div', { [option]: child.locator('span') }); diff --git a/tests/page/selectors-misc.spec.ts b/tests/page/selectors-misc.spec.ts index 528e5f1b79..b5360c038c 100644 --- a/tests/page/selectors-misc.spec.ts +++ b/tests/page/selectors-misc.spec.ts @@ -223,117 +223,56 @@ it('should work with layout selectors', async ({ page, trace }) => { }, boxes); expect(await page.$eval('div:right-of(#id6)', e => e.id)).toBe('id7'); - expect(await page.$eval('div >> right-of="#id6"', e => e.id)).toBe('id7'); - expect(await page.locator('div', { rightOf: page.locator('#id6') }).first().evaluate(e => e.id)).toBe('id7'); expect(await page.$eval('div:right-of(#id1)', e => e.id)).toBe('id2'); - expect(await page.$eval('div >> right-of="#id1"', e => e.id)).toBe('id2'); expect(await page.$eval('div:right-of(#id3)', e => e.id)).toBe('id4'); - expect(await page.$eval('div >> right-of="#id3"', e => e.id)).toBe('id4'); expect(await page.$('div:right-of(#id4)')).toBe(null); - expect(await page.$('div >> right-of="#id4"')).toBe(null); expect(await page.$eval('div:right-of(#id0)', e => e.id)).toBe('id7'); - expect(await page.$eval('div >> right-of="#id0"', e => e.id)).toBe('id7'); expect(await page.$eval('div:right-of(#id8)', e => e.id)).toBe('id9'); - expect(await page.$eval('div >> right-of="#id8"', e => e.id)).toBe('id9'); expect(await page.$$eval('div:right-of(#id3)', els => els.map(e => e.id).join(','))).toBe('id4,id2,id5,id7,id8,id9'); - expect(await page.$$eval('div >> right-of="#id3"', els => els.map(e => e.id).join(','))).toBe('id4,id2,id5,id7,id8,id9'); - expect(await page.locator('div', { rightOf: page.locator('#id3') }).locator('span').evaluateAll(els => els.map(e => e.textContent).join(','))).toBe('4,2,5,7,8,9'); expect(await page.$$eval('div:right-of(#id3, 50)', els => els.map(e => e.id).join(','))).toBe('id2,id5,id7,id8'); - expect(await page.$$eval('div >> right-of="#id3",50', els => els.map(e => e.id).join(','))).toBe('id2,id5,id7,id8'); - expect(await page.$$eval('div >> right-of="#id3",50 >> span', els => els.map(e => e.textContent).join(','))).toBe('2,5,7,8'); expect(await page.$$eval('div:right-of(#id3, 49)', els => els.map(e => e.id).join(','))).toBe('id7,id8'); - expect(await page.$$eval('div >> right-of="#id3",49', els => els.map(e => e.id).join(','))).toBe('id7,id8'); - expect(await page.$$eval('div >> right-of="#id3",49 >> span', els => els.map(e => e.textContent).join(','))).toBe('7,8'); expect(await page.$eval('div:left-of(#id2)', e => e.id)).toBe('id1'); - expect(await page.$eval('div >> left-of="#id2"', e => e.id)).toBe('id1'); - expect(await page.locator('div', { leftOf: page.locator('#id2') }).first().evaluate(e => e.id)).toBe('id1'); expect(await page.$('div:left-of(#id0)')).toBe(null); - expect(await page.$('div >> left-of="#id0"')).toBe(null); expect(await page.$eval('div:left-of(#id5)', e => e.id)).toBe('id0'); - expect(await page.$eval('div >> left-of="#id5"', e => e.id)).toBe('id0'); expect(await page.$eval('div:left-of(#id9)', e => e.id)).toBe('id8'); - expect(await page.$eval('div >> left-of="#id9"', e => e.id)).toBe('id8'); expect(await page.$eval('div:left-of(#id4)', e => e.id)).toBe('id3'); - expect(await page.$eval('div >> left-of="#id4"', e => e.id)).toBe('id3'); expect(await page.$$eval('div:left-of(#id5)', els => els.map(e => e.id).join(','))).toBe('id0,id7,id3,id1,id6,id8'); - expect(await page.$$eval('div >> left-of="#id5"', els => els.map(e => e.id).join(','))).toBe('id0,id7,id3,id1,id6,id8'); expect(await page.$$eval('div:left-of(#id5, 3)', els => els.map(e => e.id).join(','))).toBe('id7,id8'); - expect(await page.$$eval('div >> left-of="#id5",3', els => els.map(e => e.id).join(','))).toBe('id7,id8'); - expect(await page.$$eval('div >> left-of="#id5",3 >> span', els => els.map(e => e.textContent).join(','))).toBe('7,8'); expect(await page.$eval('div:above(#id0)', e => e.id)).toBe('id3'); - expect(await page.$eval('div >> above="#id0"', e => e.id)).toBe('id3'); - expect(await page.locator('div', { above: page.locator('#id0') }).first().evaluate(e => e.id)).toBe('id3'); expect(await page.$eval('div:above(#id5)', e => e.id)).toBe('id4'); - expect(await page.$eval('div >> above="#id5"', e => e.id)).toBe('id4'); expect(await page.$eval('div:above(#id7)', e => e.id)).toBe('id5'); - expect(await page.$eval('div >> above="#id7"', e => e.id)).toBe('id5'); expect(await page.$eval('div:above(#id8)', e => e.id)).toBe('id0'); - expect(await page.$eval('div >> above="#id8"', e => e.id)).toBe('id0'); expect(await page.$eval('div:above(#id9)', e => e.id)).toBe('id8'); - expect(await page.$eval('div >> above="#id9"', e => e.id)).toBe('id8'); expect(await page.$('div:above(#id2)')).toBe(null); - expect(await page.$('div >> above="#id2"')).toBe(null); expect(await page.$$eval('div:above(#id5)', els => els.map(e => e.id).join(','))).toBe('id4,id2,id3,id1'); - expect(await page.$$eval('div >> above="#id5"', els => els.map(e => e.id).join(','))).toBe('id4,id2,id3,id1'); expect(await page.$$eval('div:above(#id5, 20)', els => els.map(e => e.id).join(','))).toBe('id4,id3'); - expect(await page.$$eval('div >> above="#id5",20', els => els.map(e => e.id).join(','))).toBe('id4,id3'); expect(await page.$eval('div:below(#id4)', e => e.id)).toBe('id5'); - expect(await page.$eval('div >> below="#id4"', e => e.id)).toBe('id5'); - expect(await page.locator('div', { below: page.locator('#id4') }).first().evaluate(e => e.id)).toBe('id5'); expect(await page.$eval('div:below(#id3)', e => e.id)).toBe('id0'); - expect(await page.$eval('div >> below="#id3"', e => e.id)).toBe('id0'); expect(await page.$eval('div:below(#id2)', e => e.id)).toBe('id4'); - expect(await page.$eval('div >> below="#id2"', e => e.id)).toBe('id4'); expect(await page.$eval('div:below(#id6)', e => e.id)).toBe('id8'); - expect(await page.$eval('div >> below="#id6"', e => e.id)).toBe('id8'); expect(await page.$eval('div:below(#id7)', e => e.id)).toBe('id8'); - expect(await page.$eval('div >> below="#id7"', e => e.id)).toBe('id8'); expect(await page.$eval('div:below(#id8)', e => e.id)).toBe('id9'); - expect(await page.$eval('div >> below="#id8"', e => e.id)).toBe('id9'); expect(await page.$('div:below(#id9)')).toBe(null); - expect(await page.$('div >> below="#id9"')).toBe(null); expect(await page.$$eval('div:below(#id3)', els => els.map(e => e.id).join(','))).toBe('id0,id5,id6,id7,id8,id9'); - expect(await page.$$eval('div >> below="#id3"', els => els.map(e => e.id).join(','))).toBe('id0,id5,id6,id7,id8,id9'); expect(await page.$$eval('div:below(#id3, 105)', els => els.map(e => e.id).join(','))).toBe('id0,id5,id6,id7'); - expect(await page.$$eval('div >> below="#id3" , 105', els => els.map(e => e.id).join(','))).toBe('id0,id5,id6,id7'); expect(await page.$eval('div:near(#id0)', e => e.id)).toBe('id3'); - expect(await page.$eval('div >> near="#id0"', e => e.id)).toBe('id3'); - expect(await page.locator('div', { near: page.locator('#id0') }).first().evaluate(e => e.id)).toBe('id3'); expect(await page.$$eval('div:near(#id7)', els => els.map(e => e.id).join(','))).toBe('id0,id5,id3,id6'); - expect(await page.$$eval('div >> near="#id7"', els => els.map(e => e.id).join(','))).toBe('id0,id5,id3,id6'); expect(await page.$$eval('div:near(#id0)', els => els.map(e => e.id).join(','))).toBe('id3,id6,id7,id8,id1,id5'); - expect(await page.$$eval('div >> near="#id0"', els => els.map(e => e.id).join(','))).toBe('id3,id6,id7,id8,id1,id5'); expect(await page.$$eval('div:near(#id6)', els => els.map(e => e.id).join(','))).toBe('id0,id3,id7'); - expect(await page.$$eval('div >> near="#id6"', els => els.map(e => e.id).join(','))).toBe('id0,id3,id7'); expect(await page.$$eval('div:near(#id6, 10)', els => els.map(e => e.id).join(','))).toBe('id0'); - expect(await page.$$eval('div >> near="#id6",10', els => els.map(e => e.id).join(','))).toBe('id0'); expect(await page.$$eval('div:near(#id0, 100)', els => els.map(e => e.id).join(','))).toBe('id3,id6,id7,id8,id1,id5,id4,id2'); - expect(await page.$$eval('div >> near="#id0",100', els => els.map(e => e.id).join(','))).toBe('id3,id6,id7,id8,id1,id5,id4,id2'); expect(await page.$$eval('div:below(#id5):above(#id8)', els => els.map(e => e.id).join(','))).toBe('id7,id6'); - expect(await page.$$eval('div >> below="#id5" >> above="#id8"', els => els.map(e => e.id).join(','))).toBe('id7,id6'); expect(await page.$eval('div:below(#id5):above(#id8)', e => e.id)).toBe('id7'); - expect(await page.$eval('div >> below="#id5" >> above="#id8"', e => e.id)).toBe('id7'); - expect(await page.locator('div', { below: page.locator('#id5'), above: page.locator('#id8') }).first().evaluate(e => e.id)).toBe('id7'); expect(await page.$$eval('div:right-of(#id0) + div:above(#id8)', els => els.map(e => e.id).join(','))).toBe('id5,id6,id3'); const error = await page.$(':near(50)').catch(e => e); expect(error.message).toContain('"near" engine expects a selector list and optional maximum distance in pixels'); - const error1 = await page.$(`div >> left-of=abc`).catch(e => e); - expect(error1.message).toContain('Malformed selector: left-of=abc'); - const error2 = await page.$(`left-of="div"`).catch(e => e); - expect(error2.message).toContain('"left-of" selector cannot be first'); - const error3 = await page.$(`div >> left-of=33`).catch(e => e); - expect(error3.message).toContain('Malformed selector: left-of=33'); - const error4 = await page.$(`div >> left-of="span","foo"`).catch(e => e); - expect(error4.message).toContain('Malformed selector: left-of="span","foo"'); - const error5 = await page.$(`div >> left-of="span",3,4`).catch(e => e); - expect(error5.message).toContain('Malformed selector: left-of="span",3,4'); }); it('should escape the scope with >>', async ({ page }) => {