Unable to intercept FileChooser when invoked from window.chooseFileSystemEntries
See original GitHub issueThis is both an issue with puppeteer and Chromium. I am raising an issue here in the hope that it gets more eyes than in the Chromium issue tracker.
Steps to reproduce
Tell us about your environment:
- Puppeteer version:2.0.0
- Chromium: 78.0.3904.70 and 80.0.3982.0
- Platform / OS version:Ubuntu 4.15.0-45
- URLs (if applicable):
- Node.js version:10.16.3
Basically, I am calling window.chooseFileSystemEntries
which is a new functionality introduced in Chrome 78 to access the native filesystem. (https://web.dev/native-file-system/). And then I want to intercept the opening of the file dialog, and pass a file path to it.
Unfortunately, the event does not get intercepted. Whereas, it clearly does, when I manually invoke a file opener dialog from an input[type="file"]
.
I think since this is a bleeding edge feature, perhaps this follows a different code path from inside Chrome, due to which the event handler is unable to intercept it.
What steps will reproduce the problem?
Please include code that reproduces the issue.
HTML file:
<!doctype html>
<html>
<head>
<meta charset="utf-8">
<title>File access</title>
</head>
<body>
<input type="file" name="ff" id="open2">
<button id="openFile">Open file</button>
<script>
document.getElementById("openFile").addEventListener('click', async (e) => {
const fileHandle = await window.chooseFileSystemEntries();
const file = await fileHandle.getFile();
const contents = await file.text();
console.log(contents);
});
</script>
</body>
</html>
Serve this HTML file using any local web server.
JS Code
const puppeteer = require('puppeteer-core');
(async () => {
const browser = await puppeteer.launch({
headless: false,
executablePath: '/path/to/chromium_tip',
args: [
'--flag-switches-begin',
'--enable-features=NativeFileSystemAPI',
'--flag-switches-end',
]
});
const page = await browser.newPage();
await page.goto('http://localhost:8080/file.html');
const [fileChooser] = await Promise.all([
page.waitForFileChooser(),
page.click('#openFile'), // trying to #open2 works
]);
// await fileChooser.accept(['/home/agniva/Desktop/sticky_note.txt']);
console.log(fileChooser);
await page.waitFor(1000);
await browser.close();
})();
What is the expected result?
There are couple of issues here.
When I click #openFile
, the filechooser dialog does not get intercepted at all. I can see the dialog, and after 30 secs, it times out with:
(node:11168) UnhandledPromiseRejectionWarning: TimeoutError: waiting for waiting for file chooser failed: timeout 30000ms exceeded
But if I change it to click #open2
, everything works perfectly fine. And fileChooser
gets logged properly.
This is a problem with Chromium.
The page.handleFileChooser
API is removed from Chromium 80 at https://github.com/chromium/chromium/commit/41361e490363590c21250dfd94554f8200e041f1. So therefore, using fileChooser.accept
with Chromium 80 raises an error. This is something to be fixed at puppeteer. The API needs to use the new fields at https://chromedevtools.github.io/devtools-protocol/tot/Page#event-fileChooserOpened to call the https://chromedevtools.github.io/devtools-protocol/tot/DOM#method-setFileInputFiles method.
The commit also moved the dialog interception from browser-side to blink-side. I hoped that it will make a difference in intercepting dialogs invoked from window.chooseFileSystemEntries
but it does not. The same failure to interception occurs with Chrome 78 too.
/cc @pavelfeldman who made the commit.
For further context: I work on WebAssembly with the Go team. Not being able to read/write files has prevented us from running the Go test suite inside the browser, which has failed to catch several bugs. Currently, we run tests inside Node. But resolving this issue will allow us to run the test suite inside the browser too.
Issue Analytics
- State:
- Created 4 years ago
- Reactions:13
- Comments:19
Top GitHub Comments
This issue still exist and the only fix to this is downgrading to 4 years old chrome ver 78. Please re-open and start investigation to solve
We are closing this issue. If the issue still persists in the latest version of Puppeteer, please reopen the issue and update the description. We will try our best to accomodate it!