Я пытаюсь проверить динамически добавление функции onkeydown к элементам узла динамически в цикле for.
Вот соответствующий код:
export class Tab extends React.Component {
constructor(props) {
super(props);
this.tabInput = null;
this.setTabInputRef = element => {
this.tabInput = element;
};
this.handleKeyDown = (event, self) => {
if (event.key === 'ArrowRight' || event.key === 'Right') {
if (self.nextSibling) {
self.nextSibling.focus();
} else {
self.parentNode.firstChild.focus();
}
} else if (event.key === 'ArrowLeft' || event.key === 'Left') {
if (self.previousSibling) {
self.previousSibling.focus();
} else {
self.parentNode.lastChild.focus();
}
}
};
}
componentDidMount() {
const node = this.tabInput;
for (let i = 0; i < node.childNodes.length; i++) {
const self = node.childNodes[i];
self.onkeydown = event => {
this.handleKeyDown(event, self);
};
self.onkeydown = event => {
this.handleKeyDown(event, self);
};
}
}
render() {
return (
<ul ref={this.setTabInputRef}>
{ this.props.children }
</ul>
);
При тестировании с помощью Enzyme, какможно проверить назначение функции для self.onkeydown?Вот что я попробовал:
it('should set onkeydown on each child element', () => {
const tree = mount(<Tab><div id="hello-div"> hello </div></Tab>);
const instance = tree.find('#hello-div').instance();
instance.onkeydown = jest.fn(event => jest.fn(event, instance));
})
Я также приложил скриншот моего тестового покрытия.