Compartir a través de


Tutorial: Crear, modificar y mantener una prueba de IU codificada

En este tutorial, creará una aplicación Windows Presentation Foundation (WPF) simple para mostrar cómo crear, modificar y mantener una prueba del IU codificada.El tutorial proporciona soluciones para la corrección de pruebas que han sido interrumpidas por diversos problemas de sincronización y de control de refactorización.

Requisitos previos

Para este tutorial, necesitará:

  • Visual Studio Ultimate o Visual Studio Premium.

Crear una aplicación de WPF sencilla

  1. En el menú Archivo, elija Nuevo y haga clic en Proyecto.

    Aparecerá el cuadro de diálogo Nuevo proyecto.

  2. En el panel Instalados, expanda Visual C# y, a continuación, seleccione Windows.

  3. Encima del panel central, compruebe que la lista desplegable de versión de .NET Framework de destino se establece en .NET Framework 4.5.

  4. En el panel central, seleccione la plantilla Aplicación WPF.

  5. En el cuadro de texto Nombre, escriba SimpleWPFApp.

  6. Elija la carpeta donde guardará el proyecto.En el cuadro de texto Ubicación, escriba el nombre de la carpeta.

  7. Elija Aceptar.

    Se abre WPF Designer para Visual Studio y se muestra MainWindow del proyecto.

  8. Abra el cuadro de herramientas, si aún no está abierto.Elija el menú Ver, y elija Cuadro de herramientas.

  9. Bajo la sección Todos los controles de WPF, arrastre un control Botón, Casilla y Barra de progreso hacia MainWindow en la superficie de diseño.

  10. Seleccione el control de botón.En la ventana Propiedades, cambie el valor de la propiedad Contenido de Botón a Inicio.

  11. Seleccione el control ProgressBar.En la ventana Propiedades, cambie el valor de la propiedad Máximo de 100 a 1000.

  12. Seleccione el control Checkbox.En la ventana Propiedades, borre la propiedad IsEnabled.

    Aplicación de WPF sencilla

  13. Haga doble clic en el control de botón para agregar el evento Elegir.

    MainWindow.xmal.cs se muestra en el Editor de código con el cursor en el nuevo evento button1_Elegir.

  14. En la parte superior de la clase MainWindow, agregue un delegado.El delegado se utilizará para la barra de progreso.Para agregar el delegado, agregue el código siguiente:

            private delegate void ProgressBarDelegate(
            System.Windows.DependencyProperty dp, Object value);
    
  15. En el método button1_Elegir, agregue el siguiente código:

                double progress = 0;
    
                ProgressBarDelegate updatePbDelegate =
            new ProgressBarDelegate(progressBar1.SetValue);
    
                do
                {
                    progress ++;
    
                    Dispatcher.Invoke(updatePbDelegate,
                        System.Windows.Threading.DispatcherPriority.Background,
                        new object[] { ProgressBar.ValueProperty, progress });
                    progressBar1.Value = progress;
                }
                while (progressBar1.Value != progressBar1.Maximum);
    
                checkBox1.IsEnabled = true;
    

Comprobar que la aplicación WPF se ejecuta correctamente

  1. En el menú Depurar, seleccione Iniciar depuración o presione F5.

  2. elija Iniciar.

    En unos segundos, la barra de progreso debería ser 100% completado.El control de casilla ahora está habilitado.

  3. Cierre SimpleWPFApp.

