如何确定OnsenUI组件是否在单元测试中被编译

Question

我的项目是使用vue-cordova-webpack模板构建的。我创建了一个vue组件。v-ons-input我组件的模板内有。我需要v-ons-input在组件的单​​元测试期间更改的值。我只能做后它ons-input被编译，因为编译后，才ons-input具有input内部（见约OnsenUI组件编译）。问题是编译是异步执行的，当OnsenUI组件准备就绪时，我找不到任何“合法”方式来捕获事件。

我该怎么办？我创建了一个内部方法兴农间谍_compile的ons-input，等到它被称为：

it('test', (done) => {
   const wrapper = mount(myVueComponent)

   // here I can't set a value for ons-input

   var spy = sinon.spy(wrapper.find('ons-input').element, '_compile')

   function waitForCall(spy) {
     return new Promise(function (resolve, reject) {
       (function wait() {
         if (spy.called) {
           return resolve()
         }
         setTimeout(wait, 10)
       })()
     })
   }

   waitForCall(spy).then(function () {
     // now ons-input is compiled and I can set a value for ons-input
     wrapper.find('ons-input').element.value = 'foo'
     ...
   }).then(done, done)
 })

是否有更多“干净”的方法来确定OnsenUI组件已准备好用于单元测试（无需使用该组件的内部方法进行操作）？

PS我知道不适合测试环境的方法-监听init事件document（请参阅此处），但是在单元测试中不起作用。

Answer 1

setTimeout应该和这里的任何东西一样好。

setTimeout(() => document.querySelector('ons-input input'));

内部细节（可跳过）

VOnsInput 定义import 的 文件ons-input，它注册ons-input为自定义元素。这是同步发生的，因此只要执行了 Vue 组件的脚本，就可以保证将其ons-input注册为自定义元素。

在注册期间ons-input，Onsen UI 使用一个函数contentReady来等待编译完成，但该函数不是公共 API 的一部分。然而，contentReady使用setTimeout（从技术上讲setImmediate，但它相当于同一件事）作为后备setTimeout，因此一旦你有效地做同样的事情就使用。

简而言之，这意味着 using应该保证在运行回调时附加setTimeout内部。inputsetTimeout