Question

我正在尝试在使用CodeMirror组件的Web应用程序中的页面上编辑查询。我正在使用nightwatchjs和铬中的硒进行测试。我无法设置底层textarea元素，因为它不可见。 Nightwatchjs setValue方法不起作用，因为查询位于可编辑的div中。

示例尝试：

module.exports = {

'Testing save code change' : function (browser) {

browser
  .url("http://codemirror.net/index.html")
  .waitForElementVisible("#demo", 3000)
  .waitForElementVisible('.CodeMirror-code div:nth-child(3) .cm-string', 3000)
  .setValue('.CodeMirror-code div:nth-child(3) .cm-string', 'New String');

 }

};

有人可以提出一种有效的方法吗？

Answer 1

您可以单击CodeMirror元素，然后使用keys()进行输入。

browser.click('.CodeMirror textarea').keys('New String');

这会将值添加到文本区域内已有的值，因此如果需要，您必须进行更多的争论以删除其中的任何内容。

或者，您可以使用nightwatch.js的execute()函数直接调用CodeMirror的setValue()，依赖于您可以直接从DOM元素get the CodeMirror instance这样的事实。

browser.execute(function(text) {
    document.getElementsByClassName('CodeMirror')[0].CodeMirror.setValue(text);
}, ["you could also pass a variable in here"]);

与第一个选项不同，它不会触发所有与直接输入相同的内容（例如提示/自动填充），但它会正确设置一个确切的值。

使用nightwatchjs测试其中包含CodeMirror组件的页面

1 个答案: