Yabu.log

ITなどの雑記

PhantomJSではlet文が使えない

用語

  • ES6:大きな変更が入った最近のjavascriptの仕様。モダンなブラウザは大体対応している
  • Jasmine : javascriptのテスト環境
  • Karma:テストランナー。Jasmineを動かす
  • PhantomJS:CUI用のブラウザー。テストランナーが利用している

テストを書いたのでリフアクタリング!の勢いでとりあえず変数宣言のvarを全てletに置き換えたが*1テストでエラーになってしまった。

PhantomJS 2.1.1 (Mac OS X 0.0.0) ERROR
  SyntaxError: Expected an identifier but found 'arr2' instead

Karma runs your tests in real browser (in your case it is PhantomJs) so you should check browser support 'let' and 'const' or not. OR you should use preprocessors which compile your es6 code to es5.

ES6 variables (const and let) · Issue #2442 · karma-runner/karma · GitHub

調べてみたところ jkarma(jasmineのテストランナー)が利用するPhantomJSというテスト用ブラウザがES6をサポートしていないため 使えないようだ。

ES6にはバージョン2.5から対応するらしい(最新は2.1)

ES2015 (also colloquially known as ES6) will be possible with the new effort towards version 2.5 (see #14458 for details).

https://github.com/ariya/phantomjs/issues/14506

調査中に同じトラブルがissueに上がっているossのプロジェクト*2が何個かあったが普通にletをvarに置き換えて対応していた。ES6向けの環境に向けて作っているなら、本来ならletのままでいいはずだが、テストのためにコードを変更しているということだろうか。

レガシーコード改善ガイドじゃないけど、テストのためにスコープいじるのはやだぁ。 対策としてはプリプロセッサとしてBabelというES6→commonJSの変換ができるトランスコンパイラを指定することでテスト時には commonJSにコンパイル後のソースで実行しながら、プロジェクトのソースはES6のバージョンで管理できる。

前例を調査中・・・

*1:関数の中でスコープが共通でない別関数のvar宣言された変数をグローバルスコープとして参照するような変なことをしていない限り、この置換は問題ないはず。

*2:https://github.com/aurelia/cli/issues/259