web-dev-qa-db-ja.com

エラー：メソッド「props」は、単一ノードでのみ実行されることを意図しています。代わりに2が見つかりました

it('should call setCampaignDate on click', function () {
    let spySetCampaign = sinon.spy(wrapper.instance(), 'setCampaignDate');
    let datePickers = wrapper.find('.campaign-date-tab').dive().find(Datepicker);
    assert.equal(datePickers.length, 2);
    console.log(datePickers);
    var date = new Date();

    for (let index = 0; index < datePickers.length; index++) {
      datePickers.simulate('change'); 
      sinon.assert.calledOnce(spySetCampaign.withArgs(date, 'startDate'));
    }


  });

「変更」機能をシミュレートし、「setCampaignDate」が呼び出されるかどうかをテストしようとしています。ここでの問題は、findによって返される私の浅いコンポーネントの長さが2であることです。

let datePickers = wrapper.find('.campaign-date-tab').dive().find(Datepicker);

「datepickers」でsimulateを呼び出そうとすると、次のようなエラーが発生します。

'Error: Method “props” is only meant to be run on a single node. 2 found instead.'.

1より大きいノードを持つコンポーネントでシミュレーションする方法がわからない。

reactjschai-enzyme
10
user3725876

コードを変更せずに複数のコンポーネントを使用する場合の答えは、酵素APIを使用して、必要なボタンの正しいインデックスを取得することです。

wrapper.find(Component).at(index).simulate('click');

コンポーネントはテスト対象の名前であり、インデックスは必要な番号です。

19
Boomer Rogers

問題：「.campaign-date-tab」と「Datepicker」をクエリすると、Finderは2つの要素を返します。 2つの異なる要素に対して一度にイベント（クリックなど）を実行することはできません。

解決策：アクセスしたい要素が何であれ、それを一意にします。

例：属性を設定して要素を一意に識別する

_<CampaignDateTab class="campaign-date-tab" data-test="dateTab1"/>
_

wrapper.find('[data-test="dateTab1"]')のようにクエリします

再度、CampaignDateTabコンポーネントに複数のDatepickerコンポーネントがある場合。次に、クラス名や属性名などでそれらを区別する必要があります。

一度に1つの要素でのみイベントをシミュレートできます。一部の要素を照会しても、複数の要素が返されることはありません。

5
Uday Sravan K

Forループを実行しています。このループでは、特異なdatePickerの代わりにdatePickers（配列）を使用しています。

次のことができるはずです。

datePickers[index].simulate('change');

0
patrick