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

Die*_*ego 5 javascript selenium selenium-chromedriver selenium-webdriver vue.js

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

ElementNotInteractableError: element not interactable
  (Session info: chrome=89.0.4389.90)
Run Code Online (Sandbox Code Playgroud)

我尝试了很多不同的方式和 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()
Run Code Online (Sandbox Code Playgroud)

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()
Run Code Online (Sandbox Code Playgroud)

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)
  }
}
Run Code Online (Sandbox Code Playgroud)

VueJS 模板以

<template>
    <div class="px2 md-px4 py3">
        <h4 class="mb2">choose discipline</h4>
        <SelectDropdownComponent
            ref="disciplineList"
            :has-border="true"
            class="mb2"
            select-id="discipline"
            :options="disciplineList"
            placeholder="discipline"
            :preselected-value="disciplineStep.discipline ? disciplineStep.discipline : disciplineQuery"
            open-direction="bottom"
            @selectedValue="onSelectedDiscipline"
        />
[...]
</div>
</template>
Run Code Online (Sandbox Code Playgroud)

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

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

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

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