在 MochaJS 中测试输入

如何解决在 MochaJS 中测试输入

我对 MochaJS 测试框架还很陌生，我正在尝试验证下拉菜单以响应用户输入。我有一个具有以下方法的组件：

在我的搜索组件中：

  createqueryInputEl() {
    const inputEl = document.createElement('input');
    Object.assign(inputEl,{
      type: 'search',name: 'query',autocomplete: 'off',});

    inputEl.addEventListener('input',event =>
      this.onQueryChange(this,event.target.value));

onQueryChange() 函数通过为每个结果创建一个 li 元素来创建下拉列表，如下所示：

createResultsEl(results) {
    const fragment = document.createDocumentFragment();
    results.forEach((result) => {
      const el = document.createElement('li');
      Object.assign(el,{
        className: 'result',textContent: result.text,});

      // Pass the value to the onSelect callback
      el.addEventListener('click',(event) => {
        const { onSelect } = this.options;
        if (typeof onSelect === 'function') onSelect(result.text);
        this.displaySelected(this.inputEl,result.text)
      });

      fragment.appendChild(el);
    });
    return fragment;
  }

在 MochaJS 中，我试图像这样测试下拉列表的数量：

    it('should populate input on value selection',() => {

          const input = document.querySelector('input');
          input.value = "New"
          input.dispatchEvent(new Event('input'));

          const results = document.querySelectorAll('.result');
      
          expect(true).toBeTruthy();
    })

问题是 results 不断出现空值。当我在控制台中输入该代码时，results 是一个 NodeList，带有结果的每个 li 元素。

如何让 MochaJS 模拟这种行为？