Question

我有一个组件，其方法绑定到其子组件的onChange事件。简而言之：

DOM = React.DOM

Range = React.createClass
  getInitialState: ->
    isRange: false

  render: ->
    check = DOM.input
      type: "checkbox",
      onChange: @rangeChanged,
      checked: @state.isRange
      name: "isRange"
    DOM.form {}, [check]

  rangeChanged: React.autoBind ->
    @setState
      isRange: !@state.isRange

在测试期间，我想更改复选框的值并触发change事件。我的测试看起来像（使用mocha.js + expect.js）：

root = $("#root")

describe "test Range", ->
  beforeEach ->
    @range = Range()
    React.renderComponent(@range, root[0])

  afterEach ->
    React.unmountAndReleaseReactRootNode(root[0])

  it "should run event", (done) ->
    r = root.find("input[name=isRange]").prop("checked", true).trigger('change')
    setTimeout (=> expect(@range.state.isRange).to.be.true; done()), 10

不幸的是，我无法获得任何解决方案来使这个测试工作。知道如何让它工作吗？

jsfiddle snippet

Answer 1

把它放在那里让所有人都能看到。

Need checkbox change event to respond to change of checked state done programmatically

基本上，问题是jQuery使用trigger('click')而不是change来实际更改复选框的状态。在这种情况下，change就像您不想要的另一个自定义事件。

如何测试React组件异步方法

1 个答案: