Блог

Главная - Вопросы по программированию - Щелкните элемент в значении строки, указав другое значение ячейки в той же строке

Щелкните элемент в значении строки, указав другое значение ячейки в той же строке

#javascript #automation #protractor

#javascript #автоматизация #транспортир

Вопрос:

Я должен щелкнуть элемент, который является общим для всех строк в таблице. Но загвоздка в том, что я хочу щелкнуть по этому элементу только для 1 конкретной строки. Нужная мне строка может находиться в любом месте таблицы. Итак, все, что мне нужно, это определить нужную мне строку, а затем щелкнуть по элементу.

Добавлен мой код, который я уже пробовал, и он потерпел неудачу.

 var ClickEdit = element
    .all(by.cssContainingText('.table-element-row'))
    .filter(function(rowElement){
        return rowElement.element(by.css("td h5")).getText().then(function(text){
            return text.trim() == "Company Created by Test Automation"
        });
    })
    .first()
    .element(by.name('action-menu-trigger')).click();

Что мне нужно: определите строку, которая «Создана с помощью автоматизации тестирования», и щелкните элемент по имени = действие-меню-триггер в той же строке.

Элемент по имени=действие-меню-триггер присутствует во всех строках таблицы.

 <tr _ngcontent-c44="" class="table-element-row mat-row ng-tns-c44-63 ng-star-inserted" mat-row="" role="row">

  <td _ngcontent-c44=""
class="custom-t-user mat-cell cdk-column-responsible mat-column-responsible ng-tns-c44-63 ng-star-inserted"
mat-cell="" role="gridcell">
<app-user-profile-logo _ngcontent-c44="" class="ng-tns-c44-63" shape="circle" size="small" _nghost-c18="">
  <div _ngcontent-c18="" aria-describedby="cdk-describedby-message-20" cdk-describedby-host=""
    class="logo logo-size--small logo-shape--circle d-inline-block m-0 mt-2"
    style="touch-action: none; user-select: none; -webkit-user-drag: none; -webkit-tap-highlight-color: rgba(0, 0, 0, 0);">
    <div _ngcontent-c18="">
      <div _ngcontent-c18="" class="logo-initial ng-star-inserted">RS</div>
      <img _ngcontent-c18="" class="custom-lg-img-pos ng-star-inserted" data-img-type="no-user"
        data-max-retry="4" data-retry="0"
        src="http://studio.images/demo-designer/images/d374d7560002a04eb20878005a53c1d0df18_4.jpg">
    </div>
  </div>
</app-user-profile-logo>
  </td>

  <td _ngcontent-c44="" class="custom-t-act mat-cell cdk-column-name mat-column-name ng-tns-c44-63 ng-star-inserted"
mat-cell="" role="gridcell">
<h5 _ngcontent-c44="" class="mb-0 pointer" tabindex="0"><b _ngcontent-c44="" class="ng-tns-c44-63">Company
  Created by Test Automation</b>
</h5>
  </td>

  <td _ngcontent-c44="" class="custom-t-act mat-cell cdk-column-owner mat-column-owner ng-tns-c44-63 ng-star-inserted"
mat-cell="" role="gridcell">
<h5 _ngcontent-c44="" class="mb-0 pointer"><b _ngcontent-c44="" class="ng-tns-c44-63">Robert</b></h5>
  </td>

  <td _ngcontent-c44="" class="custom-t-cat mat-cell cdk-column-type mat-column-type ng-tns-c44-63 ng-star-inserted"
mat-cell="" role="gridcell">
<h6 _ngcontent-c44="" class="mb-0 opacity-medium">
  <span _ngcontent-c44="" class="ng-tns-c44-63 ng-star-inserted">
  <span _ngcontent-c44="" class="ng-tns-c44-63 ng-star-inserted"> Owner/Operator </span>
  </span>
</h6>
  </td>

  <td _ngcontent-c44="" class="custom-t-cat mat-cell cdk-column-city mat-column-city ng-tns-c44-63 ng-star-inserted"
mat-cell="" role="gridcell">
<h6 _ngcontent-c44="" class="mb-0 opacity-medium">Dubai</h6>
  </td>

  <td _ngcontent-c44=""
