Déboguer un contrôle WebView
.png "S'applique à Windows et Windows Phone")
Pour inspecter et déboguer des contrôles WebView dans une application Windows Runtime, vous pouvez configurer Visual Studio de sorte à attacher le débogueur de scripts au démarrage de l'application. Quand vous démarrez Visual Studio 2013 Update 2, vous avez deux moyens d'interagir avec les contrôles WebView à l'aide du débogueur :
Ouvrez l'Explorateur DOM pour une instance WebView et inspectez les éléments DOM, examinez les problèmes de style CSS et testez de manière dynamique les modifications de rendu des styles.
Sélectionnez la page web ou l'iFrame affiché dans l'instance WebView en tant que cible dans la fenêtre de la console JavaScript, puis interagissez avec la page web à l'aide des commandes de la console. La console fournit un accès au contexte actuel d'exécution du script.
Attacher le débogueur (C#, Visual Basic, C++)
Dans Visual Studio, ajoutez un contrôle WebView à votre application Windows Runtime.
Dans l'Explorateur de solutions, ouvrez les propriétés du projet en choisissant Propriétés dans le menu contextuel du projet.
Sélectionnez Déboguer. Dans la liste Processus d'application, choisissez Script.
.png "Attacher le débogueur de scripts")
(Facultatif) Pour les versions non Express de Visual Studio, désactivez le débogage juste-à-temps en choisissant Outils, Options, Débogage, Juste-à-temps, puis en désactivant le débogage juste-à-temps pour le script.
Notes
En désactivant le débogage juste-à-temps, vous pouvez masquer les boîtes de dialogue pour les exceptions non prises en charge qui se produisent sur certaines pages web.Dans Visual Studio Express, le débogage juste-à-temps est toujours désactivé.
Appuyez sur F5 pour démarrer le débogage.
Utiliser l'Explorateur DOM pour inspecter et déboguer un contrôle WebView
(C#, Visual Basic, C++) Attachez le débogueur de script à votre application. Voir la première section pour des instructions.
Si vous ne l'avez pas déjà fait, ajoutez un contrôle WebView à votre application et appuyez sur F5 pour commencer le débogage.
Naviguez jusqu'à la page contenant le ou les contrôles Webview.
Ouvrez la fenêtre de l'Explorateur DOM pour le contrôle WebView en choisissant Déboguer, Windows, Explorateur DOM, puis choisissez l'URL du WebView que vous voulez inspecter.
.png "Ouverture de l'explorateur DOM")
L'Explorateur DOM associé au WebView apparaît sous forme d'un nouvel onglet dans Visual Studio.
Affichez et modifiez les éléments DOM et les styles CSS actifs comme décrit dans la section Déboguer les styles CSS avec l'Explorateur DOM.
Utiliser la fenêtre de la console JavaScript pour inspecter et déboguer un contrôle WebView
(C#, Visual Basic, C++) Attachez le débogueur de script à votre application. Voir la première section pour des instructions.
Si vous ne l'avez pas déjà fait, ajoutez un contrôle WebView à votre application et appuyez sur F5 pour commencer le débogage.
Ouvrez la fenêtre de la console JavaScript pour le contrôle WebView en choisissant Déboguer, Windows, Console JavaScript.
La fenêtre de la console JavaScript s'ouvre.
Naviguez jusqu'à la page contenant le ou les contrôles Webview.
Dans la fenêtre de la console, sélectionnez la page web ou un iFrame affiché par le contrôle WebView dans la liste Cible.
.png "Sélection cible dans la fenêtre de la console JavaScript")
Notes
À l'aide de la console, vous pouvez interagir avec un seul WebView, iFrame, contrat de partage ou traitement web à la fois.Chaque élément requiert une instance distincte de l'hôte de plateforme web (WWAHost.exe).Vous pouvez interagir avec un seul hôte à la fois.
Affichez et modifiez des variables dans votre application ou utilisez les commandes de la console, comme décrit dans les sections Démarrage rapide : déboguer du code JavaScript à l'aide de la console et Commandes de la console JavaScript.