执行硒时意外的窗口位置移动

Question

在测试过程中使用 selenium 的 ui Select 功能时，我在窗口上的位置意外移动。这是我正在谈论的代码：

    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")

这是我的 HTML（只需 CTRL+F 'id="field-select"'）：

<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>

请注意我的观点是字段选择。每当执行 'field_select.select_by_visible_text("First Name")' 行时，浏览器视图会自动转到页面底部。我通过删除我刚才提到的那条线证明了这个理论，但什么也没发生。当我把它放回去时，它又会移到底部。

我正在使用 python 3.5、django 1.9、selenium 2.52.0、firefox 浏览器

Answer 1

这可以正常工作。 select_by_visible_text() would issue 和 CLICK webdriver 命令以获得适当的选项。根据webdriver specification，当一个元素被点击时，它首先滚动到视图中：

元素单击命令滚动查看元素，然后 尝试单击其可见区域的中心。如果元素 不显示，返回元素不可见错误。