How to catch FilePicker dialogs?

[TripleNico]

We would like to catch an event when a user opens a Filepicker dialog. For example we would like to use WebView2 in our Kiosk application. The user is able to plugin a USB drive and then get's the rights to upload a file using this HTML:

<input type="file" id="myFile" name="filename">

Now this opens up the default Win32 OpenFileDialog, giving the user access to the whole system. This isn't something we want so we want to display our own FilePicker we created (which is also touch friendly) instead of the Win32 version. With CefSharp an event get's raised when a OpenFileDialog is requested. Is there a similar event in CoreWebView2 we can use?

Already tried all the current available events but can't seem to find one for this feature.

AB#30958081

[champnic]

Hey @TripleNico - We don't currently have the ability to do this, but it's a known feature request already on our backlog. I'll link this issue to that scenario. Thanks!

[TripleNico]

Hi @champnic thanks for confirming that this isn't currently available. Saves a lot of searching ;-)

Is there a timeline when this feature will be available?

[champnic]

@TripleNico Our backlog is quite large (see # of open issues) and we generally prioritize based on size of customer ask, so unfortunately I wouldn't expect this to be available for a while.

[darbid]

I'm interested in this event, as implemented by CefSharp in that I would give the event the path to a file and cancel the dialog ever showing.

[darkguy2008]

I've been interested in this feature for a long time already. We need a way to upload files programmatically or provide our own, otherwise the file picker dialog appears and there's no way to get rid of it, except using WinAPI which isn't pretty,

[amanada]

@TripleNico Our backlog is quite large (see # of open issues) and we generally prioritize based on size of customer ask, so unfortunately I wouldn't expect this to be available for a while.

#378

[TranquilleXav]

Hello à tous
i'm interested in this feature too :-)
i have created this:
#2650 (comment)
is there any chance that this feature arrive?
thank you!

[darkguy2008]

Hello à tous i'm interested in this feature too :-) i have created this: #2650 (comment) is there any chance that this feature arrive? thank you!

If it helps, I ended up using WinAPI to catch the FilePicker dialog, type the desired filename and press Enter. Not pretty at all, and I don't have code to share as it's from a previous employer, but you basically use FindWindow and SendMessage to do that in a separate thread, while you wait for the FilePicker to disappear or set a flag on true (ManualResetEventSlim is a good option).

Again, not pretty, but it works. Considering Chrome's CDP allows to do this, it should be no issue on the WebView2 side, they just need to provide the API and make it work and that's it.

[champnic]

@darkguy2008 Are you able to share the CDP technique you mentioned?
https://chromedevtools.github.io/devtools-protocol/

You should be able to call into CDP directly through the WebView2:
https://docs.microsoft.com/en-us/dotnet/api/microsoft.web.webview2.core.corewebview2.calldevtoolsprotocolmethodasync?view=webview2-dotnet-1.0.1264.42#microsoft-web-webview2-core-corewebview2-calldevtoolsprotocolmethodasync(system-string-system-string)

[TranquilleXav]

@darkguy2008 i already use this technology.
i catch the dialogbox and i secure it.
but I wanted something simpler and more integrated...

I saw that there is a setting to block all dialog boxes (AllowFileSelectionDialogs) but that's not what i want...

[RustyStriker]

For all of those who stumble upon this issue and wonder how you can indeed do it for now, it is indeed possible to do with CDP(Chrome DevTools Protocol)
You can also use the WebView2.DevToolsProtocolExtension for easier integration.

If you go this route you will need to do the following(assuming use of the dev tools extension):

• After initializing the browser(EnsureCoreWebView2Async) you will want to get the devtools helper with
  var helper = CoreWebView2.GetDevToolsProtocolHelper()
• Enable DOM and Page with helper.Page.EnableAsync() and helper.DOMEnableAsync()
• enable Page.interceptFileChooserDialog with helper.Page.SetInterceptFileChooserDialogAsync(true)
• listen to the helper.Page.FileChooserOpened event
• when an event is executed, use
  helper.DOM.SetFileInputFilesAsync(files, null, BackendNodeId from the event arguments)

tho it seems to crash when the event call is taking too long, so if you just want to intercept some you might want to enable the interception(step 3) only when you need it and disable it later

[Karrtojal]

Hello, Any update for this feature?
I've tried the RustyStriker solutions and capture the event ok. But after capture it, if I want that continue the opening of the file picker dialog... I can't find the way. Somenthing like e.Handle=true. Example:

_await this.webView.EnsureCoreWebView2Async(null);
this.helper = this.webView.CoreWebView2.GetDevToolsProtocolHelper();
this.webView.CoreWebView2.Navigate(this.appURL);
await helper.Page.EnableAsync();
await helper.DOM.EnableAsync();
await helper.Page.SetInterceptFileChooserDialogAsync(true);
helper.Page.FileChooserOpened += Page_FileChooserOpened;

private async void Page_FileChooserOpened(object sender, Page.FileChooserOpenedEventArgs e)
{
if (I want to choose natural filepicker) {
e.continue()
}
else
{
return;
}_

[FrancoisBOTTE]

Hello all, actually, impossible to use DevToolsProtocolExtension in UWP application. I try to use CDP directly through the WebView2 like this :

var x = await this.webview.CoreWebView2.CallDevToolsProtocolMethodAsync("Page.setInterceptFileChooserDialog", "{"enabled" : true}");

But without success. @TranquilleXav it seems you re use this method with success. Can you help me ? Many thanks.

Up for this feature please, ty

[TranquilleXav]

Hello @FrancoisBOTTE ,
i don't use CallDevToolsProtocolMethodAsync ... I haven't tried this technique yet.
for the moment, i catch the dialogbox with another technology (WinAPI )...
Sorry!

[FrancoisBOTTE]

@TranquilleXav thank for the answer. Can you describe quickly or send me an entry for your solution ? I try with CallDevToolsProtocolMethodAsync but i have too many issues with this. Ty

[TranquilleXav]

i think it's not possible with UWP application, i use hooks, and resources id, and i modify property... sorry for my pauvre english :-)

[FlirtChatX]

When can it be used?