MicrosoftEdge / DevTools

Feedback and discussions about Microsoft Edge Developer Tools
MIT License
154 stars 50 forks source link

Device Emulation Missing in WebView2 Dev Tools #134

Open cartmouse opened 1 year ago

cartmouse commented 1 year ago

I'm using Tauri to develop an application that will be run in a few fixed resolutions and the device emulation tool is extremely helpful in the development process to quickly test these resolutions (and also when developing more generic responsive applications).

Tauri uses WebView2 to render the web app and when using the dev tools on Windows, the "device emulation" option is missing. Without access to this feature, testing in various layouts and resolutions is quite arduous.

Is there any scope for adding this functionality or is this a hard limitation of using Edge as part of WebView2?

AB#43526862

captainbrosset commented 1 year ago

My understanding is that device emulation only works in the context of a true browser window. Although WebView2 uses the Edge rendering engine, it doesn't include the browser UI which, for now, is necessary to use device emulation.

I'll raise this with the team internally for discussion/prioritization. There is probably a case to be made for exposing the Dimensions drop-down that's normally inside the device emulation UI also in the main DevTools UI somewhere, therefore making it available to all scenarios, including WebView2.

JordanBerni-UL commented 1 year ago

Ran into this issue as well 👍 + 1 for the proposed solution

drbsoftware commented 8 months ago

We have this problem as well. It would also be useful if device emulation could be controlled through the API.

captainbrosset commented 8 months ago

Thanks for commenting. This issue is still sitting on our backlog and hasn't yet been prioritized. But every message (with detailed use case explanation if possible) helps.

drbsoftware commented 8 months ago

We have two situations which use a WebBrowser in a .NET application. • Layout Designer • Hybrid applications

Layout Designer. All of our applications are generated by a Modeler written in .NET. The Modeler includes a Layout Designer which displays the application's layout in a WebBrowser. We are already doing some limited device emulation but having the WebBrowser do it for us would be a great help.

Hybrid Applications. We deploy some of our applications as hybrid apps, that is, a web app plus its backend code, running as a desktop app using WebBrowser. It would be very useful to test these apps using various device emulations.

drbsoftware commented 8 months ago

navigator.userAgent is read-only. Is there a way to set the contents in WebView2?

captainbrosset commented 8 months ago

Thanks for giving details in the previous comment.

navigator.userAgent is read-only. Is there a way to set the contents in WebView2?

I don't think you can do this. But this is a question that should be asked on https://github.com/MicrosoftEdge/WebView2Feedback instead.

s72ma18 commented 2 weeks ago

Please add the ability to simulate devices. I need it to debug mini-apps in Telegram.

It's interesting that the simulation section is present in the settings.