以编程方式编辑 CodeMirror 内容而不访问对象答案

【问题标题】：Programmatically edit CodeMirror contents without access to object以编程方式编辑 CodeMirror 内容而不访问对象
【发布时间】：2014-02-18 04:44:15
【问题描述】：

我正在使用 Selenium 在包含 CodeMirror 编辑器的页面上运行自动化测试。我无权访问该对象，但我确实有可用的 jQuery。如何以 CodeMirror 识别更改的方式编辑编辑器的内容？

【问题讨论】：

如果有人会搜索 Python-Selenium 处理 CodeMirror 编辑器的方式，这里是 sample。

标签： javascript selenium selenium-webdriver codemirror

【解决方案1】：

包装div DOM 元素（类CodeMirror）将有一个属性CodeMirror 引用编辑器实例对象。你可以打电话给setValue。

【讨论】：

【解决方案2】：

因为选择的答案帮助了我，所以在这里发布这个，但我缺乏一些信息来完全解决我的问题（主要是因为我不知道 JavaScript 或如何与 WebElement 属性交互）。这就是 Selenium/Java 代码的样子：

WebDriver driver = new FirefoxDriver();
WebElement queryInput = driver.findElement(By.cssSelector("div[class='CodeMirror']"));
JavascriptExecutor js = (JavascriptExecutor) driver;
js.executeScript("arguments[0].CodeMirror.setValue(\"" + query + "\");", queryInput);

【讨论】：

我收到参数 [0]。CodeMirror 未定义。
以这种方式将query 作为脚本的一部分显然是错误的（如果query 中有新行或" 字符，则会中断。将其放在另一个参数中。跨度>

【解决方案3】：

其他人发布的答案是正确的，但是如果您不想替换 codemirror 的值，而是想发送键盘事件，那么您可以这样做：

/* getting codemirror element */
WebElement codeMirror = driver.findElement(By.className("CodeMirror"));

/* getting the first line of code inside codemirror and clicking it to bring it in focus */
WebElement codeLine = codeMirror.findElements(By.className("CodeMirror-line")).get(0);
codeLine.click();

/* sending keystokes to textarea once codemirror is in focus */
WebElement txtbx = codeMirror.findElement(By.cssSelector("textarea"));
txtbx.sendKeys("Hello World");

要让 selenium 检测键盘事件，您首先必须使 codemirror 成为焦点。

【讨论】：

效果很好。谢谢。

【解决方案4】：

@user3233451 - 就我而言，我必须引用正确的 Web 元素，例如：By.cssSelector(".CodeMirror")。

此外，我在页面上有两个 CodeMirror Web 元素，因此我做了以下操作：

    //declare codemirror variable
    private By codeMirrorWebElement = By.cssselector(".CodeMirror");

    //use Javascript executor to access each code mirror element via its respective index
    ((JavascriptExecutor) driver).executeScript("arguments[0].CodeMirror.setValue( '"+ query1 + "');", driver.findElements(codeMirrorWebElement).get(0));
    ((JavascriptExecutor) driver).executeScript("arguments[0].CodeMirror.setValue( '"+ query1 + "');", driver.findElements(codeMirrorWebElement).get(1));

【讨论】：

【解决方案5】：

这对我不起作用...

driver.findElement(By.cssSelector("div[class='CodeMirror']"))

但这确实...

driver.findElement(By.className('CodeMirror'))

所以，我的代码最终是：

WebElement codeMirror driver.findElement(By.cssSelector("div[class='CodeMirror']"))
JavascriptExecutor js = (JavascriptExecutor) driver;
js.executeScript("arguments[0].CodeMirror.setValue(\"" + sqlValue + "\");", codeMirror);

【讨论】：

【解决方案6】：

这很有帮助！谢谢。

如果您使用的是柏树：

cy.get('.CodeMirror').then($cm => {
  $cm[0].CodeMirror.setValue(<some text value>)
})

【讨论】：