I have a web application with an input form, one of the fields asks the user to choose a file from their PC. I noticed that the same code opens a slightly different file picker when it's running inside a web browser (Chrome specially) versus when running inside a C# UWP WebView.
In order to demonstrate the difference, I made this sample web page to run with Node.js (based on this tutorial):
var http = require('http');
http.createServer(function (req, res) {
res.writeHead(200, {'Content-Type': 'text/html'});
res.write('<form action="fileupload" method="post" enctype="multipart/form-data">');
res.write('<input type="file" name="filetoupload" accept="image/*"><br>');
res.write('</form>');
return res.end();
}).listen(4000);
When I browse to it with Chrome (on Windows) and click the "choose file" button, I see this:
Note that the first & default filter is "Image Files".
So I did a basic C# UWP app which contains a WebView that navigates to this page (using the example here):
Note that in this case, the drop-down not only lists the file types differently (one row per each extension/type) - but it also opens on "All Files" as the first & default option.
I already understood (from here) that I can't remove the "All Files" option. But is there any way to make the file picker from inside C# UWP WebView to have the filter list more like the one from Chrome browser? Or At least make that "All files" won't be the default first option?
Edit: Chromium-based WebView2 could have solved this, but seems like it doesn't support UWP apps (which is my goal here), as mentioned here and here.