jQuery document.ready 中的 Coffeescript 调用函数

Question

茉莉花测试：

describe 'Toolbar', ->
  beforeEach ->
    jasmine.getFixtures().fixturesPath = "../spec/javascript/fixtures"
    loadFixtures("canvas_fixture.html")

  describe 'Rectangle Button Click', ->
    it 'adds the selected class to rectangle button', ->
      toolbar = new Toolbar()
      expect(toolbar).toBeDefined
      console.log $('#rectangle')
      toolbar.rectangle
      expect($('#rectangle').hasClass("selected")).toBeTruthy()
      console.log $('#rectangle')

类：

class window.Toolbar
  jQuery ->
    rectangle: $('#rectangle').click ->
      $('#toolbar button').removeClass("selected")
      $('#rectangle').addClass("selected")

这个测试对我来说失败了，因为选定的类没有被添加到夹具中，而且我认为我没有正确调用该函数。我怎么称呼

$('#rectangle').click

在我的测试中起作用？谢谢。

Answer 1

我不知道整个上下文，但我看到了一些东西：

• toolbar.rectangle 在你的测试中没有调用函数，你需要说toolbar.rectangle() 才能真正调用它

• 您编写的类没有在 Toolbar 类上定义方法，您应该编写如下内容：

  class Toolbar
    rectangle: ->
      $('#rectangle').click ->
        $('#toolbar button').removeClass("selected")
        $('#rectangle').addClass("selected")
  

• 当您编写此$('#rectangle').click -> ... 时，您正在定义一个事件处理程序，当您单击#rectangle 时将调用该事件处理程序。如果你想让它立即采取行动（即当你打电话给toolbar.rectangle()，你需要这样的东西：

  class Toolbar
    rectangle: ->
      $('#toolbar button').removeClass("selected")
      $('#rectangle').addClass("selected")
  

当然，你需要确保这一切都发生在页面正确加载之后，不熟悉 Jasmine 的说是否会发生。

希望这会有所帮助。