Unerwartete Fensterpositionsbewegung bei der Ausführung von Selen

Question

Meine Position auf dem Fenster bewegt sich unerwartet, wenn ich während des Tests die ui-Select-Funktion des Selens verwende. Dies ist der Code, den ich rede:

from django.contrib.staticfiles.testing import StaticLiveServerTestCase 

    from selenium import webdriver 
    from selenium.webdriver.common.keys import Keys 
    from selenium.webdriver.support.ui import Select 

    field_select = Select(self.browser.find_element_by_id("field-select")) 
    field_select.select_by_visible_text("First Name") 

Hier ist mein HTML (nur STRG + F 'id = "Feld wählen Sie"'):

<div id="crew-menu-header"> <!-- START id="crew-menu-header" --> 
     <strong>USERS</strong> 
     <h3 class="color-msmi-green">Create and Update users.</h3> 
    </div> <!-- END id="crew-menu-header" --> 
    <div ng-controller="itemListController"> 
     <div id="crew-menu-body" class="form-horizontal admin-screens-body"> <!-- START id="crew-menu-body" --> 
      <div class="form-group negate-margin-bottom"> <!-- START class="form-group negate-margin-bottom" --> 
       <div class="col-lg-12"> <!-- START class="col-lg-10 profile-border" --> 
        <div class="form-group" id="search-filter-container"> <!-- START class="form-group search-filter-container" --> 
         <div class="col-lg-3"> 
          <div class="input-group"> 
           <label class="input-group-addon input-label negate-padding-left">Search:</label> 
           <input class="form-control input-form" id="search" type="text" placeholder="Search here..." ng-keyup="search(apiGetItems, $event)" auto-complete ui-items="searchItems"> 
          </div> 
         </div> 
         <div class="col-lg-3"> 
          <div class="input-group"> 
           <label class="input-group-addon input-label">Search by:</label> 
           <select id="field-select" class="form-control input-form" ng-model="searchList" ng-options="x as x.label for x in searchFilters" ng-change="searchFilter()" ng-init="searchList=searchFilters[0]"></select> 
          </div> 
         </div> 
         <div class="col-lg-2"> 
          <div class="input-group"> 
           <button class="btn form-control btn-msmi-blue" ng-click="clearSearch()" id="clear-sort">Clear</button> 
          </div> 
         </div> 
        </div> <!-- END class="form-group" --> 
        <table class="table table-condensed"> <!-- START class="table table-condensed" --> 
         <thead> 
          <tr> 
          <!-- Table Headers declared in an array via angular --> 
          <th ng-repeat="x in tableHeaders"> 
           <label ng-class="checkSortable(x.url)" ng-click="itemSort(x.url, x.field, $event)"> 
            [[x.name]] 
            <span ng-if="x.url" class="caret [[ x.class ]]" ng-click="dynamicCaret($event)" id="sort_[[ x.id ]]"></span> 
           </label> 
           <span ng-if="x.url"> 
            <span ng-if="orderPosition(x.field)" class="order-attributes"> 
             <span ng-click="removeOrder(x.field, $event)" class="glyphicon glyphicon-minus-sign" data-toggle="tooltip" title="Remove Sort" id="remove_[[ x.id ]]"></span> 
             <span id="priority_[[ x.id ]]">[[ orderPosition(x.field) ]]</span> 
            </span> 
           </span> 
          <th class="text-center"><label>Options</label></th> 
          </tr> 
         </thead> 
         <tbody> 
          <tr ng-if="noRecord"> 
           <td colspan="[[ tableHeadersLength ]]" class="text-center">[[ noRecordMessage ]] <!-- in the search --></td> 
          </tr> 
          <tr ng-repeat="x in items" ng-if="!noRecord"> 
           <td>[[x.id]]</td> 
           <td>[[x.user_code]]</td> 
           <td>[[x.first_name]] [[x.middle_name]] [[x.last_name]]</td> 
           <td>Group</td> 
           <td>[[x.is_active]]</td> 
           <td>[[x.updated_by.user_code]]</td> 
           <td>[[ x.date_updated ]]</td> 
           <td class="text-center"> 
            <span data-toggle="tooltip" title="Preview" class="glyphicon glyphicon-search"></span> 
            <a href="#/update/[[ x.id ]]"><span class="glyphicon glyphicon-pencil" data-toggle="tooltip" title="Update"></span></a> 
            <span ng-if="x.is_active === 'Active'" ng-click="toggleDynamicModal(x.id, true)" data-toggle="tooltip" title="Deactivate" class="glyphicon glyphicon-ban-circle"></span> 
            <span ng-if="x.is_active === 'Inactive'" ng-click="toggleDynamicModal(x.id, false)" data-toggle="tooltip" title="Activate" class="glyphicon glyphicon-ok"></span> 
           </td> 
          </tr> 
         </tbody> 
        </table> <!-- END class="table table-condensed" --> 
        <div ng-include="'/static/html/pagination.html'"></div> 
       </div> <!-- START class="col-lg-12 profile-border" --> 
       <!-- <aside> --> <!-- START aside --> 
        <!-- <div class="col-lg-2"> --> <!-- START class="col-lg-2" --> 
         <!-- <div id="profile-sidebar"> --><!-- START id="profile-sidebar" --> 
          <!-- <a href=""><button class="btn form-control" ng-hide="!isChecked()" ng-click="deleteMultiple()">DELETE</button></a> 
          <a href="#/add"><button class="btn form-control">ADD</button></a> 
          <a href=""><button class="btn form-control" ng-click="close()">EXIT</button></a> --> 
         <!-- </div> --> <!-- END id="profile-sidebar" --> 
        <!-- </div> --> <!-- END class="col-lg-2" --> 
       <!-- </aside> --> <!-- END aside --> 
      </div> <!-- END class="form-group negate-margin-bottom" --> 
     </div> <!-- END id="crew-menu-body" --> 

     <confirmation-modal title="Please Confirm" visible="showModal"> <!-- START delete-modal --> 
      <div id="notifications"> 
       <div ng-if="!notifications"> 
        <div class="form-group"> 
         [[ statement ]] 
        </div> 
        <div class="text-right"> 
         <button class="btn btn-default" data-dismiss="modal">Cancel</button> 
         <button class="btn btn-default" ng-click="deleteItem(id, 'user_code', apiDelete)" data-dismiss="modal" ng-if="operation" id="deactivate">Deactivate</button> 
         <button class="btn btn-default" ng-click="individualUpdate($event, id,'is_active', true, apiUpdate, x)" data-dismiss="modal" ng-if="!operation" id="restore">Restore</button> 
        </div> 
       </div> 
       <div ng-if="notifications"> 
        <div ng-repeat="x in deleteArray"> 
         <div> <span class="item-notification">[[ x.name ]]</span> - has been deactivated <button class="btn btn-default btn-msmi-blue undo-button" ng-click="individualUpdate($event, x.id,'is_active', true, apiUpdate, x)">UNDO</button></div> 
        </div> 
       </div> 
      </div> 
     </confirmation-modal> <!-- END delete-modal --> 

     <div id="crew-menu-footer"> <!-- START id="crew-menu-footer" --> 
      <div class="form-group screens-footer"> <!-- START class="form-group screens-footer" --> 
       <div class="col-lg-2 col-lg-offset-6"> 
        <a href=""><button class="btn form-control" ng-hide="!isChecked()" ng-click="toggleModalMultiple()" id="deactivate-modal">DEACTIVATE</button></a> 
       </div> 
       <div class="col-lg-2"> 
        <a href="#/add"><button class="btn form-control" id="add-page">ADD</button></a> 
       </div> 
       <div class="col-lg-2"> 
        <a href=""><button class="btn form-control" ng-click="close()" id="exit">EXIT</button></a> 
       </div> 
      </div> <!-- END class="form-group screens-footer" --> 
     </div> <!-- END id="crew-menu-foote"r --> 
    </div> 

GERADE MIND über das Feld wählen wie mein Punkt ist. Immer wenn die Zeile 'field_select.select_by_visible_text (' First Name '') ausgeführt wird, wird die Browseransicht automatisch an den unteren Rand der Seite verschoben. Ich habe diese Theorie bewiesen, indem ich die erwähnte Linie entfernt habe und nichts passiert ist. Wenn ich es zurückstelle, bewegt es sich wieder auf den Boden.

ich verwende Python 3.5, django 1.9, Selen 2.52.0, Firefox-Browser

Answer 1

Dies funktioniert, wie es funktionieren soll. Der select_by_visible_text()would issue ein CLICK Web-Treiber-Befehl für eine entsprechende Option. Nach den webdriver specification, wenn ein Element geklickt wird, ist es zunächst gescrollt in Sicht:

Das Element Befehl blättert in Sicht das Element klicken und dann Versuche, das Zentrum seines sichtbaren Bereichs zu klicken. Wenn das Element nicht angezeigt wird, wird ein Element nicht sichtbarer Fehler zurückgegeben.