如何在 CodeMirror 编辑器中使用 selenium 模拟关键事件答案

【问题标题】：How can I simulate key events with selenium in a CodeMirror Editor如何在 CodeMirror 编辑器中使用 selenium 模拟关键事件
【发布时间】：2014-09-16 17:10:03
【问题描述】：

周围有很多例子展示了如何使用以下内容来使用 selenium 输入文本

driver.execute_script('cm.setValue("text")');

这可行，但对我们来说不是很“硒”。我们想模拟实际的键盘按键，例如 selenium 中的 send_keys 函数。我们创建了一个 enterFormData，它使用 driver.send_keys() 获取一个元素并为其输入类型（例如，一个带有我们可以轻松模拟输入的 ID 的文本区域）。我们如何在 CodeMirror 编辑器中模拟实际的按键操作？我们还希望能够测试热键（例如 Ctrl-Shift-M），然后执行 driver.get_screenshot_as_base64()

【问题讨论】：

如果您首先确保 CodeMirror 被聚焦，您对普通 textarea 工作的方式不是吗？它由一个隐藏的文本区域支持，它将接收关键事件。

标签： javascript python selenium codemirror

【解决方案1】：

要让 selenium 检测键盘事件，您首先必须使 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");

【讨论】：

它可以工作，但在 codeMirror.findElements(By.className("CodeMirror-line")).get(0);它应该是 CodeMirror-lines

【解决方案2】：

codemirror 实例中应该有一个隐藏的文本区域，用于捕获键盘事件...

我做了这样的事情：

driver.findElement(By.css('.CodeMirror textarea'))
    .sendKeys('text', 
        webdriver.Key.chord(webdriver.Key.CONTROL, webdriver.Key.SHIFT, "m"));

这个位：webdriver.Key.chord(webdriver.Key.CONTROL, webdriver.Key.SHIFT, "m")模拟（Ctrl+Shift+M）

【讨论】：

不幸的是，textarea 被隐藏了，selenium 显示了一个不可见的异常。我必须通过 setValue 来完成。
这很有趣，因为这适用于我的用例。

【解决方案3】：

我自己已经找到了问题https://stackoverflow.com/a/48969245/6077069 的答案。您应该使用驱动程序的动作链而不是元素 send_keys。这对我来说是有效的。

【讨论】：