search

microsoft / microsoft-ui-xaml

Windows UI Library: the latest Windows 10 native controls and Fluent styles for your applications
MIT License
6.32k stars 676 forks source link

Cannot drop files from Explorer into WebView2 in a WinUI3 app #7366

Closed michaelcapps closed 1 year ago

michaelcapps commented 2 years ago

Describe the bug

When using a WebView2 in a WinUI3 application the drag and drop files from File Explorer into the WebView2 functionality behaves strangely. When displaying a page that is capable of receiving files (via copy when dropping, ex: https://www.remove.bg/ ) initially I am unable to drop files into the browser at all (a red circle with a link through it appears). However, if I click into the browser to manually choose a file through the explorer/file picker, this enables the usual drag and drop behavior, even after that explorer is closed. If I then minimize the application and maximize it again (or interact with a non-browser UI element, such as clicking a button to open a flyout), I am unable to drag and drop again.

Steps to reproduce the bug

Make a new blank WinUI3 project and replace the default button with a WebView2, and set the source to a page that has a file drop control on it (such as remove.bg). Try to drag an image from File Explorer into the browser.

Expected behavior

Dragging files from the file explorer into the browser copies the file to the app.

Screenshots

No response

NuGet package version

WinUI 3 - Windows App SDK 1.1.2

Windows app type

Device form factor

Desktop

Windows version

Windows 10 (21H2): Build 19044

Additional context

I reported this in the WebView2 repo and they directed me here (https://github.com/MicrosoftEdge/WebView2Feedback/issues/2546 ). This is not a new bug, it has been occurring since at least 0.8.

michaelcapps commented 2 years ago

Any update on this? Issue persists in WindowsAppSDK 1.2.220909.2-experimental2

kbuckinx commented 1 year ago

I see the same behaviour in WindowsAppsSDK version 1.2.221109.1

michaelcapps commented 1 year ago

Still seeing this in the latest stable 1.2 version and in the prerelease 1.3.230202101-experimental1 version.

koenvd commented 1 year ago

Would be nice if we could get this somehow on the roadmap to get fixed @bpulliam .

koenvd commented 1 year ago

Wondering if this could get some attention @gabbybilka ? Would be awesome to get this fixed.

scottkuhl commented 1 year ago

This is a big bug for adopting MAUI Blazor Hybrid apps.

codendone commented 1 year ago

internal task

maxibyte commented 1 year ago

@codendone

When can we expect a fix? The UX of all .NET Maui Blazor Hybrid apps is very much affected by this bug and many developers would be very happy to see a fix. Besides, the bug has been known for a year now and it's really about time. The worst part is that there is not even a workaround.

https://github.com/dotnet/maui/issues/2205 https://github.com/MicrosoftEdge/WebView2Feedback/issues/2805 https://github.com/dotnet/maui/issues/7390 https://www.reddit.com/r/dotnetMAUI/comments/10sk5kr/im_considering_giving_up_on_maui_blazor_hybrid/ https://stackoverflow.com/questions/73197778/net-maui-blazor-app-drag-and-drop-impossible ...

codendone commented 1 year ago

@maxibyte Work is currently in progress on this, but there have been a series of issues and it is currently unclear how many more issues need to be solved to get this working. There also might still be fundamental blockers which could require larger feature work. In short, timeline isn't yet clear, other than the good news that this is currently being worked on.

koenvd commented 1 year ago

Wondering if there's already a better view on timeline when a fix would become available? Thanks!

RicoSuter commented 1 year ago

This is a huge blocker for us - we use Blazor + MAUI to build a desktop app and this is now preventing us to use drag and drop in the app. It's not just a tiny feature but everything drag and drop related cannot be done...

Ref: https://github.com/MicrosoftEdge/WebView2Feedback/issues/2805

michaelcapps commented 1 year ago

I just tested this in 1.4.230913002 and it's still broken, so I don't know why this was marked as fixed.

ranjeshj commented 1 year ago

@michaelcapps this is fixed in main branch so the fix will be available in the next release from main (1.5 experimental)

michaelcapps commented 1 year ago

@michaelcapps this is fixed in main branch so the fix will be available in the next release from main (1.5 experimental)

Ah I completely missed it being added to the 1.5 milestone, sorry about that. Thank you!

koenvd commented 6 months ago

Based on release notes https://learn.microsoft.com/en-us/windows/apps/windows-app-sdk/stable-channel#version-15-1 this got moved to 1.6 @codendone ? But is there any timeline around that already available?

codendone commented 6 months ago

@koenvd It looks like we missed some detailed in the release notes:

R-Vulcan commented 2 months ago

I find that with MAUI Blazor Hybrid its still not possible to drag a file onto a html file input element.

I recently ported a Blazor WASM app to Blazor Hybrid and the file input drag drop stopped working. I use MudBlazor but I've been able to reproduce this with the native element and InputFile in a separate project, just adding the input to the default Blazor Hybrid template.

.NET8 + Microsoft.AspNetCore.Components.WebView 8.0.71 -> Microsoft.WindowsAppSDK 1.5.240607001