Версия трафарета:
@stencil/[email protected]
Шутливая версия:
"jest": "24.8.0"
Текущее поведение:
Я пытаюсь сфокусировать элемент ввода на нажатии кнопки. Это работает нормально, однако при попытке протестировать функциональность с помощью npm test
, jest
выдает TypeError
, говоря, что фокус не является функцией.
Эта ошибка повторяется для всех ручных вызовов событий, таких как click
, blur
, focus
. Следовательно, тестовые случаи не проходят.
Ожидаемое поведение:
Он не должен выдавать ошибку.
Действия для воспроизведения: я предоставляю соответствующий демонстрационный код для проверки. Связанный код:
demo-btn.tsx
import { Component, h, Element } from '@stencil/core';
@Component({
tag: 'demo-btn',
styleUrl: 'demo-btn.css',
shadow: true
})
export class DemoBtnComponent {
@Element() el!: HTMLElement;
private inputEl?: HTMLElement;
onClick = () => {
if (this.inputEl) {
this.inputEl.focus();
}
}
render() {
return (
<div class="input-container">
<input ref={el => this.inputEl = el} type="text" />
<button onClick={this.onClick}>
Click Me
</button>
</div>
);
}
}
demo-btn.spec.tsx
import { newSpecPage } from '@stencil/core/testing';
import { DemoBtnComponent } from './demo-btn';
describe('my-component', () => {
it('should focus input el on btn click', async ()=> {
const page = await newSpecPage({
components: [DemoBtnComponent],
html: '<demo-btn></demo-btn>',
});
const btn = page.root.shadowRoot.querySelector('button')
btn.click(); // Throws error after this line
await page.waitForChanges();
expect(true).toBeTruthy(); // For sake of completion
});
});
Любая помощь будет оценена.