Не могу разобраться с симуляцией события keyUp на Jest?

Question

[Денис]

Здравствуйте. Пробую писать тесты на Jest. Столкнулся с проблемой описания события keyUp. Подскажите что не так в моем тесте

React:

state = {
        tabFocused: false
    };

onKeyUp = (e: SyntheticKeyboardEvent<HTMLElement>) => {
        if (
            e.keyCode === KEY_CODES.TAB &&
            document.activeElement === this.input
        ) {
            this.setState(() => ({
                tabFocused: true
            }));
        }
    };

render() {

        return (
            <label onKeyUp={this.onKeyUp}>
                <span>
                    <input
                        disabled={disabled}
                        type="checkbox"
                        checked={value}
                        id={id}
                        name={name}
                        className={sn('toggle__input')}
                        onChange={({target: {checked}}) => onChange(checked)}
                        onFocus={onFocus}
                        onBlur={this.onBlur}
                        ref={this.withRef}
                    />
                </span>
            </label>
        );
    }

Test:

import React from 'react';
import {shallow, mount} from 'enzyme';
import {Input} from '../../src';

test('calls onKeyUp', () => {
        const wrapper = shallow(<Input.Toggle id="toggle" name="test-toggle" />);
        expect(wrapper.state().tabFocused).toBe(false);
        wrapper.find('.toggle').simulate('keyUp', {keyCode: 9});
        expect(wrapper.state().tabFocused).toBe(true);
    });

Answer 1

[Aleksei Podgaev]

enzyme, который ты судя по всему используешь (jest тут ни при чём) не симулирует браузерные эвенты. он просто вызывает обработчик указанного события, привязанный к найденному элементу. У тебя обработчик привязан к label, поэтому его и нужно искать для запуска simulate. ты же ищешь, как я понимаю, input и пытаешься вызывать simulate у него.