backbone.js - 用 Jasmine 测试backbone.js View 事件

Question

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

我对上述演示的 Jasmine 测试工作得很好，除了 View 事件。我希望我被以下一项或两项所困扰 i) 我不了解 View 代码中的事件绑定(bind)，ii) 我不了解如何正确设置 View 代码事件的 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) spy 和 ii) 焦点的期望都没有得到满足。

测试我应该在 Jasmine 中了解的backbone.js 事件代码是否有特殊性？

Answer 1

你在监视 View 的 edit方法。这用 spy 对象替换了该方法，这意味着不会调用实际的编辑方法。因此，您是 @input.focus永远不会开火。

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

旁注:请勿调用expect你的 beforeEach 中的方法。如果您确实需要对这些设定期望，请创建 it阻止他们。