C# Selenium下Firefox浏览器Datepicker的SendKeys传值问题解决

问题描述 #

基于C# Selenium开展Web自动化测试时，最初面向Chrome、Edge浏览器编写的、通过SendKeys方法向Datepicker日期选择器传入日期值的代码可正常运行，但完全相同的代码在Firefox浏览器中执行失效。

原因分析与无效尝试 #

失效核心原因是Firefox浏览器点击日期类型输入框后，会弹出浏览器原生的日历弹窗，拦截常规键盘输入事件。先后测试3种适配思路均未解决问题：

• 点击日期输入元素后右键唤起系统菜单，再调用SendKeys传值
• 跳过点击元素步骤，直接对元素右键唤起菜单后传值
• 点击元素后发送Esc键尝试关闭弹窗，再调用SendKeys传值
  以上三种方案执行时，SendKeys方法始终无法正常向输入框写入日期内容。

复现说明：进入测试站点后点击顶部导航的Data栏目，下拉找到Data Horizon区域的两个日期字段即可复现问题，本次验证对象为「Use start date limit」对应id为start-date的输入框。

原有Chrome/Edge环境可用代码 #

// Chrome、Edge环境可正常运行
DateTime Datum_now = DateTime.Now;
string str_Datum_now;
str_Datum_now = Datum_back.ToString("ddMMyyyy", CultureInfo.InvariantCulture);

webdriver.FindElement(By.Id("start-date")).Click();
webdriver.FindElement(By.Id("start-date")).SendKeys(str_Datum_now);

Firefox适配失败的三类实现代码 #

尝试1：点击元素后右键唤起菜单传值 #

DateTime Datum_now = DateTime.Now;
string str_Datum_now;
str_Datum_now = Datum_back.ToString("ddMMyyyy", CultureInfo.InvariantCulture);

webdriver.FindElement(By.Id("start-date")).Click();

// 右键点击目标元素
Actions actions = new Actions(webdriver);
IWebElement elementLocator = webdriver.FindElement(By.Id("start-date"));
actions.ContextClick(elementLocator).Perform();

webdriver.FindElement(By.Id("start-date")).SendKeys(str_Datum_now);

尝试2：不点击元素直接右键后传值 #

DateTime Datum_now = DateTime.Now;
string str_Datum_now;
str_Datum_now = Datum_back.ToString("ddMMyyyy", CultureInfo.InvariantCulture);

// 移除点击元素逻辑
//webdriver.FindElement(By.Id("start-date")).Click();

// 右键点击目标元素
Actions actions = new Actions(webdriver);
IWebElement elementLocator = webdriver.FindElement(By.Id("start-date"));
actions.ContextClick(elementLocator).Perform();

webdriver.FindElement(By.Id("start-date")).SendKeys(str_Datum_now);

尝试3：点击元素后发送Esc关闭弹窗再传值 #

DateTime Datum_now = DateTime.Now;
string str_Datum_now;
str_Datum_now = Datum_back.ToString("ddMMyyyy", CultureInfo.InvariantCulture);

webdriver.FindElement(By.Id("start-date")).Click();

Actions action = new Actions(webdriver);
action.SendKeys(OpenQA.Selenium.Keys.Escape);

webdriver.FindElement(By.Id("start-date")).SendKeys(str_Datum_now);

跨浏览器兼容最终方案 #

通过IJavaScriptExecutor执行JavaScript语句直接为日期输入框赋值，该方案可同时兼容Firefox、Chrome、Edge三类浏览器，无需针对不同浏览器做分支判断。
注意：HTML原生日期输入框仅识别YYYY-MM-DD格式的日期字符串，赋值时需匹配对应格式。

IJavaScriptExecutor jsExecutor = (IJavaScriptExecutor)webdriver;
// 示例为给输入框赋值2012年3月31日，可根据实际业务替换动态日期值
jsExecutor.ExecuteScript("document.getElementById('start-date').value='2012-03-31'");

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