Skip to content

Commit

Permalink
Emit change event on uploadFile calls
Browse files Browse the repository at this point in the history
In puppeteer 1.20.0, the following code emitted an alert:
```
const puppeteer = require('puppeteer');

(async () => {
	const browser = await puppeteer.launch({args: ['--no-sandbox'], headless: false});
	const page = (await browser.pages())[0];

	await page.setContent(`
		<input type=file>
		<script>
		document.querySelector('input').addEventListener('change', () => {
			alert('Uploaded a file');
		});
		</script>
		`);
	const input = await page.waitForSelector('input[type="file"]');
	await input.uploadFile(__filename);
})();
```

A bisection yielded 6091a34 as the commit that broke this.

Emitting the change event as well seems to fix the problem.
  • Loading branch information
phihag committed Feb 7, 2020
1 parent 9923e56 commit bcf208d
Show file tree
Hide file tree
Showing 2 changed files with 7 additions and 0 deletions.
1 change: 1 addition & 0 deletions lib/JSHandle.js
Expand Up @@ -341,6 +341,7 @@ class ElementHandle extends JSHandle {
}
element.files = dt.files;
element.dispatchEvent(new Event('input', { bubbles: true }));
element.dispatchEvent(new Event('change', { bubbles: true }));
}, files);
}

Expand Down
6 changes: 6 additions & 0 deletions test/input.spec.js
Expand Up @@ -27,8 +27,14 @@ module.exports.addTests = function({testRunner, expect, puppeteer}) {
await page.goto(server.PREFIX + '/input/fileupload.html');
const filePath = path.relative(process.cwd(), FILE_TO_UPLOAD);
const input = await page.$('input');
await page.evaluate(e => {
window._inputEvents = [];
e.addEventListener('change', ev => window._inputEvents.push(ev.type));
e.addEventListener('input', ev => window._inputEvents.push(ev.type));
}, input);
await input.uploadFile(filePath);
expect(await page.evaluate(e => e.files[0].name, input)).toBe('file-to-upload.txt');
expect(await page.evaluate(() => window._inputEvents)).toEqual(['input', 'change']);
expect(await page.evaluate(e => {
const reader = new FileReader();
const promise = new Promise(fulfill => reader.onload = fulfill);
Expand Down

0 comments on commit bcf208d

Please sign in to comment.