此问题基于演示存储库https://github.com/bartocc/so-enter-key-integration-test
这个演示Ember.js 3.12应用程序包含<XFoo>
组件。当渲染时,它显示一个简单的<form>
,其中有一个文本输入和一个提交按钮。<form>
在其submit
事件上绑定了一个操作,该操作将组件的submitted
属性设置为true
。默认情况下,该属性为false
。
所需的行为是在提交后显示感谢消息,而不是<form>
。
以下是组件的模板:
{{#if this.submitted}}
<span>
Thank you for your submission
</span>
{{else}}
<form {{action (mut this.submitted) true on="submit"}}>
{{! template-lint-disable self-closing-void-elements }}
<input type="text" />
<button type="submit">
Save
</button>
</form>
{{/if}}
我为<XFoo>
添加了2个集成测试:
- 尝试将
Enter
keydown事件发送到<input>
标签
await render(hbs`<XFoo />`);
await triggerKeyEvent('input', 'keydown', 'Enter');
- 另一个单击提交按钮
await render(hbs`<XFoo />`);
await click('button');
这两个测试都会检查感谢消息是否存在:
assert.dom('span').hasText('Thank you for your submission', 'displays the thank you span');
第一个测试失败,第二个通过。
我想了解为什么使用triggerKeyEvent
不能提交表单。
1条答案
按热度按时间yquaqz181#
我能够通过使用本机事件调度程序来触发它:
我在填充输入的内容后调用这个