実際、私はreact-nativeでテストケースを書くためにreact-test-renderとjestを使用していますか? テストする必要があるコンポーネントがあり、そのコンポーネントには、接続されたコンポーネントであるネストされたコンポーネントが含まれています。以下は、コンポーネントをテストするために書いたコードです。
import React from 'react';
import renderer from 'react-test-renderer';
import sinon from 'sinon';
import { clone } from 'lodash';
import { ProfileImageSelect } from
'../../../../components/settings/ProfileImageSelect';
const userInfo = {
first_name: 'test_first_name',
last_name: 'test_last_name'
};
describe('<ProfileImageSelect />', () => {
let onClose;
let onSelect;
let socialLogins;
beforeEach(() => {
socialLogins = {
facebook: {
id: '187416164',
identifier: 'adams_facebook',
full_name: 'Eric Adams',
profile_pic: 'profile_pic_facebook.jpeg',
expired: false
},
twitter: {
full_name: 'Eric Adams',
id: '187416164',
identifier: 'adams_ea',
profile_pic: 'https://pbs.twimg.com/profile_images/707586445427380226/5uETA8fs.jpg',
expired: false
},
linkedin: {
full_name: 'Eric Adams',
id: '8vN6Da_RJJ',
identifier: 'adams.ea@gmail.com',
profile_pic:
'https://media.licdn.com/dms/image/C5603AQFfn5Ko5IS1NQ/profile-displayphoto-shrink_100_100/0?e=1549497600&v=beta&t=11m5mirEr_R2gf3OOfh3zHTL3Xe2ImrxcZ7l7ebLDa0',
expired: false
}
};
onClose = sinon.stub();
onSelect = sinon.stub();
});
it('calls onClose on the props on click of cancel link ', () => {
const connected = clone(socialLogins, true);
const testRenderer = renderer.create(
<ProfileImageSelect
onSelect={onSelect}
onClose={onClose}
socialLogins={connected}
userInfo={userInfo}
/>
);
const root = testRenderer.root;
root.findByProps({ className: 'cancel' }).props.onPress();
expect(onClose.called).toEqual(true);
});
});
しかし、次のようなエラーが表示されます:
不変違反: 「Connect(SocialServiceProfileImage)」のコンテキストまたは小道具で「ストア」が見つかりませんでした。ルート コンポーネントを でラップするか、明示的に「store」を prop として「Connect(SocialServiceProfileImage)」に渡します。
浅いレンダリングに「react-test-renderer/shallow」を使用できることはわかっていますが、Enzyme のように DOM からノードを見つけることはできません。誰でもこれで私を助けることができますか?. 私は酵素を持っておらず、react-redux-mock-store にも使用したくありません。