Jasmine 元素在下拉列表中不可交互。如何获取元素？

请帮助我正确解决我的任务

我有一个下拉列表（看起来像是下拉列表），其中包含以下代码：

<div class="jcf-select-drop jcf-select-jcf-hidden jcf-unselectable"      style="position: absolute; top: 1331px; width: 376.125px; left: 285.75px;">
<div class="jcf-select-drop-content">
    <span class="jcf-list jcf-scroll-active">
        <span class="jcf-list-content" style="max-height: 369px; overflow: auto;">
            <ul>
                <li>
                    <span class="jcf-option" data-index="0">Afghanistan</span>
                </li>
                <li>
                    <span class="jcf-option" data-index="218">USA</span>
                </li>  

我需要选择美国，但有一个错误“失败：元素不可交互”。我可以去阿富汗，但不能去美国。。我试过了

browser.actions().mouseMove(USA).click().perform();

但这没有帮助。 我可以用数据索引点击USA元素吗？或者选择元素的正确方法是什么？

---

还有，由于元素太长，如何缩短元素（by.css）的长度呢？

我假设下拉列表包含一个完整的国家列表。因此，美国不会在名单上排名靠前（看起来是第218位）。因为您的下拉列表一次只能显示有限数量的国家，所以美国是隐藏的。大多数下拉列表允许输入文本来搜索国家。这也限制了屏幕上显示的所有匹配项。然后，您可以单击美国（尽管其索引可能已更改）
范例

试试下面这个

const countryTest = element(by.cssContainingText('spna.jcf-list-content>ul>li>span', 'USA'));

因此

countryTest.click（）

从下拉列表中选择美国

---

希望它对您有所帮助。

假设您已经通过单击显示下拉列表的父元素解决了问题，您是否尝试过以下操作？：

如果您只有这两个选项：

var USA = element.all(by.css('.jcf-list-content ul li span')).last();

countryTest.click();
USA.click();

如果下拉列表有更多选项（美国为218？）：

您可以尝试在末尾添加“span”，或将其删除。我不确定哪一个会起作用

最后，尝试以下方法：

var USA = element(by.cssContainingText('li', 'USA')); 

countryTest.click();
USA.click();

---

希望有帮助。

嗨。谢谢你的回答。当我这样做时：countryTest.sendKeys（'USA'）；我的错误是：失败：未知错误：无法聚焦元素当然，我现在可以通过第一批可见国家的测试，但对未来来说，如何正确处理这种情况很有趣？@EkaterinaSalazkina我应该澄清一下。countryTest.sendKeys（）；不会将密钥发送到正确的元素。我无法从html中判断执行sendKeys（）的正确元素是什么。选择下拉菜单时，是否会显示输入框？这就是您需要对其执行sendkeys（）的内容

var USA = element.all(by.css('.jcf-list-content ul li span')).last();

countryTest.click();
USA.click();

var USA = element.all(by.css('.jcf-list-content ul li span')).get(218);

countryTest.click();
USA.click();

var USA = element(by.cssContainingText('li', 'USA')); 

countryTest.click();
USA.click();