¿Por qué el controlador de Selenium Firefox considera que mi modal no se muestra cuando el padre tiene un desbordamiento: oculto?

Question

Jul 12, 2013, 11:30 PM

selenium-webdriver selenium-firefoxdriver angularjs c#

¿Por qué el controlador de Selenium Firefox considera que mi modal no se muestra cuando el padre tiene un desbordamiento: oculto?

EDIT: Creo que hay un problema abierto sobre esto ya:http://code.google.com/p/selenium/issues/detail?id=5717

Así que básicamente estoy usando el controlador de Firefox y el div conid="page-content" está causando que mi prueba de selenio falle con el error listado en la pregunta a la que se hace referencia:"El elemento no está visible actualmente y, por lo tanto, no se puede interactuar con él", pero ¿otro es? Pude rastrear el problema hasta el hecho de que esa ID tiene un estilo cssoverflow: hidden ¿Es esto un error, o estoy haciendo algo mal?

Estoy usando la versión Selenium WebDriver: 2.33.0.0, la versión de Firefox: 22

La fuente para la prueba y el sitio web está aquí:https://github.com/tonyeung/selenium-overflow-issue

Para una referencia rápida: el HTML a continuación es mi página de prueba. Para aquellos de ustedes que no están familiarizados con angular, todo lo que hace es mostrar un fragmento html como un modo modal cada vez que haga clic en agregar o editar, puede ver una demostración en vivo aquí:http://plnkr.co/edit/LzHqxAz0f2GurbL9BGyu?p=preview

<!DOCTYPE html>
<html data-ng-app="myApp">
    <head lang="en">
        <meta charset="utf-8">
        <title>Selenium Test</title>  

        <!-- // DO NOT REMOVE OR CHANGE ORDER OF THE FOLLOWING // -->
        <!-- bootstrap default css (DO NOT REMOVE) -->
        <link rel="stylesheet" href="css/bootstrap.min.css?v=1">
        <link rel="stylesheet" href="css/bootstrap-responsive.min.css?v=1">
    </head>
    <body>
        <div data-ng-controller="MyCtrl">
            <span id="added" data-ng-show="added">Added</span>
            <span id="edited" data-ng-show="edited">Edited</span>

            <div id="page-content" style="overflow:hidden">
            <!--<div id="page-content">-->
                <div class="employees view">
                    <button name="addNewEmployee" id="addNewEmployee" class="btn btn-primary" data-ng-click="add()">Add</button>
                    <button name="editEmployee" id="editEmployee" class="btn btn-primary" data-ng-click="edit()">Edit</button>

                    <div data-ng-controller="editCtrl" data-ng-include="'app/views/edit.html'"></div>
                    <div data-ng-controller="addCtrl" data-ng-include="'app/views/add.html'"></div>
                </div>
            </div>

        </div>  

        <!-- JS scripts -->
        <script src="//ajax.googleapis.com/ajax/libs/jquery/2.0.0/jquery.min.js"></script>  
        <script src="//ajax.googleapis.com/ajax/libs/angularjs/1.0.7/angular.js"></script> 
        <script src="//cdnjs.cloudflare.com/ajax/libs/twitter-bootstrap/2.3.1/js/bootstrap.min.js"></script>
        <script src="//cdnjs.cloudflare.com/ajax/libs/angular-strap/0.7.2/angular-strap.min.js"></script>
        <script src="app/app.js"></script>

    </body>
</html>