Aller au contenu

Wikipédia:Linter

Une page de Wikipédia, l'encyclopédie libre.

Linter est une extension (voir la page de l'extension), qui vise à identifier les balises cassées et problématiques sur toutes les pages.

Plusieurs catégories existent afin de trier les différents problèmes et les catégories hautement prioritaires doivent être corrigées pour permettre la migration en juillet 2018 de Tidy (un outil basé sur HTML4) à RemexHtml (un outil basé sur HTML5). Tous les deux sont des analyseurs synthatique prévus pour réparer le code HTML cassé.

Actuellement, le logiciel Mediawiki gère le code source des pages selon le standard HTML4 grâce à Tidy. Cependant, la plupart des navigateurs récents utilisent le standard HTML5 et la migration sans corrections manuelles de la part des contributeurs ne peut être faite, car cela introduirait des erreurs dans le rendu des pages et la présentation de celles-ci pourra être cassée. L'extension Linter permet d'identifier les pages contenant des erreurs et les liste pour que les contributeurs et les robots puissent les nettoyer. La migration vers un rendu HTML 5 des pages ne pourra être fait que correctement en corrigeant ces erreurs.

La page spéciale Spécial:LintErrors liste les pages contenant ces problèmes, classées par ordre de gravité.

Corriger une erreur

[modifier le code]

Problèmes catégorie par catégorie

[modifier le code]

Balise de tableau qui devrait être supprimée

[modifier le code]

Balise mal incluse avec des rendus différents en HTML5 et HTML4

[modifier le code]

Scénario

[modifier le code]

Ce sont des balises incorrectement imbriquées qui se comporteront différemment dans HTML5 par rapport à HTML4. Ce sont des erreurs de haute gravité, car elles peuvent facilement créer des erreurs d'affichage.

Un scénario revient souvent et peut être utilisé comme cas général, prenons le wikicode suivant :

<span>a

b</span>

Quand le logiciel Tidy traite ce code, il génère le code HTML4 suivant après un nettoyage :

<p><span>a</span></p>
<p><span>b</span></p>

Un outil basé sur HTML5 comme RemexHtml nettoie le code façon différente afin de générer :

<p><span>a</span></p>
<p>b</p>

Pour corriger les erreurs de cette catégorie, il faut changer le wikicode de la manière suivante :

Wikicode Résultat avec Tidy Résultat avec Remex Wikicode corrigé
<span>a

b</span>
<p><span>a</span></p>
<p><span>b</span></p>
<p><span>a</span></p>
<p>b</p>
<span>a</span>

<span>b</span>

Autres conseils

[modifier le code]

Le plus souvent, les pages wiki contiennent des erreurs de cette lorsqu'une balise span (ou toute autre balise dans la liste des balises affectées ci-dessous) est utilisée pour encapsuler une liste. En raison des interactions entre un bogue dans l'analyseur et les spécifications autour de l'analyse du code HTML5, lorsque Tidy sera desactivé, ces encapsuleurs ne s'appliqueront plus aux listes.

Lorsqu'une balise span est utilisée pour encapsuler une liste, utilisez plutôt une balise div. C'est la bonne façon de faire puisqu'une liste est une structure de blocs et qu'une div est plus appropriée au lieu d'une balise span, utilisée pour les contenus phrasés, des lignes de texte. C'est le correctif recommandé. Voir ce diff sur Wikipédia en italien pour exemple.

Balises affectées

[modifier le code]

Les balises suivantes sont affectées.

ABBR, BDI, BDO, CITE, DATA, DEL, DFN, INS, KBD, MARK,
Q, RB, RP, RT, RTC, RUBY, SAMP, SPAN, SUB, SUP, TIME, VAR

Divers problèmes de remplacement dans Tidy

[modifier le code]

Tableau multilignes dans une liste

[modifier le code]

Problème

[modifier le code]
Wikicode Résultat avec Tidy Résultat avec Remex Wikicode corrigé
* <table>
<tr><td>foo</td></tr>
</table>
bar
<table>
<tr>
<td>foo</td>
</tr>
</table>
<p>bar</p>
<ul><li>
<table>
<tbody><tr><td>foo</td></tr>
</tbody></table>
<p>bar</p>
</li></ul>
<table>
<tr><td>foo</td></tr>
</table>
bar

Multiples balises de mise en forme non fermées

[modifier le code]

Problème

[modifier le code]
Scénario 1 : effet cumulé avec plusieurs balises
[modifier le code]

Lorsque plus d'une balise est laissée ouverte sur une page, les effets de ces balises s'accumulent sur la totalité de la page. Voir ce diff sur Wikipédia en italien pour un exemple d'un cas particulièrement mauvais avec 13 balises non fermées.

Tidy supprimait parfois ce comportement en limitant l'effet d'une balise non fermée à un fragment plus petit de la page (une section) alors qu'un analyseur HTML5 comme RemexHtml ne le fait pas.

Scénario 2 : utilisation incorrecte d'une balise ouvrante <balise> au lieu d'une balise de fermeture </balise>
[modifier le code]

Parfois, les contributeurs utilisent accidentellement une balise d'ouverture au lieu d'une balise de fermeture. Dans certains scénarios, Tidy corrigeait automatiquement la deuxième balise pour qu'elle soit une balise de fermeture. Cependant, les analyseurs HTML5 ne le font pas automatiquement. Ainsi, avec RemexHTML, le rendu sera assez différent (exemple : ce diff sur itwiki).

Scénario 3 : interférence avec d'autres balises
[modifier le code]

Parfois, ce problème est signalé à cause d'une interférence avec d'autres balises. Par exemple, cette contribution a résolu le problème en modifiant l'ordre de balises small et de balises de mise en gras/italique.

Dans les deux scénarios, fermez la ou les balises ouvertes problématiques.

Mauvaise syntaxe Bonne syntaxe
<u><big><code>foo</big><u>
<u><big><code>foo</code></big></u>
<code>foo<code>
<code>foo</code>
</small>foo<small>
<small>foo</small>
<small>Texte<br />'''''en gras/italique <small><small>et en petit'''''</small></small></small>
<small>Texte<br />'''''en gras/italique <small><small>et en petit</small></small>'''''</small>

Balises affectées

[modifier le code]

Il est à noter que ces scénarios n'ont d'incidence que sur le formatage des balises (a, b, big, code, em, font, i, nobr, s, small, strike, strong, tt, et u).

Palliatif au bogue de délimitation de paragraphe

[modifier le code]

Balises auto-fermantes

[modifier le code]

Bogue de Tidy affectant les liens englobant les balises <font>

[modifier le code]

Problème

[modifier le code]
Wikicode Résultat avec Tidy Résultat avec Remex Wikicode corrigé
<font color="green">[[Foo]]</font>
<a href=".."><font color="green">Foo</font></a>
<font color="green"><a href="..">Foo</a></font>
[[Foo|<font color="green">Foo</font>]]

ou mieux,
[[Foo|<span style="color:green;">Foo</span>]]
.

Bogue d'espace blanc Tidy

[modifier le code]
Wikicode Résultat avec Tidy Résultat avec Remex Wikicode corrigé
<span class='nowrap'>a </span><span class='nowrap'>b</span>
<span class='nowrap'>a</span> <span class='nowrap'>b</span>
<span class='nowrap'>a </span><span class='nowrap'>b</span>
<span class='nowrap'>a</span> <span class='nowrap'>b</span>

Citation non fermée dans l’entête

[modifier le code]

Problème

[modifier le code]
Wikicode Wikicode corrigé
text
==''foo==
bar
text
==''foo''==
bar

Liens utiles

[modifier le code]