Contenido. Ejercicios Dia 2. Pruebas codificadas de interfaz de usuario

Transcripción

1 Contenido Contenido... 1 Ejercicios Dia Pruebas codificadas de interfaz de usuario... 1 Para crear una prueba de IU codificada... 2 Para agregar validaciones (aserciones)... 6 Pruebas codificadas de interfaz de usuario controladas por datos... 7 Pruebas web de desempeño Pasos preliminares Para grabar la prueba de rendimiento web Ejecutar la prueba de rendimiento web Para agregar comentarios Para agregar una regla de validación a una prueba de rendimiento web Para agregar el origen de datos a la prueba de rendimiento web Bibliografía Ejercicios Dia 2 Pruebas codificadas de interfaz de usuario Pruebas web de desempeño Pruebas codificadas de interfaz de usuario Con Visual Studio 2010 Ultimate o Visual Studio 2010 Premium, puede crear una prueba de IU codificada para probar que la interfaz de usuario de una aplicación funciona correctamente. La prueba de IU codificada realiza acciones en los controles de la interfaz de usuario de una aplicación y comprueba que se muestran los controles correctos con los valores correctos. Para obtener más información sobre las plataformas y configuraciones admitidas por las pruebas de IU codificadas, vea Configuraciones y plataformas compatibles con las pruebas de IU codificadas y las grabaciones de acciones.

2 Una prueba de IU codificada contiene una asignación de la interfaz de usuario que representa los controles de IU que se ven en la aplicación en pruebas. A continuación, en estos controles de prueba de IU puede realizar acciones para automatizar la interfaz de usuario. Por ejemplo, puede hacer que el método de prueba haga clic en un hipervínculo en una aplicación web, escribir un valor en un cuadro de texto o crear una bifurcación y realizar diferentes acciones de prueba basadas en el valor de un campo. Nota Si agrega varias pruebas de IU codificadas a un proyecto de prueba, solo se crea una asignación de la interfaz de usuario. Es posible que desee tener un proyecto de prueba para cada área de su aplicación si es grande para que la asignación de la interfaz de usuario no se vuelva demasiado grande. Las clases de prueba de IU codificada se identifican mediante un atributo [CodedUITest]. Cada prueba de IU codificada es un método de prueba en una clase de prueba de IU codificada. Puede agregar varios métodos de prueba a cada clase de prueba de IU codificada e identificar cada método de prueba de IU codificada mediante un atributo [TestMethod]. El método de prueba también puede agregar código de validación para que un control de prueba de IU obtenga el valor de una propiedad de un control de prueba de IU. El método de prueba puede usar una instrucción Assert para comparar el valor real de la propiedad con un valor esperado. El resultado de esta comparación determina el resultado de la prueba. Cada vez que ejecute una prueba de IU codificada, puede analizar el resultado de la prueba y, en caso de error, puede ver o almacenar los detalles de la aserción con errores. Para crear una prueba de IU codificada 1. Cree un acceso directo a la aplicación WpfMovieDatabaseApplication en su escritorio. 2. Realice cualquiera de las tareas siguientes: 1. En el Explorador de soluciones, haga clic con el botón secundario en el proyecto de prueba MovieDatabaseApplication.Tests, seleccione Agregar y, a continuación, haga clic en Prueba de IU codificada. 2. Haga clic con el botón secundario en la ventana del Editor de lista de pruebas o de la Vista de pruebas y, a continuación, haga clic en Nueva prueba. En el cuadro de diálogo Agregar nueva prueba, haga clic en Prueba de IU codificada y, a continuación, en Aceptar. 3. En el menú Prueba, haga clic en Nueva prueba. En el cuadro de diálogo Agregar nueva prueba, haga clic en Prueba de IU codificada y, a continuación, en Aceptar.

