我不明白为什么测试失败

Question

I've looked at jest and enzyme documentation and don't know where else to find out how to do this.

Heres the test:

describe('The tile grid displays the tile container when there is no error and it is 
not loading', () => {
  let wrapper;
  beforeEach(() => {
    const defaultProps = {
      ...TileGridDefaultPropsInit,
 
    };
   wrapper = shallow(<TileGrid  {...defaultProps} />);

    console.log(wrapper.debug());
 });

  it('it displays the tile grid container', () => {
    expect(wrapper.find('.tile-grid__container')).toHaveLengthOf(1);
  });});

Heres the output from console.log(wrapper.debug())

    <div className="tile-grid">
          <div className="tile-grid__heading">
            Top Stories
          </div>
          <div className="tile-grid__container">
            // theres a load of stories here - too long to put paste onto this question.
            
           
        
      </div>
    </div>

Answer 1

According to documentation from Jest , the method is actually called toHaveLength :

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

On the other hand, documentation from Enzyme uses expect from Chai assertion which has to.have.lengthOf

https://enzymejs.github.io/enzyme/docs/api/ShallowWrapper/find.html

Choose either Jest or Chai for writing this unit test.