class="custom-t-cat mat-cell cdk-column-country mat-column-country ng-tns-c44-63 ng-star-inserted" mat-cell=""
role="gridcell">
<h6 _ngcontent-c44="" class="mb-0 opacity-medium">United Arab Emirates</h6>
  </td>

  <td _ngcontent-c44=""
class="custom-t-actions mat-cell cdk-column-actions mat-column-actions ng-tns-c44-63 ng-star-inserted"
mat-cell="" role="gridcell">
<button _ngcontent-c44="" class="ng-tns-c44-63 mat-icon-button" aria-haspopup="true" mat-icon-button=""
  name="action-menu-trigger">
  <span class="mat-button-wrapper">
    <mat-icon _ngcontent-c44="" class="inv-icon-size--small mat-icon ng-tns-c44-63 mat-icon-no-color"
      role="img" svgicon="inv-ellipsis-h" aria-hidden="true">
      <svg width="100%" height="100%" viewBox="0 0 17 3" version="1.1" xmlns="http://www.w3.org/2000/svg"
        xmlns:xlink="http://www.w3.org/1999/xlink" fit="" preserveAspectRatio="xMidYMid meet"
        focusable="false">
        <!-- Generator: sketchtool 51.3 (57544) - http://www.bohemiancoding.com/sketch -->
        <title>E1FE60C0-EF43-4EE7-AF32-E28F60D7C746@1,5x</title>
        <desc>Created with sketchtool.</desc>
        <defs></defs>
        <g id="UX-DESIGNER" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd">
          <g id="ui-03list_02--spec--product-type" transform="translate(-1493.000000, -589.000000)"
            fill="#333333">
            <g id="list/product-type-copy-2" transform="translate(255.000000, 547.000000)">
              <g id="Group-10" transform="translate(185.000000, 18.000000)">
                <g id="package/list">
                  <g id="ico/options" transform="translate(1053.000000, 24.000000)">
                    <g id="Group-4">
                      <circle id="Oval" cx="1.5" cy="1.5" r="1.5"></circle>
                      <circle id="Oval-Copy" cx="8.5" cy="1.5" r="1.5"></circle>
                      <circle id="Oval-Copy-2" cx="15.5" cy="1.5" r="1.5"></circle>
                    </g>
                  </g>
                </g>
              </g>
            </g>
          </g>
        </g>
      </svg>
    </mat-icon>
  </span>
  <div class="mat-button-ripple mat-ripple mat-button-ripple-round" matripple=""></div>
  <div class="mat-button-focus-overlay"></div>
</button>
<mat-menu _ngcontent-c44="" class="ng-tns-c44-63 ng-tns-c9-93" xposition="before">
</mat-menu>
  </td>
</tr>

<tr _ngcontent-c44="" class="table-element-row mat-row ng-tns-c44-63 ng-star-inserted" mat-row="" role="row">
  <td _ngcontent-c44=""
class="custom-t-user mat-cell cdk-column-responsible mat-column-responsible ng-tns-c44-63 ng-star-inserted"
mat-cell="" role="gridcell">
<app-user-profile-logo _ngcontent-c44="" class="ng-tns-c44-63" shape="circle" size="small" _nghost-c18="">
  <div _ngcontent-c18="" aria-describedby="cdk-describedby-message-20" cdk-describedby-host=""
    class="logo logo-size--small logo-shape--circle d-inline-block m-0 mt-2"
    style="touch-action: none; user-select: none; -webkit-user-drag: none; -webkit-tap-highlight-color: rgba(0, 0, 0, 0);">
    <div _ngcontent-c18="">
      <div _ngcontent-c18="" class="logo-initial ng-star-inserted">RS</div>
      <img _ngcontent-c18="" class="custom-lg-img-pos ng-star-inserted" data-img-type="no-user"
        data-max-retry="4" data-retry="0"
        src="http://studio.images/demo-designer/images/d374d7560002a04eb20878005a53c1d0df18_4.jpg">
    </div>
  </div>
</app-user-profile-logo>
  </td>
  <td _ngcontent-c44="" class="custom-t-act mat-cell cdk-column-name mat-column-name ng-tns-c44-63 ng-star-inserted"
