/**
* Copyright 2018 Google Inc. All rights reserved.
* Modifications copyright (c) Microsoft Corporation.
*
* Licensed under the Apache License, Version 2.0 (the "License");
* you may not use this file except in compliance with the License.
* You may obtain a copy of the License at
*
* http://www.apache.org/licenses/LICENSE-2.0
*
* Unless required by applicable law or agreed to in writing, software
* distributed under the License is distributed on an "AS IS" BASIS,
* WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
* See the License for the specific language governing permissions and
* limitations under the License.
*/
import { it, expect } from './fixtures';
import * as path from 'path';
const { selectorsV2Enabled } = require(path.join(__dirname, '..', 'lib', 'server', 'common', 'selectorParser'));
it('should work', async ({page}) => {
await page.setContent(`
yo
ya
\nye
`);
expect(await page.$eval(`text=ya`, e => e.outerHTML)).toBe('
ya
');
expect(await page.$eval(`text="ya"`, e => e.outerHTML)).toBe('
ya
');
expect(await page.$eval(`text=/^[ay]+$/`, e => e.outerHTML)).toBe('
ya
');
expect(await page.$eval(`text=/Ya/i`, e => e.outerHTML)).toBe('
ya
');
expect(await page.$eval(`text=ye`, e => e.outerHTML)).toBe('
\nye
');
await page.setContent(`
ye
ye
`);
expect(await page.$eval(`text="ye"`, e => e.outerHTML)).toBe('
ye
');
await page.setContent(`
yo
"ya
hello world!
`);
expect(await page.$eval(`text="\\"ya"`, e => e.outerHTML)).toBe('
"ya
');
expect(await page.$eval(`text=/hello/`, e => e.outerHTML)).toBe('
hello world!
');
expect(await page.$eval(`text=/^\\s*heLLo/i`, e => e.outerHTML)).toBe('
hello world!
');
await page.setContent(`
yo
ya
hey
hey
`);
expect(await page.$eval(`text=hey`, e => e.outerHTML)).toBe('
yo
ya
hey
hey
');
expect(await page.$eval(`text="yo">>text="ya"`, e => e.outerHTML)).toBe('
ya
');
expect(await page.$eval(`text='yo'>> text="ya"`, e => e.outerHTML)).toBe('
ya
');
expect(await page.$eval(`text="yo" >>text='ya'`, e => e.outerHTML)).toBe('
ya
');
expect(await page.$eval(`text='yo' >> text='ya'`, e => e.outerHTML)).toBe('
ya
');
expect(await page.$eval(`'yo'>>"ya"`, e => e.outerHTML)).toBe('
ya
');
expect(await page.$eval(`"yo" >> 'ya'`, e => e.outerHTML)).toBe('
ya
');
await page.setContent(`
yo
yo
`);
expect(await page.$$eval(`text=yo`, es => es.map(e => e.outerHTML).join('\n'))).toBe('
yo
\n
yo
');
await page.setContent(`
'
"
\\
x
`);
expect(await page.$eval(`text='\\''`, e => e.outerHTML)).toBe('
\'
');
expect(await page.$eval(`text='"'`, e => e.outerHTML)).toBe('
"
');
expect(await page.$eval(`text="\\""`, e => e.outerHTML)).toBe('
"
');
expect(await page.$eval(`text="'"`, e => e.outerHTML)).toBe('
\'
');
expect(await page.$eval(`text="\\x"`, e => e.outerHTML)).toBe('
x
');
expect(await page.$eval(`text='\\x'`, e => e.outerHTML)).toBe('
x
');
expect(await page.$eval(`text='\\\\'`, e => e.outerHTML)).toBe('
\\
');
expect(await page.$eval(`text="\\\\"`, e => e.outerHTML)).toBe('
\\
');
expect(await page.$eval(`text="`, e => e.outerHTML)).toBe('
"
');
expect(await page.$eval(`text='`, e => e.outerHTML)).toBe('
\'
');
expect(await page.$eval(`"x"`, e => e.outerHTML)).toBe('
x
');
expect(await page.$eval(`'x'`, e => e.outerHTML)).toBe('
`);
expect(await page.$eval(`text="`, e => e.outerHTML)).toBe('
"
');
expect(await page.$eval(`text='`, e => e.outerHTML)).toBe('
\'
');
await page.setContent(`
Hi''>>foo=bar
`);
expect(await page.$eval(`text="Hi''>>foo=bar"`, e => e.outerHTML)).toBe(`
Hi''>>foo=bar
`);
await page.setContent(`
Hi'">>foo=bar
`);
expect(await page.$eval(`text="Hi'\\">>foo=bar"`, e => e.outerHTML)).toBe(`
Hi'">>foo=bar
`);
await page.setContent(`
Hi>>
`);
expect(await page.$eval(`text="Hi>>">>span`, e => e.outerHTML)).toBe(``);
await page.setContent(`
a b
a
`);
expect(await page.$eval(`text=a`, e => e.outerHTML)).toBe('
a b
');
expect(await page.$eval(`text=b`, e => e.outerHTML)).toBe('
a b
');
expect(await page.$(`text=ab`)).toBe(null);
expect(await page.$$eval(`text=a`, els => els.length)).toBe(2);
expect(await page.$$eval(`text=b`, els => els.length)).toBe(1);
expect(await page.$$eval(`text=ab`, els => els.length)).toBe(0);
await page.setContent(``);
await page.$eval('div', div => {
div.appendChild(document.createTextNode('hello'));
div.appendChild(document.createTextNode('world'));
});
await page.$eval('span', span => {
span.appendChild(document.createTextNode('hello'));
span.appendChild(document.createTextNode('world'));
});
expect(await page.$eval(`text=lowo`, e => e.outerHTML)).toBe('
helloworld
');
expect(await page.$$eval(`text=lowo`, els => els.map(e => e.outerHTML).join(''))).toBe('
helloworld
helloworld');
await page.setContent(`Sign inHello\n \nworld`);
expect(await page.$eval(`text=Sign in`, e => e.outerHTML)).toBe('Sign in');
expect((await page.$$(`text=Sign \tin`)).length).toBe(1);
expect(await page.$(`text="Sign in"`)).toBe(null);
expect((await page.$$(`text="Sign in"`)).length).toBe(0);
expect(await page.$eval(`text=lo wo`, e => e.outerHTML)).toBe('Hello\n \nworld');
expect(await page.$(`text="lo wo"`)).toBe(null);
expect((await page.$$(`text=lo \nwo`)).length).toBe(1);
expect((await page.$$(`text="lo wo"`)).length).toBe(0);
});
it('should work in v2', async ({page}) => {
if (!selectorsV2Enabled())
return; // Selectors v1 do not support this.
await page.setContent(`
yo
ya
\nHELLO \n world
`);
expect(await page.$eval(`:text("ya")`, e => e.outerHTML)).toBe('
ya
');
expect(await page.$eval(`:text-is("ya")`, e => e.outerHTML)).toBe('
ya
');
expect(await page.$eval(`:text("y")`, e => e.outerHTML)).toBe('
yo
');
expect(await page.$(`:text-is("y")`)).toBe(null);
expect(await page.$eval(`:text("hello world")`, e => e.outerHTML)).toBe('
\nHELLO \n world
');
expect(await page.$eval(`:text-is("hello world")`, e => e.outerHTML)).toBe('
\nHELLO \n world
');
expect(await page.$eval(`:text("lo wo")`, e => e.outerHTML)).toBe('
\nHELLO \n world
');
expect(await page.$(`:text-is("lo wo")`)).toBe(null);
expect(await page.$eval(`:text-matches("^[ay]+$")`, e => e.outerHTML)).toBe('
ya
');
expect(await page.$eval(`:text-matches("y", "g")`, e => e.outerHTML)).toBe('
yo
');
expect(await page.$eval(`:text-matches("Y", "i")`, e => e.outerHTML)).toBe('
yo
');
expect(await page.$(`:text-matches("^y$")`)).toBe(null);
});
it('should be case sensitive if quotes are specified', async ({page}) => {
await page.setContent(`
yo
ya
\nye
`);
expect(await page.$eval(`text=yA`, e => e.outerHTML)).toBe('
ya
');
expect(await page.$(`text="yA"`)).toBe(null);
});
it('should search for a substring without quotes', async ({page}) => {
await page.setContent(`
textwithsubstring
`);
expect(await page.$eval(`text=with`, e => e.outerHTML)).toBe('
textwithsubstring
');
expect(await page.$(`text="with"`)).toBe(null);
});
it('should skip head, script and style', async ({page}) => {
await page.setContent(`
title
title script style
`);
const head = await page.$('head');
const title = await page.$('title');
const script = await page.$('body script');
const style = await page.$('body style');
for (const text of ['title', 'script', 'style']) {
expect(await page.$eval(`text=${text}`, e => e.nodeName)).toBe('DIV');
expect(await page.$$eval(`text=${text}`, els => els.map(e => e.nodeName).join('|'))).toBe('DIV');
for (const root of [head, title, script, style]) {
expect(await root.$(`text=${text}`)).toBe(null);
expect(await root.$$eval(`text=${text}`, els => els.length)).toBe(0);
}
}
});
it('should match input[type=button|submit]', async ({page}) => {
await page.setContent(``);
expect(await page.$eval(`text=hello`, e => e.outerHTML)).toBe('');
expect(await page.$eval(`text=world`, e => e.outerHTML)).toBe('');
});
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.textContent)).toBe('Hello from root1');
expect(await page.$eval(`text=root2`, e => e.textContent)).toBe('Hello from root2');
expect(await page.$eval(`text=root3`, e => e.textContent)).toBe('Hello from root3');
expect(await page.$eval(`#root1 >> text=from root3`, e => e.textContent)).toBe('Hello from root3');
expect(await page.$eval(`#target >> text=from root2`, e => e.textContent)).toBe('Hello from root2');
expect(await page.$(`text:light=root1`)).toBe(null);
expect(await page.$(`text:light=root2`)).toBe(null);
expect(await page.$(`text:light=root3`)).toBe(null);
});
it('should prioritize light dom over shadow dom in the same parent', async ({page, server}) => {
await page.evaluate(() => {
const div = document.createElement('div');
document.body.appendChild(div);
div.attachShadow({ mode: 'open' });
const shadowSpan = document.createElement('span');
shadowSpan.textContent = 'Hello from shadow';
div.shadowRoot.appendChild(shadowSpan);
const lightSpan = document.createElement('span');
lightSpan.textContent = 'Hello from light';
div.appendChild(lightSpan);
});
expect(await page.$eval(`div >> text=Hello`, e => e.textContent)).toBe('Hello from light');
});
it('should waitForSelector with distributed elements', async ({page, server}) => {
const promise = page.waitForSelector(`div >> text=Hello`);
await page.evaluate(() => {
const div = document.createElement('div');
document.body.appendChild(div);
div.attachShadow({ mode: 'open' });
const shadowSpan = document.createElement('span');
shadowSpan.textContent = 'Hello from shadow';
div.shadowRoot.appendChild(shadowSpan);
div.shadowRoot.appendChild(document.createElement('slot'));
const lightSpan = document.createElement('span');
lightSpan.textContent = 'Hello from light';
div.appendChild(lightSpan);
});
const handle = await promise;
expect(await handle.textContent()).toBe('Hello from light');
});
it('should match root after >>', async ({page, server}) => {
await page.setContent('test');
const element = await page.$('css=section >> text=test');
expect(element).toBeTruthy();
const element2 = await page.$('text=test >> text=test');
expect(element2).toBeTruthy();
});
it('should match root after >> with *', async ({ page }) => {
await page.setContent(` `);
expect(await page.$$eval('*css=button >> text=hello >> text=world', els => els.length)).toBe(2);
});