xpath locators c # правильная методика поиска - PullRequest
Новая
       1

xpath locators c # правильная методика поиска

0 голосов
/ 26 ноября 2018

Я пытаюсь справиться со своими выводами xPath, но столкнулся с проблемой.Моя цель - снять флажок со стола.Не могли бы вы дать мне какие-нибудь советы, как всегда должен быть установлен локатор?

Давайте представим, что моей целью является input , указывающий на флажок , который нужно щелкнуть.

Сначала я попробовал очень простым способом: 

By.XPath("//input[@type = 'checkbox'][1]")

У меня есть два флажка, поэтому я указываю, чтобы получить первый.Результат - Ошибка.

Далее: 

By.XPath("//div[@class = 'receipt-grid-container h-90']//tbody/tr[1]/td[5]/input");

Я начинаю с основного класса и иду вниз, через элементы tbody и table.Поскольку мой флажок находится внутри 5-го столбца, я попытался найти его, заканчивая его / input.Результат - также неудача.

И последний подход, я предполагал, что это можно сделать, просто "опустившись" так: 

By.XPath("//div[@class = 'receipt-grid-container h-90']//tbody/tr[1]/td[5]/div/input");

Однако я тоже потерпел неудачу.Может кто-нибудь посоветовать мне, как мы можем его найти?Кроме того, когда мы ищем xpath, нужно ли начинать технику «сверху вниз», как я делаю выше?Или мы можем начать по-другому, используя, например, xPath Axes 

<div class="receipt-grid-container h-90">
   <div style="height: auto; overflow: auto;">
      <div>
         <table style="background-color: rgb(255, 255, 255); width: 100%; border-collapse: collapse; border-spacing: 0px; table-layout: fixed; font-family: Roboto, sans-serif;">
            <thead style="border-bottom: 1px solid rgb(224, 224, 224);">
               <tr style="border-bottom: 1px solid rgb(224, 224, 224); color: rgba(0, 0, 0, 0.87); height: 48px;">
                  <th width="35%" style="font-weight: normal; font-size: 12px; padding-left: 24px; padding-right: 24px; height: 56px; text-align: left; white-space: nowrap; text-overflow: ellipsis; color: rgb(158, 158, 158); position: relative; background-color: inherit;">
                     <!-- react-text: 1986 -->Name<!-- /react-text -->
                  </th>
                  <th width="15%" style="font-weight: normal; font-size: 12px; padding-left: 24px; padding-right: 24px; height: 56px; text-align: left; white-space: nowrap; text-overflow: ellipsis; color: rgb(158, 158, 158); position: relative; background-color: inherit;">
                     <!-- react-text: 1988 -->Quantity<!-- /react-text -->
                  </th>
                  <th width="20%" style="font-weight: normal; font-size: 12px; padding-left: 24px; padding-right: 24px; height: 56px; text-align: left; white-space: nowrap; text-overflow: ellipsis; color: rgb(158, 158, 158); position: relative; background-color: inherit;">
                     <!-- react-text: 1990 -->EUR<!-- /react-text -->
                  </th>
                  <th width="15%" style="font-weight: normal; font-size: 12px; padding-left: 24px; padding-right: 24px; height: 56px; text-align: left; white-space: nowrap; text-overflow: ellipsis; color: rgb(158, 158, 158); position: relative; background-color: inherit;">
                     <!-- react-text: 1992 -->Refunded<!-- /react-text -->
                  </th>
                  <th width="15%" style="font-weight: normal; font-size: 12px; padding-left: 24px; padding-right: 24px; height: 56px; text-align: left; white-space: nowrap; text-overflow: ellipsis; color: rgb(158, 158, 158); position: relative; background-color: inherit;">
                     <!-- react-text: 1994 -->Refund<!-- /react-text -->
                  </th>
               </tr>
            </thead>
         </table>
      </div>
      <div style="height: inherit; overflow: hidden auto;">
         <table style="background-color: rgb(255, 255, 255); width: 100%; border-collapse: collapse; border-spacing: 0px; table-layout: fixed; font-family: Roboto, sans-serif;">
            <tbody>
               <tr style="border-bottom: 1px solid rgb(224, 224, 224); color: rgba(0, 0, 0, 0.87); height: 48px;">
                  <td width="35%" style="padding-left: 24px; padding-right: 24px; height: 48px; text-align: left; font-size: 13px; overflow: hidden; white-space: nowrap; text-overflow: ellipsis; background-color: inherit;">Coca-Cola 0,5 l</td>
                  <td width="15%" style="padding-left: 24px; padding-right: 24px; height: 48px; text-align: left; font-size: 13px; overflow: hidden; white-space: nowrap; text-overflow: ellipsis; background-color: inherit;">1 pcs</td>
                  <td width="20%" style="padding-left: 24px; padding-right: 24px; height: 48px; text-align: left; font-size: 13px; overflow: hidden; white-space: nowrap; text-overflow: ellipsis; background-color: inherit;">3.00</td>
                  <td width="15%" style="padding-left: 24px; padding-right: 24px; height: 48px; text-align: left; font-size: 13px; overflow: hidden; white-space: nowrap; text-overflow: ellipsis; background-color: inherit;">0</td>
                  <td width="15%" style="padding-left: 24px; padding-right: 24px; height: 48px; text-align: left; font-size: 13px; overflow: hidden; white-space: nowrap; text-overflow: ellipsis; background-color: inherit;">
                     <div style="cursor: pointer; position: relative; overflow: visible; display: table; height: auto; width: 100%;">
                        <!-- react-empty: 2005 --><input type="checkbox" value="on" style="position: absolute; cursor: inherit; pointer-events: all; opacity: 0; width: 100%; height: 100%; z-index: 2; left: 0px; box-sizing: border-box; padding: 0px; margin: 0px;">
                        <div style="display: flex; width: 100%; height: 100%;">
                           <div style="transition: all 450ms cubic-bezier(0.23, 1, 0.32, 1) 0ms; float: left; position: relative; display: block; flex-shrink: 0; width: 24px; margin-right: 16px; margin-left: 0px; height: 24px;">
                              <div>
                                 <svg viewBox="0 0 24 24" style="display: inline-block; color: rgba(0, 0, 0, 0.87); fill: rgba(0, 0, 0, 0.87); height: 24px; width: 24px; user-select: none; transition: opacity 1000ms cubic-bezier(0.23, 1, 0.32, 1) 200ms; position: absolute; opacity: 1;">
                                    <path d="M19 5v14H5V5h14m0-2H5c-1.1 0-2 .9-2 2v14c0 1.1.9 2 2 2h14c1.1 0 2-.9 2-2V5c0-1.1-.9-2-2-2z"></path>
                                 </svg>
                                 <svg viewBox="0 0 24 24" style="display: inline-block; color: rgba(0, 0, 0, 0.87); fill: rgb(0, 188, 212); height: 24px; width: 24px; user-select: none; transition: opacity 450ms cubic-bezier(0.23, 1, 0.32, 1) 0ms, transform 0ms cubic-bezier(0.23, 1, 0.32, 1) 450ms; position: absolute; opacity: 0; transform: scale(0);">
                                    <path d="M19 3H5c-1.11 0-2 .9-2 2v14c0 1.1.89 2 2 2h14c1.11 0 2-.9 2-2V5c0-1.1-.89-2-2-2zm-9 14l-5-5 1.41-1.41L10 14.17l7.59-7.59L19 8l-9 9z"></path>
                                 </svg>
                              </div>
                              <div></div>
                              <div style="position: absolute; height: 100%; width: 100%; top: 0px; left: 0px;"></div>
                           </div>
                        </div>
                     </div>
                  </td>
               </tr>
               <tr style="color: rgba(0, 0, 0, 0.87); height: 48px;">
                  <td width="35%" style="padding-left: 24px; padding-right: 24px; height: 48px; text-align: left; font-size: 13px; overflow: hidden; white-space: nowrap; text-overflow: ellipsis; background-color: inherit;">Fanta Zero 0,5 l</td>
                  <td width="15%" style="padding-left: 24px; padding-right: 24px; height: 48px; text-align: left; font-size: 13px; overflow: hidden; white-space: nowrap; text-overflow: ellipsis; background-color: inherit;">1 pcs</td>
                  <td width="20%" style="padding-left: 24px; padding-right: 24px; height: 48px; text-align: left; font-size: 13px; overflow: hidden; white-space: nowrap; text-overflow: ellipsis; background-color: inherit;">3.00</td>
                  <td width="15%" style="padding-left: 24px; padding-right: 24px; height: 48px; text-align: left; font-size: 13px; overflow: hidden; white-space: nowrap; text-overflow: ellipsis; background-color: inherit;">0</td>
                  <td width="15%" style="padding-left: 24px; padding-right: 24px; height: 48px; text-align: left; font-size: 13px; overflow: hidden; white-space: nowrap; text-overflow: ellipsis; background-color: inherit;">
                     <div style="cursor: pointer; position: relative; overflow: visible; display: table; height: auto; width: 100%;">
                        <!-- react-empty: 2023 --><input type="checkbox" value="on" style="position: absolute; cursor: inherit; pointer-events: all; opacity: 0; width: 100%; height: 100%; z-index: 2; left: 0px; box-sizing: border-box; padding: 0px; margin: 0px;">
                        <div style="display: flex; width: 100%; height: 100%;">
                           <div style="transition: all 450ms cubic-bezier(0.23, 1, 0.32, 1) 0ms; float: left; position: relative; display: block; flex-shrink: 0; width: 24px; margin-right: 16px; margin-left: 0px; height: 24px;">
                              <div>
                                 <svg viewBox="0 0 24 24" style="display: inline-block; color: rgba(0, 0, 0, 0.87); fill: rgba(0, 0, 0, 0.87); height: 24px; width: 24px; user-select: none; transition: opacity 1000ms cubic-bezier(0.23, 1, 0.32, 1) 200ms; position: absolute; opacity: 1;">
                                    <path d="M19 5v14H5V5h14m0-2H5c-1.1 0-2 .9-2 2v14c0 1.1.9 2 2 2h14c1.1 0 2-.9 2-2V5c0-1.1-.9-2-2-2z"></path>
                                 </svg>
                                 <svg viewBox="0 0 24 24" style="display: inline-block; color: rgba(0, 0, 0, 0.87); fill: rgb(0, 188, 212); height: 24px; width: 24px; user-select: none; transition: opacity 450ms cubic-bezier(0.23, 1, 0.32, 1) 0ms, transform 0ms cubic-bezier(0.23, 1, 0.32, 1) 450ms; position: absolute; opacity: 0; transform: scale(0);">
                                    <path d="M19 3H5c-1.11 0-2 .9-2 2v14c0 1.1.89 2 2 2h14c1.11 0 2-.9 2-2V5c0-1.1-.89-2-2-2zm-9 14l-5-5 1.41-1.41L10 14.17l7.59-7.59L19 8l-9 9z"></path>
                                 </svg>
                              </div>
                              <div></div>
                              <div style="position: absolute; height: 100%; width: 100%; top: 0px; left: 0px;"></div>
                           </div>
                        </div>
                     </div>
                  </td>
               </tr>
            </tbody>
         </table>
      </div>
   </div>
</div>

Ответы [ 2 ]

0 голосов
/ 26 ноября 2018

В соответствии с HTML , которым вы поделились, ваш сценарий использования может быть либо установленным флажком для элемента Coca-Cola , либо флажок для элемента Fanta Zero .Таким образом, чтобы установить соответствующий флажок , вы можете создать функцию следующим образом: 

public void click_checkbox(string softdrink)
{
    driver.FindElement(By.XPath("//div[contains(@class,'receipt-grid-container')]//table/tbody//td[contains(.,'" + softdrink + "')]//following::input[1]")).Click();
}

Теперь вы можете вызывать функцию click_checkbox() с нужным элементом, который вы всегда хотите щелкнуть, следующим образом: 

click_checkbox("Coca-Cola")
//or
click_checkbox("Fanta Zero")
0 голосов
/ 26 ноября 2018

Попробуйте использовать это в качестве xpath: 

By.XPath("(//input[@type = 'checkbox'])[1]")

Как правило, попробуйте выбрать элементы с помощью id (это должно быть уникальным, но это не всегда), затемname, и после этого я буду сохранять их максимально простыми, не используя слишком много пронумерованных элементов (например, //div[13]/span[9]//td/td[4]/div).

Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.

Нет похожих вопросов

...