mat-cell="" role="gridcell">
<h5 _ngcontent-c44="" class="mb-0 pointer" tabindex="0"><b _ngcontent-c44="" class="ng-tns-c44-63">Company
  Created by Test Automation</b>
</h5>
  </td>
  <td _ngcontent-c44="" class="custom-t-act mat-cell cdk-column-owner mat-column-owner ng-tns-c44-63 ng-star-inserted"
mat-cell="" role="gridcell">
<h5 _ngcontent-c44="" class="mb-0 pointer"><b _ngcontent-c44="" class="ng-tns-c44-63">Robert</b></h5>
  </td>
  <td _ngcontent-c44="" class="custom-t-cat mat-cell cdk-column-type mat-column-type ng-tns-c44-63 ng-star-inserted"
mat-cell="" role="gridcell">
<h6 _ngcontent-c44="" class="mb-0 opacity-medium">
  <span _ngcontent-c44="" class="ng-tns-c44-63 ng-star-inserted">
  <span _ngcontent-c44="" class="ng-tns-c44-63 ng-star-inserted"> Owner/Operator </span>
  </span>
</h6>
  </td>
  <td _ngcontent-c44="" class="custom-t-cat mat-cell cdk-column-city mat-column-city ng-tns-c44-63 ng-star-inserted"
mat-cell="" role="gridcell">
<h6 _ngcontent-c44="" class="mb-0 opacity-medium">Dubai</h6>
  </td>
  <td _ngcontent-c44=""
class="custom-t-cat mat-cell cdk-column-country mat-column-country ng-tns-c44-63 ng-star-inserted" mat-cell=""
role="gridcell">
<h6 _ngcontent-c44="" class="mb-0 opacity-medium">United Arab Emirates</h6>
  </td>
  <td _ngcontent-c44=""
class="custom-t-actions mat-cell cdk-column-actions mat-column-actions ng-tns-c44-63 ng-star-inserted"
mat-cell="" role="gridcell">
<button _ngcontent-c44="" class="ng-tns-c44-63 mat-icon-button" aria-haspopup="true" mat-icon-button=""
  name="action-menu-trigger">
  <span class="mat-button-wrapper">
    <mat-icon _ngcontent-c44="" class="inv-icon-size--small mat-icon ng-tns-c44-63 mat-icon-no-color"
      role="img" svgicon="inv-ellipsis-h" aria-hidden="true">
      <svg width="100%" height="100%" viewBox="0 0 17 3" version="1.1" xmlns="http://www.w3.org/2000/svg"
        xmlns:xlink="http://www.w3.org/1999/xlink" fit="" preserveAspectRatio="xMidYMid meet"
        focusable="false">
        <!-- Generator: sketchtool 51.3 (57544) - http://www.bohemiancoding.com/sketch -->
        <title>E1FE60C0-EF43-4EE7-AF32-E28F60D7C746@1,5x</title>
        <desc>Created with sketchtool.</desc>
        <defs></defs>
        <g id="UX-DESIGNER" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd">
          <g id="ui-03list_02--spec--product-type" transform="translate(-1493.000000, -589.000000)"
            fill="#333333">
            <g id="list/product-type-copy-2" transform="translate(255.000000, 547.000000)">
              <g id="Group-10" transform="translate(185.000000, 18.000000)">
                <g id="package/list">
                  <g id="ico/options" transform="translate(1053.000000, 24.000000)">
                    <g id="Group-4">
                      <circle id="Oval" cx="1.5" cy="1.5" r="1.5"></circle>
                      <circle id="Oval-Copy" cx="8.5" cy="1.5" r="1.5"></circle>
                      <circle id="Oval-Copy-2" cx="15.5" cy="1.5" r="1.5"></circle>
                    </g>
                  </g>
                </g>
              </g>
            </g>
          </g>
        </g>
      </svg>
    </mat-icon>
  </span>
  <div class="mat-button-ripple mat-ripple mat-button-ripple-round" matripple=""></div>
  <div class="mat-button-focus-overlay"></div>
</button>
<mat-menu _ngcontent-c44="" class="ng-tns-c44-63 ng-tns-c9-93" xposition="before">
</mat-menu>
  </td>
