Login to websites does not work

[fisfra]

I integrated a webview2 control into a WPF window. That worked fine in general. When I try to login a site which requires Google reCaptcha - this does unfortunately not work. I also tried the WebView2Samples project - the login dit not work either (I think the images from Google reCaptcha do not show).

Any idea?

Site is e.g. https://contributor-accounts.shutterstock.com/login

AB#29504496

[ukandrewc]

OK on Winforms:

[fisfra]

OK on Winforms:

I re-check it with the Forms Sample code and I cannot confirm - it does not work for me. It might depend if reCAPTCHA needs to open a popup with photos which it does for me if I run Edge standalone.

[cgeier]

Is the screen just blank? You may be encountering issue #431. Compile as 64-bit (Any CPU with Prefer 32 bit unchecked), or x64. See the post for more details.

[champnic]

@cgeier They included a screenshot of what I assume is their app, so it looks more like a popup issue.

@fisfra Are you handling the NewWindowRequested event at all? If you are, could you remove the handler and see if that fixes it temporarily?

I tried to repro this, but unfortunately I can't get it to require the popup - it always just accepts that I'm not a robot. 🤖
I've opened a bug and we'll take a further look. Thanks!

[cgeier]

@champnic Guess that I missed that the image was from an app using WebView2 rather than from MS Edge. Since the WebView2Samples project is being used, perhaps NewWindowRequested has been subscribed to and there is code in the NewWindowRequested event handler, as you mentioned.

@fisfra Ensure you're using WebView2 version 0.9.628-prerelease with MS Edge version 87.0.628.0 (or higher). By default, WebView2 will use the most stable (oldest) version of MS Edge. If you have MS Edge Beta and MS Edge Dev installed. It will use MS Edge Beta. Also comile using the same bitness of your OS. If you're using Windows 64-bit, compile using x64 or Any CPU with Prefer 32 bit unchecked (see issue 431 for more info).

Try the following code:

MainWindow.xaml

<Grid>
    <Grid.RowDefinitions>
        <RowDefinition Height="30"/>
        <RowDefinition Height="5"/>
        <RowDefinition Height="*"/>
        <RowDefinition Height="5"/>
    </Grid.RowDefinitions>

    <Grid>
        <Grid.ColumnDefinitions>
            <ColumnDefinition Width="5"/>
            <ColumnDefinition Width="50"/>
            <ColumnDefinition Width="5"/>
            <ColumnDefinition Width="50"/>
            <ColumnDefinition Width="5"/>
            <ColumnDefinition Width="50"/>
            <ColumnDefinition Width="5"/>
            <ColumnDefinition Width="35"/>
            <ColumnDefinition Width="5"/>
            <ColumnDefinition Width="30"/>
            <ColumnDefinition Width="5"/>
            <ColumnDefinition Width="250*"/>
            <ColumnDefinition Width="5"/>
            <ColumnDefinition Width="40"/>
            <ColumnDefinition Width="10"/>
        </Grid.ColumnDefinitions>

        <Button Grid.Row="0" Grid.Column="1" x:Name="btnBack" Click="btnBack_Click"  Content="Back"  HorizontalAlignment="Stretch" Height="22"/>
        <Button Grid.Row="0" Grid.Column="3" x:Name="btnForward" Click="btnForward_Click"  Content="Forward" HorizontalAlignment="Stretch" Height="22"/>
        <Button Grid.Row="0" Grid.Column="5" x:Name="btnRefresh" Click="btnRefresh_Click"  Content="Refresh" HorizontalAlignment="Stretch" Height="22"/>
        <Button Grid.Row="0" Grid.Column="7" x:Name="btnStop" Click="btnStop_Click"  Content="Stop" HorizontalAlignment="Stretch" Height="22"/>
        <Label Grid.Row="0" Grid.Column="9">URL:</Label>
        <TextBox Grid.Row="0" Grid.Column="11" Name = "textBoxAddressBar" HorizontalAlignment="Stretch" VerticalAlignment="Center" MinWidth="250"  KeyDown="textBoxAddressBar_KeyDown">https://www.microsoft.com</TextBox>
        <Button Grid.Row="0" Grid.Column="13" x:Name="btnGo" Click="btnGo_Click"  Content="Go" HorizontalAlignment="Stretch" Height="22"/>
        
    </Grid>

        <wv2:WebView2 Grid.Row="2" 
                      Name="webView21"
                      CoreWebView2Ready="webView21_CoreWebView2Ready" />
    </Grid>
