В своем коде React я слушаю FocusEvent и проверяю тип элемента, на который фокусируется:

function onBlur(event) {
    if(event.relatedTarget instanceof HTMLInputElement) { /* ... */ }
}

Это отлично работает. Кажется, я просто не могу написать для него правильный модульный тест ... Я решил, что смогу вызвать метод onBlur следующим образом:

onBlur({ relatedTarget: new HTMLInputElement() });

... но, к сожалению, это приводит к ошибке:

TypeError: Illegal constructor

Я использую Jest и Enzyme (который, я думаю, использует jsdom?), Если это имеет значение.

Как лучше подойти к этому?

2
Vincent 30 Авг 2017 в 11:02

3 ответа

Лучший ответ

Используя это, вы можете издеваться над своим элементом:

var a = document.createElement('input')
a instanceof HTMLInputElement // returns true

Если вам нужно добавить больше поведения, вы можете просто добавить его к объекту a.

3
eddyP23 30 Авг 2017 в 08:08

Еще один подход - изменить способ проверки входного элемента. Вы можете использовать tagName, которая должна быть строкой INPUT:

function onBlur(event) {
    if(event.relatedTarget.tagName === 'INPUT') { /* ... */ }
}

onBlur({ relatedTarget: {tagName: 'INPUT'} });
0
dfsq 30 Авг 2017 в 08:10

Это даст оценку true:

document.createElement('input') instanceof HTMLInputElement
1
klaasman 30 Авг 2017 в 08:08