Тестирование ReactJS: невозможно прочитать свойство 'иметь' из неопределенного

Question

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

//namePlate.js
import React from 'react';

const NamePlate = (props)=>(
  <div className = 'namePlate' style = {props.color(props.name)}>
    {props.name}
    <button id = {props.id} type = 'button' onClick = {props.onClick}>x</button>}
  </div>
)

export default NamePlate

//namePlate.test.js

import React from 'react';
import NamePlate from './namePlate.js';
import {shallow} from 'enzyme';


it('renders', () => {
  const wrapper = shallow(<NamePlate name = 'Test' id = '1' onClick ={() =>{}} color = {()=>{}}/>);
  expect(wrapper.find('div')).to.have.lengthOf(1);

})

Я получаю сообщение "TypeError: Невозможно прочитать свойство 'have' of undefined", и я действительно не уверен в том, что я делаю неправильно. Любая помощь приветствуется.

Answer 1

expect(wrapper.find('div')).toHaveLength(1);

https://jestjs.io/docs/en/expect#tohavelengthnumber