Thursday, December 23, 2021

Receiving web messages and making screenshots for WebView2 inside WinUI 3 in Desktop project (Part 5)

In Part 4 we discussed injecting Javascript into a web page and printed WebView2 content with the help of Javascript. Now let's talk about receiving web messages from a page and also let's make screenshots of some web page.

Here is the code for receiving web message. Note that WebMessageReceived is raised when the IsWebMessageEnabled setting is set and the top-level document of the WebView runs

webView.CoreWebView2.WebMessageReceived += CoreWebView2_WebMessageReceived;

private void CoreWebView2_WebMessageReceived(CoreWebView2 sender, CoreWebView2WebMessageReceivedEventArgs args)
    var message = args.WebMessageAsJson;

    // do whatever you need

Now let's add one more button for making screenshots. CapturePreviewAsync allows to capture of what WebView2 is displaying.
private async void makeScreenshotButton_Click(object sender, RoutedEventArgs e)
    using (InMemoryRandomAccessStream stream = new InMemoryRandomAccessStream())
        await webView.CoreWebView2.CapturePreviewAsync(CoreWebView2CapturePreviewImageFormat.Png, stream);
        // here you can add saving to a file or copying to clipboard