Test: add tests to cover clicking checkbox (#1125)

This patch adds tests to make sure clicking both checkbox and its label
works.

These are regression tests to cover the upstream fix, rolled in #1299.
This commit is contained in:
Alix Axel 2017-11-08 05:38:22 +01:00 committed by Andrey Lushnikov
parent 73f5b806a3
commit 7d18275fb9
4 changed files with 77 additions and 3 deletions

View File

@ -75,7 +75,7 @@ class ElementHandle extends JSHandle {
/** /**
* @param {!Object=} options * @param {!Object=} options
*/ */
async click(options) { async click(options = {}) {
const {x, y} = await this._visibleCenter(); const {x, y} = await this._visibleCenter();
await this._page.mouse.click(x, y, options); await this._page.mouse.click(x, y, options);
} }

View File

@ -750,9 +750,9 @@ class Page extends EventEmitter {
/** /**
* @param {string} selector * @param {string} selector
* @param {!Object} options * @param {!Object=} options
*/ */
async click(selector, options) { async click(selector, options = {}) {
const handle = await this.$(selector); const handle = await this.$(selector);
console.assert(handle, 'No node found for selector: ' + selector); console.assert(handle, 'No node found for selector: ' + selector);
await handle.click(options); await handle.click(options);

View File

@ -0,0 +1,42 @@
<!DOCTYPE html>
<html>
<head>
<title>Selection Test</title>
</head>
<body>
<label for="agree">Remember Me</label>
<input id="agree" type="checkbox">
<script>
window.result = {
check: null,
events: [],
};
let checkbox = document.querySelector('input');
const events = [
'change',
'click',
'dblclick',
'input',
'mousedown',
'mouseenter',
'mouseleave',
'mousemove',
'mouseout',
'mouseover',
'mouseup',
];
for (let event of events) {
checkbox.addEventListener(event, () => {
if (['change', 'click', 'dblclick', 'input'].includes(event) === true) {
result.check = checkbox.checked;
}
result.events.push(event);
}, false);
}
</script>
</body>
</html>

View File

@ -1845,6 +1845,38 @@ describe('Page', function() {
await page.click('button'); await page.click('button');
expect(await page.evaluate(() => result)).toBe('Clicked'); expect(await page.evaluate(() => result)).toBe('Clicked');
})); }));
it('should click on checkbox input and toggle', SX(async function() {
await page.goto(PREFIX + '/input/checkbox.html');
expect(await page.evaluate(() => result.check)).toBe(null);
await page.click('input#agree');
expect(await page.evaluate(() => result.check)).toBe(true);
expect(await page.evaluate(() => result.events)).toEqual([
'mouseover',
'mouseenter',
'mousemove',
'mousedown',
'mouseup',
'click',
'change',
]);
await page.click('input#agree');
expect(await page.evaluate(() => result.check)).toBe(false);
}));
it('should click on checkbox label and toggle', SX(async function() {
await page.goto(PREFIX + '/input/checkbox.html');
expect(await page.evaluate(() => result.check)).toBe(null);
await page.click('label[for="agree"]');
expect(await page.evaluate(() => result.check)).toBe(true);
expect(await page.evaluate(() => result.events)).toEqual([
'click',
'change',
]);
await page.click('label[for="agree"]');
expect(await page.evaluate(() => result.check)).toBe(false);
}));
it('should fail to click a missing button', SX(async function() { it('should fail to click a missing button', SX(async function() {
await page.goto(PREFIX + '/input/button.html'); await page.goto(PREFIX + '/input/button.html');
let error = null; let error = null;