How to create new webView2 window using NewWindowRequested ?

[53b4]

Hello,
I spent some time to find out how should I properly handle event NewWindowRequested and create new webView2 window, but without sucess. So, please help - maybe somebody will add here simple working example.
Regardin this @david-risney SO answer: https://stackoverflow.com/questions/65087294/how-do-i-get-reference-to-the-new-window-in-webview2/65132490#65132490

I am intereset scenario number 4 - I want to create my own WPF or WindowForms child window.
So, what I am doing (WindowsForm example):

1. during loading main form :

private async void Form1_Load(object sender, EventArgs e)
		{
			webViewEnvironment = await CoreWebView2Environment.CreateAsync();

			webView = new WebView2();
			webView.Dock = DockStyle.Fill;

			webView.CoreWebView2InitializationCompleted += WebView_CoreWebView2InitializationCompleted;
			
			Controls.Add(webView);

			await webView.EnsureCoreWebView2Async();
		}

2. handling WebView_CoreWebView2InitializationCompleted

private async void WebView_CoreWebView2InitializationCompleted(object sender, CoreWebView2InitializationCompletedEventArgs e)
		{
			if (!e.IsSuccess) return;

			webView.CoreWebView2.NewWindowRequested += CoreWebView2_NewWindowRequested;

			webView.CoreWebView2.Settings.AreDevToolsEnabled = true;  
			webView.CoreWebView2.Settings.IsWebMessageEnabled = true;

			Controls.Add(webView);

			await webView.EnsureCoreWebView2Async();
			webView.Source = new Uri("https://google.com");
		}

3. handling CoreWebView2_NewWindowRequested
   `
   private async void CoreWebView2_NewWindowRequested(object sender, CoreWebView2NewWindowRequestedEventArgs e)
   {
   var newForm = new Form();
   newForm.Text = "New Window";
   newForm.Size = new Size(1000, 800);

    	var newWebView = new WebView2();
    	newWebView.Dock = DockStyle.Fill;
   
    	CoreWebView2Environment ce = CoreWebView2Environment.CreateAsync().Result;
   
    	newWebView.CoreWebView2InitializationCompleted += async (s, args) =>
    	{
    		if (!args.IsSuccess) return;
    		MessageBox.Show("new window initialization completed !");
    		newWebView.CoreWebView2.NavigationCompleted += CoreWebView2_NavigationCompleted; //for diagnostic only
    		newWebView.CoreWebView2.NavigationStarting += CoreWebView2_NavigationStarting; //for diagnostic only
    		e.NewWindow = newWebView.CoreWebView2;
    		newWebView.Source = new Uri(e.Uri);
    	};
   
    	await newWebView.EnsureCoreWebView2Async(ce);
    	e.Handled = true;
    }
   

`

After start application, I go to Console in DevTools (Ctr + Shift + J) and type: var win = window.open("http://bing.com", "_blank", "location=yes,height=570,width=820,scrollbars=yes,status=yes");
so I'm trying to force open new webView2. I see that CoreWebView2_NewWindowRequested is triggerred but window doesnt opened.; I have an open "empty" window (just a frame? see the upper right corner of the screen) that has been closed after a few seconds, and the main window is also starting to be empty:

after few second:

So, maybe somebody know how to do it properly ? pls help

Regards,
Sebastian

[david-risney]

You're mostly on the right track. But there's a couple of issues with your NewWindowRequested handler:

• Connect the new WebView2 to your new window. In your NewWindowRequested handler you create a new WebView2 and a new Form but I don't see you placing that WebView2 into your new Form window. The NewWindowRequested event from WebView2 wants you to setup a new CoreWebView2 somewhere appropriate for however your app wants to handle new windows.
• Don't create a new environment synchronously. Perhaps it will happen to work, but you really shouldn't do CreateAsync().Result which will perform a synchronous blocking wait for the environment to be created. This may result in deadlock. More info is in WebView2 Threading Model - Blocking the UI thread.
• Reuse the existing environment. You are creating a new environment, but really you should be reusing the existing environment you already have. The 'sender' object in your NewWindowRequested event handler should be the CoreWebView2 that is raising the NewWindowRequested event and it has an Environment property that you should use. The web platform requires that in order for the two windows to have a connection they must be in the same set of processes which in the WebView2 case means in the same CoreWebView2Environment.
• Use a deferral to perform async work in an event handler. You setup a CoreWebView2InitializationCompleted event handler and you have an await in your event handler, but unless you use the EventArgs.GetDeferral() method to get a deferral the event will be considered completed after synchronous execution completes and your changes to EventArgs.NewWindow won't be examined. See WebView2 Threading Model - Deferral for more information on using deferrals to perform async work in an event handler.

Additional good information about setting the NewWindow property

