如何在量角器测试中使用 CKEditor 将数据设置为字段？

Question

我的问题是，当我尝试使用 CKEditor 将数据设置到字段中时，我在量角器中收到消息 "element not visible"。应用程序正在使用 AngularJS。

element(by.model("question.translations[lang.locale].answer")).sendKeys("Test answer e2e!!!");

如何在 Protractor 测试中使用 CKEditor 设置（或获取）数据到字段？ HTML代码：

<div ng-repeat="lang in languages">
  <div class="col-md-4">
    <div class="input-icon right">
       <div ckeditor="CKoptions" ng-model="question.translations[lang.locale].answer"></div>
    </div>
  </div>
</div>

当我尝试这个时

var value = 'Hello';
browser.executeScript(function (arguments) {
    window.CKEDITOR.instances.html_editor.setData(arguments[0]); 
}, value);

我收到错误：失败：未知错误：无法读取未定义的属性 'setData'

Answer 1

执行protractor.ExpectedConditions检查元素的可见性并将数据发送给它。如果您仍然面临同样的问题，请粘贴元素 HTML 代码。以便我能提供帮助。

代码段

var EC=protractor.ExpectedConditions;
var  
  inputField=element(by.css('div[ckeditor="CKoptions"]'));

  inputField.click();


browser.wait(EC.visibilityOf(inputField),8000,'Input filed is not visible');
browser.wait(EC.elementToBeClickable(inputField),8000,'Input filed is not  
            clickable');
inputField.sendKeys("Test answer e2e!!!");

Answer 2

我找到了解决方案

browser.switchTo().frame(element(by.css('#cke_editor1 iframe')).click().sendKeys("Test answer e2e"));

Answer 3

我通过标题字段中的名称读取实例使其开始工作。

    var statamentDes = 'Hello';
    browser.executeScript(function (arguments) {
        var name = "editor1" // split title to get this
        window.CKEDITOR.instances[name].setData(arguments); 
    }, statamentDes);

<iframe src="" frameborder="0" class="cke_wysiwyg_frame cke_reset" style="width: 100%; height: 100%;" title="Rich Text Editor, editor1" tabindex="0" allowtransparency="true"></iframe>

如何在量角器测试中使用 CKEditor 将数据设置为字段？

How can I set data to field with CKEditor in Protractor test?

ckeditor

angularjs

protractor