手動テストを簡略化するために、ブックレットレットを書いてフォームを自動入力しようとしています。このサイトはReactで実装されています。 inputフィールドは目に見えて、ブラウザで更新されますが、検証が提出フォームに失敗したとしてReact-generated入力フィールドをJQueryに埋め込む方法
$("#emailAddress").val("[email protected]").changed()
、言って、ボンネットの下にフィールドが変更として認識されていないことが表示されます：私は、たとえば、jQueryのを使用して試してみましたデータが欠落しています。
ソースコードを変更せずにアドホックJSを使用してReactフォームフィールドを自動生成する方法はありますか？
（注：私はこの種の直接操作はではないことを理解しています。一般的なアプリケーション開発でReactを使用する正しい方法ですが、ここではどのような解決策も探しています。 hoc手動テスト）。
//find element
let elem = document.querySelector("#emailAddress");
//create event
let event = new Event('input', { bubbles: true });
//set value
elem.value="[email protected]";
//trigger event
elem.dispatchEvent(event)
あなたはキスをしなければなりません、私はこの解決策を3ヶ月間探していましたが、私はあきらめました。ありがとうございました！！！！！！！！！！！！！！！！！！！！！ – Samul
私のコメントでの議論から、変更を予定している入力ごとに変更イベントを発生させたいと思います。
var element = document.getElementById('emailAddress'),
event = {
target: {
value: 'new value for the input'
}
};
element.onchange(event);
ありがとうございます。私の要素には、残念ながら、「onchange」メンバーはいませんでしたが、@ Utroの答えからの解決策は治療になりました。 –
それは本当にこれらのフィールドが実装されている方法によって異なります。これは、[Controlled Components]（https://facebook.github.io/react/docs/forms.html#controlled-components）のように聞こえます。これは、Reactが各入力の値を制御していることを意味します。 ReactベースのWebサイトで使用されている一般的なデザインパターンは、各変更フィールドが新しいフィールド値をいくつかの中央ストアに送信してReactコンポーネントを再作成する 'onChange'ハンドラを各入力フィールドに付加することです新しい値が存在する状態でレンダリングします。 –
...だから私はあなたが手動で、各フィールドにいくつかの値を含む変更イベントを発生させると思います。これにより、この集中型ストアは各フィールドを必要な値で更新します。 –
@MichaelParker - ありがとう、ええ、あなたが記述しているように、サイトは 'onChange'メカニズムを使用しています。適切な変更イベントを生成する方法に関するアイデア？私はhttp://stackoverflow.com/a/2856602/6524176に従って試しましたが、私は運がありませんでした。 –