如何使用CodeceptJs找到并键入SimpleMde RichText编辑器

问题描述

我正在尝试使用CodeceptJs和Selenium键入RichText编辑器，但到目前为止，我唯一能做的方法是单击页面上的上一个输入字段，然后将其切换到RichText编辑器然后在其中添加模拟键盘交互的文本。但是，我觉得可能有更好的方法来做到这一点，并找到编辑器以查看其是否显示在屏幕上。

我尝试抓住在检查页面时看到的textarea和span标签，但是它们都不起作用。我也花了很长时间尝试使用javascript执行程序删除似乎与该字段伴随的隐藏文本区域上的display none属性，我可以在其中键入但仍不能在其中的文本区域上输入文本编辑器。我还检查了编辑器是否可能在我需要切换到的框架内，但事实并非如此。

请多多帮助。

async checkAllElementsAredisplayed() {
    await I.seeElement(this.titleInput)
    await I.seeElement(this.summaryInput)

    await I.executeScript(function() {
        const doc = document.evaluate('//div[3]/div[1]/textarea',document,null,XPathResult.FirsT_ORDERED_NODE_TYPE,null).singleNodeValue;
        doc.style.display='inline';
        doc.click()
    });

    await I.click(this.summaryInput)
    await I.pressKey("Tab");
    await I.pressKey("a");

    I.fillField(this.textArea,"my text" )
    await I.saveScreenshot('textarea.png',true)


    await I.seeElement(this.textArea)
    await I.seeElement(this.userInput)
    await I.seeElement(this.secretInput)
    await I.seeElement(this.saveButton)
}

PS：RichText编辑器是import * as SimpleMDE from "easymde";的React组件

<div className="container container-narrow">
    <SimpleMDE
    className={""}
    value={this.state.textValue}
    onChange={this.handleChange}
/> </div>

非常感谢您。

解决方法

暂无找到可以解决该程序问题的有效方法，小编努力寻找整理中！

如果你已经找到好的解决方法，欢迎将解决方案带上本链接一起发送给小编。

小编邮箱:dio#foxmail.com (将#修改为@）

codeceptjs javascript selenium selenium-webdriver