如何使用 CasperJS 发送转义键（关闭模式）？答案

【问题标题】：how do I send an escape key press (to close a modal) with CasperJS?如何使用 CasperJS 发送转义键（关闭模式）？
【发布时间】：2016-04-14 21:15:48
【问题描述】：

使用 casper 测试模态对话框：

.then(function() {
   this.click(variables.configButton);
}).then(function() {
  this.capture('./test/screencaps/edit-afterClickFlyout1.png');
   test.assertVisible('#addDataDialog');
}).then(function() {
   // send ESC key, how? 
}).then(function() {
  this.capture('./test/screencaps/edit-afterClickFlyout2.png');
   test.assertNotVisible('#addDataDialog');
}).run(function() {
   test.done();
});

这是一个角度模式，所以按 ESC 将关闭它。 Casper 有 sendKeys 但是：

目前支持的可以接收键盘事件的 HTMLElements 从 sendKeys 是 , , 和任何 HTMLElement 与属性 contenteditable="true"。

如果我在页面上没有任何文本输入，那就有点问题了。我可以在其他控件上添加一个或设置 contenteditable，但这意味着我正在修改页面以使测试通过，这并不好。

（我通过给取消链接一个 id 并在其上使用 this.click 解决了这个问题，但我真的不应该修改我的标记来使测试通过）

如何使用 casper 发送一个简单的按键？

【问题讨论】：

标签： javascript angularjs functional-testing casperjs

【解决方案1】：

要走的路是发送 phantomjs 特殊键。

casper.then(function() {    
    test.comment('Send Esc key');
    this.sendKeys('#contact-us-modal', casper.page.event.key.Escape);
});

这是 casper.page.event.key 中可用的特殊键的list

这是sendKeys 文档链接。

【讨论】：

这个问题太老了，我无法验证这个答案（差不多 2 年，哎呀），但这似乎比使用 jquery 更好

【解决方案2】：

如果您的页面中有 jQuery，您可以使用此代码来触发密钥，但出于安全考虑，它可能无法正常工作。看到这个post。

casper.thenEvaluate(function(){
    var esc = $.Event("keydown", { keyCode: 27 });
    $("body").trigger(esc);
});

我确定也有非 jQuery 版本。

【讨论】：