Skip to content

Instantly share code, notes, and snippets.

Embed
What would you like to do?
原稿
破綻させない大規模JavaScript
~あるいは如何にして普通のJSerにテストを書いてもらうか
・とあるプロジェクトに参加した時のこと
ネイティブのゲーム → HTMLの移植
(諸事情により)仕掛りの5000行のJSが降ってきた
Railsプロジェクト
テストコード一切なし
普通のJSerはテストコード書かない
どうやってテストコードを書いてもらうか、というのが主題
# どのテスト環境を使うか
よく使われるもの
Jasmine Headless Webkit
ぶっちゃけ遅い。Watchrで自動テストとか回せない。
Jasmineのjasmine-nodeは出来が悪くて、失敗時にエラーコードを返さないのでCIに向かない。(改善されたかも)
qtwebkit不安定。皆不幸になってる。
・ゲームの場合
DOM依存がないロジックのコードがほとんどなのに、ブラウザ立ち上げるのは無駄
・そもそも
JSがものすごく多いので、単体テストでは必要なファイルしか読み込みたくない
結局、Node/jsdomでテストすれば早いのでは
jsdom nodeのDOMシミュレータ。ネイティブのlibxml2依存。早い。
#ライブラリ選定
mocha
should
sinon
jsdom
jsdomちゃんと動くしスゲー早い
zombie.jsはサーバーが立ち上がってないといけないので使わなかった
#言語選定
CoffeeScriptでオブジェクト指向的にやることに。
プロジェクトに非Web系の人が多かったので、「JSの学習コストを下げるために」CoffeeScriptを使った。
既存のJSをペアプロでcoffee化+リファクタリング+ペアプロしながら、一週間ほどでチームとしてキャッチアップ。
# 最初にやったこと
Railsにnodeディレクトリ掘ってpackage.json書いてnodeプロジェクト化
node/lib -> app/assets/javascripts/lib にエイリアス
node/test 以下でlibに対応するテストコードを書くことに
わかる箇所からCoffeeScript化+テストコードを追加
RailsのSprocketsでcoffee-scriptの動的コンパイルを導入
Sprocketsの擬似requireを使ってファイル分割
Railsっぽい命名規約でディレクトリを分割
!!命名規約迷ったらRuby/Railsからパクってくる
Sprocetsマジ便利
(Sprockets, noodeならexpress/connect-assets便利)
#普通のJSerにテストを書いてもらうために
・環境
そもそもLinux慣れてない人は環境を作るのが辛い
→NodeとRails環境を整備したVMwareのイメージを配布
rvm, rubygems, nodebrew, npm, coffee
環境構築用スクリプト https://gist.github.com/2780416
・JSでそのまま書くようなコードを表現
テストのために本番コードを変更したくない、という需要
→「名前空間をあわせて無理やりrequireする」
jsdomでDOM,BOMを生成してglobalに貼る
ヘルパ関数で名前空間を初期化
・とにかくサンプルコードをみせる
TDDの存在を知らない人もいた
とにかくテストのサンプルコードを書く。
sinonのモック使う書き方は、他のモックライブラリ知らないと辛い
・わかる人がCakefileとテスト用ヘルパをごりごり書く
Cakefileとspec_helper.jsの黒魔術
# 現在の問題
git rebase upstream/masterした後、
RailsのSprocketsのCoffeeScriptの動的コンパイルが遅くてタイムアウトする
そもそもRailsのJSExecが遅い
アセットサーバーだけでもNode/express/connect-assetsで立てる価値があるかも。
# 万行のJS
型がないのがどんどんつらくなってきた!
次のプロジェクトがあるならJSXやHaxeを検討したい
# 高度に複雑なDOMイベント
JSDOMがそこまで信頼出来ないのでDOM書換検知以上のテストコードが書けない
外部から非同期なイベントやコールバックのキャッチが難しい
そもそも細かくテストしない。
DOMイベントとロジックを切り分けてロジック側だけテストする。
ビューやUXに関する部分は別の指針が必要なので、ある程度のところで切り上げる。
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
You can’t perform that action at this time.