3 Aparece el cuadro de diálogo Generar código. 3. En este cuadro de diálogo, puede seleccionar el método que desea usar para crear los controles de prueba de IU en su prueba de IU codificada: Métodos Acción Pasos siguientes: Grabar las acciones en la Haga clic en Grabar aplicación en pruebas, modificar la acciones, editar asignación de la interfaz de asignación de IU o usuario o agregar las aserciones agregar aserciones Cómo: Generar una prueba de IU codificada mediante la grabación de la aplicación que se prueba Usar una grabación de acciones existente Haga clic en Usar una grabación de acciones existente. Cómo: Generar una prueba de IU codificada a partir de la grabación de acciones 4. Todos estos métodos crean en su proyecto de prueba una clase de prueba de IU codificada, que tiene un atributo [CodedUITest], y abren el archivo de esta clase. La clase se rellena con un método de prueba, con un atributo [TestMethod]. El Explorador de soluciones muestra el nuevo archivo de prueba en su proyecto de prueba. 5. En este taller, seleccionaremos la opción: Grabar las acciones en la aplicación en pruebas, modificar la asignación de la interfaz de usuario o agregar las aserciones. 6. Para iniciar la grabación, haga clic en el icono Grabar. 7. Haga doble click sobre el acceso directo a WpfMovieDatabaseApplication, aparecerá la siguiente pantalla

4 8. Haga click en Create. Aparecera la siguiente pantalla: 9. Capture la Date Released, el Director y el Title (El Id se genera automáticamente).

5 10. Haga click en Save, la pantalla principal ahora se ve asi: 11. Para ver las acciones, haga clic en el icono Mostrar pasos grabados. Las acciones se muestran en el cuadro de diálogo Generador de pruebas de IU codificadas - Acciones grabadas

6 12. Para terminar la grabación, haga clic en el icono Generar código. Escriba el nombre CreateAndSaveMovie para el método de prueba de IU codificada en Nombre de método y, a continuación, haga clic en Agregar y generar 13. El código se genera de la siguiente manera: [TestMethod] public void CodedUITestMethod1() { // To generate code for this test, select "Generate Code for Coded UI Test" from the shortcut menu and select one of the menu items. // For more information on generated code, see this.uimap.createandsavemovie(); } Para agregar validaciones (aserciones) 14. Para generar aserciones de los controles de interfaz de usuario, haga clic en el icono con forma de cruz y arrástrelo hasta el control que desea comprobar si es correcto. Se muestra el cuadro de diálogo Generador de pruebas de IU codificadas - Agregar aserciones. 15. Haga clic en la barra vertical para ver la asignación de la interfaz de usuario. El control de IU que desea comprobar debe aparecer resaltado. 16. Haga clic con el botón secundario en el control de IU que desea comprobar (el ListView con las películas uimovieslistviewtable ) y, a continuación, elija Agregar aserción. Se muestra el cuadro de diálogo Agregar aserción, indique que desea utilizar la propiedad RowCount para la aserción. 17. Seleccione el Comparador para la aserción (AreEqual). 18. Escriba el valor de la aserción en Valor de comparación (1) 19. Para agregar la aserción, haga clic en Aceptar. 20. Una vez agregadas todas las aserciones para la prueba, cierre el cuadro de diálogo Generador de pruebas de IU codificadas - Agregar aserciones. 21. Para generar el código de las aserciones, haga clic en el icono Generar código. 22. Se muestra el cuadro de diálogo Generador de pruebas de IU codificadas - Generar código.

7 23. Escriba el nombre AssertRowCountIncreased para el método de prueba de IU codificada en Nombre de método y, a continuación, haga clic en Agregar y generar 24. El código se genera de la siguiente manera: [TestMethod] public void CodedUITestMethod1() { // To generate code for this test, select "Generate Code for Coded UI Test" from the shortcut menu and select one of the menu items. // For more information on generated code, see this.uimap.createandsavemovie(); this.uimap.assertrowcountincreased(); } 25. Haga clic en el icono Cerrar para cerrar el Generador de pruebas de IU codificadas 26. Para ejecutar la prueba, haga clic con el botón secundario en el método de prueba y, a continuación, haga clic en Ejecutar pruebas. Pruebas codificadas de interfaz de usuario controladas por datos Crear una prueba de IU codificada controlada por datos Para crear una prueba de IU codificada controlada por datos 1. En el Explorador de soluciones, abra la solución de su proyecto de prueba MovieDatabaseApplication.Tests que contiene el archivo de origen de la prueba de IU codificada: CodedUITest1.cs 2. Haga clic en Prueba, seleccione Ventanas y, a continuación, elija Vista de pruebas. Se muestra la ventana Vista de pruebas con la prueba de IU codificada. 3. En la ventana Vista de pruebas, haga clic con el botón secundario en el método de prueba de IU codificada y elija Propiedades. Se muestra la ventana Propiedades. 4. Para seleccionar el origen de datos que usará para su prueba de IU codificada, haga clic en los puntos suspensivos a la derecha de Cadena de conexión a datos en la ventana Propiedades. Se muestra el Asistente para orígenes de datos de prueba nueva.

8 5. Cree un archivo Movies.csv con las columnas Number,Title,Director,DateReleased y datos de pruebas para 3 renglones. Agregue el archivo a la solución. 6. Seleccione el tipo de origen de datos que desea utilizar. Para este ejemplo, utilice el archivo Movies.csv, y seleccionar ese tipo de origen de datos. Haga clic en Siguiente y escriba la ruta de acceso y el nombre del archivo la archivo Movies.csv; a continuación, haga clic en Finalizar. Ahora, el origen de datos está disponible para usarlo en este método de prueba. La clase TestContext.DataRow se usa para obtener acceso a la fila de datos actual desde el origen de datos. Puede tener acceso a cada columna con la siguiente sintaxis: TestContext.DataRow["Number"] TestContext.DataRow["Title"] TestContext.DataRow["Director"] Nota Asegúrese de que selecciona el archivo.csv para implementarlo con su prueba. Verá que la información de la implementación y del origen de datos se ha agregado como atributos a su método de prueba. 7. En el Explorador de soluciones, abra el archivo CodedUITest1.cs. Realice los siguientes cambios en la clase CodedUITest1: 1. Agregue estas dos líneas de código para preparar los datos de entrada que desea usar como parámetros al sumar dos números. Agregue estas líneas de código antes de llamar al método CreateAndSaveMovie. this.uimap.createandsavemovieparams.uidirectortextboxedittext=testcontext.datarow ["Director"].ToString(); this.uimap.createandsavemovieparams.uititletextboxedittext =TestContext.DataRow["Title"].ToString(); this.uimap.createandsavemovieparams.uidatereleaseddatepickdatepickerdateasstring = TestContext.DataRow["DateReleased"].ToString(); Agregue esta línea de código para preparar los datos de entrada que desea usar como parámetro para la instrucción de aserción que comprueba que el resultado esperado coincide con el resultado real. Agregue este elemento antes de la llamada al método AssertRowCountIncreased this.uimap.assertrowcountincreasedexpectedvalues.uimovieslistviewtablerowcount=conve rt.toint32(testcontext.datarow["number"].tostring());

9 Éste es el aspecto del método de prueba de IU codificada con los parámetros y el origen de datos agregados a él: [DataSource("Microsoft.VisualStudio.TestTools.DataSource.CSV", " DataDirectory \\Movies.csv", "Movies#csv", DataAccessMethod.Sequential), DeploymentItem("MovieDatabaseApplication.Tests\\Movies.csv"), TestMethod] public void CodedUITestMethod1() { // To generate code for this test, select "Generate Code for Coded UI Test" from the shortcut menu and select one of the menu items. // For more information on generated code, see this.uimap.createandsavemovieparams.uidirectortextboxedittext=testcontext.datarow["d irector"].tostring(); this.uimap.createandsavemovieparams.uititletextboxedittext =TestContext.DataRow["Title"].ToString(); this.uimap.createandsavemovieparams.uidatereleaseddatepickdatepickerdateasstring = TestContext.DataRow["DateReleased"].ToString(); this.uimap.createandsavemovie(); this.uimap.assertrowcountincreasedexpectedvalues.uimovieslistviewtablerowcount=conve rt.toint32(testcontext.datarow["number"].tostring()); this.uimap.assertrowcountincreased(); } 8. Guarde los cambios en el archivo de código fuente CodedUITest1.cs. 9. Para ejecutar la prueba de IU codificada, haga clic con el botón secundario en ella en la ventana Vista de pruebas y elija Ejecutar selección. El resultado general de la prueba para todas las iteraciones se muestra en la ventana Resultados de pruebas. Para ver los detalles de cada iteración, haga doble clic en la prueba en la ventana Resultados de pruebas. 10. Notara que por cada renglón en la lista de datos (iteración), se ejecuta una instancia de la aplicación y dicha instancia se mantiene abierta aun después de haberse completado la iteración, para evitar esto, es necesario utiliza la instrucción using. [DataSource("Microsoft.VisualStudio.TestTools.DataSource.CSV", " DataDirectory \\Movies.csv", "Movies#csv", DataAccessMethod.Sequential), DeploymentItem("MovieDatabaseApplication.Tests\\Movies.csv"), TestMethod] public void CodedUITestMethod1() { using(applicationundertest uimainwindowwindow = ApplicationUnderTest.Launch(this.UIMap.CreateAndSaveMovieParams.UIMainWindowWindowEx epath, this.uimap.createandsavemovieparams.uimainwindowwindowalternateexepath)){

10 } // Codigo Original } 11. Vuelva a ejecutar la prueba y notara que en esta ocasión la aplicación se cierra cada ves que termina una iteración. Pruebas web de desempeño Pasos preliminares 1. Abra la solucion MovieDatabaseApplication 2. Haga clic con el botón derecho en el proyecto MovieDatabaseApplication, seleccione la opción Set as Startup Project 3. Verifique que el puerto que utilizara se mantendrá constante entre ejecuciones, para esto, haga click con el botón derecho en en el proyecto MovieDatabaseApplication y selecione la opción Properties. Seleccione la opción Web y cambio la opción de puerto a Specific port. Establesca el puerto Presione CTRL+F5 para ejecutar la aplicación Web en el explorador. Debería ver la primera página. 5. Copie la dirección de la aplicación Web en el portapapeles o en un archivo del Bloc de notas o agréguela la barra de favoritos.

11 6. Cierre el explorador, pero deje la aplicación Web abierta

12 Para grabar la prueba de rendimiento web Para grabar una prueba de rendimiento web, visite el sitio web como si fuera un usuario final. A medida que se desplace por el sitio, las solicitudes se grabarán y se agregarán a la prueba de rendimiento web. 1. Abra el proyecto MovieDatabaseApplication.Tests 2. Cree una carpeta llamada Web y seleccionela 3. Haga click en el botón derecho sobre la carpeta Web y haga clic en Add, New Test. Se muestra el cuadro de diálogo Add new test. 4. En el cuadro de diálogo Add new test, seleccione Web Performance Test, asigne el nombre MoviesWebTest.webtest a la prueba y haga clic en Aceptar. Se agregará al proyecto un nuevo archivo de prueba de rendimiento web denominado MoviesWebTest.webtest y se abrirá la Grabadora de prueba web dentro de una nueva instancia de Internet Explorer. 5. En la barra de direcciones del explorador, escriba la dirección de la aplicación web que copió en un paso anterior y presione ENTRAR(o haga clic en el acceso directo guardado en la barra de favoritos).

13 6. Haga clic en Create New 7. Escriba un Title, un Director y un Date Released:

14 8. Haga click en el boton Create. Esto guardara el registro de la película y volverá a la pantalla principal:

15 9. Visual Studio muestra la prueba de rendimiento web grabada en el Web Test Editor y en el Web Test Recorder a medida que se va grabando. Cuando detenga el registro, podrá editar la prueba. 10. Haga clic en Stop en el Web Test Recorder para terminar el registro y cerrar Internet Explorer. 11. Un cuadro de diálogo muestra el mensaje Detectando parámetros dinámicos. También muestra una barra de progreso que muestra el estado de detección de parámetros en las respuestas HTTP recibidas.

16 12. Si no se detecta ningún parámetro dinámico, el cuadro de diálogo muestra el mensaje No se detectaron parámetros dinámicos que promover. A continuación, se cerrará el cuadro de diálogo. 13. Si se detectan los parámetros dinámicos, se abre el cuadro de diálogo Promover parámetros dinámicos a parámetros de prueba web. Este cuadro de diálogo contiene una tabla con una lista de los valores de parámetros dinámicos que se han encontrado, si los hay. Ahora, puede promoverlos a parámetros de prueba web. Cada fila muestra un valor de parámetro que puede promover si lo desea. 14. En el menú Archivo, haga clic en Guardar para guardar la prueba de rendimiento web que acaba de grabar. Ejecutar la prueba de rendimiento web Para ejecutar la prueba de rendimiento, haga clic en el botón de Ejecutar (el botón más a la izquierda en la barra de herramientas del Web Test Editor). Como en todas los tipos de prueba en Visual Studio, es posible utilizar las ventanas del Test Manager y del Test View para organizar y ejecutar las pruebas.

17 Para ver los resultados de la ejecución, haga doble clic en registro en la ventana de Test Results. Si selecciona cada una de las Request en la ventana de resultados, podrá ver una imagen del sitio web tal y como se hubiera visto de haber efectuado la interacción con el mismo de forma manual Para agregar comentarios Los comentarios son útiles para identificar las acciones de una sección particular de una prueba de rendimiento web. Además, si conviertes tu prueba en código, tus comentarios serán preservados en el código 1. Abra la prueba de rendimiento web MoviesWebTest.webtest. 2. En el Web Test Editor, seleccione la solicitud a la que desee agregar el comentario 3. Haca click con el botón secundario la primera petición y seleccione la opción Insert Comment. Escriba Initial site request. 4. Agregue el comentario Create Movie Record a la segunda petición

18 5. Y agregue el comentario Save Movie Record a la tercera Para agregar una regla de validación a una prueba de rendimiento web 1. Abra la prueba de rendimiento web MoviesWebTest.webtest. 2. En el Web Test Editor, seleccione la solicitud a la que desee agregar la regla de validación. En este caso, seleccionamos la peticion Save Movie Record 3. Haga clic con el botón secundario en la solicitud y seleccione Agregar regla de validación. Se mostrará el cuadro de diálogo Agregar regla de validación.

19 4. En el cuadro de diálogo Agregar regla de validación, seleccione una regla para configurarla; por ejemplo, seleccione Find Text. Buscar texto es una regla de validación que busca una cadena concreta en la respuesta HTTP a su solicitud. 5. Escriba el valor de la propiedad Buscar texto, que debe ser una cadena que espere encontrar en el cuerpo de la respuesta cuando se ejecute la prueba. En este caso escribiremos The best movie ever 6. Establezca la propiedad Pass If Text Found en True.

20 7. Haga clic en Aceptar para cerrar el cuadro de diálogo Agregar regla de validación. 8. En el menú Archivo, haga clic en Guardar para guardar la prueba de rendimiento web. En este punto, nuestra prueba validara que la cadena The best movie ever. Si queremos además, garantizar que dicha película no esta registrada antes ejecutar el test, deberemos agregar otra regla de validación en la petición Initial Site Request 9. En el Editor de prueba web, haga clic en Ejecutar para iniciar la prueba de rendimiento web. Se muestra el Visor de prueba web. 10. En el panel superior del Visor de pruebas Web, haga clic en la solicitud a la que haya agregado la regla de validación. 11. En el panel inferior del Visor de pruebas Web, haga clic en la ficha Detalles. La cuadrícula Reglas de validación y extracción se muestra con una entrada para la regla de validación recién agregada. Compruebe que la regla de validación se haya comportado del modo esperado.

21 12. Agregue una regla de validación para garantiza que The best movie ever no este registrada desde un principio (en la petición Initial Site Request) y vuelva a ejecutar la prueba. 13. La prueba fallara, puesto que ya se insertó antes un registo que viola la regla de validación. Para resolver este problema, borre manualmente el registro utilizando el server explorer y vuelva a ejecutar la prueba. Para agregar el origen de datos a la prueba de rendimiento web 1. En el Web Test Editor, haga clic con el botón secundario en el nodo superior de la prueba de rendimiento web y, a continuación, haga clic en Agregar origen de datos. Aparecerá el Asistente para orígenes de datos

22 2. En el cuadro Data Source Name, escriba el nombre del origen de datos, en este caso Movies 3. En la lista Tipo de origen de datos, haga clic en CSV File. 4. Haga clic en Next. 5. En el cuadro Elija un archivo CSV, escriba la ruta de acceso y el nombre del archivo, o haga clic en los puntos suspensivos (...) para navegar al archivo. Por ejemplo, escriba el siguiente texto: <Ruta de acceso>\movies.csv Los datos del archivo CSV aparecen en el recuadro Vista previa de datos. Se muestran las primeras filas de datos. 6. Haga clic en Finalizar. Si el archivo no pertenece ya al proyecto aparecerá un cuadro de diálogo que le preguntará si desea agregar el archivo al proyecto actual. Puede utilizar la información siguiente para ayudarle a decidir: Response Resultado Ventaja Sí Se copia el archivo en el proyecto. Cuando se implementa el proyecto, no se necesita trabajo adicional. No Este archivo no se copia en el proyecto. Cuando se implementa el proyecto, es posible que deba actualizar la ruta de acceso del archivo. Algunos archivos de datos pueden ser muy grandes y deben mantenerse separados del proyecto. Algunos archivos de datos deben compartirlos varios miembros de un equipo y deben mantenerse en una ubicación central a la que puedan tener acceso todos los miembros. 7. Haga clic en Sí o en No. Se agregará un nodo Data Sources a la prueba de rendimiento web y, a continuación, el archivo de texto aparecerá como una tabla en la jerarquía.

23 8. En el menú Archivo, haga clic en Guardar para guardar la prueba de rendimiento web. 9. Expanda la carpeta Tables y seleccione la Tabla Movies. Si visualiza las propiedades de dicha tabla, podrá notar que hay tres tipos de Access Method 1. Sequential: En el orden en el que estan 2. Random: En un orden al azar 3. Unique: En el orden en el que están, y solo 1 vez 10. En esta ocasión, selecionaremos Unique 11. Expande la petición Save Movie Record, expande los Form Post Parameters y haz click en el Parametro Title, y visualiza las propiedades de dicho paremetro:

24 12. Haz click en Value, haz click en el valor para dicho campo y veraz un selecto ara efectuar databinding. Expande el datasource Movies, expande la tabla Movies#csv y selecciona el campo Title.

25 13. Repite este proceso para Director y DateReleased. Al final el Web Test Editor debe lucir asi: 14. Ahora debes indicar que el test debe efectuarse 1 ves por cada datasource row, para esto, entra el menú Test, Edit Test Settings, Local. Aparecera el siguiente cuadro de dialogo, selecciona la opción Web Test y cambia el radio button a la opción One run per data source row, tal y como se indica en la siguiente image, al terminar has click en Apply

26 15. Ejectua ahora la prueba, que deberá fallar, ya que las reglas de validación no han sido ajustadas para tomar en cuenta el DataSource:

27 16. Para que la prueba pase (además de borrar los registros que fueron insertados durante la ejecución anterior) será necesario ajustar las reglas de validación. Seleccione la regla Find Text dentro de la petición Initial Site Request y cambia el valor en FindText por {{Movies.Movies#csv.Title}} 17. Repita la operación de ajuste a la regla de validación FindText con la petición Save Movie Record 18. Ejecute la prueba, en esta ocasión, debería tener éxito.

28 Bibliografía Administración del ciclo de vida de las aplicaciones de Visual Studio: Professional Application Lifecycle Management with Visual Studio Autores: Mickey Gousset, Brian Keller, Ajoy Krishnamoorthy, Martin Woodward. Publicado por Wiley / Wrox. ISBN: