俺の報告

RoomClipを運営するエンジニアの日報(多分)です。

日報 #74 - REM-unit-polyfill再び IE8のrem対応

打っても打っても倒れない、
それがIE8なんです。
とはいえ最近はそうでもないようですが。
ブラウザシェア2014年10月 - http://news.mynavi.jp/news/2014/11/04/230/
頑張れIE11、そしてIE9!どうしたんだIE10!と言う概況ですね。
この調子でいつかIE8が圏外に飛んでくれればあとはCSS3の楽園か!
と思いきやIE9は伏兵として申し分ないくらい面倒な相手だったりするので、 まだまだ辛い日々が続きそうです。
もう強制的にIE11にアップデートしようよ世界… 誰にとっても幸せだと思うんだけどな。

今日は色々と面倒な作業ばかりだったので、
語ることはとっても少ないよ。
つまり大体いつも通りだよ。
さっさと終わらそうね。
IE8対応の話、続編。

IE8対応の問題の中核が見えつつあります。
rem周りの対応です。
それ以外は丁寧にCSSを書いていけば割とすんなり治っていきます。
まぁ要はCSS3コンバート用のjsがすげぇという話なんですが。
そういう意味ではREM-unit-polyfillは、もちろん素晴らしいですが一部問題があるようです。
前回はfilterのところの「=」のエスケープでしたが、
今回は「string.replaceにおける正規表現エスケープ」でハマりました。

30.2remと書いたものが、何度やっても32pxと出力されるのです。
おかしいなぁ…まぁ確かに似てるけど…とか思ってたらピンときました。
「.」これがエスケープされていないで正規表現特殊文字でした。
103行目あたり、loadCSSの関数のところで、

foundProps[i] = new RegExp(foundProps[i]);

これをしないとremの置換が過剰に行われてしまいますよ。というエラーでした。
素晴らしいくらいの小ネタですね。
ばいなら。