Как написать контрольные примеры для setState реагируют на ловушки, используя шутки и энзимы? - PullRequest
0 голосов
/ 04 мая 2020

Здесь мне нужно написать контрольные примеры с использованием реакционных хуков для использования состояния в шутке и энзиме. У меня есть две кнопки, и в зависимости от выбора кнопки будет загружен component1, если selectedBtn = "btn1"

Как мне написать контрольные примеры, чтобы определить, какая кнопка выбрана и на основании чего мне нужно загрузить component1, если выбран btn1, и component2, если выбран btn2.

const [selectedBtn, setSelectedBtn] = useState("btn1");
 const clickBtn = (btnType: string): void => {
    setSelectedBtn(btnType);
  };
  
<button className={classBtn1} onClick={(): void => {clickBtn("btn1");}}> Button1  </button>
<button className={classBtn2} onClick={(): void => {clickBtn("btn2");}}> Button2 </button>

 {selectedBtn === "btn1" ? ( <div> <Component props={comp1}/> </div>)   : (<div> <Component2 props={comp2}/> </div>)}

Я пытался использовать следующие тестовые наборы, но я не знаю, как написать тестовые наборы для ловушек useState. Как мне нужно изменить следующие тестовые наборы для достижения функциональности упомянутый выше.

it("Clicks the component", (): void => {
    // @ts-ignore
    const wrapper = mount(
      <Router>
        <button onClick={clickBtn("btn1")} />
      </Router>
    );
    wrapper
      .find("button")
      .simulate("click");
    expect(Component).toHaveBeenCalledWith("comp1");
  });
...