仅在Safari中触发OpenQA.Selenium.ElementNotInteractableException问题求助

我们使用VS/C#/Selenium/.Net 8.0编写了大量回归测试，在Windows系统的Chrome、Edge、Firefox浏览器中运行正常。但通过RemoteWebDriver连接本地Mac Mini，在Mac的Safari浏览器中运行时，多数按钮点击正常，唯独侧边菜单选项触发OpenQA.Selenium.ElementNotInteractableException错误。

目标元素的典型CSS选择器：

body>pop-shell>div>ppo-sidebar>nav>div.top.level1.menu>div>span.invoices-pop.menu-item.btn

已尝试的定位方式：CSS选择器、XPath
已尝试的点击方法均触发相同错误：

1. 原生Click方法：

Driver.FindElement(InvoicePopMenu).Click();

2. 带滚动的原生Click：

protected static void ClickElement(By by)
{
    try
    {
        var link = Driver.FindElement(by);
        var js = $"window.scroll(0, {link.Location.Y});";
        ((IJavaScriptExecutor)Driver).ExecuteScript(js);
        Driver.FindElement(by).Click();
    }
    catch (Exception err)
    {
        WriteToConsole("Error: " + err.Message);
    }
}

3. JS模拟点击：

protected static void FireEvent(By by)
{
    try
    {
        var link = Driver.FindElement(by);
        var js = $"window.scroll(0, {link.Location.Y});";
        ((IJavaScriptExecutor)Driver).ExecuteScript(js);
        ((IJavaScriptExecutor)Driver).ExecuteScript("arguments[0].click();", link);
    }
    catch (Exception ex)
    {
        WriteToConsole("Error: " + ex.Message);
    }
}

疑问：为何仅在Mac的Safari中出现该问题，其他点击操作却正常？

1. Shadow DOM 处理差异 #

你的选择器包含pop-shell、ppo-sidebar这类自定义元素，大概率使用了Shadow DOM。Chrome/Firefox对Shadow DOM的自动化支持更宽松，而Safari的WebDriver实现对Shadow DOM内部元素的交互有严格限制——即使能定位到元素，也可能因为未正确穿透Shadow Root导致无法交互。

解决方法：
使用Selenium 4+的Shadow DOM定位API，先获取Shadow Root再定位目标元素：

// 获取包含Shadow DOM的自定义根元素
var popShell = Driver.FindElement(By.CssSelector("pop-shell"));
// 获取Shadow Root
var shadowRoot = popShell.GetShadowRoot();
// 在Shadow Root内部定位目标菜单元素
var invoiceMenu = shadowRoot.FindElement(By.CssSelector("ppo-sidebar nav div.top.level1.menu div span.invoices-pop.menu-item.btn"));
invoiceMenu.Click();

2. 滚动行为的浏览器差异 #

当前使用window.scroll(0, {link.Location.Y})的滚动方式，在Safari中可能因为页面缩放、浏览器工具栏高度、滚动偏移等因素，导致元素未完全进入可视区域。

解决方法：

• 使用Selenium内置的Actions类适配浏览器滚动逻辑：

var element = Driver.FindElement(by);
new Actions(Driver).MoveToElement(element).Perform();
element.Click();

• 改用更可靠的JS滚动，确保元素完全居中显示在视口：

((IJavaScriptExecutor)Driver).ExecuteScript("arguments[0].scrollIntoView({block: 'center', inline: 'nearest'});", element);

3. 事件触发机制的严格性 #

Safari对原生事件触发的要求比其他浏览器更严格：元素必须完全可见、无遮挡、未被设置disabled属性，才能触发click事件。此外，侧边菜单可能是动态渲染组件，Safari的DOM加载速度较慢，导致定位元素时它还未处于可交互状态。

解决方法：

• 添加显式等待，确保元素进入可交互状态后再执行点击：

var wait = new WebDriverWait(Driver, TimeSpan.FromSeconds(10));
var element = wait.Until(ExpectedConditions.ElementToBeClickable(by));
element.Click();

• 模拟完整的用户事件链，绕过Safari的部分限制：

((IJavaScriptExecutor)Driver).ExecuteScript(@"
    const evt = new MouseEvent('click', {
        bubbles: true,
        cancelable: true,
        view: window
    });
    arguments[0].dispatchEvent(evt);
", element);

4. WebDriver版本兼容性问题 #

Safari对浏览器、WebDriver、Selenium三者的版本匹配要求极高，版本不兼容会导致各种交互异常。

检查与修复步骤：

1. 在Mac上打开Safari，进入Safari > 设置 > 高级，勾选「显示开发菜单」；
2. 打开开发 > 显示WebDriver，确认WebDriver版本与Safari浏览器版本完全一致；
3. 更新.NET项目中引用的Selenium.WebDriver包至兼容.NET 8.0的最新版本。

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