Macで不可視な文字が入力されてしまう問題への対処法

MacでATOMエディターを使ってHTML/CSSを記述していたら、見た目上は見えないけど内部で0x08の制御コードなるバックスペースが入力されて、HTML/CSSが正常に機能しない問題にぶちあたった。

ATOM,テキストエディタ、Chrome,Safari上では目に見えないが、FireFoxやさくらエディタで見るとバックスペースが入っているよう。

ちなみにFireFoxでは文字化けのような文字が入っており、これをコピペして検索窓に貼り付けると「？」に変換されてしまう。しかし今回は「？」ではなくバックスラッシュであった。

過去にも経験しており、クライアントさんに納品したときにミスに気づけないので、非常にクリティカルなバグだが、Apple側はまだ対処できていないようである。

ATOMの問題かと思ったが、Mac特有のバグらしく、他のサービスなどでも苦しんでいる方がいた。

teratailで質問し解決できた

teratailで初めて質問を行った。

15分以上調べて分からなかったら聞く、というコンセプトに共感していたが、回答者に心無いコメントも多く、若干勇気がいった。

しかし、私の質問には親切でフレンドリーな方ばかりが回答してくださって、安心し、使ってよかったと思った。

Macの標準の入力ソース（IME）ではなく、Google日本語入力をダウンロードし日本語入力はこれで行う。
（英字の「￥」キーで「\」を入力するようにしている場合）標準の日本語入力ソース（実際は日本語だけでなく英字・カタカナ・半角カタカナもこれで対応させている）は削除せずに残しておき、「日本語はGoogle、英字はMac標準」の入力ソースを使うようにする。

Twitterで調べたところGoogle日本語入力でも再発するらしい。VSCodeなどの他エディタでも再発するらしくMac側の問題のよう。今のところはVSCodeに乗り換えて不可視文字（制御文字）を見えるようにするのが一時対策っぽい。

少なくとも VSCode では “editor.renderControlCharacters”: true で制御文字を画面表示するようにすれば気づくことはできるようになった
— ふろうと (@float168) 2019年1月5日

ちなみにMacでRubyなどを扱うにはVSCode（Visual Studio Code）というMicrosoft製のエディタが「一択」と言わしめるほど良いらしい。https://twitter.com/search?q=VSCode%20%E4%B8%80%E6%8A%9E&src=typd&lang=ja

TwitterはURLでも検索できるから最新情報や皆んなの意見を調べたい時は便利。https://twitter.com/search?src=typd&q=right-apps.com&lang=ja

①macの標準のIME?の日本語入力で、日本語を打つ
②スペースおして変換モードにする
③delete1回押して変換モード終了する
④この状態で左キーなどを押すと、見かけでは文字が消えるのに、内部に制御コードなるバックスペースがはいってしまう

容量が160MBくらいいる。が、クリティカルな問題なだけに仕方ない。

コーディングの関係上「¥」キーを「\」に変えている場合、Googleの英数だと「¥」のままになってしまう。

そこで「書類ごとに入力ソースを切り替える」にチェックして（これで「かな」「英数」キーを押した時の切り替え先を覚えてくれる？）、上のステータスバー？で一度理想の入力ソースに切り替えてあげればOKなようです。

Macの標準の入力ソースに慣れていたので、Google日本語入力の変換窓がちょっと小さくて見にくい。けれどMacの変換は結構おバカさんだったので、変換能力はGoogleのほうがいいかも。

あとは、Macの標準の日本語入力ソース（IME）において、理想は「英字」だけ使いたいので本分の「日本語」をチェックオフにしときたいが出来ない。そのため「気づいたらMac標準の日本語入力になっていた」ということが多々ありうる。

不可視文字（制御コード）が入ってしまうとGoogleインデックスにも引っかからずSEO的にも大きな問題であるため、なんとかシンプルな解決策が必要だ。

この記事の感想をシェアしていただけないでしょうか(*´∀`人)