अदृश्य वर्ण दर्शक
कोड दृश्य में अदृश्य वर्णों को प्रस्तुत करके रिक्त स्थान, टैब और लाइन ब्रेक को देखें।
रीडमी
अदृश्य वर्ण क्या हैं?
अदृश्य वर्ण Unicode code points हैं जिनका कोई दृश्यमान glyph नहीं होता लेकिन फिर भी string में स्थान घेरते हैं और software द्वारा text को संसाधित या प्रस्तुत करने के तरीके को प्रभावित करते हैं। इनमें control characters (जैसे tab और line feed), format characters (जैसे zero-width joiners और directional marks), विभिन्न whitespace variants, और Byte Order Mark (BOM) जैसे विशेष markers शामिल हैं। क्योंकि वे कुछ नहीं दिखते, वे plain text editor में खोजना बेहद मुश्किल होते हैं और subtle bugs, broken layouts, और data-processing errors का एक सामान्य स्रोत हैं।
Tool विवरण
Invisible Characters Viewer एक interactive text editor है जो हर अदृश्य वर्ण को एक दृश्यमान symbol के रूप में प्रस्तुत करता है, ठीक जगह पर। कोई भी text paste या type करें और प्रत्येक छिपा हुआ वर्ण तुरंत एक छोटे symbolic glyph द्वारा प्रतिस्थापित हो जाता है — tabs → के रूप में दिखाई देते हैं, spaces · के रूप में, zero-width spaces · के रूप में, directional marks → / ← के रूप में, BOM ▯ के रूप में, और इसी तरह। किसी भी glyph पर hover करने से character के पूर्ण नाम और Unicode code point के साथ एक tooltip दिखाई देता है। कुछ भी editor से बाहर नहीं जाता; सभी rendering आपके browser में स्थानीय रूप से होता है।
उदाहरण
| Input text (raw) | Viewer में आप क्या देखते हैं |
|---|---|
Hello\u200BWorld (शब्दों के बीच zero-width space) |
Hello·World with the · glyph marking U+200B |
\u202Eright-to-left override |
→right-to-left override with the directional glyph at the start |
line one\r\nline two |
Carriage-return और line-feed glyphs newline से पहले |
\uFEFFstart of file |
▯start of file showing the BOM at position 0 |
विशेषताएं
- Inline rendering: अदृश्य वर्ण editor के अंदर सीधे glyphs के रूप में दिखाई देते हैं, एक अलग panel में नहीं, इसलिए आप उन्हें आसपास के text के साथ context में देखते हैं
- व्यापक वर्ण कवरेज: C0 और C1 control characters, सभी named Unicode format characters, Unicode whitespace variants (en space, em space, hair space, narrow no-break space, आदि), directional formatting characters, variation selectors, tag characters, और BOM को संभालता है
- Tooltips: किसी भी glyph पर hover करने से character का पूर्ण Unicode नाम और code point दिखाई देता है (उदाहरण के लिए,
Zero Width Space — U+200B) - Standard whitespace highlighting: Regular spaces और tabs CodeMirror के built-in whitespace markers का उपयोग करके highlight किए जाते हैं, जिससे वे regular text से visually अलग रहते हैं
- Plain-text mode: Editor plain-text mode में रहता है इसलिए special characters को कभी भी reinterpreted या modified नहीं किया जाता है जब आप type करते हैं
उपयोग के मामले
- Copy-paste artifacts को debug करना: PDF, web pages, या word processors से copied text अक्सर zero-width spaces, soft hyphens, या non-breaking spaces ले जाता है जो string comparisons और search results में mismatches का कारण बनते हैं
- Data files को inspect करना: CSV, JSON, या log output को paste करें ताकि data को database या parser में import करने से पहले unexpected control characters (null bytes, carriage returns, BOM) को locate किया जा सके
- Web और code debugging: User-supplied input या API responses को hidden directional marks या format characters के लिए check करें जो rendering को break कर सकते हैं या security issues का कारण बन सकते हैं
यह कैसे काम करता है
Tool CodeMirror 6 का उपयोग करता है एक custom extension के साथ जो editor के visible viewport में हर character पर iterate करता है। प्रत्येक code point के लिए यह known invisible characters की एक lookup table को check करता है, Unicode property classes \p{Cc} (control) और \p{Cf} (format) के विरुद्ध test करता है, और variation selectors और tag character ranges को detect करता है। Matched characters को inline decoration widgets द्वारा प्रतिस्थापित किया जाता है जो corresponding symbol glyph को दिखाते हैं। Regular spaces और tabs को CodeMirror के built-in highlightWhitespace extension को delegate किया जाता है।