Crear y ejecutar una prueba del IU codificada para SimpleWPFApp

  1. En el Explorador de soluciones, haga clic con el botón secundario en la solución, elija Agregar y, a continuación, seleccione Nuevo proyecto.

    Aparecerá el cuadro de diálogo Agregar nuevo proyecto.

  2. En el panel Instalados, expanda Visual C# y, a continuación, seleccione Prueba.

  3. En el panel central, seleccione la plantilla Proyecto prueba de IU codificada.

  4. Elija Aceptar.

    En el explorador de soluciones, el nuevo proyecto de prueba de IU codificada denominado CodedUITestProject1 se agrega a la solución.

    Aparece el cuadro de diálogo Generar código para prueba de IU codificada.

  5. seleccione la opción Grabar acciones, editar asignación de IU o agregar aserciones y elija Aceptar.

    UIMap – generador de pruebas de IU codificadas aparece, y se minimiza la ventana de Visual Studio.

    Para obtener más información acerca de las opciones del cuadro de diálogo, vea Crear pruebas de IU codificadas.

  6. Busque y ejecute la aplicación SimpleWPFApp que creó anteriormente.De forma predeterminada, la aplicación se encontrará en C:\Users\<nombreusuario>\Documentos\Visual Studio 2012\Proyectos\SimpleWPFApp\SimpleWPFApp\bin\Debug\SimpleWPFApp.exe

  7. Cree un acceso directo en el escritorio a la aplicación SimpleWPFApp.Haga clic con el botón secundario en SimpleWPFApp.exe y elija Copiar.En su escritorio, haga clic con el botón secundario y elija Pegar acceso directo.

    SugerenciaSugerencia

    Un acceso directo a la aplicación facilita el poder agregar o modificar pruebas de IU codificadas para la aplicación porque permite iniciar la aplicación rápidamente.No tiene que navegar hasta ella.Tendrá que volver a ejecutar la aplicación en este tutorial.

  8. Elija Iniciar grabación en UIMap – Generador de pruebas de IU codificadas.En unos segundos, el Generador de pruebas de IU codificadas estará listo.

  9. Ejecute SimpleWPFApp.exe mediante el acceso directo en el escritorio.

  10. En SimpleWPFApp, elija Iniciar.

    En unos segundos, la barra de progreso debería ser 100% completado.El control de casilla ahora está habilitado.

  11. Seleccione el cuadro para el control CheckBox.

  12. Cierre la aplicación SimpleWPFApp.

  13. En UIMap - Generador de pruebas de IU codificadas, elija Generar código.

  14. En el nombre del método, escriba SimpleAppTest y elija Agregar y generar.En unos segundos, aparece la prueba de IU codificada y se agrega a la Solución.

  15. Cierre UIMap – Generador de pruebas de IU codificadas.

    El archivo CodedUITest1.cs aparece en el Editor de código.

Ejecutar la prueba de IU codificada

  • En el archivo CodedUITest1.cs, busque el método CodedUITestMethod, haga clic con el botón secundario y seleccione Ejecutar pruebas.

    Mientras se ejecuta la prueba de IU codificada, la aplicación SimpleWPFApp está visible.Realiza los pasos que realizó en el procedimiento anterior.Sin embargo, cuando la prueba intenta activar la casilla para el control CheckBox, la ventana Resultados de pruebas muestra que se produjo un error en la prueba.Esto es debido a que la prueba intenta activar la casilla pero no tiene en cuenta que el control CheckBox está deshabilitado hasta que la barra de progreso sea 100% completado.Puede corregir esto y los problemas similares utilizando los distintos métodos UITestControl.WaitForControlXXX() que están disponibles para las pruebas de IU codificadas.El procedimiento siguiente mostrará cómo utilizar el método WaitForControlEnabled() para corregir el problema que provocó errores en esta prueba.Para obtener más información, vea Hacer que la prueba de IU codificada espere por eventos concretos durante la reproducción.

