selenium - 单击具有相同 ID 的按钮

Question

我有这个 Angular 代码，它使用相同的按钮 id 3 次：barcodeScanner.button

<mobileweb-rowify _ngcontent-svn-c50="" class="full-height-right-separator" fxflex="auto" _nghost-svn-c4="" style="flex: 1 1 auto; box-sizing: border-box;">
   <!---->
   <div _ngcontent-svn-c4="" fxlayout="column" class="full-height-right-separator" id="rowify" style="flex-direction: column; box-sizing: border-box; display: flex; place-content: stretch space-between; align-items: stretch; max-width: 100%;">
      <mobileweb-value-input _ngcontent-svn-c50="" class="compact-xs" id="pick-slip" _nghost-svn-c6="">
         <!---->
         <mobileweb-columnify _ngcontent-svn-c6="" _nghost-svn-c5="">
            <!---->
            <div _ngcontent-svn-c5="" fxlayout="row" class="compact-xs" id="pick-slip.form-input.columnify" style="flex-direction: row; box-sizing: border-box; display: flex; place-content: stretch space-between; align-items: stretch; max-height: 100%;">
               <!---->
               <mobileweb-action-button _ngcontent-svn-c6="" button.flex="56px" button.image="fas fa-barcode fa-2x" class="compact-right-margin-half ng-star-inserted" fxlayout="row" fxlayoutalign="start end" id="barcodeScanner" _nghost-svn-c10="" style="flex-direction: row; box-sizing: border-box; display: flex; place-content: flex-end flex-start; align-items: flex-end;">
                  <!----><!----><!---->
                  <button _ngcontent-svn-c10="" mat-button="" mat-flat-button="" class="mat-button mat-flat-button mat-primary ng-star-inserted selector" id="barcodeScanner.button" style="flex: 1 1 56px; box-sizing: border-box; max-width: 56px; min-width: 56px;">
                     <span class="mat-button-wrapper">
                        <!----><!----><!----><i _ngcontent-svn-c10="" id="barcodeScanner.button.icon" class="fas fa-barcode fa-2x ng-star-inserted"></i><!---->
                     </span>
                     <div class="mat-button-ripple mat-ripple" matripple=""></div>
                     <div class="mat-button-focus-overlay"></div>
                  </button>
               </mobileweb-action-button>
               <!---->
               <mobileweb-rowify _ngcontent-svn-c6="" fxflex="auto" _nghost-svn-c4="" class="ng-star-inserted" style="flex: 1 1 auto; box-sizing: border-box;">
                  <!---->
                  <div _ngcontent-svn-c4="" fxlayout="column" id="rowify" style="flex-direction: column; box-sizing: border-box; display: flex; place-content: stretch space-between; align-items: stretch; max-width: 100%;">
                     <mat-label _ngcontent-svn-c6="" class="compact-xs" id="pick-slip.label">Pick Slip:</mat-label>
                     <mat-form-field _ngcontent-svn-c6="" class="mat-form-field ng-tns-c11-58 mat-primary compact indent mat-form-field-type-mat-input mat-form-field-appearance-fill mat-form-field-can-float ng-pristine ng-valid ng-star-inserted ng-touched" id="pick-slip.formfield">
                        <div class="mat-form-field-wrapper">
                           <div class="mat-form-field-flex">
                              <!----><!---->
                              <div class="mat-form-field-infix">
                                 <!----><input _ngcontent-svn-c6="" class="mat-input-element mat-form-field-autofill-control cdk-text-field-autofill-monitored ng-pristine ng-valid ng-star-inserted ng-touched" matinput="" type="text" id="pick-slip.input" placeholder="Enter Pick Slip" aria-invalid="false" aria-required="false"><!---->
                                 <span class="mat-form-field-label-wrapper">
                                    <!---->
                                 </span>
                              </div>
                              <!---->
                           </div>
                           <!---->
                           <div class="mat-form-field-underline ng-tns-c11-58 ng-star-inserted"><span class="mat-form-field-ripple"></span></div>
                           <div class="mat-form-field-subscript-wrapper">
                              <!----><!---->
                              <div class="mat-form-field-hint-wrapper ng-tns-c11-58 ng-trigger ng-trigger-transitionMessages ng-star-inserted" style="opacity: 1; transform: translateY(0%);">
                                 <!---->
                                 <div class="mat-form-field-hint-spacer"></div>
                              </div>
                           </div>
                        </div>
                     </mat-form-field>
                  </div>
               </mobileweb-rowify>
               <!---->
            </div>
         </mobileweb-columnify>
         <!---->
      </mobileweb-value-input>
      <mobileweb-value-input _ngcontent-svn-c50="" class="compact-xs" id="shipment" _nghost-svn-c6="">
         <!---->
         <mobileweb-columnify _ngcontent-svn-c6="" _nghost-svn-c5="">
            <!---->
            <div _ngcontent-svn-c5="" fxlayout="row" class="compact-xs" id="shipment.form-input.columnify" style="flex-direction: row; box-sizing: border-box; display: flex; place-content: stretch space-between; align-items: stretch; max-height: 100%;">
               <!---->
               <mobileweb-action-button _ngcontent-svn-c6="" button.flex="56px" button.image="fas fa-barcode fa-2x" class="compact-right-margin-half ng-star-inserted" fxlayout="row" fxlayoutalign="start end" id="barcodeScanner" _nghost-svn-c10="" style="flex-direction: row; box-sizing: border-box; display: flex; place-content: flex-end flex-start; align-items: flex-end;">
                  <!----><!----><!---->
                  <button _ngcontent-svn-c10="" mat-button="" mat-flat-button="" class="mat-button mat-flat-button mat-primary ng-star-inserted selector" id="barcodeScanner.button" style="flex: 1 1 56px; box-sizing: border-box; max-width: 56px; min-width: 56px;">
                     <span class="mat-button-wrapper">
                        <!----><!----><!----><i _ngcontent-svn-c10="" id="barcodeScanner.button.icon" class="fas fa-barcode fa-2x ng-star-inserted"></i><!---->
                     </span>
                     <div class="mat-button-ripple mat-ripple" matripple=""></div>
                     <div class="mat-button-focus-overlay"></div>
                  </button>
               </mobileweb-action-button>
               <!---->
               <mobileweb-rowify _ngcontent-svn-c6="" fxflex="auto" _nghost-svn-c4="" class="ng-star-inserted" style="flex: 1 1 auto; box-sizing: border-box;">
                  <!---->
                  <div _ngcontent-svn-c4="" fxlayout="column" id="rowify" style="flex-direction: column; box-sizing: border-box; display: flex; place-content: stretch space-between; align-items: stretch; max-width: 100%;">
                     <mat-label _ngcontent-svn-c6="" class="compact-xs" id="shipment.label">Shipment:</mat-label>
                     <mat-form-field _ngcontent-svn-c6="" class="mat-form-field ng-tns-c11-59 mat-primary compact indent mat-form-field-type-mat-input mat-form-field-appearance-fill mat-form-field-can-float ng-untouched ng-pristine ng-valid ng-star-inserted" id="shipment.formfield">
                        <div class="mat-form-field-wrapper">
                           <div class="mat-form-field-flex">
                              <!----><!---->
                              <div class="mat-form-field-infix">
                                 <!----><input _ngcontent-svn-c6="" class="mat-input-element mat-form-field-autofill-control cdk-text-field-autofill-monitored ng-untouched ng-pristine ng-valid ng-star-inserted" matinput="" type="text" id="shipment.input" placeholder="Enter Shipment" aria-invalid="false" aria-required="false"><!---->
                                 <span class="mat-form-field-label-wrapper">
                                    <!---->
                                 </span>
                              </div>
                              <!---->
                           </div>
                           <!---->
                           <div class="mat-form-field-underline ng-tns-c11-59 ng-star-inserted"><span class="mat-form-field-ripple"></span></div>
                           <div class="mat-form-field-subscript-wrapper">
                              <!----><!---->
                              <div class="mat-form-field-hint-wrapper ng-tns-c11-59 ng-trigger ng-trigger-transitionMessages ng-star-inserted" style="opacity: 1; transform: translateY(0%);">
                                 <!---->
                                 <div class="mat-form-field-hint-spacer"></div>
                              </div>
                           </div>
                        </div>
                     </mat-form-field>
                  </div>
               </mobileweb-rowify>
               <!---->
            </div>
         </mobileweb-columnify>
         <!---->
      </mobileweb-value-input>
      <mobileweb-value-input _ngcontent-svn-c50="" class="compact-xs" id="master-order" _nghost-svn-c6="">
         <!---->
         <mobileweb-columnify _ngcontent-svn-c6="" _nghost-svn-c5="">
            <!---->
            <div _ngcontent-svn-c5="" fxlayout="row" class="compact-xs" id="master-order.form-input.columnify" style="flex-direction: row; box-sizing: border-box; display: flex; place-content: stretch space-between; align-items: stretch; max-height: 100%;">
               <!---->
               <mobileweb-action-button _ngcontent-svn-c6="" button.flex="56px" button.image="fas fa-barcode fa-2x" class="compact-right-margin-half ng-star-inserted" fxlayout="row" fxlayoutalign="start end" id="barcodeScanner" _nghost-svn-c10="" style="flex-direction: row; box-sizing: border-box; display: flex; place-content: flex-end flex-start; align-items: flex-end;">
                  <!----><!----><!---->
                  <button _ngcontent-svn-c10="" mat-button="" mat-flat-button="" class="mat-button mat-flat-button mat-primary ng-star-inserted selector" id="barcodeScanner.button" style="flex: 1 1 56px; box-sizing: border-box; max-width: 56px; min-width: 56px;">
                     <span class="mat-button-wrapper">
                        <!----><!----><!----><i _ngcontent-svn-c10="" id="barcodeScanner.button.icon" class="fas fa-barcode fa-2x ng-star-inserted"></i><!---->
                     </span>
                     <div class="mat-button-ripple mat-ripple" matripple=""></div>
                     <div class="mat-button-focus-overlay"></div>
                  </button>
               </mobileweb-action-button>
               <!---->
               <mobileweb-rowify _ngcontent-svn-c6="" fxflex="auto" _nghost-svn-c4="" class="ng-star-inserted" style="flex: 1 1 auto; box-sizing: border-box;">
                  <!---->
                  <div _ngcontent-svn-c4="" fxlayout="column" id="rowify" style="flex-direction: column; box-sizing: border-box; display: flex; place-content: stretch space-between; align-items: stretch; max-width: 100%;">
                     <mat-label _ngcontent-svn-c6="" class="compact-xs" id="master-order.label">Master Order:</mat-label>
                     <mat-form-field _ngcontent-svn-c6="" class="mat-form-field ng-tns-c11-60 mat-primary compact indent mat-form-field-type-mat-input mat-form-field-appearance-fill mat-form-field-can-float ng-untouched ng-pristine ng-valid ng-star-inserted" id="master-order.formfield">
                        <div class="mat-form-field-wrapper">
                           <div class="mat-form-field-flex">
                              <!----><!---->
                              <div class="mat-form-field-infix">
                                 <!----><input _ngcontent-svn-c6="" class="mat-input-element mat-form-field-autofill-control cdk-text-field-autofill-monitored ng-untouched ng-pristine ng-valid ng-star-inserted" matinput="" type="text" id="master-order.input" placeholder="Enter Master Order" aria-invalid="false" aria-required="false"><!---->
                                 <span class="mat-form-field-label-wrapper">
                                    <!---->
                                 </span>
                              </div>
                              <!---->
                           </div>
                           <!---->
                           <div class="mat-form-field-underline ng-tns-c11-60 ng-star-inserted"><span class="mat-form-field-ripple"></span></div>
                           <div class="mat-form-field-subscript-wrapper">
                              <!----><!---->
                              <div class="mat-form-field-hint-wrapper ng-tns-c11-60 ng-trigger ng-trigger-transitionMessages ng-star-inserted" style="opacity: 1; transform: translateY(0%);">
                                 <!---->
                                 <div class="mat-form-field-hint-spacer"></div>
                              </div>
                           </div>
                        </div>
                     </mat-form-field>
                  </div>
               </mobileweb-rowify>
               <!---->
            </div>
         </mobileweb-columnify>
         <!---->
      </mobileweb-value-input>
   </div>
</mobileweb-rowify>

有什么方法可以使用 Selenium 点击它们中的每一个？唯一的方法是使用完整的 xpath。还有其他方法吗？

标签： seleniumselenium-webdriverselenium-chromedriver

Answer 1

你可以通过这种方式选择使用 xpath。谢谢

click_id = driver.find_elements_by_xpath('//*[@id="barcodeScanner.button"]')
click_id[0].click() # or [1],[2] meaning which one you need.