使用jasmine测试backbone.js查看事件

Question

我正在尝试为无处不在的backbone.js'todo'示例的Coffeescript实现实现视图测试(请参阅github.com/rsim/backbone_coffeescript_demo.)

除了视图事件之外,我对上述演示的茉莉花测试工作非常顺利.我希望我被困在以下一个或两个上面i)我不理解视图代码中的事件绑定,ii)我不明白如何正确设置视图代码事件的Jasmine测试.

以下是"编辑"活动的示例...

class TodoApp.TodoView extends Backbone.View
  tagName: "li"
  template: TodoApp.template '#item-template'
  events:
    "dblclick div.todo-content" : "edit"
     ...

  initialize: ->
    _.bindAll this, 'render', 'close'
    @model.bind 'change', @render
    @model.bind 'destroy', => @remove()

  render: ->
    $(@el).html @template @model.toJSON()
    @setContent()
    this

  edit: ->
    $(@el).addClass "editing"
    @input.focus()
  ...

...现在这是对双击是否获得焦点的测试:

    describe "edit state", ->
      li = null

    beforeEach ->
       setFixtures('<ul id="todo-list"></ul>')
       model = new Backbone.Model id: 1, content: todoValue, done: false
       view = new TodoApp.TodoView model: model, template: readFixtures("_item_template.html")
       $("ul#todo-list").append(view.render().el)
           li = $('ul#todo-list li:first')
       target = li.find('div.todo-content')
       expect(target).toExist()
               target.trigger('dblclick') # here's the event!

    it "input takes focus", ->
       expect(li.find('.todo-input').is(':focus')).toBe(true)

对i)间谍和ii)的期望都没有得到满足.

是否有一个特性来测试我在Jasmine中应该注意的backbone.js事件代码？

Answer 1

你正在监视视图的edit方法。这会用间谍对象替换该方法，这意味着不会调用实际的编辑方法。因此，你@input.focus永远不会着火。

因为您希望测试实际调用您的编辑方法，所以我会删除它的间谍。

旁注：不要expect在 beforeEach 中调用方法。如果您确实需要对这些设定期望，请it为它们创建一个块。