Modificar y volver a ejecutar la prueba de IU codificada

  1. En la ventana Resultados de pruebas, haga clic con el botón secundario en la prueba con errores y seleccione Ver detalles de resultados de la prueba.

    Se muestra CodedUITestMethod1[Results].

  2. En la sección Seguimiento de pila de errores, elija el primer vínculo al lado de TestProject1.UIMap.SimpleAppTest ().

    El archivo UIMap.Designer.cs empieza con el punto de error resaltado en el código:

    // Select 'CheckBox' check box
    uICheckBoxCheckBox.Checked = this.SimpleAppTestParams.UICheckBoxCheckBoxChecked;
    
  3. Para corregir este problema, puede hacer que la prueba de IU codificada espere a que el control CheckBox esté habilitado antes de continuar en esta línea utilizando el método WaitForControlEnabled().

    Nota de precauciónPrecaución

    No modifique el archivo UIMap.Designer.cs.Cualquier cambio que se realice en el código del archivo UIMapDesigner.cs se sobrescribirá cada vez que se genere código mediante UIMap - Generador de pruebas de IU codificadas.Si tiene que modificar un método grabado, debe copiarlo en el archivo UIMap.cs y cambiar el nombre.El archivo UIMap.cs se puede utilizar para invalidar métodos y propiedades en el archivo UIMapDesigner.cs.Debe quitar la referencia al método original en el archivo UITest.cs el Codificado y reemplazarlo con el nombre del método cuyo nombre ha cambiado.

  4. En el Explorador de soluciones, busque UIMap.uitest en el proyecto de prueba de IU codificada.

  5. Abra el menú contextual para UIMap.uitest y elija Abrir.

    La prueba de IU codificada se abre en el editor.Ahora puede ver y modificar la prueba de IU codificada.

  6. En el panel Acción de UI, seleccione el método de prueba que desea mover al archivo UIMap.cs o UIMap.vb para facilitar la funcionalidad de código personalizado que no se sobrescribirá cuando se vuelva a compilar el código de prueba.

  7. Elija el botón Mover código de la barra de herramientas del Editor de pruebas de la interfaz de usuario codificada.

  8. Se abrirá el cuadro de diálogo Microsoft Visual Studio.Le advierte de que el método se va a mover del archivo UIMap.uitest al archivo UIMap.cs y que ya no se podrá modificar dicho método utilizando el Editor de pruebas de IU codificadas.Elija .

    El método de prueba se quita del archivo UIMap.uitest y ya no se muestra en el panel de acciones de la interfaz de usuario.Para editar el archivo de prueba que se ha movido, abra el archivo UIMap.cs del explorador de soluciones.

  9. En la barra de herramientas de Visual Studio, elija Guardar.

    Las actualizaciones del método de prueba se guardan en el archivo UIMap.Designer.

    Nota de precauciónPrecaución

    Una vez que se ha movido el método, ya no puede modificarlo con el Editor de pruebas de la interfaz de usuario codificadas.Debe agregar el código personalizado y mantenerlo con el Editor de código.

  10. Cambiar el método de SimpleAppTest() a ModifiedSimpleAppTest()

  11. Agregue la siguiente instrucción using al archivo:

    using Microsoft.VisualStudio.TestTools.UITesting.WpfControls;
    
  12. Agregue el siguiente método WaitForControlEnabled() antes de la línea de código que provoca el error identificada previamente:

    uICheckBoxCheckBox.WaitForControlEnabled();
    
    // Select 'CheckBox' check box
    uICheckBoxCheckBox.Checked = this.SimpleAppTestParams.UICheckBoxCheckBoxChecked;
    
  13. En el archivo CodedUITest1.cs, busque el método CodedUITestMethod y marque como comentario o cambie el nombre de la referencia al método original SimpleAppTest () y, a continuación, reemplácelo con el nuevo método ModifiedSimpleAppTest ():

    [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 https://go.microsoft.com/fwlink/?LinkId=179463
                //this.UIMap.SimpleAppTest();
                this.UIMap.ModifiedSimpleAppTest();
            }
    
  14. En el menú Compilar, elija Compilar solución.

  15. Haga clic con el botón secundario en el método CodedUITestMethod y seleccione Ejecutar pruebas.

  16. Esta vez, la prueba de IU codificada completa correctamente todos los pasos en la prueba y aparece Superada en la ventana Resultados de pruebas.

Refactorizar un control en SimpleWPFApp

  1. En el archivo MainWindow.xaml, en el Diseñador, seleccione el control de botón.

  2. En la parte superior de la ventana Propiedades, seleccione el valor button1 junto a Botón y cambie el valor a buttonA.

  3. En el menú Compilar, elija Compilar solución.

  4. En el menú Prueba, seleccione Ventanas y, a continuación, elija Vista de pruebas.

  5. En Vista de pruebas, seleccione CodedUITestMethod1 en la columna Nombre de la prueba y, a continuación, elija Ejecutar selección en la barra de herramientas.

    La prueba no se supera porque la prueba de IU codificada no puede localizar el control de botón que se asignó originalmente en UIMap como button1.La refactorización puede impactar las pruebas de IU codificadas de esta manera.

  6. En la ventana Resultados de pruebas, haga clic con el botón secundario en la prueba con errores y seleccione Ver detalles de resultados de la prueba.

    Aparece CodedUITestMethod1[Results].

  7. En la sección Seguimiento de pila de errores, elija el primer vínculo junto a TestProject1.UIMpa.SimpleAppTest().

    El archivo UIMap.Designer.cs se abre.El punto de error se resalta en el código:

    // Choose 'Start' button
    Mouse.Click(uIStartButton, new Point(27, 10));
    

    Observe que la línea de código anterior en este procedimiento está utilizando UiStartButton, que es el nombre de UIMap antes de refactorizarse.

    Para corregir el problema, puede agregar el control refactorizado a UIMap utilizando el Generador de pruebas de IU codificadas.Puede actualizar el código de la prueba para utilizar el código, tal y como se muestra en el procedimiento siguiente.

