Enzyme - So greifen Sie auf den <input> -Wert zu und legen ihn fe

Ich bin verwirrt darüber, wie man auf @ zugrei<input> Wert bei Verwendung vonmount. Folgendes habe ich als Test:

  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();
  });

Die Konsole druckt ausundefined. Aber wenn ich den Code leicht ändere, funktioniert es:

  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();
  });

Außer natürlich dasinput.simulate Zeile schlägt fehl, da ich @ verwenrender jetzt. Ich brauche beides, um richtig zu arbeiten. Wie behebe ich das?

BEARBEITE:

Ich sollte erwähnen,<EditableText /> ist keine gesteuerte Komponente. Aber wenn ichdefaultValuein<input />, es scheint den Wert zu setzen. Der zweite obige Codeblock gibt den Wert aus, und auch, wenn ich das Eingabeelement in Chrome überprüfe und @ eingeb$0.value In der Konsole wird der erwartete Wert angezeigt.

Antworten auf die Frage(22)

Ihre Antwort auf die Frage