Расположение элемента внутри тега Span в неугловом сайте Reactjs с помощью транспортира

Question

Мне нужно нажать на «логин», который находится внутри тега span, код выглядит как

<div data-reactroot>
<div class "ant-dropdown ant-dropdown-placement-bottomRight ant-dropdown-hidden" style="left 632.234px; top 65px;">
<ul class="ant-dropdown-menu ant-dropdown-menu-light ant-dropdown-menu-root ant-dropdown-menu-vertical" role="menu" style="border" 1px solid rgba(0, 0, 0, 0.23);">
<li class="ant-dropdown-menu-item" role="menuitem">...</li>
<li class=" ant-dropdown-menu-item-divider"></li>
<li class="ant-dropdown-menu-item" role="menuitem">...</li>
            <span>Login</span>
</li>

https://i.stack.imgur.com/qDt4z.png

Я пытался использовать код ниже, он делаетне работает:

browser.driver.findElement(by.cssContainingText('ant-dropdown-menu-item', 'Login'))

Я получаю сообщение об ошибке, см. ниже:

Message: 
Failed: Invalid locator
Stack:
TypeError: Invalid locator

Answer 1

Теперь работает, я попробую использовать следующий код ниже

element(by.xpath("//span[. = 'Login']")).click();

Answer 2

Попробуйте:

browser.driver.findElement(by.cssContainingText('.ant-dropdown-menu-item', 'Login'))

В классе селекторов CSS необходимо иметь ..

Редактировать: browser.driver.findElement(by.css('.ant-dropdown-menu-item > span'))