React-Testing: отладка, почему этот jest-тест-снимок не выполняется для компонента, использующего Grid Material UI

Question

У меня есть компонент многократного использования, использующий контейнеры Material UI Grid. У меня есть простой тест снимка в шутку, и я получаю сообщение

Summary of all failing tests
 FAIL  src/components/Form/__tests__/FormContentGrid.node.js
  ● renders correctly

    Warning: Failed prop type: The prop `xs` of `Grid` must be used on `item`.
        in WithStyles(ForwardRef(Grid))

      11 |       </LabelWrapper>
      12 |     </Grid>
    > 13 |     <Grid container spacing={1} xs={10}>
         |     ^
      14 |       {children}
      15 |     </Grid>
      16 |   </Grid>

Вот компонент, для которого написан тест:

import React from 'react';
import PropTypes from 'prop-types';
import { Grid } from '@material-ui/core';
import { LabelWrapper, SideLabel } from './components';

const FormContentGrid = ({ label, children }) => (
  <Grid container spacing={1}>
    <Grid item xs={1}>
      <LabelWrapper>
        <SideLabel>{label}</SideLabel>
      </LabelWrapper>
    </Grid>
    <Grid container spacing={1} xs={10}>
      {children}
    </Grid>
  </Grid>
);

FormContentGrid.propTypes = {
  label: PropTypes.string,
  children: PropTypes.node,
};

export default FormContentGrid;

Вот тест:

import React from 'react';
import { shallow } from 'enzyme';

import FormContentGrid from '../FormContentGrid';

it('renders correctly', () => {
  const component = shallow(<FormContentGrid label="test" />);

  expect(component).toMatchSnapshot();
});

Я пытаюсь выяснить, почему тест не пройден и как его исправить

Answer 1

Похоже, что способ обойти это состоит в том, чтобы установить элемент равный true в контейнере.

<Grid container spacing={1} xs={10} item={true}>