</Window>

When started, it will show a MessageBox showing the version of MS Edge being used by WebView2. To get rid of the MessageBox, comment out:

MessageBox.Show("MS Edge Version: " + Microsoft.Web.WebView2.Core.CoreWebView2Environment.GetAvailableBrowserVersionString(), "MS Edge Version", MessageBoxButton.OK, MessageBoxImage.Information); 

in the Window_Loaded event handler in MainWindow.xaml.cs.

MainWindow.xaml.cs

using System;
using System.Collections.Generic;
using System.Linq;
using System.Text;
using System.Threading.Tasks;
using System.Windows;
using System.Windows.Controls;
using System.Windows.Data;
using System.Windows.Documents;
using System.Windows.Input;
using System.Windows.Media;
using System.Windows.Media.Imaging;
using System.Windows.Navigation;
using System.Windows.Shapes;
using Microsoft.Web.WebView2.Wpf;
using Microsoft.Web.WebView2.Core;
using System.Diagnostics;


namespace WebView2Test
{
    /// <summary>
    /// Interaction logic for MainWindow.xaml
    /// </summary>
    public partial class MainWindow : Window
    {
        public MainWindow()
        {
            InitializeComponent();
        }

        private async void Window_Loaded(object sender, RoutedEventArgs e)
        {
            Debug.WriteLine("Info: before InitializeCoreWebView2Async");

            //initialize CoreWebView2
            //don't set Source property in MainWindow.xaml 
            //as this causes CoreWebView2 initialization to occur.
            //set it here instead
            await InitializeCoreWebView2Async();
            Debug.WriteLine("Info: after InitializeCoreWebView2Async");

            //https://github.com/MicrosoftEdge/WebViewFeedback/issues/432
            webView21.UpdateWindowPos();

            //set Source property - navigate to URL
            //webView21.Source = new Uri("https://www.microsoft.com", UriKind.Absolute);
            webView21.Source = new Uri("https://contributor-accounts.shutterstock.com/login", UriKind.Absolute);

            Debug.WriteLine("MS Edge Version: " + Microsoft.Web.WebView2.Core.CoreWebView2Environment.GetAvailableBrowserVersionString());
            MessageBox.Show("MS Edge Version: " + Microsoft.Web.WebView2.Core.CoreWebView2Environment.GetAvailableBrowserVersionString(), "MS Edge Version", MessageBoxButton.OK, MessageBoxImage.Information);
        }

        public async Task InitializeCoreWebView2Async()
        {
            Debug.WriteLine("Info: before EnsureCoreWebView2Async");

            //wait for CoreWebView2 initialization
            await webView21.EnsureCoreWebView2Async();

            Debug.WriteLine("Info: after EnsureCoreWebView2Async");

        }

        public async Task InitializeCoreWebView2Async(WebView2 wv, string webCacheDir = "")
        {
            CoreWebView2EnvironmentOptions options = null;
            string tempWebCacheDir = string.Empty;
            CoreWebView2Environment webView2Environment = null;

            //set value
            tempWebCacheDir = webCacheDir;

            if (String.IsNullOrEmpty(tempWebCacheDir))
            {
                //get fully-qualified path to user's temp folder
                tempWebCacheDir = System.IO.Path.GetTempPath();

                tempWebCacheDir = System.IO.Path.Combine(tempWebCacheDir, System.Guid.NewGuid().ToString("N"));
            }

            //webView2Environment = await CoreWebView2Environment.CreateAsync(@"C:\Program Files (x86)\Microsoft\Edge Dev\Application\85.0.564.8", tempWebCacheDir, options);
            webView2Environment = await CoreWebView2Environment.CreateAsync(null, tempWebCacheDir, options);

            //wait for CoreWebView2 initialization
            await wv.EnsureCoreWebView2Async(webView2Environment);

            System.Diagnostics.Debug.WriteLine("Cache data folder set to: " + tempWebCacheDir);
        }

