Selenium Nedir ve Bir Asp.net Mvc Projesi Selenium ile Nasıl Test Edilir?
Jul 7 2015
Selenium Nedir ve Bir Asp.net Mvc Projesi Selenium ile Nasıl Test Edilir?
Bu makalede selenium’un ne olduğu ve bir asp.net mvc uygulamasında nasıl kullanılacağı hakkında bilgi verilecektir.
UI Test Nedir ?
UI , User Interface’in kısaltılmışıdır. UI Test’lerin , kodlanmış (programlanmış ve/veya yazılıma dahil edilmiş) kullanıcı arayüzünü daha iyi ve sorunsuz bir şekilde teslim edilmesini amaçlan bir test yaklaşımıdır. Bu tür bir test ile aşağıdaki soruların cevaplarına yanıt bulunabilir:
- Sayfanın sol tarafında static bir menü olacaktı ancak xxx tasarımında ciddi bir desing’a bağımlı accordion bir menü var. Acaba açılısında bir sorun olur mu ya da doğru mu entegre ediyorum?
- Login olurken, pop up olarak açılan login penceresi arkada kalır mı?
- Yorum listeleme sayfasında view more butonu stabil mi?
- Listeleme sayfasında 20 kayıt’tan sonra görüntü stabil mi?
- Listeleme sayfasında Next / Previous butonları stabil mi?
UI Testing aşağıdaki gibi bir senaryoda zaman kazandırabilir:
Kullanıcıdan “Listeleme sayfasında, time picker’dan tarip seçip kriter girdiğimde, listelemeye basıyorum sayfa donuyor ve kayıtlar oyle listeleniyor, next dediğimde sayfa donuyor ve yeni kayıt gelmiyor ya da exception fırlatıyor” diye değil de listeleme sayfası çalışmıyor diye bir issue gelecektir. Developer da bu çalışmama senaryosunu bulabilmek için ciddi bir mesai harcayabilir.
Bu tarz durumlar UI Test yapılırsa çok ciddi ölçüde azalacaktır.
Automated UI Tests Nedir ?
Automated UI test bu testlerin otomatik hale getirilmesidir. Her nasıl ki bir birim test (unit test) yazıldığında sağ tıklayıp run test ediliyorsa, automated ui test’lerde tüm istenenler yazılır ( hangi sayfa açılacak, hangi alan seçilecek, hangi değer girilecek, hangi butona basılacak, post edilecek gibi) ve run test edilir. Bunun sonucunda, otomatik olarak browser açılır, ilgili sayfaya redirect olunur,eğer gerekliyse ve belirtilmişse login olur, sayfa açılır, alan(lar) seçilir, istenmiş olan değerler girilir ve sonuç görülür. Bu işlemleri elle yapılmaz, otomatik olarak yapılır. Field’ların bolluğunda bir sayfayı sürekli elle değer girerek test etmektense bunu otomatik hale getirmiş olmak daha da avantajlı bir durumdur. Bu testleri geliştirmek için, ilgili sayfadaki tüm işleyişleri ve iş kurallarını bilmek gerekir.
Birkaç Automated UI Test Frameworkleri ?
Çoğu teknolojide olduğu gibi, bir çok UI test framework mevcut. Aşağıda bu iş için kullanılabilecek framework’ler bulunmaktadır:
- Selenium
- CUITe
- UI Automation Verify
- Visual Studio Coded UI Test Framework
Selenium Nedir ve Asp.Net Mvc Projesinde Nasıl Kullanılır?
Selenium bir UI(User Interface) test framework’üdür. Test edebilmek için kendisine ait bir SIDE’si bulunmaktadır. IDE “Mozilla Firefox” eklentisi şeklinde Sçalışmaktadır. IDE ile ilgili doküman için: Shttp://docs.seleniumhq.org/docs/
IDE’yi kurmak
- İlk önce kullandığınız bilgisayara firefox kurulmalıdır.
- Daha sonra şu linkten: http://docs.seleniumhq.org/download/ kısmından “Selenium IDE” başlığı altında .xpi dosyası indirilir.
3.Firefox açlır ve eklentiler seçilir.
4.Sağ üst kısımdan Ayar simgesine tıklanıldıktan sonra “Dosyadan eklenti kur…” seçilir.
5.Burada indirilen .xpi uzantılı dosya seçilir ve open denilir. Daha sonra çıkan ekranda “Şimdi Kur” seçeneği ile işlem bitirilir ve firefox yeniden başlatılır.
Eklenti böylece kurulmuş oldu. Test işleminin gerçekleştirilebilmesi için bir .Net projesine ya da herhangi bir web sayfasına ihtiyaç vardır.
Örnek Proje
Örnek olarak Microsoft Visual Studio ile yeni bir Mvc projesi oluşturulur. Bu projeyi oluşturulurken “Internet Application” seçeneğini seçilir ki direk olarak test aşamasına geçilebilsin. Daha sonra Firefoxtan açılacak seçilde seçildiken sonra F5 ile projeyi başlatılır. Gelen default sayfada sağ üst kısımdaki Selenium simgesine tıklanılır. Aşağıdaki gibi bir pencere açılır:
Bu IDE’deki amaç tıkladığımız button’lar, yazdığımız text’ler, açılan URL’ler burada step step kaydı tutulur. Daha sonra bu kayıtlar otomatik olarak çalıştırılır.
Yukarıdaki numaralandırılmış kısımlarla IDE’yi anlatmak gerekirse:
[1]Table: Tutulan step kayıtlarının bir tablo halinde görüldüğü bölümdür.
[2]Source: Table’da bulunan değerlerin HTML kodudur.
[3]Play: Kaydedilen steplerin otomatik olarak çalıştırmak için kullanılan button.
[4]Test Case: Test olaylarının bulunduğu bölüm. Burada case’lerre isim vererek özelleştirilebilir. İsim vermek için mause right click yapıp properties bölümünden değiştirilebilir.
[5]Command: Selenium’daki hangi komutun kullanıldığının bulunduğu bölümdür.
[6]Target: Yapılan işlemin nerede ve nasıl olduğunun bulunduğu bölümdür.
[7]Value: Eğer sayfada bir değer girildiğiyse bu değerin bulunduğu bölümdür.
[8]Runs&Failures: Test Case’de kaç tanesinin geçip kaç tanesinin geçmediğinin tutulduğu bölümdür.
[9]Record: Kayıt tutmak için kullanılan button.
[10]Base URL: Test Case’ler için ilk açılacak olan sayfanın bulunduğu URL bölümü.
[11]Log: Step’lerin log’larının tutulduğu bölüm. Yani, adımlar kaydedilip “Play” ile çalıştırılıp burada izlenebilir. Eğer hata olursa da burada gösterilmektedir.
[12]Reference: Command’da kullanılan kodun dokümanı.
Adımları kaydetmeden önce yapılması gereken en önemli şey Base URL kısmına ilk açılacak olan sayfayı yazmanızdır. Daha sonra adımları kaydetmek için “Record” butonuna basılır. Mozilla’dan açtığımız projeyi aşağıdaki yolu izleyecek şekilde ilerleyip kaydedelim:
- “About” menüsüne tıklayın.
- Daha sonra sağ köşedeki “Contact” üzerinde olan “register”a tıklayın.
- Buradaki alanları doldurup “Register” olun.
- Login olunduktan sonra “Log off”a tıklayın.
- Tekrar IDE’yi açıp “Record” button’una basıp kaydı durdurun.
Bu işlemleri yaprıktan sonra aşağıdaki gibi bir görüntü elde edeceksiniz:
“Table”daki kodlardan bahsedecek olursak;
- Open: Test edilen sitenin adresini yani URL’ini açmak için kullanılır.
- ClickAndWait: Bir nesneye tıklandığında ve o nesnenin açılması için
- Type: Inputbox’larin içerisine value ile verdiğimiz değerin yazılmasını sağlar.
Bu kodları daha önceden anlatıldığı gibi “Play” Tuşuna basıldığında IDE’nin kendisi otomatik olarak yapar. Eğer doğru bir şekilde yaparsa satırlar yeşil barlarla yanar. Yanlış olursa o adımda durur ve kırmızı bir barla yanar. Play tuşuna bastıktan sonra otomatik olarak yapılan işlemleri Firefox’tan takip edebilirsiniz. İşlemleri daha yavaş yapması için Play button’unun solundaki slider fast’tan slow’a çekilmesi gerekir.
İşlemler doğru bir şekilde gerçekleştirildiğinde:
Aynı kaydı bir daha çalıştırdığımızda hata alacağız. Çünkü aynı kayıttan daha önce register edildiği için login olamayacak, bu yüzden de “log off” butonunu bulamayacaktır:
Daha sonradan kullanabilmek için bu kayıtlar bilgisayara kaydedilebiliyor. Bunu yapmak için:
Bu dosya .hmtl uzantılı bir dosya olacaktır. Bunu daha sonra tekrardan IDE’ye eklemek için “Test Case” bölümüne sağ click yapıp “Add Test Case” seçeneği seçilir. Daha sonra ilgili dosya oradan bulunup aktarılır:
Selenium HTML formatında hazırlamış olduğu test case’leri Python, Ruby, Java ve C# dillerinde kullanabileceğimiz test case’lere aşağıdaki şekilde çevirebiliriz:
Elde edilen kod aşağıdaki gibidir:
using System;
using System.Text;
using System.Text.RegularExpressions;
using System.Threading;
using NUnit.Framework;
using OpenQA.Selenium;
using OpenQA.Selenium.Firefox;
using OpenQA.Selenium.Support.UI;
namespace SeleniumTests
{
[TestFixture]
public class TestUITest
{
private IWebDriver driver;
private StringBuilder verificationErrors;
private string baseURL;
private bool acceptNextAlert = true;
[SetUp]
public void SetupTest()
{
driver = new FirefoxDriver();
baseURL = "http://localhost:54786/";
verificationErrors = new StringBuilder();
}
[TearDown]
public void TeardownTest()
{
try
{
driver.Quit();
}
catch (Exception)
{
// Ignore errors if unable to close the browser
}
Assert.AreEqual("", verificationErrors.ToString());
}
[Test]
public void TheUITest()
{
driver.Navigate().GoToUrl(baseURL + "/");
driver.FindElement(By.LinkText("Contact")).Click();
driver.FindElement(By.Id("registerLink")).Click();
driver.FindElement(By.Id("UserName")).Clear();
driver.FindElement(By.Id("UserName")).SendKeys("erty");
driver.FindElement(By.Id("Password")).Clear();
driver.FindElement(By.Id("Password")).SendKeys("333333");
driver.FindElement(By.Id("ConfirmPassword")).Clear();
driver.FindElement(By.Id("ConfirmPassword")).SendKeys("333333");
driver.FindElement(By.CssSelector("input[type=\\"submit\\"]")).Click();
driver.FindElement(By.LinkText("Log Off")).Click();
}
private bool IsElementPresent(By by)
{
try
{
driver.FindElement(by);
return true;
}
catch (NoSuchElementException)
{
return false;
}
}
private bool IsAlertPresent()
{
try
{
driver.SwitchTo().Alert();
return true;
}
catch (NoAlertPresentException)
{
return false;
}
}
private string CloseAlertAndGetItsText()
{
try
{
IAlert alert = driver.SwitchTo().Alert();
string alertText = alert.Text;
if (acceptNextAlert)
{
alert.Accept();
}
else
{
alert.Dismiss();
}
return alertText;
}
finally
{
acceptNextAlert = true;
}
}
}
}
Elde edilen bu kodu NUnit assembly'lerini ekleyerek çalıştırabilirsiniz.
Bu makalede; UI test nedir, automated UI test nedir, bazı automated UI test frameworklerini ve bu frameworklerden biri olan Seleniu’u inceledik.
