mirror of
https://github.com/puppeteer/puppeteer
synced 2024-06-14 14:02:48 +00:00
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:
parent
73f5b806a3
commit
7d18275fb9
@ -75,7 +75,7 @@ class ElementHandle extends JSHandle {
|
||||
/**
|
||||
* @param {!Object=} options
|
||||
*/
|
||||
async click(options) {
|
||||
async click(options = {}) {
|
||||
const {x, y} = await this._visibleCenter();
|
||||
await this._page.mouse.click(x, y, options);
|
||||
}
|
||||
|
@ -750,9 +750,9 @@ class Page extends EventEmitter {
|
||||
|
||||
/**
|
||||
* @param {string} selector
|
||||
* @param {!Object} options
|
||||
* @param {!Object=} options
|
||||
*/
|
||||
async click(selector, options) {
|
||||
async click(selector, options = {}) {
|
||||
const handle = await this.$(selector);
|
||||
console.assert(handle, 'No node found for selector: ' + selector);
|
||||
await handle.click(options);
|
||||
|
42
test/assets/input/checkbox.html
Normal file
42
test/assets/input/checkbox.html
Normal 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>
|
32
test/test.js
32
test/test.js
@ -1845,6 +1845,38 @@ describe('Page', function() {
|
||||
await page.click('button');
|
||||
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() {
|
||||
await page.goto(PREFIX + '/input/button.html');
|
||||
let error = null;
|
||||
|
Loading…
Reference in New Issue
Block a user