How can I add WebView2 control in Visual Studio Toolbar?

Question

In Visual Studio 2019, using Nuget, I have installed Microsoft.Web.WebView2 package.

PM> Install-Package Microsoft.Web.WebView2 -Version 0.9.430

As explained on Web, I have installed new Microsoft Edge Chromium Canary version (it is important).

Now, when I open the Toolbox, I don't see any WebView2 control.

Before that, I have installed WebView control (old version that is working with old Edge browser).

After installing WebView, the control has been visible immediately in Toolbox.

But this is not the case with WebView2 control.

I have tried to add in Toolbox all controls from Microsoft.Web.WebView2 package manually.

But Visual Studio refuses to load WebView2Loader.dll found in following folder

C:\Users\bernard\.nuget\packages\microsoft.web.webview2\0.9.430\build\x86

I have also tried with DLL found in

C:\Users\bernard\.nuget\packages\microsoft.web.webview2\0.9.430\build\x64

Is there possible to install WebView2 control in Toolbox ?

If yes, how ?

Solution 1

EDIT: According to this post you need to use Canary or Dev build of Edge or the Edge WebView2 Preview no matter what version is supposed to work according to the release notes.

The main reason people have this problem is because they have not installed the required version of Edge.

Check the release notes. For each release you see the "minimum Microsoft Edge version". For example, when you install the latest WebView2 release 0.9.579 (released 07/20/2020) it requires Edge 86.0.579.0

but the official Edge build is (on that day) 84.0.522.

So the answer is:

• either update Edge to a newer version
• or use an older version of Microsoft.Web.WebView2. For which you likely need to enable prereleases:

Important: Do not downgrade! Uninstall WebView2 Nuget package, restart VS, install an older version of it, to be on the safe side.

Solution 2

I also had this problem. I followed the instructions in the Getting Started tutorial:

https://docs.microsoft.com/en-us/microsoft-edge/webview2/gettingstarted/winforms

and installed Canary Edge as well, but the controls were still not appearing. However, it is interesting that the Microsoft.Web.WebView2.WinForms references were not showing up in the References of my Windows Form project initially. They are now appearing, but it is not clear why any of the following steps were necessary after initially simply using Nuget to installing Canary and the latest version of the WebView2 control.

1. After reinstalling Canary, restart Windows
2. Clean Project
3. In Manage Nuget packages, reinstall the WebView2 package to a lower version (I used the prelease of the current version, 0.9.538-prerelease)

After the third step, the library references to the WebView2 control appeared in my project References for the first time, and I was able to use them in the Form Designer.

NOTE: trying to update the control to the release version on 0.9.538 caused the references to disappear from the References and the WebView2 control was no longer available to the Form Designer. Reinstalling the prerelease solved the issue, so it appears the release of 0.9.538 supports a smaller scope than its prerelease.

TL;DR: do not update to the latest version of 0.9.538, just use the 0.9.538-prerelease.

Solution 3

You need to make sure that you select the checkbox "include prerelease" next to the text box for searching for packages by name. Then select a version which has a prerelease label.

Solution 4

Even after using the prerelease version, it was not showing in my toolbox in Visual Studio 2017 Community edition 16.6.6

My solution was to do the following:

1. Right-click on the toolbar in Visual Studios
2. Select 'Choose Items...'
3. Click the '.NET Framework Components' tab
4. Click 'Browse', may have to wait for scan to finish
5. Navigate to '\packages\Microsoft.Web.WebView2.0.9.538-prerelease\lib\net462'
6. Select the correct DLL for your application type
7. Once the file is selected click the 'OK' button in the window

Solution copied from here: https://developercommunity.visualstudio.com/content/problem/1112781/webview2-control-is-missing-from-toolbox.html

Solution 5

You can now do this in C#. Just tested in WinForms.

https://docs.microsoft.com/en-us/microsoft-edge/webview2/gettingstarted/winforms

You must also download the Canary version of the browser from here: https://www.microsoftedgeinsider.com/en-us/download

View more solutions

Comments

[schlebe]

Thank. I thougt that this package is also for .net but it seems that is not the case.

[duck]

See my answer below - WebView2 is now supported

[Jim Wilcox]

How did you get the WebView2 component to show up in your tool box?

[Manish Gupta]

This worked for me. Thanks. Make sure to select "include prerelease" and then select "0.9.538-prerelease" to install it.

[MattPerry]

As of today, you need to select a prerelease version. "0.9.538" does not work with .net. "0.9.538-prerelease" does work. Good luck.

[Jack Miller]

This answer is obsolete. @schlebe Please select a current one.

[Johan Danforth]

This has been the most successful way of getting it into the toolbox for me. I've had to add it again and again for each new project :)