İzlenecek yol: Kodlanmış Bir UI Testi Oluşturmak Düzenlemek ve Sürdürmek

Makale
08/01/2011

Bu yönergede kodlanmış UI testinin nasıl oluşturulduğunu, düzenlendiğini ve korunduğunu göstermek üzere basit bir Windows Presentation Foundation (WPF) oluşturacaksınız. İzlenecek yol çeşitli zamanlama sorunları ve yeniden düzenlemeyi denetleme tarafından kırılan testleri düzeltmeye ilişkin çözümler sağlar.

Önkoşullar

Bu örnek için şunlar gerekir:

Visual Studio 2010 Ultimate veya Visual Studio 2010 Premium.

Basit WPF Uygulaması Oluşturma

Dosya menüsünde, Yeni'nin üzerine gelin ve sonra Proje'yi seçin.

Yeni Proje iletişim kutusu görüntülenir.
Yüklü Şablonlar bölmesinde Visual C# öğesini genişletin ve sonra Windows'u seçin.
Orta bölmede hedef çerçeve açılır listesinin .NET Framework 4 olarak ayarlandığını doğrulayın.
Ortadaki bölmeden WPF Uygulaması şablonunu seçin.
Ad metin kutusuna, SimpleWPFApp yazın.
Projeyi kaydetmek için bir klasör seçin. Konum metin kutusuna klasörün adını yazın.
Tamam düğmesini tıklatın.

Visual Studio için WPF Tasarımcısı açılır ve projenin MainWindow öğesini görüntüler.
Araç kutusu açık değilse, açın. Görüntüleme menüsünü tıklatın ardından Araç kutusu öğesini tıklatın.
Tüm WPF Denetimleri bölümü altında, tasarım yüzeyindeki MainWindow üzerine bir Button, CheckBox ve ProgressBar denetimi sürükleyin.
Düğme kontrolünü seçin. Özellikler penceresinde İçerik özelliğinin değerini Düğme'den Başlat'a değiştirin.
ProgressBar kontrolünü seçin. Özellikler penceresinde Maksimum özelliğinin değerini 100'den 1000'e değiştirin.
Onay kutusu kontrolünü seçin. Özellikler penceresinde IsEnabled özelliğini temizleyin.
Bir Tıklatma etkinliği eklemek için düğme denetimini çift tıklatın.

MainWindow.xmal.cs, yeni button1_Click olayındaki imleç ile Kod Düzenleyicisi'nde görüntülenir.
MainWindow sınıfının en üstünde, bir temsilci ekleyin. Temsilci ilerleme çubuğu için kullanılacaktır. Temsilci eklemek için aşağıdaki kodu ekleyin:
```
        private delegate void ProgressBarDelegate(
        System.Windows.DependencyProperty dp, Object value);
```

button1_Click yöntemine aşağıdaki kodu ekleyin:

            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;

WPF Uygulamasının Düzgün Çalıştığını Doğrulayın

Hata Ayıkla menüsünde Hata Ayıklamayı Başlat öğesini seçin veya F5 tuşuna basın.
Başlat'ı tıklatın.

Birkaç saniye içinde ilerleme çubuğu tam %100 bitmiş olmalıdır. Onay kutusu denetimi şimdi etkinleştirildi.
SimpleWPFApp Uygulamasını Kapatın.

SimpleWPFApp için Kodlanmış Kullanıcı Arabirimi Testi Oluşturun ve Çalıştırın

Çözüm Gezgini'nde, çözümü sağ tıklatın, Ekle'yi tıklatın ve sonra Yeni Proje'yi seçin.

Yeni Proje Ekle iletişim kutusu görüntülenir.
Yüklü Şablonlar bölmesinde Visual C# öğesini genişletin ve sonra Test'i seçin.
Ortadaki bölmeden Test Projesi şablonunu seçin.
Tamam düğmesini tıklatın.

Çözüm Gezgini'nde TestProject1 adlı yeni test projesi çözümünüze eklenir ve UnitTest1.cs Kod Düzenleyicisi'nde belirir. UnitTest1.cs dosyasını kapatamazsınız çünkü dosya bu gözden geçirmelerde kullanılmaz.
Çözüm Gezgini'nde TestProject1 öğesini sağ tıklatın, Ekle'yi tıklatın ve ardından Kodlanmış UI testi'ni seçin.

Kodlanmış UI Testi için Kod Üret iletişim kutusu görünür.
Eylemleri kaydet, UI eşlemesini düzenle veya onaylama işlemlerini ekle seçeneğini seçin ve Tamam'ı tıklatın.

UIMap – Kodlanmış UI Test Oluşturucusu görünür.

İletişim kutusundaki seçenekler hakkında daha fazla bilgi için bkz. Kodlanmış UI Testi Nasıl Oluşturulur.
Daha önce oluşturduğunuz SimpleWPFApp uygulamasını bulup çalıştırın. Varsayılan olarak, uygulama C:\Users\<username>\Documents\Visual Studio 2010\Projects\SimpleWPFApp\SimpleWPFApp\bin\Debug\SimpleWPFApp.exe yer alacaktır

SimpleWPFApp uygulaması için bir masaüstü kısayolu oluşturun. SimpleWPFApp.exe dosyasını sağ tıklayın ve Kopyala'yı seçin. Masaüstünüzde sağ tıklatın ve Kısayolu yapıştır'ı seçin.

İpucu
Uygulamaya bir kısayol eklenmesi, uygulamayı hızlıca başlatmanızı sağladığından uygulamanız açısından Kodlanmış UI testleri ekleyip değiştirmenizi kolaylaştırır. Ona gitmeniz gerekmez. İzlenecek bu yolda uygulamayı yeniden çalıştırmanız gerekir.

UIMap – Kodlanmış Kullanıcı Arabirimi Test Oluşturucusu üzerinde Kaydetmeye Başla seçeneğini tıklatın. Birkaç saniye içinde Kodlu UI Testi Oluşturucusu hazır olacak.
SimpleWPFApp.exe dosyasını masaüstü kısayolunu kullanarak çalıştırın.
SimpleWPFApp üzerinde Başlat'ı tıklatın.

Birkaç saniye içinde ilerleme çubuğu tam %100 bitmiş olmalıdır. Onay kutusu denetimi şimdi etkinleştirildi.
Onay Kutusu denetimi kutusunu seçin.
SimpleWPFApp uygulamasını kapatın.
UIMap - Kodlanmış UI Test Oluşturucusu üzerinde Kod Oluştur seçeneğini tıklatın.
Yöntem Adı'na SimpleAppTest yazın ve Ekle ve Oluştur'u tıklatın. Birkaç saniye içinde Kodlu UI testi görünür ve Çözüm'e eklenir.
UIMap uygulamasını kapatın– Kodlanmış Kullanıcı Arabirimi Test Oluşturucusu.

Kod Editörü'nde CodedUITest1.cs dosyası görüntülenir.

Kodlu UI Testi Çalıştırma

CodedUITest1.cs dosyasında CodedUITestMethod yöntemini bulun, sağ tıklatın ve Testleri Çalıştır'ı seçin.

Kodlanmış UI testi çalışırken, SimpleWPFApp görülebilir. Bir önceki yordamda yaptığınız adımları oluşturur. Ancak, test CheckBox denetimi için onay kutusunu seçmeyi denerken, Test sonuçları penceresi testin başarısız olduğunu gösterir. Bu, testin onay kutusunu seçmeye çalışmasından, ancak ilerleme çubuğu %100 olacak şekilde tamamlanana kadar CheckBox denetiminin devre dışı olduğunun farkında olmamasından kaynaklanır. Kodlanmış arayüz testleri için mevcut çeşitli UITestControl.WaitForControlXXX() yöntemlerini kullanarak, bunu ve benzeri sorunları düzeltebilirsiniz. Sonraki yordamı bu testin başarısız olmasına neden olan sorunu düzeltmek için WaitForControlEnabled() yöntemini kullanmayı gösterir. Daha fazla bilgi için bkz. Kayıttan Yürütme Sırasında Belirli Olaylar için Kodlanmış UI Testlerini Bekletme.

Kodlanmış Kullanıcı Arabirimi Testini Düzenleme ve Yeniden Çalıştırma

Test Sonuçları penceresinde başarısız testi sağ tıklatın ve Test Sonuçları Ayrıntılarını Görüntüle'yi seçin.

CodedUITestMethod1 [sonuçlar] görüntülenir.
Hata Yığını İzlemesi bölümünde, TestProject1.UIMap.SimpleAppTest() öğesinin yanındaki ilk bağlantıyı tıklatın.

Kodda vurgulanan hata noktasını içeren UIMap.Designer.cs dosyası açılır:
```
// Select 'CheckBox' check box
uICheckBoxCheckBox.Checked = this.SimpleAppTestParams.UICheckBoxCheckBoxChecked;
```

Bu sorunu düzeltmek için WaitForControlEnabled() yöntemini kullanarak bu yolda devam etmeden önce kodlanmış UI testinin CheckBox denetiminin etkin olmasını beklemesini sağlayabilirsiniz.

Uyarı
UIMap.Designer.cs dosyasını doğrudan değiştirmeyin. UIMap - Kodlanmış UI Test Oluşturucusu kullanarak kodu her oluşturduğunuzda, UIMapDesigner.cs dosyasında yaptığınız herhangi bir kod değişikliğinin üzerine yazılır. Kayıtlı bir yöntemi değiştirmeniz gerekiyorsa, yöntemi UIMap.cs dosyasına kopyalayıp yeniden adlandırmanız gerekir. UIMap.cs dosyası, UIMapDesigner.cs dosyasındaki yöntemleri ve özellikleri geçersiz kılmak için kullanılabilir. Kodlanmış UITest.cs dosyasındaki orijinal yönteme referansı kaldırıp yeniden adlandırılan yöntem adıyla değiştirmelisiniz.

UIMap.Designer.cs dosyasını doğrudan değiştirmeyin. UIMap - Kodlanmış UI Test Oluşturucusu kullanarak kodu her oluşturduğunuzda, UIMapDesigner.cs dosyasında yaptığınız herhangi bir kod değişikliğinin üzerine yazılır. Kayıtlı bir yöntemi değiştirmeniz gerekiyorsa, yöntemi UIMap.cs dosyasına kopyalayıp yeniden adlandırmanız gerekir. UIMap.cs dosyası, UIMapDesigner.cs dosyasındaki yöntemleri ve özellikleri geçersiz kılmak için kullanılabilir. Kodlanmış UITest.cs dosyasındaki orijinal yönteme referansı kaldırıp yeniden adlandırılan yöntem adıyla değiştirmelisiniz.

UIMapDesinger.cs dosyasından tüm SimpleAppTest yönteminin kodunun tamamını seçin ve kopyalayın.
Çözüm Gezgini'nde, UIMap.cs dosyasını açın.
SimpleAppTest yönteminin kodunu UIMap kısmi sınıfına yapıştırın.
SimpleAppTest() olan yöntemi ModifiedSimpleAppTest() olarak yeniden adlandır

Aşağıdaki kullanım deyimini dosyaya ekleyin:

using Microsoft.VisualStudio.TestTools.UITesting.WpfControls;

Aşağıdaki WaitForControlEnabled() yöntemini önceden tanımlanmış sorunlu kod satırından önce ekleyin.

uICheckBoxCheckBox.WaitForControlEnabled();

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

CodedUITest1.cs dosyasında CodedUITestMethod yöntemini bulun ve ya SimpleAppTest() yöntemine yapılan başvuruyu yeniden adlandırın ya da derleme dışı bırakın ve sonra yeni ModifiedSimpleAppTest() ile değiştirin:

[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();
        }

Yapı menüsünde, Çözümü Derle'yi tıklatın.
CodedUITestMethod yöntemini sağ tıklayın ve Testleri Çalıştır'ı seçin.
Bu kez kodlanmış UI testi testteki tüm adımları başarıyla tamamlar ve Test Sonuçları penceresinde Geçildi görüntülenir.

SimpleWPFApp içinde Denetimi Yeniden Düzenleme

MainWindow.xaml dosyasındaki Tasarımcı'da düğme denetimini seçin.
Özellikler penceresinin üst kısmında, Button öğesinin yanındaki button1 değerini seçin ve değeri buttonA olarak değiştirin.
Yapı menüsünde, Çözümü Derle'yi tıklatın.
Test menüsünde Windows'u seçin ve sonra Test Görünümü'nü tıklatın.
Test Görünümü'nde Test Adı sütununun altındaki CodedUITestMethod1 öğesini seçin ve ardından araç çubuğundaki Seçimi Çalıştır'ı tıklatın.

Kodlanmış UI testi button1 olarak UIMap öğesinde başlangıçta eşlenen düğme denetimini konumlandıramadığından test başarısız. Yeniden düzenleme kodlanmış UI testlerini bu anlamda etkileyebilir.
Test Sonuçları penceresinde başarısız testi sağ tıklatın ve Test Sonuçları Ayrıntılarını Görüntüle'yi seçin.

CodedUITestMethod1 [sonuçlar] görünür.
Hata Yığını İzlemesi bölümünde, TestProject1.UIMpa.SimpleAppTest() öğesinin yanındaki ilk bağlantıyı tıklatın.

UIMap.Designer.cs dosyası açılır. Hata noktası kodda vurgulanır:
```
// Click 'Start' button
Mouse.Click(uIStartButton, new Point(27, 10));
```
Bu yordamın başındaki kod satırının, yeniden düzenlenmeden önceki UIMap adı olan UiStartButton öğesini kullanıp kullanmadığına dikkat edin.

Sorunu düzeltmek için UIMap'e yeniden işlenmiş denetimi Kodlanmış UI Test Oluşturucusu kullanarak ekleyebilirsiniz. Testin kodunu, kodu kullanmak için sonraki yordamda gösterildiği şekilde güncelleştirebilirsiniz.

Yeniden Düzenlenmiş Denetimi Eşleme ve Kodlanmış UI Testini Düzenleme ve Yeniden Çalıştırma

CodedUITest1.cs dosyasındaki CodedUITestMethod1() yönteminde sağ tıklatarak Kodlanmış UI Testi Kodu Üret'i seçin ve Kodlanmış UI Testi Oluşturucu'yu tıklatın.

UIMap – Kodlanmış UI Test Oluşturucusu görünür.
Daha önce oluşturduğunuz masaüstü kısayolunu kullanarak, daha önce oluşturduğunuz SimpleWPFApp uygulamasını Çalıştırın.
UIMap – Kodlanmış UI Test Oluşturucusu üzerinde artı aracını SimpleWPFApp öğesindeki Başlat düğmesine sürükleyin.

Başlat düğmesi mavi bir kutu içine alınır ve Kodlanmış UI Test Oluşturucusunun seçili denetim için veriyi işlemesi ve denetim özelliklerini görüntülemesi birkaç saniyesini alır. AutomationUId öğesinin adının buttonA olduğuna dikkat edin.
Denetimin özelliklerinden, UI Denetim Eşlemesi'ni genişletmek için sol üst köşedeki oku tıklatın. UIStartButton1 öğesinin seçildiğinden emin olun.
Araç çubuğunda Kullanıcı Arabirimi Denetim Haritasına denetim ekle'yi tıklatın.

Pencerenin altındaki durum Seçili denetim UI kontrol eşleşmesine eklendiöğesini görüntüleyerek eylemi doğrular.
UIMap – Kodlanmış UI Test Oluşturucusu üzerinde Kod Oluştur seçeneğini tıklatın.

Kodlanmış UI Test Oluşturucu – Kod Oluştur yeni bir yönteme gerek olmadığı notuyla görüntülenir ve bu kod yalnızca UI kontrol haritasında değişiklikler olduğunda oluşturulacaktır.
Oluştur seçeneğini tıklatın.
SimpleWPFApp.exe Uygulamasını Kapatın.
UIMap uygulamasını kapatın – Kodlanmış Kullanıcı Arabirimi Test Oluşturucusu.

UIMap – Kodlanmış UI Test Oluşturucusunun UI kontrol eşlemesi değişikliklerini işlemesi bir kaç saniye alır.
Çözüm Gezgini'nde, UIMap.Designer.cs dosyasını açın.
Oluşturucu kod sınıfı UIMainWindow öğesindeki oluşturucunun alt bölümündeki UIMap.Designer.cs dosyasında Özellikler bölgesini genişletin. public WpfButton UIStartButton1 özelliğinin eklendiğinden emin olun.

UIStartButton1 özelliğinde, Arama Ölçütü bölgesini genişletin. SearchProperties özelliğinin "buttonA" olarak ayarlandığından emin olun:

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

Şimdi yeni eşlenen denetimi kullanmak için kodlanmış kullanıcı arabirimini değiştirebilirsiniz. Önceki yordamda işaret edildiği gibi, kodlu UI testindeki herhangi bir yöntemi ya da özelliği geçersiz kılmak istiyorsanız, bunu UIMap.cs dosyasında yapmalısınız.

UIMap.cs dosyasına bir oluşturucu ekleyin ve UIStartButton özelliğinin SearchProperties özelliğini, AutomationID özelliğini bir "buttonA": değeriyle kullanmak üzere belirtin.
```
public UIMap()
        {
            this.UIMainWindowWindow.UIStartButton.SearchProperties[WpfButton.PropertyNames.AutomationId] = "buttonA";
        }
```
Yapı menüsünde, Çözümü Derle'yi tıklatın.
Test Görünümü'nde Test Adı sütununun altındaki CodedUITestMethod1 öğesini seçin ve ardından araç çubuğundaki Seçimi Çalıştır'ı tıklatın.

Bu kez, kodlanmış UI testi testteki tüm adımları başarıyla tamamlar. Test Sonuçları Penceresi'nde Geçti durumunu göreceksiniz.

Ayrıca bkz.

Aracılığıyla paylaş