Vad är osynliga tecken?

Osynliga tecken är Unicode-kodpunkter som saknar synlig glyf men fortfarande tar upp utrymme i en sträng och påverkar hur programvara bearbetar eller renderar text. De inkluderar kontrolltecken (som tabb och radmatning), formatteringstecken (som nollbredds-sammanfogare och riktningsmarkeringar), olika whitespace-varianter och speciella markörer som Byte Order Mark (BOM). Eftersom de ser ut som ingenting är de notoriskt svåra att upptäcka i en vanlig textredigerare och är en vanlig källa till subtila buggar, bruten layout och databearbetningsfel.

Verktygsbeskrivning

Invisible Characters Viewer är en interaktiv textredigerare som renderar varje osynligt tecken som en synlig symbol, på plats. Klistra in eller skriv in vilken text som helst och varje dolt tecken ersätts omedelbar av en liten symbolisk glyf — tabbar visas som →, mellanslag som ·, nollbredds-mellanslag som ·, riktningsmarkeringar som → / ←, BOM som ▯, och så vidare. Genom att hovra över någon glyf visas ett verktygstips med tecknets fullständiga namn och Unicode-kodpunkt. Ingenting lämnar redigeraren; all rendering sker lokalt i din webbläsare.

Exempel

Inmatningstext (rå) Vad du ser i visningsprogrammet
Hello\u200BWorld (nollbredds-mellanslag mellan ord) Hello·World med ·-glyfen som markerar U+200B
\u202Eright-to-left override →right-to-left override med riktningsglyfen i början
line one\r\nline two Carriage-return och line-feed-glyfer före radbrytningen
\uFEFFstart of file ▯start of file som visar BOM på position 0

Funktioner

  • Inline-rendering: Osynliga tecken visas som glyfer direkt i redigeraren istället för i en separat panel, så du ser dem i sammanhang med omgivande text
  • Bred teckentäckning: Hanterar C0- och C1-kontrolltecken, alla namngivna Unicode-formatteringstecken, Unicode whitespace-varianter (en-mellanslag, em-mellanslag, hårtunt mellanslag, smalt mellanslag utan radbrytning, etc.), riktningsformatteringstecken, variantväljarare, tagetstecken och BOM
  • Verktygstips: Genom att hovra över någon glyf visas tecknets fullständiga Unicode-namn och kodpunkt (t.ex. Zero Width Space — U+200B)
  • Markering av standardwhitespace: Vanliga mellanslag och tabbar markeras med CodeMirrors inbyggda whitespace-markörer, vilket håller dem visuellt åtskilda från vanlig text
  • Vanlig textläge: Redigeraren förblir i vanlig textläge så speciella tecken tolkas eller ändras aldrig när du skriver

Användningsfall

  • Felsökning av copy-paste-artefakter: Text kopierad från PDF-filer, webbsidor eller ordbehandlare innehåller ofta nollbredds-mellanslag, mjuka bindestreck eller mellanslag utan radbrytning som orsakar matchningsfel i strängsammanlikningar och sökresultat
  • Inspektering av datafiler: Klistra in CSV, JSON eller loggutdata för att hitta oväntade kontrolltecken (nollbyte, carriage return, BOM) innan data importeras till en databas eller parser
  • Webb- och kodfelsökning: Kontrollera användardata eller API-svar för dolda riktningsmarkeringar eller formatteringstecken som kan bryta rendering eller orsaka säkerhetsproblem

Hur det fungerar

Verktyget använder CodeMirror 6 med ett anpassat tillägg som itererar över varje tecken i redigerarens synliga visningsområde. För varje kodpunkt kontrollerar det en uppslagstabell över kända osynliga tecken, testar mot Unicode-egenskapsklasser \p{Cc} (kontroll) och \p{Cf} (formattering), och detekterar variantväljarare och tagetsteckenintervall. Matchade tecken ersätts av inline-dekorationsplugins som visar motsvarande symbolglyf. Vanliga mellanslag och tabbar delegeras till CodeMirrors inbyggda highlightWhitespace-tillägg.