酶-如何访问和设置<input>值?

我对使用<input>如何获取价值感到困惑mount这是我的测试内容:

  it('cancels changes when user presses esc', done => {
    const wrapper = mount(<EditableText defaultValue="Hello" />);
    const input = wrapper.find('input');

    console.log(input.render().attr('value'));
    input.simulate('focus');
    done();
  });

控制台将输出undefined但是,如果我稍微修改一下代码,它就会起作用:

  it('cancels changes when user presses esc', done => {
    const wrapper = render(<EditableText defaultValue="Hello" />);
    const input = wrapper.find('input');

    console.log(input.val());
    input.simulate('focus');
    done();
  });

当然,除了那input.simulate行因为我现在正在使用而失败render我都需要正常工作。我该如何解决?

编辑

我应该提到,<EditableText />不是受控组件。但是,当我通过defaultValue<input />,似乎要设置的值。上面的第二个代码块确实输出了该值,同样,如果我在Chrome中检查了输入元素并$0.value在控制台中键入,它将显示期望的值。

JinJin西门2020/03/14 18:15:21

这里有很多不同的意见。唯一对我有用的是上述所有内容,而没有使用input.props().value希望对您有所帮助。

Tony阳光2020/03/14 18:15:21

这为我工作:

let wrapped = mount(<Component />);
expect(wrapped.find("input").get(0).props.value).toEqual("something");