1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
|
---
title: Affiche le Code source
slug: Outils/View_source
translation_of: Tools/View_source
---
<div>{{ToolsSidebar}}</div>
<p>"Code source de la page" permet de visualiser le code HTML ou XML de la page. Pour activer cet outil, il faut :</p>
<ul>
<li>Faire un clic droit puis sélectionner "Code source de la page".</li>
<li>Utiliser le raccourci clavier <kbd>Ctrl</kbd> + <kbd>U</kbd>, ou <kbd>Cmd</kbd> + <kbd>U</kbd> sur OS X</li>
</ul>
<p>Avant Firefox 42, Une nouvelle fenêtre s'ouvre alors pour afficher le code source de la page.</p>
<p>Depuis Firefox 42, cet outil ouvrira par défaut un nouvel onglet (à la place d'une fenêtre). Pour changer cette préférence, il faut passer la variable <code>view_source.tab</code> à <code>false</code> dans <code>about:config</code>.</p>
<p>Depuis Firefox 60 la préférence <code>view_source.tab</code> a été supprimée ({{bug(1418403)}}), il n'est donc plus possible de changer le mode d'ouverture, les sources s'ouvriront toujours dans un nouvel onglet.</p>
<h2 id="Fonctionnalités">Fonctionnalités</h2>
<p>Cet outil possède trois fonctionnalités supplémentaires. Celles-ci depuis Firefox 40 peuvent être utilisées via le menu contextuel dans l'onglet du code source :</p>
<ul>
<li>Aller à la ligne</li>
<li>Retour à la ligne automatique (activer/désactiver)</li>
<li>Coloration syntaxique (activer/désactiver)</li>
</ul>
<p>Lorsque la coloration syntaxique est activée, l'outil met également les erreurs de parsage en surbrillance rouge. Survoler les messages d'erreurs affiche une infobulle expliquant l'erreur.</p>
<p>Pour utiliser la fonctionnalité aller à la ligne avec le clavier, il suffit d'utiliser le raccourci clavier <kbd>Alt</kbd> + <kbd>Shift</kbd> + <kbd>L</kbd> sur Windows et Linux ou <kbd>Control</kbd> + <kbd>Option</kbd> + <kbd>L</kbd> sur Mac.</p>
<h2 id="Lien_vers_un_numéro_de_ligne">Lien vers un numéro de ligne</h2>
<p>Il est possible de faire un lien vers une ligne en particulier. Il suffit d'ajouter l'ancre <code>#lineNNN</code> dans l'URL du navigateur pour sauter à la ligne NNN.</p>
<p>Par exemple : <a>view-source:https://www.mozilla.org/#line100</a></p>
<h2 id="Code_source_de_la_sélection">Code source de la sélection</h2>
<p>Si une partie de la page est sélectionnée, alors l'option "Code source de la sélection" est disponible dans le menu contextuel de la page. Le comportement est le même que pour "Code source de la page" sauf que la partie du code source affiché ne sera que celle correspondant à la sélection.</p>
<h2 id="Code_MathML_de_la_sélection">Code MathML de la sélection</h2>
<p>Si la souris survole du code <a href="/fr/docs/Web/MathML">MathML</a> lors d'un clic droit, alors l'option "Code MathML de la sélection" est disponible, il sert à visualiser le code MathML.</p>
<h2 id="Limitations">Limitations</h2>
<p>Il existe des limitations à l'outil qu'il faut connaitre :</p>
<h3 id="Le_reporteur_d'erreurs_n'est_PAS_un_validateur">Le reporteur d'erreurs n'est <strong>PAS </strong>un validateur</h3>
<p>L'outil ne reporte que les erreurs de parsing, <strong>PAS</strong> les erreurs de validité HTML. Par exemple mettre un élément {{ HTMLElement("div") }} en enfant d'un élément {{ HTMLElement("ul") }} n'est pas une erreur de parsing, mais <strong>ce n'est pas</strong> de l'HTML valide ! Cette erreur n'apparaitra donc pas dans l'outil. Pour valider un code HTML, il est nécessaire d'utiliser un validateur HTML tel que celui <a class="external" href="http://validator.w3.org/" title="http://validator.w3.org/">proposé par le W3C</a>.</p>
<h3 id="Toutes_les_erreurs_de_parsing_ne_sont_pas_supportées">Toutes les erreurs de parsing ne sont pas supportées</h3>
<p>Même si toutes les erreurs affichées sont des erreurs de parsing, toutes les erreurs de parsing ne sont pas affichées. Parmi celles qui ne sont pas supportées, on retrouve :</p>
<ul>
<li>Les octets qui sont illégaux selon l'encodage du document ne sont pas considérés comme des erreurs.</li>
<li>Les caractères interdits ne sont pas considérés en tant qu'erreur.</li>
<li>Les erreurs de fin de fichier.</li>
<li>Les erreurs de Tree builder de texte (au contraire des tags, commentaires, ou doctypes) ne sont pas rapportés.</li>
<li>Les erreurs de parsing liées aux attributs <code>xmlns</code> ne sont pas rapportées.</li>
</ul>
<h2 id="Coloration_syntaxique_XML">Coloration syntaxique XML</h2>
<p>L'outil utilise le HTML tokenizer lorsqu'il met en surbrillance le code XML. Bien que le tokenizer supporte les processing instructions lors de la coloration de code XML, il s'agit de la seule fonctionnalité orientée XML fournie. À cause de cela, les doctypes qui ont un sous-ensemble interne ne sont pas colorés correctement, et les références d'entités des entités personnalisées ne sont pas non plus colorées correctement.</p>
<p>Cette mauvaise coloration peut être observée en regardant le code source des fichiers chrome de Firefox (tel que les documents XUL). Cependant, cela ne devrait pas être un problème pour analyser des fichiers XML ordinaires.</p>
<h2 id="A_voir_également">A voir également</h2>
<ul>
<li><a class="external" href="http://hsivonen.iki.fi/view-source/" title="http://hsivonen.iki.fi/view-source/">HTML5 Parser-Based View Source Syntax Highlighting</a> (post de blog)</li>
</ul>
|
