如何从 WPF WebBrowser 控件调试页面的 JavaScript 代码

Question

我有一个 WPF WebBrowser 控件，我在我的 wpf 客户端应用程序中使用它来导航到不同的页面。它具有调用 this.webbrowser.goback()、this.webbrowser.goforward()、this.webbrowser.go() 等基本功能。

虽然 Web 应用程序可以在 IE 上正常工作，这意味着不止一个级别的所有前进和后退导航。超过一个级别的导航在我的 WPF 应用程序中的一个页面（具有联系人链接的 Billings 和联系人页面我们有地址链接。）点击我的地址页面上的后退按钮时，它会转到联系人页面，但点击联系人页面上的后退按钮不会转到结算页面。

由于它在 IE 中运行良好，没有任何问题，我怀疑我的 WPF 应用程序有问题。我这里有几个问题。

1. webbrowser.goback() 和 IE 的后退按钮一样吗？或者与 IE 相比，wpf webbrowser 控件中会遗漏任何事件？
2. 有什么方法可以从 WPF 应用程序本身调试 javasctipts 吗？
3. 有没有更好的方法从 WPF 应用程序中调试此类场景？
4. IE 是将 WPF WebBrowser 导航存储在其历史记录中还是单独的实例？

我的控件如下所示

<WebBrowser x:Name="webBrowser" DockPanel.Dock="Bottom" Navigating="webBrowser_Navigating" Navigated="webBrowser_Navigated" LoadCompleted="webBrowser_LoadCompleted"/>

后面的代码如下：

private void backButton_Click(object sender, RoutedEventArgs e)
    {
        // Navigate to the previous HTML document, if there is one
        if (this.webBrowser.CanGoBack)
        {
            this.webBrowser.GoBack();
        }
        else
        {
            MessageBox.Show("Cannot go back. There needs to be something in the history to go back to.");
        }
    }
    private void forwardButton_Click(object sender, RoutedEventArgs e)
    {
        // Navigate to the next HTML document, if there is one
        if (this.webBrowser.CanGoForward)
        {
            this.webBrowser.GoForward();
        }
        else
        {
            MessageBox.Show("Cannot go Forward. There needs to be something in the history to go forward to.");
        }
    }

Answer 1

我本来希望 WebBrowser 控件的导航以与 WPF 中托管的 IE 相同的方式工作。

您可以在 .NET 应用程序中使用 JavaScript 调用方法，因此可以让 JavaScript 将调试信息写入 .NET 控制台

这个类可以传递给 WebBrowser 中的 JavaScript 以便它调用 .NET 方法：

[ComVisible(true)]
public class ScriptManager
{
    // This method can be called from JavaScript.
    public void WriteConsole(string output)
    {
        // Call a method on the form.
        Console.WriteLine(output);
    }
}

传递给 WebBrowser：

webBrowser1.ObjectForScripting = new ScriptManager();

我不知道调用该方法的 JavaScript 位，因为我从未真正使用过 JavaScript，但我认为它会是这样的：

$scope.LogBackNavigation = function() {
    window.external.WriteConsole("Back Navigation");
}

这可能让你看到你的 JavaScript 中发生了什么。

Answer 2

调试 - 附加到进程 -> 脚本代码 这已经加载了我的 VS 中的所有 JS 文件，我可以在任何我想要的地方放置断点。