CreateJSとfastclickを一緒に使うときの注意点

fastclickを有効にしたDOMの中で
CreateJSのオブジェクトにclickで登録したイベントが
呼ばれないという現象が起きます。(iOS/Android実機)

shape = new cjs.Shape()
shape.graphics
  .f '#f00'
  .r 10, 10, 100, 100
  .ef()
shape.addEventListener 'click', ->
  console.log 'shape clicked'
stage.addChild shape
stage.update()

原因

EaselJS

mouseupと直前のmousedownがヒットエリア内にあれば
clickで登録したイベントを呼ぶ。
Canvasが直接clickを拾っている訳ではない模様。
https://github.com/CreateJS/EaselJS/blob/release_v0.7.1/src/easeljs/display/Stage.js#L701

fastclick

touchendのタイミングで強制的にclickを発火させる
https://github.com/ftlabs/fastclick/blob/v1.0.0/lib/fastclick.js#L573

という仕組みになっているため相性が悪いようです。

対策

• ターゲットがCanvasの場合はmouseup, mousedownも発火させるようにする

だいぶ雑な感じですが一応これで動きました。

もっと良い方法あったら教えてもらえると嬉しいです。