Props undefined после нескольких перенаправлений

Question

Я пытаюсь реорганизовать свои тесты React для повторного использования кода, чтобы я мог возвращать компонент React через функцию, которая принимает аргументы компонента, хранилища провайдера и создаваемых реквизитов. первая функция правильно передает адрес электронной почты, однако при создании самого компонента она работает иначе.

Тест. js

it('perform test', () => {
    const email = '123@test.com

    // define my store
    ...

    provider = getComponent(MyReactComponent, store, {email});
    ...
}

утилит js

export const getComponent = (Component, store = null, ...props) => {
    console.log({props}); // returns { props: [ { email: '123@test.net' } ] }

    const mockStore = configureStore();
    return <Provider store={mockStore(store)}><Component {...props}/></Provider>;
}

MyComponent.jsx

const MyComponent = ({email}) => {
    console.log({email}); // returns undefined
    ...

Answer 1

Изменить

export const getComponent = (Component, store = null, ...props) => {

На

export const getComponent = (Component, store = null, props) => {

Реквизиты не предназначены для распространения в виде массива. То, как это работает с вашим текущим кодом, заключается в том, что вы, вероятно, получаете объект {email: '123@test.net'} под prop 0 (из-за того, что он находится под 0-м индексом в массиве)