web-dev-qa-db-fra.com

Débogage de JavaScript dans Chromium Embedded Framework

J'ai une application WPF qui utilise CEF pour afficher du contenu Web. Ma question est, existe-t-il un moyen de déboguer les parties Javascript/Web dans une application WPF?

23
stefan

Activez le débogage à distance dans votre application:

C # (CefSharp)

CefSettings.RemoteDebuggingPort = 8088;

C++

CefSettings settings;
settings.remote_debugging_port = 8088;

puis lancez votre application et pointez votre navigateur sur http://localhost:8088/ pour accéder à la console développeur de Chromium (la même que celle de Chrome avec Ctrl + Maj + j)

32
Sga

Vous pouvez également utiliser la méthode d'extension ShowDevTools() ( source )

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

CEFSharp Developer Tools window

40
Eido95

Bien que la réponse acceptée soit correcte, elle n'a pas vraiment assez de détails.

J'ai obtenu ce travail dans CefSharp en utilisant le contrôle WinForms dans une application WPF. (le contrôle WinForms semble avoir de meilleures performances). Le code de débogage à distance sera probablement très similaire pour le contrôle WPF.

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

Ensuite aller à http://localhost:8088/ dans votre navigateur.

25
craftworkgames

Pour utiliser "ShowDevTools ()", vous devez d'abord vérifier si le navigateur est initialisé. Un exemple de solution:

//Add an event to check
ChromeBrowser.IsBrowserInitializedChanged += ChromeBrowser_IsBrowserInitializedChanged;

//Declare the event method to be called
private void ChromeBrowser_IsBrowserInitializedChanged(object sender, IsBrowserInitializedChangedEventArgs e)
    {            
        if (e.IsBrowserInitialized)
        {
            ChromeBrowser.ShowDevTools();
        }
    }
1
Eduardo Gadotti

Pour ouvrir la fenêtre Chromium Dev-Tools, vous pouvez procéder comme suit:

CefBrowser.GetBrowser().GetHost().ShowDevTools();

C'est similaire à la réponse d'Eido95, mais cela ne nécessite pas les méthodes d'extension, qui enveloppent simplement ces appels de méthode.

NOTE : Le contrôle doit être initialisé avant d'appeler cette méthode peut être appelée. Si vous connectez et que vous utilisez une fonctionnalité de type F12, cela ne devrait pas poser de problème. Si vous essayez de le faire au démarrage de l'application, vous devrez écouter l'événement ChromiumWebBrowser.IsBrowserInitializedChanged

0
Caleb Seadon