Asignar control refactorizado, y editar y volver a ejecutar la prueba de IU codificada

  1. En el archivo CodedUITest1.cs, en el método CodedUITestMethod1 (), haga clic con el botón secundario, seleccione Generar código para prueba de IU codificada y, a continuación, elija Usar generador de pruebas de IU codificadas.

    Aparece UIMap – Generador de pruebas de IU codificadas.

  2. Use el acceso directo en el escritorio que creó anteriormente; ejecute la aplicación SimpleWPFApp que creó anteriormente.

  3. En UIMap – Generador de pruebas de IU codificadas, arrastre la herramienta en forma de cruz hacia el botón Inicio en SimpleWPFApp.

    El botón Inicio se incluye en un cuadro azul y el Generador de pruebas de IU codificadas tarda unos segundos en procesar los datos para el control seleccionado y muestra las propiedades de los controles.Observe que AutomationUId se denomina buttonA.

  4. En las propiedades para el control, elija la flecha de la esquina superior izquierda para expandir la asignación de controles de IU.Observe que UIStartButton1 está seleccionado.

  5. En la barra de herramientas, elija Agregar control a la asignación de controles de IU.

    El estado en la parte inferior de la ventana comprueba la acción mostrando El control seleccionado se ha agregado a la asignación de controles de IU.

  6. En UIMap - Generador de pruebas de IU codificadas, elija Generar código.

    El Generador de pruebas de IU codificadas - Generar código aparece con una nota que indica que no se requiere ningún nuevo método y ese código únicamente se generará para los cambios a la asignación de controles de IU.

  7. Elija Generar.

  8. Cierre SimpleWPFApp.exe.

  9. Cierre UIMap - Generador de pruebas de IU codificadas.

    UIMap – Generador de pruebas de IU codificadas tarda unos segundos en procesar los cambios en la asignación de controles de IU.

  10. En el Explorador de soluciones, abra el archivo UIMap.Designer.cs.

  11. En el archivo UIMap.Designer.cs, debajo del constructor en la clase generada por código UIMainWindow, expanda la región Propiedades.Observe que se ha agregado la propiedad public WpfButton UIStartButton1.

  12. En la propiedad UIStartButton1, expanda la región de Criterios de búsqueda.Observe que SearchProperties está establecido en "buttonA":

    public WpfButton UIStartButton1
            {
                get
                {
                    if ((this.mUIStartButton1 == null))
                    {
                        this.mUIStartButton1 = new WpfButton(this);
                        #region Search Criteria
                        this.mUIStartButton1.SearchProperties[WpfButton.PropertyNames.AutomationId] = "buttonA";
                        this.mUIStartButton1.WindowTitles.Add("MainWindow");
                        #endregion
                    }
                    return this.mUIStartButton1;
                }
            }
    

    Ahora puede modificar la prueba de IU codificada para utilizar el control asignado recientemente.Como se indicó en el procedimiento anterior si desea invalidar cualquier método o propiedad en la prueba de IU codificada, debe hacerlo en el archivo UIMap.cs.

  13. En el archivo UIMap.cs, agregue un constructor y especifique la propiedad SearchProperties de la propiedad UIStartButton para utilizar la propiedad AutomationID con un valor de "buttonA":

    public UIMap()
            {
                this.UIMainWindowWindow.UIStartButton.SearchProperties[WpfButton.PropertyNames.AutomationId] = "buttonA";
            }
    
  14. En el menú Compilar, elija Compilar solución.

  15. En Vista de pruebas, seleccione CodedUITestMethod1 bajo la columna Nombre de la prueba. En la barra de herramientas, haga clic en Ejecutar selección.

    Este tiempo, la prueba de IU codificada completa correctamente todos los pasos en la prueba.En la Ventana Resultados de pruebas, verá un estado de Superada.

Recursos externos

Ff977233.collapse_all(es-es,VS.110).gifVideos

vínculo a vídeo

vínculo a vídeo

vínculo a vídeo

Ff977233.collapse_all(es-es,VS.110).gifManos de laboratorio

Práctica virtual de MSDN: Introducción a crear pruebas de UI codificadas con Visual Studio 2010

Ff977233.collapse_all(es-es,VS.110).gifPreguntas más frecuentes

Preguntas más frecuentes las pruebas de IU codificadas de usuario - 1

Preguntas más frecuentes de las pruebas de la IU codificadas -2

Ff977233.collapse_all(es-es,VS.110).gifForo

Prueba de automatización de la IU de Visual Studio (incluye CodedUI)

Vea también

Conceptos

Comprobar el código usando pruebas de interfaz de usuario codificadas

Configuraciones y plataformas compatibles con las pruebas de IU codificadas y las grabaciones de acciones

Otros recursos

Introducción a WPF Designer

Editar pruebas de IU codificadas mediante el editor de pruebas de IU codificadas