</tr>  

 <button _ngcontent-c44="" class="ng-tns-c44-63 mat-icon-button" aria-haspopup="true" mat-icon-button="" name="action-menu-trigger"><span class="mat-button-wrapper"><mat-icon _ngcontent-c44="" class="inv-icon-size--small mat-icon ng-tns-c44-63 mat-icon-no-color" role="img" svgicon="inv-ellipsis-h" aria-hidden="true"><svg width="100%" height="100%" viewBox="0 0 17 3" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" fit="" preserveAspectRatio="xMidYMid meet" focusable="false">
    <!-- Generator: sketchtool 51.3 (57544) - http://www.bohemiancoding.com/sketch -->
    <title>E1FE60C0-EF43-4EE7-AF32-E28F60D7C746@1,5x</title>
    <desc>Created with sketchtool.</desc>
    <defs></defs>
    <g id="UX-DESIGNER" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd">
        <g id="ui-03list_02--spec--product-type" transform="translate(-1493.000000, -589.000000)" fill="#333333">
            <g id="list/product-type-copy-2" transform="translate(255.000000, 547.000000)">
                <g id="Group-10" transform="translate(185.000000, 18.000000)">
                    <g id="package/list">
                        <g id="ico/options" transform="translate(1053.000000, 24.000000)">
                            <g id="Group-4">
                                <circle id="Oval" cx="1.5" cy="1.5" r="1.5"></circle>
                                <circle id="Oval-Copy" cx="8.5" cy="1.5" r="1.5"></circle>
                                <circle id="Oval-Copy-2" cx="15.5" cy="1.5" r="1.5"></circle>
                            </g>
                        </g>
                    </g>
                </g>
            </g>
        </g>
    </g>
</svg></mat-icon></span><div class="mat-button-ripple mat-ripple mat-button-ripple-round" matripple=""></div><div class="mat-button-focus-overlay"></div></button>

Комментарии:

1. Вы пытаетесь щелкнуть элемент «circle»?

2. ДА. три точки.

3. Итак, вы хотите щелкнуть элемент circle, который является потомком <desc>Created with sketchtool.</desc> элемента?

4. Нет. Я хочу нажать на элемент — <button _ngcontent-c44=»» class=»ng-tns-c44-63 мат-значок-кнопка» aria-haspopup=»true» мат-значок-кнопка =»» name=»действие-меню-триггер»>»мат-кнопка-оболочка»>aria -hidden=»true»>false»>

5. И этот элемент находится в той же строке, где находится мой текст «Созданный с помощью автоматизации тестирования».

Ответ №1:

Если вы можете использовать XPath, чтобы выбрать <button> элемент, который является потомком элемента, содержащего текст «Создано с помощью автоматизации тестирования», используйте следующий селектор

 //td[contains(., 'Created by Test Automation')]/following-sibling::td//button

Комментарии:

1. Разве это не скрипт на python? Я работаю над JavaScript. Так что это не работает для меня.

2. Это не python. Просто селектор Xpath.

Ответ №2:

Вы можете передать текст поиска by.cssContainingText() следующим образом, тогда вам не нужно фильтровать.

 element(by.cssContainingText('tr.table-element-row', 'Company Created by Test Automation'))
.element(by.xpath('./..'))
.element(by.css('button[name="action-menu-trigger"]'))
.click()

Комментарии:

1. Это решение не работает. Я полагаю, что он ожидает щелчка по другому элементу. Вот ошибка — Сбой: неизвестная ошибка: элемент … недоступен для просмотра в точке (1272, 271).< /span> Другой элемент получит щелчок: <div class=»cdk-overlay-background cdk-overlay-прозрачный-фон cdk-overlay-background-показ»></div>

2. Пожалуйста, подтвердите, что строка, которую вы собираетесь щелкнуть, видна в текущем окне просмотра страницы. Если нет, возможно, потребуется прокрутить строку в текущий вид.

3. Он находится в текущем представлении. Мне не нужно прокручивать вниз, чтобы увидеть строку, на которую я собираюсь щелкнуть.

4. Добавьте длительный режим ожидания перед щелчком, если это тоже не сработало. пожалуйста, найдите <div class=»cdk-overlay-background cdk-overlay-transparent-background cdk-overlay-background-showing»></div> на странице вручную в инструменте разработки браузера, затем определите связь между ним и ячейкой, на которую нужно щелкнуть.