Question

我有一个WPF应用程序，它使用CEF来显示Web内容。我的问题是，有没有办法在WPF应用程序中调试Javascript / Web部件？

Answer 1

您也可以使用ShowDevTools()扩展方法（http://code.stephenmorley.org/javascript/understanding-the-google-analytics-tracking-code/）

ChromiumWebBrowser browser = new ChromiumWebBrowser();
browser.ShowDevTools(); // Opens Chrome Developer tools window

source

Answer 2

在您的应用程序中启用远程调试：

C＃（CefSharp）

CefSettings.RemoteDebuggingPort = 8088;

<强> C ++

CefSettings settings;
settings.remote_debugging_port = 8088;

然后运行您的应用并将浏览器指向http://localhost:8088/以访问Chromium开发者控制台（与Chrome中的相同， Ctrl + Shift + j ）

Answer 3

虽然接受的答案是正确的，但它并没有足够的细节。

我在WPF应用程序中使用WinForms控件在CefSharp中使用它。（WinForms控件似乎有更好的性能）。尽管如此，远程调试的代码可能与WPF控件非常相似。

var settings = new CefSettings { RemoteDebuggingPort = 8088 };
Cef.Initialize(settings);
WindowsFormsHost.Child = new ChromiumWebBrowser(url);

然后在浏览器中转到http://localhost:8088/。

Answer 4

要打开Chromium Dev-Tools窗口，您可以执行以下操作：

for line in $(cat $BASE_PATH/publishfile.txt)
do 
      FILE_PATH=$(echo "line"| awk '{print  $NF}' )
done
FILE_NAME=($basename  $FILEPATH)

这与Eido95的答案类似，但是它不需要扩展方法，而扩展方法实际上只是包装这些方法调用。

注意：需要先初始化控件，然后才能调用此方法。如果您要接线并且具有类似F12的功能，那么这应该不是问题。如果您尝试在应用启动时执行此操作，则需要监听 ChromiumWebBrowser.IsBrowserInitializedChanged 事件

Answer 5

要使用“ ShowDevTools（）”，您首先需要验证浏览器是否已初始化。解决方案示例：

<div class="ml-xs mr-xs my-flex-column">
<p>Interest:</p>
<ul *ngFor="let interests of item.profileInterest">
    <li *ngIf="interests.type == 'Interest'"> {{ interests.name }} </li>
</ul>
</div>

<div class="ml-xs mr-xs my-flex-column">
<p>Behavior:</p>
<ul *ngFor="let behaviors of item.profileInterest">
    <li *ngIf="behaviors.type == 'Behavior'"> {{ behaviors.name }} </li>
</ul>
</div>

在Chromium Embedded Framework中调试JavaScript

5 个答案: