Wskazówki: tworzenie, edytowanie i obsługa kodowanego testu interfejsu użytkownika

Artykuł
06/08/2015

Podręcznik pozwala utworzyć prostą aplikację Windows Presentation Foundation (WPF) do przedstawienia sposobu tworzenia, edytowania i utrzymywania kodowanego testu interfejsu użytkownika.Dostarcza on rozwiązania do korekcji testów, które zostały uszkodzone przez różne problemy związane z czasem i refaktoryzacją kontroli.

Wymagania wstępne

Oprócz przewodnika potrzeba:

Visual Studio Ultimate lub Visual Studio Premium.

Tworzenie prostej aplikacji WPF

Na pliku menu, wskaż opcję nowy, a następnie wybierz opcję projektu.

Pojawi się okno dialogowe Nowy projekt.
W zainstalowane okienku rozwiń Visual C#, a następnie wybierz opcję pulpitu systemu Windows.
Nad środkowym okienkiem sprawdź, czy dla listy rozwijanej platformy docelowej wybrano ustawienie .NET Framework 4.5.
W środkowym okienku wybierz szablon Aplikacja WPF.
W polu tekstowym Nazwa wpisz SimpleWPFApp.
Wybierz folder, w którym zapiszesz projekt.W polu tekstowym Lokalizacja wpisz nazwę folderu.
Wybierz przycisk OK.

Zostanie otwarty program The WPF Designer for Visual Studio i pojawi się główne okno projektu.
Jeśli przybornik nie jest otwarty, otwórz go.Wybierz WIDOKU menu, a następnie wybierz przybornika.
W sekcji Wszystkie formanty WPF przeciągnij formanty Przycisk, Pole wyboru i Pasek postępu na powierzchnię projektową okna głównego.
Zaznacz formant przycisku.W oknie Właściwości zmień wartość na nazwa właściwości < bez nazwy > button1.Następnie zmień wartość dla zawartości właściwości przycisku Start.
Zaznacz formant paska postępu.W oknie Właściwości zmień wartość dla nazwa właściwości < bez nazwy > progressBar1.Następnie zmień wartość dla maksymalna właściwości z 100 do 10000.
Zaznacz formant pola wyboru.W oknie Właściwości zmień wartość na nazwa właściwości z < bez nazwy > pole wyboru 1 i wyczyść isenabled, należy właściwości.
Kliknij dwukrotnie formant przycisku do obsługi zdarzenia kliknij przycisk Dodaj.

MainWindow.xmal.cs jest wyświetlany w edytorze kodu, z kursorem w nowej metodzie button1_Click.

W górnej części klasy MainWindow dodaj delegata.Delegat będzie używany dla paska postępu.Aby dodać delegata, dodaj następujący kod:

public partial class MainWindow : Window
{
        private delegate void ProgressBarDelegate(System.Windows.DependencyProperty dp, Object value);        

    public MainWindow()
    {

        InitializeComponent();
    }

W metodzie button1_Click dodaj następujący kod:

private void button1_Click(object sender, RoutedEventArgs e)
{
    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;
}

Zapisz plik.

Weryfikowanie prawidłowego uruchamiania aplikacji WPF

Na debugowanie menu, wybierz opcję rozpocząć debugowanie lub naciśnij klawisz F5.
Zwróć uwagę, że kontrolka pole wyboru jest wyłączona.Wybierz opcję Rozpocznij.

W ciągu kilku sekund pasek postępu powinien być zapełniony w 100%.
Można wybierać kontrolkę pola wyboru.
Zamknij aplikację SimpleWPFApp.

Tworzenie i uruchamianie kodowanego testu interfejsu użytkownika dla aplikacji SimpleWPFApp

Zlokalizuj utworzony wcześniej aplikacji SimpleWPFApp.Domyślnie aplikacji można znaleźć na C:\Users\ < nazwa_użytkownika > \Documents\Visual Studio 2013\Projects\SimpleWPFApp\SimpleWPFApp\bin\Debug\SimpleWPFApp.exe
Utwórz na pulpicie skrót do aplikacji SimpleWPFApp.Kliknij prawym przyciskiem myszy plik SimpleWPFApp.exe i wybierz polecenie Kopiuj.Na pulpicie kliknij prawym przyciskiem myszy i wybierz polecenie Wklej skrót.

Porada

Skrót do aplikacji ułatwia dodawanie lub modyfikowanie kodowanych testów interfejsu użytkownika dla aplikacji, ponieważ pozwala to na szybkie uruchamianie aplikacji.
W Eksploratorze rozwiązań kliknij prawym przyciskiem myszy rozwiązanie, wybierz polecenie Dodaj, a następnie wybierz polecenie Nowy projekt.

Pojawi się okno dialogowe Dodaj nowy projekt.
W okienku Zainstalowane rozwiń obszar Visual C#, a następnie wybierz opcję Test.
W środkowym okienku wybierz szablon Projekt kodowanego testu interfejsu użytkownika.
Wybierz przycisk OK.

W Eksploratorze rozwiązań nowy kodowanych projektu testowego interfejsu użytkownika o nazwie CodedUITestProject1 zostanie dodany do rozwiązania.

Pojawi się okno dialogowe Generowanie kodu kodowanego testu interfejsu użytkownika.
Wybierz opcję Zarejestruj akcje, edytuj mapę interfejsu użytkownika lub dodaj asercje i wybierz OK.

UIMap — konstruktora testów interfejsu użytkownika zakodowanego pojawia się i jest zminimalizowane okna programu Visual Studio.

Aby uzyskać więcej informacji dotyczących opcji w oknie dialogowym, zobacz sekcję Tworzenie kodowanych testów interfejsu użytkownika.

Porada
Skrót do aplikacji ułatwia dodawanie lub modyfikowanie kodowanych testów interfejsu użytkownika dla aplikacji, ponieważ pozwala to na szybkie uruchamianie aplikacji.

Wybierz polecenie Rozpocznij nagrywanie dla UIMap — Konstruktor kodowanego testu interfejsu użytkownika.

Rozpocznij rejestrowanie

Można zatrzymać nagrywania, jeśli to konieczne, na przykład, jeśli zachodzi potrzeba zaradzenia poczty przychodzącej.

Wstrzymaj rejestrowanie

Przestroga
Będą rejestrowane wszystkie akcje wykonywane na pulpicie.Zatrzymaj rejestrowanie wykonywania akcji, które mogą prowadzić do danych poufnych znajdujących się w rejestracji.

Uruchom SimpleWPFApp przy użyciu skrótu pulpitu.

Jak wcześniej Zwróć uwagę, że kontrolka pole wyboru jest wyłączona.
W aplikacji wybierz polecenie Rozpocznij.

W ciągu kilku sekund pasek postępu powinien być zapełniony w 100%.
Sprawdź kontrolkę pola wyboru, który jest teraz włączona.
Zamknij aplikację SimpleWPFApp.
Dla UIMap — Konstruktor kodowanego testu interfejsu użytkownika wybierz polecenie Generuj kod.
W polu Nazwa metody wpisz SimpleAppTest i wybierz polecenie Dodaj i Generuj.W ciągu kilku sekund Kodowany test interfejsu użytkownika pojawi się i będzie dodany do rozwiązania.
Zamknij UIMap — Konstruktor kodowanego testu interfejsu użytkownika.

Plik CodedUITest1.cs pojawi się w edytorze kodu.
Zapisać swój projekt.

Uruchamianie kodowanego testu interfejsu użytkownika.

Z testu menu, wybierz polecenie Windows , a następnie wybierz Eksploratora testów.
Z tworzenie menu, wybierz polecenie tworzyć rozwiązania.
W pliku CodedUITest1.cs CodedUITestMethod metody, kliknij prawym przyciskiem myszy i wybierz polecenie Uruchom testy, lub uruchomić test z Eksploratora testów.

Podczas wykonywania kodowanego testu interfejsu użytkownika aplikacja SimpleWPFApp jest widoczna.Wykonuje ona działania, których nie było w poprzedniej procedurze.Jednak próba test zaznacz pole wyboru dla formantu pola wyboru, okna testowanie wyniki pokazuje, że testowanie nie powiodło się.To jest, ponieważ test próbuje zaznacz pole wyboru nie jest jednak pamiętać, że formant pole wyboru jest wyłączony, dopóki nie zostanie wykonane w 100% pasek postępu.Ten i podobne problemy można rozwiązać za pomocą różnych metod UITestControl.WaitForControlXXX(), dostępnych dla kodowanego testowania interfejsu użytkownika.Następna procedura wykaże za pomocą metody WaitForControlEnabled(), jak rozwiązać problem, który spowodował niepowodzenie testu.Aby uzyskać więcej informacji, zobacz Wstrzymywanie kodowanych testów użytkownika dla określonych zdarzeń podczas odtwarzania.

Edytowanie i ponowne uruchamianie kodowanego testu interfejsu użytkownika

W oknie Eksploratora testów, wybierz test nie powiodło się i w StackTrace sekcji, wybierz pierwsze łącze do UIMap.SimpleAppTest().

Plik UIMap.Designer.cs otwiera się z punktem błędu wyróżnionego w kodzie:

// Select 'CheckBox' check box
uICheckBoxCheckBox.Checked = this.SimpleAppTestParams.UICheckBoxCheckBoxChecked;

Aby rozwiązać ten problem, należy wykonać kodowany test interfejsu użytkownika i poczekać, aż formant CheckBox zostanie włączony przed przejściem do tego wiersza przy użyciu metody WaitForControlEnabled().

Przestroga
Nie należy modyfikować pliku UIMap.Designer.cs.Wszelkie zmiany kodu wprowadzone w pliku UIMapDesigner.cs zostaną każdorazowo zastąpione przy generowaniu kodu za pomocą UIMap — Konstruktora kodowanego testu interfejsu użytkownika.Jeśli trzeba zmodyfikować nagraną metodę, należy skopiować ją do pliku UIMap.cs i zmienić jej nazwę.Plik UIMap.cs może służyć do zastępowania metod i właściwości w pliku UIMapDesigner.cs.Musisz usunąć odwołanie do oryginalnej metody w pliku Coded UITest.cs, a następnie zastąpić je zmienioną nazwą metody.

Nie należy modyfikować pliku UIMap.Designer.cs.Wszelkie zmiany kodu wprowadzone w pliku UIMapDesigner.cs zostaną każdorazowo zastąpione przy generowaniu kodu za pomocą UIMap — Konstruktora kodowanego testu interfejsu użytkownika.Jeśli trzeba zmodyfikować nagraną metodę, należy skopiować ją do pliku UIMap.cs i zmienić jej nazwę.Plik UIMap.cs może służyć do zastępowania metod i właściwości w pliku UIMapDesigner.cs.Musisz usunąć odwołanie do oryginalnej metody w pliku Coded UITest.cs, a następnie zastąpić je zmienioną nazwą metody.

W Eksploratorze rozwiązań zlokalizuj UIMap.uitest w projekcie kodowanego testu interfejsu użytkownika.
Otwórz menu skrótów dla UIMap.uitest i wybierz polecenie Otwórz.

Kodowany test interfejsu użytkownika jest wyświetlany w Edytorze kodowanego testu interfejsu użytkownika.Teraz można wyświetlać i edytować kodowany test interfejsu użytkownika.
W interfejsu użytkownika akcji okienka, wybierz jest zwrócenie metody badania (SimpleAppTest), który chcesz przenieść do pliku UIMap.cs lub UIMap.vb w celu ułatwienia funkcji kodu niestandardowego, który nie zostać zastąpiony, gdy kod testu.
Naciśnij przycisk Przenieś kod na pasku narzędzi Edytora kodowanego testu interfejsu użytkownika.
Pojawi się okno dialogowe programu Microsoft Visual Studio.Zawiera ono ostrzeżenie, że metoda ta ma zostać przeniesiona z pliku UIMap.uitest do pliku UIMap.cs i nie będzie już można edytować metody za pomocą Edytora kodowanego testu interfejsu użytkownika.Kliknij przycisk Tak.

Metoda testu jest usuwana z pliku UIMap.uitest i nie jest już wyświetlana w okienku Akcje interfejsu użytkownika.Aby edytować przeniesiony plik testowy, otwórz plik UIMap.cs w Eksploratorze rozwiązań.

Na pasku narzędzi Visual Studio wybierz opcję Zapisz.

Aktualizacje do metody testowej są zapisywane w pliku UIMap.Designer.

Przestroga
Po przeniesieniu metody nie będzie można edytować jej za pomocą Edytora kodowanego testu interfejsu użytkownika.Należy dodać niestandardowy kod i obsługiwać go za pomocą Edytora kodu.

Zmień nazwę metody z SimpleAppTest() na ModifiedSimpleAppTest()

Dodaj następującą instrukcję using do pliku:

using Microsoft.VisualStudio.TestTools.UITesting.WpfControls;

Dodaj następującą metodę WaitForControlEnabled() przed naruszającym wierszem kodu zidentyfikowanym wcześniej:

uICheckBoxCheckBox.WaitForControlEnabled();

// Select 'CheckBox' check box
uICheckBoxCheckBox.Checked = this.SimpleAppTestParams.UICheckBoxCheckBoxChecked;

W pliku CodedUITest1.cs zlokalizuj metodę CodedUITestMethod i skomentuj albo zmień nazwę odniesienia do oryginalnej metody SimpleAppTest() i zastąp nowym testem 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();
        }

Na tworzenie menu, wybierz polecenie tworzyć rozwiązania.
Kliknij prawym przyciskiem myszy CodedUITestMethod i wybierz opcję Uruchom testy.
Ten czas kodowanych testów interfejsu użytkownika pomyślnie ukończeniu wszystkich czynności w teście i Passed jest wyświetlany w oknie Eksploratora testów.

Reorganizacja formantu w aplikacji SimpleWPFApp

W pliku MainWindow.xaml w Projektancie zaznacz formant przycisku.
U góry okna właściwości, należy zmienić nazwa wartości właściwości z button1 do buttonA.
Na tworzenie menu, wybierz polecenie tworzyć rozwiązania.
W Eksploratorze testów, uruchom CodedUITestMethod1.

Test zakończy się niepowodzeniem, ponieważ w UIMap jako button1 kodowany test interfejsu użytkownika nie można znaleźć formantu przycisku, który pierwotnie był mapowany.Refaktoryzacja może w ten sposób wpłynąć na kodowane testy interfejsu użytkownika.
W oknie Eksploratora testów w StackTrace sekcji, wybierz pierwsze łącze obok (UIMpa.ModifiedSimpleAppTest).

Otwiera plik UIMap.cs.Punkt błędu jest wyróżniany w kodzie:
```
// Click 'Start' button
Mouse.Click(uIStartButton, new Point(27, 10));
```
Należy zauważyć, że w wierszu kodu wcześniej w tej procedurze użyto właściwości UiStartButton, która była nazwą UIMap, zanim został wycofany.

