javascript - Protractor - 选择文本

标签 javascript angularjs selenium webdriver protractor

我在使用 Protractor 选择一些文本时遇到了一些真正的麻烦。

一些上下文;这是用于编写新闻文章的 AngularJS CMS 系统。我要突出显示的文本位于页面大部分的文本区域内。类似的应用程序是 Google Docs 文档。

有了 webdriver,我相信我可以简单地使用一些东西来达到这种效果:

browser.actions().keyDown(protractor.Key.CTRL).sendKeys('a').perform();

但是,我在 MAC 上编写代码,虽然目前我们的测试是在 SauceLabs 的 Windows 机器上运行,但最终目标是转移到 MAC 上来模拟我们的用户。

根据 this post,我尝试了类似的代码行,但使用 Command(或 CMD)但它不起作用, OSX 不支持 native 按键事件。

我探索过的其他方法:

  1. 尝试在元素中单击三次以选择所有文本...但我无法让它工作(有帮助吗?)。由于鼠标光标必须悬停在文本上才能突出显示所有文本,所以这很复杂。

  2. 在我本地机器上的字段内双击可以选择文本区域中的最后一个作品,但在 SauceLabs 中,浏览器较小,因此可以选择不同的词。这感觉太脆弱了,因为它在大多数机器上都会有所不同。

  3. 将文本光标移动到文本区域的开头或结尾,按住 Shift 键并根据文本区域中的字符数按向左或向右箭头键。在此实现中,我无法将光标移动到文本字段的开头或结尾。

感谢阅读,我知道这篇文章有点长!如果您能想到一种我还没有想到的方法,或者一种对三次点击或箭头键方法进行编码的方法,那将非常有帮助!

最佳答案

好的,我设法通过使用 .executeScript 方法以编程方式选择文本来解决这个问题。

这有点作弊,因为它没有模仿用户的交互,但我找不到替代方案,它被认为是一个可以接受的解决方法。

如果你感兴趣的话,这里是代码,这将选择文本区域中的第一段:

Article.prototype.selectFirstParagraph = function(driver) {
    driver.executeScript(function () {
        var range = document.createRange();
        range.selectNode(document.body.querySelector('.ui-rich-text-editor__input').firstChild);
        var sel = window.getSelection();
        sel.removeAllRanges();
        sel.addRange(range);
        return sel;
    });
}

关于javascript - Protractor - 选择文本,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/25620486/

相关文章:

javascript - PHP 警报不显示

javascript - 从 Backbone 事件监听器回调函数中获取返回值

javascript - Vue.js 中使用 prop.sync 和 watcher 进行双向绑定(bind)

javascript - React Native 中未处理的 promise 拒绝

javascript - 使用 ng-repeat 时无法添加和删除类

javascript - Angular - 使用范围变量设置 ng-model

javascript - AngularJS:翻译服务调用返回不可用的$$state对象

选择单选按钮的 Selenium 代码

java - 使用 Webdriver 确定页面是否已更改

python - Selenium find element_by_id 不适用于单选按钮