Ошибка: Uncaught [Инвариантное нарушение: объекты недопустимы как дочерний элемент React - PullRequest
0 голосов
/ 19 марта 2020

Написание теста рендеринга для компонента и не может разрешить эту ошибку:

Error: Uncaught [Invariant Violation: Objects are not valid as a React child (found: object with keys {$$typeof, type, compare, displayName, muiName}). If you meant to render a collection of children, use an array instead...

Я знаю, что это должно быть что-то простое, но я разрываюсь. Вот как выглядит мой тестовый файл:

import React from 'react';
import { render } from '@testing-library/react';

import DashboardCard from '../index';

const CardWithProps = () => (
  <DashboardCard title="title">
    <div>child</div>
  </DashboardCard>
);

describe('<DashboardCard />', () => {
  it('Expect to not log errors in console', () => {
    const spy = jest.spyOn(global.console, 'error');
    render(<CardWithProps />);
    expect(spy).not.toHaveBeenCalled();
  });
});

DashboardCard:

import React from 'react';
import T from 'prop-types';

import { CardContainer, StyledSpan } from './styledComponents';

const DashboardCard = ({ children, title }) => (
  <CardContainer>
    <StyledSpan>{title}</StyledSpan>
    {children}
  </CardContainer>
);

DashboardCard.propTypes = { children: T.node.isRequired, title: T.string.isRequired };

export default DashboardCard;

CardContainer:

import styled from 'styled-components';

export const CardContainer = styled.article`
  background-color: white;
  padding: 2rem 4rem 1rem;
`;
...