Aby rozwiązać ten problem, można dodać wycofany formant do UIMap za pomocą Konstruktora kodowanego testu interfejsu użytkownika.Można zaktualizować kod testu do użycia kodu, jak przedstawiono w następnej procedurze.

Mapowanie wycofanej kontroli i edycji oraz ponowne przeprowadzenie kodowanego testu interfejsu użytkownika

W pliku CodedUITest1.cs w metodzie CodedUITestMethod1() kliknij prawym przyciskiem myszy, wybierz polecenie Generuj kod dla kodowanego testu interfejsu użytkownika, a następnie wybierz opcję Użyj konstruktora kodowanego testu interfejsu użytkownika.

Pojawi się UIMap — Konstruktor kodowanego testu interfejsu użytkownika.
Przy użyciu skrótu pulpitu utworzony wcześniej, uruchomić aplikację SimpleWPFApp, który został utworzony wcześniej.
W UIMap — Konstruktor kodowanego testu interfejsu użytkownika przeciągnij narzędzie krzyżyka do przycisku Rozpocznij na SimpleWPFApp.

Przycisk Rozpocznij jest ujęty w niebieskie pole, a przetworzenie danych dla wybranego formantu przez Konstruktora kodowanego testu interfejsu użytkownika i wyświetlenie właściwości formantów trwa tylko kilka sekund.Należy zauważyć, że AutomationUId nazwano buttonA.
We właściwościach formantu wybierz strzałkę w lewym górnym rogu, aby rozwinąć Mapę formantów UI.Należy zauważyć, że zaznaczona jest opcja UIStartButton1.
Na pasku narzędzi wybierz polecenie Dodaj formant do Mapy formantów UI.

Stan w dolnej części okna sprawdza akcję poprzez wyświetlenie opcji Zaznaczony formant został dodany do mapy formantów interfejsu użytkownika.
W UIMap — Konstruktor kodowanego testu interfejsu użytkownika wybierz polecenie Generuj kod.

Konstruktor testu kodowanego interfejsu użytkownika — Generuj kod pojawia się z uwagą wskazującą, że nie jest wymagana żadna nowa metoda, a kod zostanie wygenerowany wyłącznie dla zmian w mapie formantów interfejsu użytkownika.
Wybierz opcję Generuj.
Zamknij aplikację SimpleWPFApp.exe.
Zamknij UIMap — Konstruktor kodowanego testu interfejsu użytkownika.

UIMap — Konstruktor kodowanego testu interfejsu użytkownika potrzebuje kilku sekund, aby przetworzyć zmiany mapy formantów interfejsu użytkownika.
W Eksploratorze rozwiązań otwórz plik UIMap.Designer.cs.

W pliku UIMap.Designer.cs odszukaj właściwość UIStartButton1.Należy zauważyć, że dla właściwości SearchProperties jest wybrane ustawienie "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;
            }
        }

Teraz można zmodyfikować kodowany test interfejsu użytkownika do korzystania z ostatnio mapowanego formantu.Jak wskazano w poprzedniej procedurze, aby zastąpić jakąkolwiek metodę lub właściwości w kodowanym teście interfejsu użytkownika, należy to zrobić w pliku UIMap.cs.

W pliku UIMap.cs dodaj konstruktora i dla właściwości SearchProperties dla UIStartButton do korzystania z właściwości AutomationID wybierz wartość "buttonA":
```
public UIMap()
        {
            this.UIMainWindowWindow.UIStartButton.SearchProperties[WpfButton.PropertyNames.AutomationId] = "buttonA";
        }
```
Na tworzenie menu, wybierz polecenie tworzyć rozwiązania.
W Eksploratorze testów, uruchom CodedUITestMethod1.

Tym razem kodowany test interfejsu użytkownika pomyślnie zakończy wszystkie etapy testu.W oknie wyników testu widać stan Zakończone powodzeniem.