test: put existing retarget tests to a separate file (#16510)
This commit is contained in:
Dmitry Gozman
GitHub
parent
d9e8e1e92d
commit
0ff00e5978
|
|
@ -58,13 +58,6 @@ it('inputValue should work', async ({ page, server }) => {
|
|||
expect(await handle2.inputValue().catch(e => e.message)).toContain('Node is not an <input>, <textarea> or <select> element');
|
||||
});
|
||||
|
||||
it('inputValue should work on label', async ({ page, server }) => {
|
||||
await page.setContent(`<label><input type=text></input></label>`);
|
||||
await page.fill('input', 'foo');
|
||||
const handle = await page.$('label');
|
||||
expect(await handle.inputValue()).toBe('foo');
|
||||
});
|
||||
|
||||
it('innerHTML should work', async ({ page, server }) => {
|
||||
await page.goto(`${server.PREFIX}/dom.html`);
|
||||
const handle = await page.$('#outer');
|
||||
|
|
@ -114,22 +107,6 @@ it('isVisible and isHidden should work', async ({ page }) => {
|
|||
expect(await page.isHidden('no-such-element')).toBe(true);
|
||||
});
|
||||
|
||||
it('element state checks should work for label with zero-sized input', async ({ page, server }) => {
|
||||
await page.setContent(`
|
||||
<label>
|
||||
Click me
|
||||
<input disabled style="width:0;height:0;padding:0;margin:0;border:0;">
|
||||
</label>
|
||||
`);
|
||||
// Visible checks the label.
|
||||
expect(await page.isVisible('text=Click me')).toBe(true);
|
||||
expect(await page.isHidden('text=Click me')).toBe(false);
|
||||
|
||||
// Enabled checks the input.
|
||||
expect(await page.isEnabled('text=Click me')).toBe(false);
|
||||
expect(await page.isDisabled('text=Click me')).toBe(true);
|
||||
});
|
||||
|
||||
it('isVisible should not throw when the DOM element is not connected', async ({ page }) => {
|
||||
await page.setContent(`<div id="root"></div>`);
|
||||
await page.evaluate(() => {
|
||||
|
|
|
|||
|
|
@ -83,17 +83,6 @@ it('should wait for hidden when detached', async ({ page }) => {
|
|||
await promise;
|
||||
});
|
||||
|
||||
it('should wait for enabled button', async ({ page, server }) => {
|
||||
await page.setContent('<button disabled><span>Target</span></button>');
|
||||
const span = await page.$('text=Target');
|
||||
let done = false;
|
||||
const promise = span.waitForElementState('enabled').then(() => done = true);
|
||||
await giveItAChanceToResolve(page);
|
||||
expect(done).toBe(false);
|
||||
await span.evaluate(span => (span.parentElement as HTMLButtonElement).disabled = false);
|
||||
await promise;
|
||||
});
|
||||
|
||||
it('should throw waiting for enabled when detached', async ({ page }) => {
|
||||
await page.setContent(`<button disabled>Target</button>`);
|
||||
const button = await page.$('button');
|
||||
|
|
@ -103,17 +92,6 @@ it('should throw waiting for enabled when detached', async ({ page }) => {
|
|||
expect(error.message).toContain('Element is not attached to the DOM');
|
||||
});
|
||||
|
||||
it('should wait for button with a disabled fieldset', async ({ page }) => {
|
||||
await page.setContent('<fieldset disabled=true><button><span>Target</span></button></div>');
|
||||
const span = await page.$('text=Target');
|
||||
let done = false;
|
||||
const promise = span.waitForElementState('enabled').then(() => done = true);
|
||||
await giveItAChanceToResolve(page);
|
||||
expect(done).toBe(false);
|
||||
await span.evaluate(span => (span.parentElement.parentElement as HTMLFieldSetElement).disabled = false);
|
||||
await promise;
|
||||
});
|
||||
|
||||
it('should wait for aria enabled button', async ({ page }) => {
|
||||
await page.setContent('<button aria-disabled=true><span>Target</span></button>');
|
||||
const span = await page.$('text=Target');
|
||||
|
|
@ -136,17 +114,6 @@ it('should wait for button with an aria-disabled parent', async ({ page }) => {
|
|||
await promise;
|
||||
});
|
||||
|
||||
it('should wait for disabled button', async ({ page }) => {
|
||||
await page.setContent('<button><span>Target</span></button>');
|
||||
const span = await page.$('text=Target');
|
||||
let done = false;
|
||||
const promise = span.waitForElementState('disabled').then(() => done = true);
|
||||
await giveItAChanceToResolve(page);
|
||||
expect(done).toBe(false);
|
||||
await span.evaluate(span => (span.parentElement as HTMLButtonElement).disabled = true);
|
||||
await promise;
|
||||
});
|
||||
|
||||
it('should wait for stable position', async ({ page, server, browserName, platform }) => {
|
||||
it.fixme(browserName === 'firefox' && platform === 'linux');
|
||||
|
||||
|
|
|
|||
|
|
@ -58,35 +58,6 @@ it('inputValue should work', async ({ page, server }) => {
|
|||
expect(await locator2.inputValue().catch(e => e.message)).toContain('Node is not an <input>, <textarea> or <select> element');
|
||||
});
|
||||
|
||||
it('inputValue should work on label', async ({ page, server }) => {
|
||||
await page.setContent(`<label><input type=text></input></label>`);
|
||||
await page.fill('input', 'foo');
|
||||
expect(await page.locator('label').inputValue()).toBe('foo');
|
||||
});
|
||||
|
||||
it('should get value of input with label', async ({ page }) => {
|
||||
await page.setContent(`<label for=target>Fill me</label><input id=target value="some value">`);
|
||||
expect(await page.inputValue('text=Fill me')).toBe('some value');
|
||||
await expect(page.locator('text=Fill me')).toHaveValue('some value');
|
||||
});
|
||||
|
||||
it('should get value of input with span inside the label', async ({ page }) => {
|
||||
await page.setContent(`<label for=target><span>Fill me</span></label><input id=target value="some value">`);
|
||||
expect(await page.inputValue('text=Fill me')).toBe('some value');
|
||||
await expect(page.locator('text=Fill me')).toHaveValue('some value');
|
||||
});
|
||||
|
||||
it('should get value of textarea with label', async ({ page }) => {
|
||||
await page.setContent(`<label for=target>Fill me</label><textarea id=target>hey</textarea>`);
|
||||
expect(await page.inputValue('text=Fill me')).toBe('hey');
|
||||
await expect(page.locator('text=Fill me')).toHaveValue('hey');
|
||||
|
||||
await page.fill('textarea', 'Look at this');
|
||||
expect(await page.inputValue('text=Fill me')).toBe('Look at this');
|
||||
await expect(page.locator('text=Fill me')).toHaveValue('Look at this');
|
||||
});
|
||||
|
||||
|
||||
it('innerHTML should work', async ({ page, server }) => {
|
||||
await page.goto(`${server.PREFIX}/dom.html`);
|
||||
const locator = page.locator('#outer');
|
||||
|
|
|
|||
|
|
@ -41,41 +41,6 @@ it('should not uncheck the unchecked box', async ({ page }) => {
|
|||
expect(await page.evaluate(() => window['checkbox'].checked)).toBe(false);
|
||||
});
|
||||
|
||||
it('should check the box by label', async ({ page }) => {
|
||||
await page.setContent(`<label for='checkbox'><input id='checkbox' type='checkbox'></input></label>`);
|
||||
await page.check('label');
|
||||
expect(await page.evaluate(() => window['checkbox'].checked)).toBe(true);
|
||||
});
|
||||
|
||||
it('should check the box outside label', async ({ page }) => {
|
||||
await page.setContent(`<label for='checkbox'>Text</label><div><input id='checkbox' type='checkbox'></input></div>`);
|
||||
await page.check('label');
|
||||
expect(await page.evaluate(() => window['checkbox'].checked)).toBe(true);
|
||||
});
|
||||
|
||||
it('should check the box inside label w/o id', async ({ page }) => {
|
||||
await page.setContent(`<label>Text<span><input id='checkbox' type='checkbox'></input></span></label>`);
|
||||
await page.check('label');
|
||||
expect(await page.evaluate(() => window['checkbox'].checked)).toBe(true);
|
||||
});
|
||||
|
||||
it('should check the box outside shadow dom label', async ({ page }) => {
|
||||
await page.setContent('<div></div>');
|
||||
await page.$eval('div', div => {
|
||||
const root = div.attachShadow({ mode: 'open' });
|
||||
const label = document.createElement('label');
|
||||
label.setAttribute('for', 'target');
|
||||
label.textContent = 'Click me';
|
||||
root.appendChild(label);
|
||||
const input = document.createElement('input');
|
||||
input.setAttribute('type', 'checkbox');
|
||||
input.setAttribute('id', 'target');
|
||||
root.appendChild(input);
|
||||
});
|
||||
await page.check('label');
|
||||
expect(await page.$eval('input', input => input.checked)).toBe(true);
|
||||
});
|
||||
|
||||
it('should check radio', async ({ page }) => {
|
||||
await page.setContent(`
|
||||
<input type='radio'>one</input>
|
||||
|
|
|
|||
|
|
@ -605,32 +605,6 @@ it('should click disabled div', async ({ page }) => {
|
|||
expect(await page.evaluate('__CLICKED')).toBe(true);
|
||||
});
|
||||
|
||||
it('should climb dom for inner label with pointer-events:none', async ({ page }) => {
|
||||
await page.setContent('<button onclick="javascript:window.__CLICKED=true;"><label style="pointer-events:none">Click target</label></button>');
|
||||
await page.click('text=Click target');
|
||||
expect(await page.evaluate('__CLICKED')).toBe(true);
|
||||
});
|
||||
|
||||
it('should climb up to [role=button]', async ({ page }) => {
|
||||
await page.setContent('<div role=button onclick="javascript:window.__CLICKED=true;"><div style="pointer-events:none"><span><div>Click target</div></span></div>');
|
||||
await page.click('text=Click target');
|
||||
expect(await page.evaluate('__CLICKED')).toBe(true);
|
||||
});
|
||||
|
||||
it('should climb up to a anchor', async ({ page }) => {
|
||||
// For Firefox its not allowed to return anything: https://bugzilla.mozilla.org/show_bug.cgi?id=1392046
|
||||
// Note the intermediate div - it is necessary, otherwise <a><non-clickable/></a> is not recognized as a clickable link.
|
||||
await page.setContent(`<a href="javascript:(function(){window.__CLICKED=true})()" id="outer"><div id="intermediate"><div id="inner" style="pointer-events: none">Inner</div></div></a>`);
|
||||
await page.click('#inner');
|
||||
expect(await page.evaluate('__CLICKED')).toBe(true);
|
||||
});
|
||||
|
||||
it('should climb up to a [role=link]', async ({ page }) => {
|
||||
await page.setContent(`<div role=link onclick="javascript:window.__CLICKED=true;" id="outer"><div id="inner" style="pointer-events: none">Inner</div></div>`);
|
||||
await page.click('#inner');
|
||||
expect(await page.evaluate('__CLICKED')).toBe(true);
|
||||
});
|
||||
|
||||
it('should wait for BUTTON to be clickable when it has pointer-events:none', async ({ page }) => {
|
||||
await page.setContent('<button onclick="javascript:window.__CLICKED=true;" style="pointer-events:none"><span>Click target</span></button>');
|
||||
let done = false;
|
||||
|
|
|
|||
|
|
@ -34,36 +34,6 @@ it('should fill input', async ({ page, server }) => {
|
|||
expect(await page.evaluate(() => window['result'])).toBe('some value');
|
||||
});
|
||||
|
||||
it('should fill input with label', async ({ page }) => {
|
||||
await page.setContent(`<label for=target>Fill me</label><input id=target>`);
|
||||
await page.fill('text=Fill me', 'some value');
|
||||
expect(await page.$eval('input', input => input.value)).toBe('some value');
|
||||
});
|
||||
|
||||
it('should fill input with label 2', async ({ page }) => {
|
||||
await page.setContent(`<label>Fill me<input id=target></label>`);
|
||||
await page.fill('text=Fill me', 'some value');
|
||||
expect(await page.$eval('input', input => input.value)).toBe('some value');
|
||||
});
|
||||
|
||||
it('should fill input with span inside the label', async ({ page }) => {
|
||||
await page.setContent(`<label for=target><span>Fill me</span></label><input id=target>`);
|
||||
await page.fill('text=Fill me', 'some value');
|
||||
expect(await page.$eval('input', input => input.value)).toBe('some value');
|
||||
});
|
||||
|
||||
it('should fill input inside the label', async ({ page }) => {
|
||||
await page.setContent(`<label><input id=target></label>`);
|
||||
await page.fill('input', 'some value');
|
||||
expect(await page.$eval('input', input => input.value)).toBe('some value');
|
||||
});
|
||||
|
||||
it('should fill textarea with label', async ({ page }) => {
|
||||
await page.setContent(`<label for=target>Fill me</label><textarea id=target>hey</textarea>`);
|
||||
await page.fill('text=Fill me', 'some value');
|
||||
expect(await page.$eval('textarea', textarea => textarea.value)).toBe('some value');
|
||||
});
|
||||
|
||||
it('should throw on unsupported inputs', async ({ page, server }) => {
|
||||
await page.goto(server.PREFIX + '/input/textarea.html');
|
||||
for (const type of ['button', 'checkbox', 'file', 'image', 'radio', 'reset', 'submit']) {
|
||||
|
|
|
|||
|
|
@ -108,26 +108,6 @@ it('should select multiple options with attributes', async ({ page, server }) =>
|
|||
expect(await page.evaluate(() => window['result'].onChange)).toEqual(['blue', 'gray', 'green']);
|
||||
});
|
||||
|
||||
it('should select options with sibling label', async ({ page, server }) => {
|
||||
await page.setContent(`<label for=pet-select>Choose a pet</label>
|
||||
<select id='pet-select'>
|
||||
<option value='dog'>Dog</option>
|
||||
<option value='cat'>Cat</option>
|
||||
</select>`);
|
||||
await page.selectOption('text=Choose a pet', 'cat');
|
||||
expect(await page.$eval('select', select => select.options[select.selectedIndex].text)).toEqual('Cat');
|
||||
});
|
||||
|
||||
it('should select options with outer label', async ({ page, server }) => {
|
||||
await page.setContent(`<label for=pet-select>Choose a pet
|
||||
<select id='pet-select'>
|
||||
<option value='dog'>Dog</option>
|
||||
<option value='cat'>Cat</option>
|
||||
</select></label>`);
|
||||
await page.selectOption('text=Choose a pet', 'cat');
|
||||
expect(await page.$eval('select', select => select.options[select.selectedIndex].text)).toEqual('Cat');
|
||||
});
|
||||
|
||||
it('should respect event bubbling', async ({ page, server }) => {
|
||||
await page.goto(server.PREFIX + '/input/select.html');
|
||||
await page.selectOption('select', 'blue');
|
||||
|
|
|
|||
|
|
@ -142,13 +142,6 @@ it('should work @smoke', async ({ page, asset }) => {
|
|||
expect(await page.$eval('input', input => input.files[0].name)).toBe('file-to-upload.txt');
|
||||
});
|
||||
|
||||
it('should work with label', async ({ page, asset }) => {
|
||||
await page.setContent(`<label for=target>Choose a file</label><input id=target type=file>`);
|
||||
await page.setInputFiles('text=Choose a file', asset('file-to-upload.txt'));
|
||||
expect(await page.$eval('input', input => input.files.length)).toBe(1);
|
||||
expect(await page.$eval('input', input => input.files[0].name)).toBe('file-to-upload.txt');
|
||||
});
|
||||
|
||||
it('should set from memory', async ({ page }) => {
|
||||
await page.setContent(`<input type=file>`);
|
||||
await page.setInputFiles('input', {
|
||||
|
|
|
|||
219
tests/page/retarget.spec.ts
Normal file
219
tests/page/retarget.spec.ts
Normal file
|
|
@ -0,0 +1,219 @@
|
|||
/**
|
||||
* Copyright 2017 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 { test as it, expect } from './pageTest';
|
||||
|
||||
async function giveItAChanceToResolve(page) {
|
||||
for (let i = 0; i < 5; i++)
|
||||
await page.evaluate(() => new Promise(f => requestAnimationFrame(() => requestAnimationFrame(f))));
|
||||
}
|
||||
|
||||
it('element state checks should work as expected for label with zero-sized input', async ({ page, server }) => {
|
||||
await page.setContent(`
|
||||
<label>
|
||||
Click me
|
||||
<input disabled style="width:0;height:0;padding:0;margin:0;border:0;">
|
||||
</label>
|
||||
`);
|
||||
// Visible checks the label.
|
||||
expect(await page.isVisible('text=Click me')).toBe(true);
|
||||
expect(await page.isHidden('text=Click me')).toBe(false);
|
||||
|
||||
// Enabled checks the input.
|
||||
expect(await page.isEnabled('text=Click me')).toBe(false);
|
||||
expect(await page.isDisabled('text=Click me')).toBe(true);
|
||||
});
|
||||
|
||||
it('should wait for enclosing disabled button', async ({ page }) => {
|
||||
await page.setContent('<button><span>Target</span></button>');
|
||||
const span = await page.$('text=Target');
|
||||
let done = false;
|
||||
const promise = span.waitForElementState('disabled').then(() => done = true);
|
||||
await giveItAChanceToResolve(page);
|
||||
expect(done).toBe(false);
|
||||
await span.evaluate(span => (span.parentElement as HTMLButtonElement).disabled = true);
|
||||
await promise;
|
||||
});
|
||||
|
||||
it('should wait for enclosing button with a disabled fieldset', async ({ page }) => {
|
||||
await page.setContent('<fieldset disabled=true><button><span>Target</span></button></div>');
|
||||
const span = await page.$('text=Target');
|
||||
let done = false;
|
||||
const promise = span.waitForElementState('enabled').then(() => done = true);
|
||||
await giveItAChanceToResolve(page);
|
||||
expect(done).toBe(false);
|
||||
await span.evaluate(span => (span.parentElement.parentElement as HTMLFieldSetElement).disabled = false);
|
||||
await promise;
|
||||
});
|
||||
|
||||
it('should wait for enclosing enabled button', async ({ page, server }) => {
|
||||
await page.setContent('<button disabled><span>Target</span></button>');
|
||||
const span = await page.$('text=Target');
|
||||
let done = false;
|
||||
const promise = span.waitForElementState('enabled').then(() => done = true);
|
||||
await giveItAChanceToResolve(page);
|
||||
expect(done).toBe(false);
|
||||
await span.evaluate(span => (span.parentElement as HTMLButtonElement).disabled = false);
|
||||
await promise;
|
||||
});
|
||||
|
||||
it('inputValue should work on label', async ({ page, server }) => {
|
||||
await page.setContent(`<label><input type=text></input></label>`);
|
||||
await page.fill('input', 'foo');
|
||||
expect(await page.locator('label').inputValue()).toBe('foo');
|
||||
});
|
||||
|
||||
it('should get value of input with label', async ({ page }) => {
|
||||
await page.setContent(`<label for=target>Fill me</label><input id=target value="some value">`);
|
||||
expect(await page.inputValue('text=Fill me')).toBe('some value');
|
||||
await expect(page.locator('text=Fill me')).toHaveValue('some value');
|
||||
});
|
||||
|
||||
it('should get value of input with span inside the label', async ({ page }) => {
|
||||
await page.setContent(`<label for=target><span>Fill me</span></label><input id=target value="some value">`);
|
||||
expect(await page.inputValue('text=Fill me')).toBe('some value');
|
||||
await expect(page.locator('text=Fill me')).toHaveValue('some value');
|
||||
});
|
||||
|
||||
it('should get value of textarea with label', async ({ page }) => {
|
||||
await page.setContent(`<label for=target>Fill me</label><textarea id=target>hey</textarea>`);
|
||||
expect(await page.inputValue('text=Fill me')).toBe('hey');
|
||||
await expect(page.locator('text=Fill me')).toHaveValue('hey');
|
||||
|
||||
await page.fill('textarea', 'Look at this');
|
||||
expect(await page.inputValue('text=Fill me')).toBe('Look at this');
|
||||
await expect(page.locator('text=Fill me')).toHaveValue('Look at this');
|
||||
});
|
||||
|
||||
it('should check the box by label', async ({ page }) => {
|
||||
await page.setContent(`<label for='checkbox'><input id='checkbox' type='checkbox'></input></label>`);
|
||||
await page.check('label');
|
||||
expect(await page.evaluate(() => window['checkbox'].checked)).toBe(true);
|
||||
});
|
||||
|
||||
it('should check the box outside label', async ({ page }) => {
|
||||
await page.setContent(`<label for='checkbox'>Text</label><div><input id='checkbox' type='checkbox'></input></div>`);
|
||||
await page.check('label');
|
||||
expect(await page.evaluate(() => window['checkbox'].checked)).toBe(true);
|
||||
});
|
||||
|
||||
it('should check the box inside label w/o id', async ({ page }) => {
|
||||
await page.setContent(`<label>Text<span><input id='checkbox' type='checkbox'></input></span></label>`);
|
||||
await page.check('label');
|
||||
expect(await page.evaluate(() => window['checkbox'].checked)).toBe(true);
|
||||
});
|
||||
|
||||
it('should check the box outside shadow dom label', async ({ page }) => {
|
||||
await page.setContent('<div></div>');
|
||||
await page.$eval('div', div => {
|
||||
const root = div.attachShadow({ mode: 'open' });
|
||||
const label = document.createElement('label');
|
||||
label.setAttribute('for', 'target');
|
||||
label.textContent = 'Click me';
|
||||
root.appendChild(label);
|
||||
const input = document.createElement('input');
|
||||
input.setAttribute('type', 'checkbox');
|
||||
input.setAttribute('id', 'target');
|
||||
root.appendChild(input);
|
||||
});
|
||||
await page.check('label');
|
||||
expect(await page.$eval('input', input => input.checked)).toBe(true);
|
||||
});
|
||||
|
||||
it('click should climb dom for inner label with pointer-events:none', async ({ page }) => {
|
||||
await page.setContent('<button onclick="javascript:window.__CLICKED=true;"><label style="pointer-events:none">Click target</label></button>');
|
||||
await page.click('text=Click target');
|
||||
expect(await page.evaluate('__CLICKED')).toBe(true);
|
||||
});
|
||||
|
||||
it('click should climb up to [role=button]', async ({ page }) => {
|
||||
await page.setContent('<div role=button onclick="javascript:window.__CLICKED=true;"><div style="pointer-events:none"><span><div>Click target</div></span></div>');
|
||||
await page.click('text=Click target');
|
||||
expect(await page.evaluate('__CLICKED')).toBe(true);
|
||||
});
|
||||
|
||||
it('click should climb up to a anchor', async ({ page }) => {
|
||||
// For Firefox its not allowed to return anything: https://bugzilla.mozilla.org/show_bug.cgi?id=1392046
|
||||
// Note the intermediate div - it is necessary, otherwise <a><non-clickable/></a> is not recognized as a clickable link.
|
||||
await page.setContent(`<a href="javascript:(function(){window.__CLICKED=true})()" id="outer"><div id="intermediate"><div id="inner" style="pointer-events: none">Inner</div></div></a>`);
|
||||
await page.click('#inner');
|
||||
expect(await page.evaluate('__CLICKED')).toBe(true);
|
||||
});
|
||||
|
||||
it('click should climb up to a [role=link]', async ({ page }) => {
|
||||
await page.setContent(`<div role=link onclick="javascript:window.__CLICKED=true;" id="outer"><div id="inner" style="pointer-events: none">Inner</div></div>`);
|
||||
await page.click('#inner');
|
||||
expect(await page.evaluate('__CLICKED')).toBe(true);
|
||||
});
|
||||
|
||||
|
||||
it('should fill input with label', async ({ page }) => {
|
||||
await page.setContent(`<label for=target>Fill me</label><input id=target>`);
|
||||
await page.fill('text=Fill me', 'some value');
|
||||
expect(await page.$eval('input', input => input.value)).toBe('some value');
|
||||
});
|
||||
|
||||
it('should fill input with label 2', async ({ page }) => {
|
||||
await page.setContent(`<label>Fill me<input id=target></label>`);
|
||||
await page.fill('text=Fill me', 'some value');
|
||||
expect(await page.$eval('input', input => input.value)).toBe('some value');
|
||||
});
|
||||
|
||||
it('should fill input with span inside the label', async ({ page }) => {
|
||||
await page.setContent(`<label for=target><span>Fill me</span></label><input id=target>`);
|
||||
await page.fill('text=Fill me', 'some value');
|
||||
expect(await page.$eval('input', input => input.value)).toBe('some value');
|
||||
});
|
||||
|
||||
it('should fill input inside the label', async ({ page }) => {
|
||||
await page.setContent(`<label><input id=target></label>`);
|
||||
await page.fill('input', 'some value');
|
||||
expect(await page.$eval('input', input => input.value)).toBe('some value');
|
||||
});
|
||||
|
||||
it('should fill textarea with label', async ({ page }) => {
|
||||
await page.setContent(`<label for=target>Fill me</label><textarea id=target>hey</textarea>`);
|
||||
await page.fill('text=Fill me', 'some value');
|
||||
expect(await page.$eval('textarea', textarea => textarea.value)).toBe('some value');
|
||||
});
|
||||
|
||||
it('should selectOption with sibling label', async ({ page, server }) => {
|
||||
await page.setContent(`<label for=pet-select>Choose a pet</label>
|
||||
<select id='pet-select'>
|
||||
<option value='dog'>Dog</option>
|
||||
<option value='cat'>Cat</option>
|
||||
</select>`);
|
||||
await page.selectOption('text=Choose a pet', 'cat');
|
||||
expect(await page.$eval('select', select => select.options[select.selectedIndex].text)).toEqual('Cat');
|
||||
});
|
||||
|
||||
it('should selectOption with outer label', async ({ page, server }) => {
|
||||
await page.setContent(`<label for=pet-select>Choose a pet
|
||||
<select id='pet-select'>
|
||||
<option value='dog'>Dog</option>
|
||||
<option value='cat'>Cat</option>
|
||||
</select></label>`);
|
||||
await page.selectOption('text=Choose a pet', 'cat');
|
||||
expect(await page.$eval('select', select => select.options[select.selectedIndex].text)).toEqual('Cat');
|
||||
});
|
||||
|
||||
it('setInputFiles should work with label', async ({ page, asset }) => {
|
||||
await page.setContent(`<label for=target>Choose a file</label><input id=target type=file>`);
|
||||
await page.setInputFiles('text=Choose a file', asset('file-to-upload.txt'));
|
||||
expect(await page.$eval('input', input => input.files.length)).toBe(1);
|
||||
expect(await page.$eval('input', input => input.files[0].name)).toBe('file-to-upload.txt');
|
||||
});
|
||||
Loading…
Reference in a new issue