Как проверить контейнер, чтобы сказать мне, что он знает, сколько предметов он держит

Question

Этот компонент генерирует неупорядоченный список с 5 li.Я просто хочу написать тест, который говорит, что этот контейнер знает, сколько li сидит внутри него.Я буквально использую тот же код, что и в Enzyme docs, НО вместо того, чтобы получить желаемый результат, я получаю пустой объект {}.Что я делаю неправильно?Примечание: у меня также установлен Jest, так что ... это также сбивает меня с толку.(Я ожидаю, что «Ожидаемый» и «Полученный» вернутся как 5)

тестовый вывод

    expect(received).toEqual(expected)

    Expected: 5
    Received: {}

код компонента

import React from "react"
import TabLink from "./TabLink";
import ErrorBoundary from "./ErrorBoundary";
import Nav from "./Nav";

export default function TabLinkContainer({selectedId, items, handleClick}) {

    const tabLinks = items.map(({id, label, isDisabled}) => (
        <ErrorBoundary key={id}>
            {/*{console.log("inside TabLinkContainer: ", selectedId, ",", id)}*/}
            <TabLink
                id={id}
                handleClick={handleClick}
                isDisabled={isDisabled}
                isSelected={selectedId === id}
                text={ typeof label === 'object' ? label.text : label}
                icon={label.icon || null}
            />
        </ErrorBoundary>
    ));
    return <Nav tabs className="scroll">{tabLinks}</Nav>;
}

тестовый файл

import React from 'react';
import Enzyme, { mount } from 'enzyme';
import Adapter from 'enzyme-adapter-react-16';
import TabLinkContainer from '../Tabs/TabLinkContainer';
import TabData from '../Tabs/TabsData';
Enzyme.configure({adapter: new Adapter()});

let activeTab = '0';
let post = TabData;

describe('TabLinkContainer', () => {
    const handleClick = (tab,event) => {
        event.preventDefault();
        if (active !== tab) {
            this.setState({ active: tab })
        }
    };

    it('knows number of tabs it contains', () => {
        const wrapper = mount(
           <TabLinkContainer
               selectedId={active}
               handleClick={handleClick}
               items={post}
           />
           );
        expect(wrapper.find('ul').children()).toEqual(5);
    });
});

Answer 1

Вы пытаетесь сравнить children элемента ul с числом.

То, что вы ищете, будет count children:

expect(wrapper.find('ul').children().length).toEqual(5);

ИЛИ используйте expect s встроенный toHaveLength метод:

expect(wrapper.find('ul').children()).toHaveLength(5);