Qu'est-ce que les caractères invisibles ?

Les caractères invisibles sont des points de code Unicode qui n'ont pas de glyphe visible mais occupent toujours de l'espace dans une chaîne et influencent la façon dont les logiciels traitent ou affichent le texte. Ils incluent les caractères de contrôle (comme la tabulation et le saut de ligne), les caractères de formatage (comme les jointures de largeur nulle et les marques directionnelles), diverses variantes d'espaces blancs et des marqueurs spéciaux comme la marque d'ordre des octets (BOM). Parce qu'ils ne sont pas visibles, ils sont notoires pour être difficiles à repérer dans un éditeur de texte brut et sont une source courante de bugs subtils, de mises en page cassées et d'erreurs de traitement de données.

Description de l'outil

L'Invisible Characters Viewer est un éditeur de texte interactif qui affiche chaque caractère invisible sous la forme d'un symbole visible, sur place. Collez ou tapez n'importe quel texte et chaque caractère caché est immédiatement remplacé par un petit glyphe symbolique — les tabulations apparaissent comme →, les espaces comme ·, les espaces de largeur nulle comme ·, les marques directionnelles comme → / ←, BOM comme ▯, et ainsi de suite. Survoler n'importe quel glyphe affiche une infobulle avec le nom complet du caractère et son point de code Unicode. Rien ne quitte l'éditeur ; tout le rendu se fait localement dans votre navigateur.

Exemples

Texte d'entrée (brut) Ce que vous voyez dans la visionneuse
Hello\u200BWorld (espace de largeur nulle entre les mots) Hello·World avec le glyphe · marquant U+200B
\u202Eright-to-left override →right-to-left override avec le glyphe directionnel au début
line one\r\nline two Glyphes de retour à la ligne et de saut de ligne avant la nouvelle ligne
\uFEFFstart of file ▯start of file montrant le BOM à la position 0

Fonctionnalités

  • Rendu en ligne : Les caractères invisibles sont affichés sous forme de glyphes directement dans l'éditeur plutôt que dans un panneau séparé, vous les voyez donc en contexte avec le texte environnant
  • Couverture de caractères large : Gère les caractères de contrôle C0 et C1, tous les caractères de formatage Unicode nommés, les variantes d'espaces blancs Unicode (espace fine, espace cadratin, espace cheveu, espace insécable étroit, etc.), les caractères de formatage directionnel, les sélecteurs de variation, les caractères de balise et BOM
  • Infobulles : Survoler n'importe quel glyphe affiche le nom Unicode complet du caractère et son point de code (par exemple, Zero Width Space — U+200B)
  • Mise en surbrillance des espaces blancs standard : Les espaces et tabulations réguliers sont mis en surbrillance à l'aide des marqueurs d'espaces blancs intégrés de CodeMirror, les gardant visuellement distincts du texte régulier
  • Mode texte brut : L'éditeur reste en mode texte brut afin que les caractères spéciaux ne soient jamais réinterprétés ou modifiés au fur et à mesure que vous tapez

Cas d'usage

  • Débogage des artefacts de copier-coller : Le texte copié à partir de PDF, de pages web ou de traitements de texte porte souvent des espaces de largeur nulle, des traits d'union conditionnels ou des espaces insécables qui causent des incompatibilités dans les comparaisons de chaînes et les résultats de recherche
  • Inspection des fichiers de données : Collez CSV, JSON ou la sortie de journal pour localiser les caractères de contrôle inattendus (octets nuls, retours à la ligne, BOM) avant d'importer des données dans une base de données ou un analyseur
  • Débogage web et code : Vérifiez l'entrée fournie par l'utilisateur ou les réponses API pour les marques directionnelles cachées ou les caractères de formatage qui pourraient casser le rendu ou causer des problèmes de sécurité

Comment ça marche

L'outil utilise CodeMirror 6 avec une extension personnalisée qui itère sur chaque caractère dans la fenêtre d'affichage visible de l'éditeur. Pour chaque point de code, il vérifie une table de recherche des caractères invisibles connus, teste par rapport aux classes de propriétés Unicode \p{Cc} (contrôle) et \p{Cf} (formatage), et détecte les plages de sélecteurs de variation et de caractères de balise. Les caractères correspondants sont remplacés par des widgets de décoration en ligne affichant le glyphe de symbole correspondant. Les espaces et tabulations réguliers sont délégués à l'extension highlightWhitespace intégrée de CodeMirror.