Как смоделировать выбор из выпадающего списка в Jest / энзимном тестировании? - PullRequest
0 голосов
/ 22 октября 2018

Я пытаюсь написать шутные тесты для моего компонента React с выпадающим списком, подобным этому:

<select id="dropdown" onInput={this.handlechange} ref={this.refDropdown}>
    {this.props.items.map(item => {
        return (
            <option key={item.id} value={item.id}>
                {item.name}
            </option>
        );
    })}
</select>

, и обработчик выглядит так:

handlechange = () => {
    const sel = this.refDropdown.current;
    const value = sel.options[sel.selectedIndex].value;
    //...
}

Я хочуИмитация пользователя, выбирающего 2-ую запись (или что-либо, кроме первой) в списке, но у меня возникли проблемы.Если я имитирую событие «change», оно запускает вызов handlechange(), но selectedIndex всегда устанавливается в ноль.

Я пробовал этот код в тесте jest, но он не вызывает selectedIndexбыть доступным в обработчике.

const component = mount(<MyComponent/>);
component.find("#dropdown").simulate("change", {
    target: { value: "item1", selectedIndex: 1 }
});

То, что происходит, почти правильно.Если я посмотрю на входящее событие, я увижу, что e.value установлен на «item1», но он не действует, как будто выбор был фактически сделан.

Я также пытался попытатьсяотправлять имитации «щелчка» непосредственно в элемент Option, но это ничего не делает.

Как правильно имитировать выделение из раскрывающегося списка?

Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.
...