        private void WebsiteNavigate(WebView2 wv, string dest)
        {
            //set value
            string tempDest = dest;

            if (wv != null && wv.CoreWebView2 != null)
            {
                if (!String.IsNullOrEmpty(dest))
                {
                    if (dest != "about:blank" &&
                        !dest.StartsWith("edge://") &&
                        !dest.StartsWith("file://") &&
                        !dest.StartsWith("http://") &&
                        !dest.StartsWith("https://"))
                    {
                        //URL must start with one of the specified strings
                        //if not, pre-pend with "http://" or "https://"
                        //set value
                        tempDest = "http://" + dest;
                    }

                    //option 1
                    wv.CoreWebView2.Navigate(tempDest);

                    //option 2
                    //wv.Source = new Uri(tempDest, UriKind.Absolute);
                }
            }
        }
        private void btnBack_Click(object sender, RoutedEventArgs e)
        {
            if (webView21 != null && webView21.CanGoBack)
            {
                webView21.GoBack();
            }
        }

        private void btnForward_Click(object sender, RoutedEventArgs e)
        {
            if (webView21 != null && webView21.CanGoForward)
            {
                webView21.GoForward();
            }
        }

        private void textBoxAddressBar_KeyDown(object sender, KeyEventArgs e)
        {
            if (e.Key == Key.Enter)
            {
                WebsiteNavigate(webView21, textBoxAddressBar.Text);
            }
        }

        private void btnGo_Click(object sender, RoutedEventArgs e)
        {
            WebsiteNavigate(webView21, textBoxAddressBar.Text);
        }

        private void btnStop_Click(object sender, RoutedEventArgs e)
        {
            if (webView21 != null)
            {
                webView21.Stop();
            }
        }

        private void CoreWebView2_HistoryChanged(object sender, object e)
        {
            btnBack.IsEnabled = webView21.CanGoBack;
            btnForward.IsEnabled = webView21.CanGoForward;
        }

        private void CoreWebView2_NavigationCompleted(object sender, CoreWebView2NavigationCompletedEventArgs e)
        {

        }
        private void webView21_CoreWebView2Ready(object sender, EventArgs e)
        {
            Debug.WriteLine("Info: webView21_CoreWebView2Ready");

            //subscribe to events (add event handlers) - CoreWebView2
            webView21.CoreWebView2.HistoryChanged += CoreWebView2_HistoryChanged;
            webView21.CoreWebView2.NavigationCompleted += CoreWebView2_NavigationCompleted;

            //subscribe to events (add event handlers) - WebView2
            webView21.NavigationCompleted += WebView21_NavigationCompleted;
            webView21.NavigationStarting += WebView21_NavigationStarting;

            Debug.WriteLine("Info: leaving webView21_CoreWebView2Ready");

        }

        private void WebView21_NavigationCompleted(object sender, CoreWebView2NavigationCompletedEventArgs e)
        {

        }

        private void WebView21_NavigationStarting(object sender, CoreWebView2NavigationStartingEventArgs e)
        {
            //set value
            //updates the URL in the address bar,
            //when the Back or Forward button is clicked
            textBoxAddressBar.Text = e.Uri.ToString();

            //set cursor to end of text
            textBoxAddressBar.SelectionStart = textBoxAddressBar.Text.Length;
            textBoxAddressBar.SelectionLength = 0;
        }

        private void btnRefresh_Click(object sender, RoutedEventArgs e)
        {
            if (webView21 != null)
            {
                webView21.Reload();
            }
        }
    }
}

Here's the complete project: WebView2Test.zip

• Release notes for WebView2 SDK
• Microsoft Edge Insider Channels

[fisfra]

Is the screen just blank? You may be encountering issue #431. Compile as 64-bit (Any CPU with Prefer 32 bit unchecked), or x64. See the post for more details.

No the screen is not blank, The Recaptcha is just not working. The "wait cursor" animation is showing a couple of seconds and and the the recaptcha screen shows again. There is no popup appearing (which can be used for selection to correct images to solve the recaptcha)

[fisfra]

@cgeier They included a screenshot of what I assume is their app, so it looks more like a popup issue.

@fisfra Are you handling the NewWindowRequested event at all? If you are, could you remove the handler and see if that fixes it temporarily?

I tried to repro this, but unfortunately I can't get it to require the popup - it always just accepts that I'm not a robot. 🤖
I've opened a bug and we'll take a further look. Thanks!
@champnic: No, I am not handling that event. I also tried the sample from the MS Website and it has the same issue.

[fisfra]

@cgeier: Thanks for your suggestion. I will try it later that week and let you know if it works.