Как выполнить модульное тестирование условного рендеринга деконструированных свойств? - PullRequest
2 голосов
/ 12 июля 2020

Я хочу проверить существование элемента Typography из Material-UI, когда свойство bio истинно. Однако я получаю сообщение об ошибке, что элемент не получен. Посоветуйте, пожалуйста.

MyComponent. js

const MyComponent = (props) => {
  const {
    classes,
    profile: { handle, createdAt, profileImage, bio, website, location}
  } = props;

  return (
    {bio && <Typography variant='body2'>{bio}</Typography>}
  )

  MyComponent.propTypes = {
    profile: PropTypes.object.isRequired,
    classes: PropTypes.object.isRequired
  }
}
export default withStyles(styles)(MyComponent)

MyComponent.test. js

describe('<MyComponent />', () => {
  let shallow;
  let wrapper;

  const myProps = {
    profile: {
        bio: 'this is a bio'
    }
  }

  beforeEach(() => {
    shallow = createShallow();
    wrapper = shallow(<MyComponent {...myProps} />);
  })

  it('should render a Typography element', () => {
    console.log(wrapper.debug(MyComponent));
    expect(wrapper.dive().find(Typography)).toHaveLength(1);
  })
})

Ошибка

expect(received).toHaveLength(expected)

Expected length: 1
Received length: 0
Received object: {}

console.error node_modules/@material-ui/styles/mergeClasses/mergeClasses.js:36
Material-UI: the key `bio` provided to the classes prop is not implemented in MyComponent.
You can only override one of the following: paper,profile.
console.log src/components/MyComponent/MyComponent.test.js:36
<MyComponent classes={{...}} profile={{...}} />
Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.
...