feat(text selector): match button input by value (#1657)

Inputs of type button and submit are rendered with their value as text,
so we match them by text.

Fixes #1427.
This commit is contained in:
Dmitry Gozman 2020-04-03 14:18:08 -07:00 committed by GitHub
parent f8ecdffd47
commit 270206e2b4
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
3 changed files with 12 additions and 0 deletions

View File

@ -78,6 +78,8 @@ Text engine finds an element that contains a text node with passed text. Example
> **NOTE** Text engine searches for elements inside open shadow roots, but not inside closed shadow roots or iframes.
> **NOTE** Input elements of the type `button` and `submit` are rendered with their value as text, and text engine finds them. For example, `text=Login` matches `<input type=button value="Login">`.
> **NOTE** Malformed selector starting with `"` is automatically transformed to text selector. For example, Playwright converts `page.click('"Login"')` to `page.click('text="Login"')`.
### id, data-testid, data-test-id, data-test

View File

@ -68,6 +68,8 @@ function queryInternal(root: SelectorRoot, matcher: Matcher): Element | undefine
const node = walker.currentNode;
if (node.nodeType === Node.ELEMENT_NODE) {
const element = node as Element;
if ((element instanceof HTMLInputElement) && (element.type === 'submit' || element.type === 'button') && matcher(element.value))
return element;
if (element.shadowRoot)
shadowRoots.push(element.shadowRoot);
} else {
@ -92,6 +94,8 @@ function queryAllInternal(root: SelectorRoot, matcher: Matcher, result: Element[
const node = walker.currentNode;
if (node.nodeType === Node.ELEMENT_NODE) {
const element = node as Element;
if ((element instanceof HTMLInputElement) && (element.type === 'submit' || element.type === 'button') && matcher(element.value))
result.push(element);
if (element.shadowRoot)
shadowRoots.push(element.shadowRoot);
} else {

View File

@ -541,6 +541,12 @@ module.exports.describe = function({testRunner, expect, playwright, FFOX, CHROMI
expect(await page.$(`text="with"`)).toBe(null);
});
it('should match input[type=button|submit]', async({page}) => {
await page.setContent(`<input type="submit" value="hello"><input type="button" value="world">`);
expect(await page.$eval(`text=hello`, e => e.outerHTML)).toBe('<input type="submit" value="hello">');
expect(await page.$eval(`text=world`, e => e.outerHTML)).toBe('<input type="button" value="world">');
});
it('should work for open shadow roots', async({page, server}) => {
await page.goto(server.PREFIX + '/deep-shadow.html');
expect(await page.$eval(`text=root1`, e => e.outerHTML)).toBe('<span>Hello from root1</span>');