aboutsummaryrefslogtreecommitdiff
path: root/files/fr/tools/remote_debugging/chrome_desktop/index.html
diff options
context:
space:
mode:
Diffstat (limited to 'files/fr/tools/remote_debugging/chrome_desktop/index.html')
-rw-r--r--files/fr/tools/remote_debugging/chrome_desktop/index.html49
1 files changed, 49 insertions, 0 deletions
diff --git a/files/fr/tools/remote_debugging/chrome_desktop/index.html b/files/fr/tools/remote_debugging/chrome_desktop/index.html
new file mode 100644
index 0000000000..1e1580b614
--- /dev/null
+++ b/files/fr/tools/remote_debugging/chrome_desktop/index.html
@@ -0,0 +1,49 @@
+---
+title: Déboguer Chrome Desktop à distance
+slug: Outils/Débogage_distant/Chrome_Desktop
+translation_of: Tools/Remote_Debugging/Chrome_Desktop
+---
+<div>{{ToolsSidebar}}</div><p>Cet article explique comment connecter <a href="/fr/docs/Outils">les outils de développement Firefox</a> à <a href="https://www.google.fr/chrome/browser/desktop/">Google Chrome</a> si celui-ci est lancé sur l'ordinateur.</p>
+
+<div class="note">
+<p><strong>Note :</strong> Ce support dépend du module complémentaire Valence qui effectue le lien entre le protocole de débogage utilisé par Firefox et celui utilisé par Chrome. Le support de Valence est toujours expérimental.</p>
+</div>
+
+<p>Ce guide est organisé en deux parties : la première concerne les prérequis nécessaires, la seconde partie concerne la partie de connexion.</p>
+
+<h2 id="Prérequis">Prérequis</h2>
+
+<p>Pour connecter les outils de développement avec Google Chrome, vous aurez besoin de :</p>
+
+<ul>
+ <li>Firefox 35 ou une version supérieure</li>
+ <li>Du module complémentaire <a href="/fr/docs/Outils/Firefox_Tools_Adapter">Valence</a> (anciennement appelé Adaptateur des outils) installé sur Firefox. Si vous utilisez <a href="/fr/Firefox/Developer_Edition">Firefox Developer Edition</a>, Valence est déjà installé. Sinon, vous pouvez <a href="https://ftp.mozilla.org/pub/mozilla.org/labs/fxdt-adapters/">télécharger la dernière version de Valence</a> pour l'installer dans Firefox en ouvrant le fichier XPI.</li>
+ <li>Chrome 37 ou une version supérieure.</li>
+</ul>
+
+<h2 id="Connexion">Connexion</h2>
+
+<p>{{EmbedYouTube("g5p9__OiaMY")}}</p>
+
+<h3 id="Lancer_Chrome">Lancer Chrome</h3>
+
+<p>Pour activer le débogage distant sur Chrome (pour ordinateur), vous aurez besoin de le lancer avec le flag suivant : <code>--remote-debugging-port=9222</code>. Pour plus d'informations, voir ce guide pour <a href="http://www.chromium.org/developers/how-tos/run-chromium-with-flags">démarrer Chrome avec des options en ligne de commande</a>.</p>
+
+<p>D'autres options peuvent s'avérer utiles. En lançant Chrome avec <code>--no-first-run</code>, <code>--no-default-browser-check</code>, et <code>--user-data-dir</code>, on peut lancer une instance de Chrome en parallèle d'une autre déjà lancée.</p>
+
+<p>Par exemple, sur OS X, on peut lancer la commande suivante pour démarrer une instance de Chrome qui soit débogable et qui puisse être séparée des autres instances éventuellement déjà lancées :</p>
+
+<pre class="language-html"><code class="language-html">/Applications/Google\ Chrome.app/Contents/MacOS/Google\ Chrome --remote-debugging-port=9222 --no-first-run --no-default-browser-check --user-data-dir=$(mktemp -d -t 'chrome-remote_data_dir')</code></pre>
+
+<h3 id="Effectuer_la_connexion_avec_WebIDE">Effectuer la connexion avec WebIDE</h3>
+
+<p>Sous Firefox, ouvrez <a href="/fr/docs/Tools/WebIDE/Opening_WebIDE">WebIDE</a>. Dans WebIDE, cliquez sur « Sélectionner l'environnement » puis sélectionnez « Chrome Desktop » dans le menu déroulant.</p>
+
+<p>Ensuite, cliquez sur le menu « Ouvrir une application » de WebIDE. Cela affichera une liste des onglets ouverts sur l'instance. Cliquez sur un onglet pour y connecter les outils de développement. Vous pourrez ensuite utiliser la plupart des outils de développement Firefox. À l'heure actuelle, les outils suivants ne sont pas encore supportés :</p>
+
+<ul>
+ <li><a href="/fr/docs/Outils/Performance">Performance</a></li>
+ <li>Timeline</li>
+ <li><a href="/fr/docs/Outils/Moniteur_réseau">Réseau</a></li>
+ <li><a href="/fr/docs/Outils/Inspecteur_de_stockage">Stockage</a></li>
+</ul>