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

时间:2021-05-03 20:45:06

I have a WPF WebBrowser control which I used in my wpf client application to navigate to different pages. It has basic functionalities like back , forward , go events which calls this.webbrowser.goback(), this.webbrowser.goforward(), this.webbrowser.go().

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

Though the web application works fine with IE which means all the forward and back navigations for more than one level .More than one level navigation doesn't work fine in my WPF application for one page(Billings which has contacts link and in contacts page we have address link.) when clicking back button on my address page it goes to contacts page but clicking back button on contacts page doesn't go to billing page.

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

Since it's working fine in IE without any issues I suspect there is something wrong with my WPF applications . I have few questions here .

由于它在IE中工作正常而没有任何问题,我怀疑我的WPF应用程序有问题。我这里的问题很少。

  1. Is the webbrowser.goback() same as click back button of IE ? Or any events will be missed out in the wpf webbrowser control compared to IE ?
  2. webbrowser.goback()与IE的点击后退按钮相同吗?或者,与IE相比,wpf webbrowser控件中是否会遗漏任何事件?
  3. IS there a way we can debug the javasctipts from WPF application itself ?
  4. 有没有办法可以从WPF应用程序本身调试javasctipts?
  5. Is there a better way to debug these kind of scenarios from WPF applications ?
  6. 有没有更好的方法从WPF应用程序调试这些方案?
  7. Does IE stores the WPF WebBrowser navigations in its history or it is a separate instance ?
  8. IE是否将WPF WebBrowser导航存储在其历史记录中,或者它是一个单独的实例?

my control looks like below

我的控制如下所示

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

And code behind looks like below:

后面的代码如下所示:

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.");
        }
    }

2 个解决方案

#1


3  

I would have expected the WebBrowser control's navigation to work in the same way as it is essentially IE hosted in WPF.

我原本期望WebBrowser控件的导航工作方式与它本质上是在WPF中托管的IE一样。

You can have the JavaScript call methods in the .NET application, so could have the JavaScript write debug info to the .NET console

您可以在.NET应用程序中使用JavaScript调用方法,因此可以将JavaScript编写调试信息发送到.NET控制台

This class can be passed to JavaScript in WebBrowser for it to call .NET method:

这个类可以传递给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);
    }
}

Pass to WebBrowser:

传递给WebBrowser:

webBrowser1.ObjectForScripting = new ScriptManager();

I don't know the JavaScript bit to call the method as I've never really used JavaScript, BUT I think it would be something like this:

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

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

That might allow you to see whats happening in your JavaScript.

这可能会让您看到JavaScript中发生的事情。

#2


1  

Debug -Attach to Process -> Script Code This has loaded all the JS files in my VS and I could put breakpoint wherever I want.

Debug -Attach to Process - > Script Code这已经加载了我VS中的所有JS文件,我可以在任何地方放置断点。

#1


3  

I would have expected the WebBrowser control's navigation to work in the same way as it is essentially IE hosted in WPF.

我原本期望WebBrowser控件的导航工作方式与它本质上是在WPF中托管的IE一样。

You can have the JavaScript call methods in the .NET application, so could have the JavaScript write debug info to the .NET console

您可以在.NET应用程序中使用JavaScript调用方法,因此可以将JavaScript编写调试信息发送到.NET控制台

This class can be passed to JavaScript in WebBrowser for it to call .NET method:

这个类可以传递给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);
    }
}

Pass to WebBrowser:

传递给WebBrowser:

webBrowser1.ObjectForScripting = new ScriptManager();

I don't know the JavaScript bit to call the method as I've never really used JavaScript, BUT I think it would be something like this:

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

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

That might allow you to see whats happening in your JavaScript.

这可能会让您看到JavaScript中发生的事情。

#2


1  

Debug -Attach to Process -> Script Code This has loaded all the JS files in my VS and I could put breakpoint wherever I want.

Debug -Attach to Process - > Script Code这已经加载了我VS中的所有JS文件,我可以在任何地方放置断点。