One other thing I'd note is that you usually don't need to use both CoreWebView2InitializeCompleted and EnsureCoreWebView2Async. There's two ways the WebView2 control can initialize its CoreWebView2. The first is if you set the Source property on the WebView2 - this will implicitly begin initialization (and navigation) of the WebView2's CoreWebView2 when the control is initialized. If you don't set the Source property then you need to call EnsureCoreWebView2Async. The CoreWebView2InitializeCompleted event will be raised in either case although its intent is to be used when you are setting the Source property. If you are calling EnsureCoreWebView2Async then when that method asynchronously completes the CoreWebView2 is initialized and you can run code after the call completes. So you don't usually also need the CoreWebView2InitializeCompleted handler.

[53b4]

Hello all,
Thanks @david-risney for your answer and hints.
After some investigation I finally sucess and open second webView2, but not as modal dialog;
Current implementation (is ok ? ):

  private async void CoreWebView2_NewWindowRequested(object sender, CoreWebView2NewWindowRequestedEventArgs e)
        {
            var deferral = e.GetDeferral();  //using deferral
            
            var newForm = new Form();

            newForm.Text = "New Window";
            newForm.Size = new Size(800, 600);

            var newWebView = new WebView2();
            newWebView.Dock = DockStyle.Fill;
            newForm.Controls.Add(newWebView);  //add new webWebView2 to newForm

            CoreWebView2 coreWebView2 = sender as CoreWebView2;
            CoreWebView2Environment ce = coreWebView2?.Environment;  //from sender get existing env

            //CoreWebView2Environment ce = await CoreWebView2Environment.CreateAsync();

            newWebView.CoreWebView2InitializationCompleted += async (s, args) =>
            {
                MessageBox.Show($"new window initialization completed ! dialog uri: {e.Uri}");
                newWebView.NavigationStarting += NewWebView_NavigationStarting; //diagnostic event
                newWebView.NavigationCompleted += NewWebView_NavigationCompleted; //diagnostic event
                newWebView.Source = new Uri(e.Uri);  //probably not necessary 
                e.NewWindow = newWebView.CoreWebView2;
            };

            await newWebView.EnsureCoreWebView2Async(ce); //
            newForm.Show();  //working only when Show();  when ShowDialog() it shows only empty form 
            e.Handled = true;
            deferral.Complete(); //complete deferral 
        }

What is interesting here (and it took me some time to find that is the reason) - when I try to display new form as dialog and use method newForm.ShowDialog(); , loading new uri (in this case https://bing.com ) stops and form stays empty.
Seems (because I got diagnostic message from NewWebView_NavigationStarting and NewWebView_NavigationCompleted ) that it page is loading when I close this new modal dialog .
What is reason of such behavior ? Is possible to display new webView2 window as modal dialog ?

regards,
Sebastian

[tubakhxn]

To create a new WebView2 window using the NewWindowRequested event, you can follow these general steps:

1. Handle the NewWindowRequested event: Subscribe to the NewWindowRequested event of your existing WebView2 instance.
2. Create a new WebView2 instance for the new window: When the event is triggered, create a new instance of WebView2 for the new window.
3. Manage the new window: Handle the new window instance appropriately, whether you want to display it in a separate window, tab, or within the same application window.
   Here's a basic example in C#:

csharp

using Microsoft.Web.WebView2.Core;
using System.Windows;

namespace WebView2Demo
{
    public partial class MainWindow : Window
    {
        public MainWindow()
        {
            InitializeComponent();
            webView2.CoreWebView2InitializationCompleted += WebView2_CoreWebView2InitializationCompleted;
        }

        private async void WebView2_CoreWebView2InitializationCompleted(object sender, CoreWebView2InitializationCompletedEventArgs e)
        {
            if (e.IsSuccess)
            {
                webView2.NewWindowRequested += WebView2_NewWindowRequested;
            }
        }

        private async void WebView2_NewWindowRequested(object sender, CoreWebView2NewWindowRequestedEventArgs e)
        {
            // Create a new instance of WebView2
            var newWebView = new WebView2();
            await newWebView.EnsureCoreWebView2Async();

            // Handle the new window according to your requirements
            // For example, you might open it in a new window or a new tab
            // For simplicity, let's just open it in a new window
            var newWindow = new Window
            {
                Content = newWebView,
                Width = 800,
                Height = 600
            };
            newWindow.Show();

            // Navigate the new WebView2 to the requested URI
            newWebView.CoreWebView2.Navigate(e.Uri);
            
            // Mark the event as handled
            e.Handled = true;
        }
    }
}

In this example, when a new window is requested (NewWindowRequested event), a new instance of WebView2 is created and loaded with the requested URI. Then, it's displayed in a new Window instance. Finally, the event is marked as handled (e.Handled = true) to prevent the default behaviour.