Как смоделировать событие на дочернем компоненте при монтировании родительского компонента?

Question

Необходимо использовать mount(<parentComp><testedComp /></parentComp>) для моделирования useLocation. В testsComp есть элемент ('.tabs'), который я хочу смоделировать, нажав (событие onChange). Я должен был сделать симуляцию, когда на TestComp была сделана небольшая визуализация. Как получить мелкий дочерний компонент из родительского компонента монтирования? Или есть другой способ смоделировать событие в таком случае? Просто при необходимости: мой testComp - это функциональный компонент.

Функция дескриптора:

const handleTabChange = (event: React.ChangeEvent<{}>, tab: number) => {
    console.log("test handleTabChange: " + tab);
    setCurrentTab(tab);
  };

Код HTML компонента Header:

  <Tabs className="tabs" value={currentTab} onChange={handleTabChange}>
       <Tab
              className="tab"
              component={Link}
              to={routes....}
              label={
                <div className="tab-label">                  
                   ...
                </div>
              }
            />
       <Tab
              className="tab"
              component={Link}
              to={routes....}
              label={
                <div className="tab-label">                  
                   ...
                </div>
              }
            />
    </Tabs>

Тест код:

wrapper = mount(
            <MemoryRouter initialEntries={["....."]}>
                <Header />
            </MemoryRouter>
        );
wrapper.find(Header).find(Tabs).simulate('change', {target: {value: 1}});
expect(wrapper.find(Header).find(Tabs).props().value).toEqual(1);

Большое спасибо.

Answer 1

Предполагая, что существует только один элемент с className .tabs, вы можете использовать метод энзима find () , чтобы найти указанный узел c, который соответствует требуемым селекторам. Оттуда вы можете смоделировать событие щелчка, которое вызовет метод, связанный с событием щелчка на этом элементе.

const wrapper = mount(<parentComp><testedComp /></parentComp>);

wrapper.find(testedComp).find('.tabs').simulate('click');