如何将文本发送到页面源中的富文本编辑器

时间:2018-06-16 05:45:36

标签: java selenium selenium-webdriver xpath webdriverwait

有人可以帮我在富文本编辑器中找到textarea吗?正在努力解决这个问题,无法找到解决方案。 试过这个(以及其他尝试):

List<WebElement> messageBody =  driver.findElements(By.xpath("//body[@class='cke_editable cke_editable_themed  cke_contents_ltr cke_show_borders']/p"));
    messageBody.get(0).sendKeys("Vamos con una apuesta para esta");

下面是截图,它看起来如何,也附加了pagesource。 先感谢您 enter image description here

enter image description here

以下是页面来源的一部分:

<form role="form" id="user_message_form">
<div class="form-body">
<div class="row">
    <div class="form-group col-md-12">  
<textarea id="user_message_editor" name="continut_mesaj" class="ckeditor form-control" rows="12" minlength="2" style="visibility: hidden; display: none;"></textarea>
<div id="cke_user_message_editor" class="cke_210 cke cke_reset cke_chrome cke_editor_user_message_editor cke_ltr cke_browser_webkit" dir="ltr" lang="en" role="application" aria-labelledby="cke_user_message_editor_arialbl">
<div class="cke_inner cke_reset" role="presentation">
<span id="cke_210_top" class="cke_top cke_reset_all" role="presentation" style="height: auto; user-select: none;"><span id="cke_218" class="cke_voice_label">Editor toolbars</span>
<div id="cke_210_contents" class="cke_contents cke_reset" role="presentation" style="height: 200px;"><span id="cke_303" class="cke_voice_label">Press ALT 0 for help</span><iframe src="" frameborder="0" class="cke_wysiwyg_frame cke_reset" style="width: 866px; height: 100%;" title="Rich Text Editor, user_message_editor" aria-describedby="cke_303" tabindex="0" allowtransparency="true"></iframe></div>
<iframe src="" frameborder="0" class="cke_wysiwyg_frame cke_reset" style="width: 866px; height: 100%;" title="Rich Text Editor, user_message_editor" aria-describedby="cke_303" tabindex="0" allowtransparency="true"></iframe>
#document
<html dir="ltr" lang="en"><head><title data-cke-title="Rich Text Editor, user_message_editor">Rich Text Editor, user_message_editor</title><style data-cke-temp="1">html{cursor:text;*cursor:auto}
<head>...</head>
<body contenteditable="true" class="cke_editable cke_editable_themed cke_contents_ltr cke_show_borders" spellcheck="false"><p><br></p></body>

1 个答案:

答案 0 :(得分:1)

快照中的 HTML 与您提供的文字 HTML 之间存在增量差异。

  • 如果Rich Text Editor不在任何<iframe>范围内,您可以使用以下解决方案:

    WebElement messageBody = driver.findElement(By.xpath("//body[@class='cke_editable cke_editable_themed cke_contents_ltr cke_show_borders']/p"));
    messageBody.click();
    messageBody.sendKeys("Vamos con una apuesta para esta");
    
  • 如果Rich Text Editor位于<iframe> 属性 class =&#34; cke_wysiwyg_frame cke_reset&#34; ,则首先切换到所需的 iframe ,如下所示:

    new WebDriverWait(driver, 20).until(ExpectedConditions.frameToBeAvailableAndSwitchToIt(By.xpath("//iframe[@class='cke_wysiwyg_frame cke_reset']")));
    new WebDriverWait(driver, 20).until(ExpectedConditions.elementToBeClickable(By.xpath("//body[@class='cke_editable cke_editable_themed cke_contents_ltr cke_show_borders']/p"))).click();
    messageBody.sendKeys("Vamos con una apuesta para esta");