deepCss не может определить элемент внутри теневого корня в Protractor

Question

Невозможно определить кнопку, которая внутри ShadowRoot в транспортире.

Я попытался использовать deepCss следующим образом,

this.startNowButton = element(by.deepCss('button[class="apply-now"]'));

Но я получаю

NoSuchElementError: No element found using locator: By(css selector, * /deep/ button[class="apply-now"])

Является ли это правильным способом идентификации элементов внутри ShadowRoot для транспортира? Спасибо

моя HTML-страница похожа на следующую,

<div id="modal">
<div class="push-wrap">
   <header id ="site-header">
      <hmy-cms-header class="hydrated">
         #shadow-root (open)
           <header>
               <div class=notification-banner> ... </div>
               <div class="ca">
                  <button class="apply-now">"Apply"<span>now</span>

Answer 1

Были проблемы с локатором deepcss, и он не работает должным образом, но есть способ найти элемент в теневом DOM. Обратитесь по следующей ссылке для другого способа поиска элемента shadow dom.

Транспортир - теневой ДОМ

Answer 2

Запрос на получение https://github.com/angular/protractor/pull/4786 еще не объединен. Я применил предложенный обходной путь (https://github.com/angular/protractor/issues/4367), а затем он сработал.

Answer 3

Попробуйте следующие параметры локатора

1. const ele = element(by.css(div.ca>button.apply-now));
2. const ele = element(by.buttonText('Apply'));

Если обычный щелчок не работает, попробуйте выполнить приведенный ниже исполнитель, нажав на кнопку

await browser.executeScript("arguments[0].click()", ele);