Selenium WebDriver测试中Kendo文本框输入异常问题及解决

• 已通过XPath解决输入异常问题，但借助开发者工具Inspect定位根源的过程难度较高，后续将通过幻灯片记录排查轨迹及知识补全要点。
• 排查中曾因无法修改ng-reflect-model中的文本（手动输入内容会存入此处）产生困惑。
• 研读《Selenium with Kendo UI》后，定位到kendo-textbox下嵌套在span元素后的input标签，编写对应XPath完成修复。
• 注意：通过Inspect查看表单易陷入误区，此处涉及Angular指令技术，需遵循Kendo框架逻辑——测试必须定位到特定input元素才能实现正常输入。

• 11月20日17:45找到相关Stack Overflow帖子，存在疑问：使用Selenium WebDriver时，是否仍需通过C#编写XPath这种“繁琐方式”？该帖子已发布6年，是否有更优方案？
• 已在Kendo Textbox论坛发帖求助，希望找到比“运行测试-失败-编写XPath-重复尝试”更高效的测试方法。

• 测试运行时，姓名输入内容未显示在正确区域，反而被塞入右侧的span元素，导致左侧因无输入触发错误图标；但手动输入可正常显示在正确位置。
• 无法找到span.k-input-suffix类的来源，在VS解决方案中搜索无匹配结果。
• 日期选择器存在相同问题：手动输入/选择日期正常，但调用SendKeys("11/20/2024")时，日期字符串会被塞入日历图标右侧的验证区域。
• 推测：SCSS接管了文本框渲染，导致生成了无法追踪的类，错误地将输入内容导向验证指示器所在的span区域（手动输入时，该区域正常显示验证标记：符合长度显示对勾，无输入显示红色!）。

测试代码（存在输入异常的部分） #

public class SeleniumCourseWebDriverTests
{
    [Fact]
    public void SimpleDoITWebDriverTests()
    {
        var driver = new EdgeDriver();
        driver.Manage().Window.Size = new Size(1200, 1087);
        driver.Navigate().GoToUrl("http://localhost:5000/login?returnUrl=%2Fhome");
        driver.FindElement(By.CssSelector(".flexbox-container")).Click();
        driver.FindElement(By.CssSelector(".btn")).Click();
        driver.FindElement(By.Id("WindowsAuthentication")).Click();
        driver.FindElement(By.Name("Recognize a Team Member")).Click();
        driver.FindElement(By.LinkText("Award Submission")).Click();
        driver.FindElement(By.Id("shouterFirstName")).Click();
        driver.FindElement(By.Name("First Name")).SendKeys("Michael");
        driver.FindElement(By.Id("shouterLastName")).Click();
        driver.FindElement(By.Id("shouterLastName")).SendKeys("Durthaler");
    }
}

正常工作的文本区域测试代码 #

driver.FindElement(By.Id("awardCommentsText")).Click();
driver.FindElement(By.Id("awardCommentsText")).SendKeys(" Ian was a great help figuring out why my courses in my Edge browser were freezing up.");

FirstName文本框HTML代码（存在输入异常） #

<div class="col-md">
  <kendo-label text="First Name">
    <kendo-textbox
                   name="First Name"
                   id="shouterFirstName"
                   contenteditable="true"
                   >

    </kendo-textbox>
  </kendo-label>
</div>

正常工作的评论文本区域HTML代码 #

<div col-md>
  <kendo-label
               id="awardtext"
               [for]="awardtext"
               text="Comments">
  </kendo-label>
  <textarea kendoTextArea #awardtext id="awardCommentsText" contenteditable="true"> </textarea>
</div>

需排查输入内容被导向验证区域的异常原因，寻求更高效的Selenium测试方案。

内容的提问来源于stack exchange，提问作者user1585204