无法使用SeleniumJS在VueJS中单击下拉测试网站

我正在尝试使用 Selenium 和 Javascript 测试 VueJS 网站；我目前正在尝试简单地点击一个下拉菜单，但我所有的尝试都会导致

ElementNotInteractableError: element not interactable
(Session info: chrome=89.0.4389.90)


我尝试了很多不同的方式和 css 或 xpath 选择，包括

A) 快速检查

const elem = await driver.findElement(
By.css(
'div.mb2:first-of-type > div.multiselect.col-12.border:first-of-type > div.multiselect__tags > span.multiselect__placeholder',
),
)
await elem.click()


B）很好地检查一切

await driver.wait(until.elementLocated(By.css('div[data-fetch-key="1"] > div.multiselect.col-12.border > div.multiselect__tags')), timeout)
await driver.wait(until.elementIsVisible(element), timeout)
await driver.wait(until.elementIsEnabled(element), timeout)
await element.click()


C）设置display:block一切

const disabledList = await driver.findElements(By.css('[style*="display:none"]'))
for (elem of disabledList) {
try {
await driver.executeScript(
"arguments[0].setAttribute('style', 'display:block !important; visibility: visible !important; opacity: 1 !important; position:initial !important')",
elem,
)
elem.click()
} catch (error) {
console.log('---------broken but still goes on-------------', error)
}
}


VueJS 模板以

有人可以告诉我为什么这个元素不应该是可交互的吗？它工作的唯一方法是使用 x 和 y 坐标进行单击，但由于它是一个下拉列表，因此它会打开，我无法使用坐标来选择特定选项（因为它们可以更改顺序和数量）。

更新：经过询问和搜索，我发现前端网站使用了vue-multiselect插件。

更新 2：我尝试重建整个测试，但这次使用cypress和cypress-xpath并且它有效。我错过了一些东西，但我不明白。

更新 3：使用 cypress 处理 iFrame 真的很困难，我需要它；也许我会切换回 selenium，但我绝对需要解决这个问题，我不明白为什么这些元素被认为是不可交互的。